.flip-card{--fc-glare:.06;border-radius:var(--radius-panel);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;outline:none;width:100%;display:block;position:relative}.flip-card[data-draggable]{touch-action:pan-y}.flip-card[data-draggable][data-axis=x]{touch-action:pan-x}.flip-card[data-draggable]:not([data-dragging]){cursor:grab}.flip-card[data-dragging]{cursor:grabbing}.flip-card[data-disabled]{cursor:default;opacity:.6}.flip-card:focus-visible .flip-card__face{outline:2px solid var(--blush);outline-offset:4px}.flip-card__rotor{transform-style:preserve-3d;position:absolute;inset:0}.flip-card__face{border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--raised);color:var(--ink);backface-visibility:hidden;position:absolute;inset:0;overflow: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{background:radial-gradient(circle farthest-side at var(--fc-gx,50%) var(--fc-gy,50%), rgb(255 255 255/calc(var(--fc-glare) * 100%)) 0%, rgb(255 255 255/calc(var(--fc-glare) * 50%)) 26%, rgb(255 255 255/calc(var(--fc-glare) * 12%)) 60%, #fff0 100%);opacity:var(--fc-sheen,0);pointer-events:none;position:absolute;inset:0}.flip-card[data-fade] .flip-card__face{opacity:0;backface-visibility:visible;transition:opacity .2s;transform:none}.flip-card[data-fade=front] .flip-card__face--front,.flip-card[data-fade=back] .flip-card__face--back{opacity:1}