.ripple-distortion{background:#000;width:100%;height:100%;position:relative;overflow:hidden}.ripple-distortion canvas{width:100%;height:100%;display:block}
.pixel-swap{isolation:isolate;outline:none;width:100%;position:relative;overflow:hidden}.pixel-swap__layer{width:100%;height:100%;position:absolute;inset:0}.pixel-swap__layer[data-visible=false]{visibility:hidden}.pixel-swap__grid{z-index:3;pointer-events:none;position:absolute;inset:0}.pixel-swap__pixel{opacity:0;contain:paint;position:absolute;overflow:hidden}.pixel-swap__pixel-content{position:absolute}
.flip-card{--fc-w:300px;--fc-h:400px;--fc-radius:22px;--fc-bg:#27272a;--fc-ink:#f5f5f5;--fc-shadow:#000;--fc-shadow-o:.45;--fc-glare:.22;width:var(--fc-w);max-width:100%;height:var(--fc-h);border-radius:var(--fc-radius);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y;outline:none;display:inline-block;position:relative}.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__shadow{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;position:absolute;inset:12% 9% -5%}.flip-card__rotor{transform-style:preserve-3d;-webkit-transform-style:preserve-3d;position:absolute;inset:0}.flip-card__face{border-radius:var(--fc-radius);background:var(--fc-bg);color:var(--fc-ink);backface-visibility:hidden;border:1px solid #ffffff14;transition:border-color .3s,box-shadow .3s;position:absolute;inset:0;overflow:hidden;transform:translateZ(0);box-shadow:0 4px 20px #0006}.flip-card:hover .flip-card__face{border-color:#fff3;box-shadow:0 8px 30px #0009}.flip-card__face img{-webkit-user-drag:none}.flip-card__face--back{background:var(--fc-back-bg,#fff);color:var(--fc-back-ink,#09090b);border-color:#fffffff2;transform:rotateY(180deg)translateZ(1px);box-shadow:0 8px 30px #00000040}.flip-card:hover .flip-card__face--back{border-color:#fff;box-shadow:0 12px 36px #00000059,0 0 25px #ffffff26}.flip-card[data-axis=x] .flip-card__face--back{transform:rotateX(180deg)translateZ(1px)}.flip-card__glare{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%, #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}