.flip-card{--fc-w:300px;--fc-h:400px;--fc-radius:22px;--fc-bg:#27272a;--fc-ink:#f5f5f5;--fc-shadow:#000000;--fc-shadow-o:0.45;--fc-glare:0.22;position:relative;display:inline-block;width:var(--fc-w);max-width:100%;height:var(--fc-h);border-radius:var(--fc-radius);outline:none;cursor:pointer;-moz-user-select:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y}.flip-card[data-axis=x]{touch-action:pan-x}.flip-card[data-draggable]{cursor:grab}.flip-card[data-dragging]{cursor:grabbing}.flip-card[data-disabled]{cursor:default;opacity:.6}.flip-card.flip-card--fill{display:block;width:100%;height:auto}.flip-card.flip-card--square{aspect-ratio:1}.flip-card.flip-card--portrait{aspect-ratio:9/16}.flip-card.flip-card--wide{aspect-ratio:16/10}.flip-card__shadow{position:absolute;inset:12% 9% -5%;border-radius:var(--fc-radius);background:color-mix(in srgb,var(--fc-shadow) calc(var(--fc-shadow-o) * 100%),transparent);filter:blur(22px);pointer-events:none}.flip-card__rotor{position:absolute;inset:0;transform-style:preserve-3d}.flip-card__face{position:absolute;inset:0;overflow:hidden;border-radius:var(--fc-radius);background:var(--fc-bg);color:var(--fc-ink);backface-visibility:hidden;-webkit-backface-visibility:hidden}.flip-card__face img{-webkit-user-drag:none}.flip-card__face--back{transform:rotateY(180deg)}.flip-card[data-axis=x] .flip-card__face--back{transform:rotateX(180deg)}.flip-card__glare{position:absolute;inset:0;background:radial-gradient(circle farthest-side at var(--fc-gx,50%) var(--fc-gy,50%),rgba(255,255,255,var(--fc-glare)) 0,rgba(255,255,255,calc(var(--fc-glare) * .76)) 12%,rgba(255,255,255,calc(var(--fc-glare) * .5)) 26%,rgba(255,255,255,calc(var(--fc-glare) * .28)) 42%,rgba(255,255,255,calc(var(--fc-glare) * .12)) 60%,rgba(255,255,255,calc(var(--fc-glare) * .04)) 78%,rgba(255,255,255,0) 100%);opacity:var(--fc-sheen,0);pointer-events:none}.flip-card[data-fade] .flip-card__face{transform:none;opacity:0;backface-visibility:visible;-webkit-backface-visibility:visible;transition:opacity .2s ease}.flip-card[data-fade=back] .flip-card__face--back,.flip-card[data-fade=front] .flip-card__face--front{opacity:1}