:root{--paper: #f3eee6;--ink: #3a342c;--card-w: min(68vw, 280px);--radius: 20px;color:var(--ink);background:var(--paper);font-family:IBM Plex Mono,ui-monospace,monospace}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{min-height:100dvh;background:var(--paper)}.stage{position:relative;min-height:100dvh;overflow:hidden;background:var(--paper);outline:none}.fan{position:relative;height:100dvh;margin-right:0}.subtitle{position:fixed;top:22px;left:16px;right:16px;z-index:8;margin:0;font-size:11px;font-weight:500;letter-spacing:.16em;line-height:1.5;text-align:center;color:var(--ink);pointer-events:none}.caret{display:inline-block;margin-left:1px;animation:blink .8s steps(1) infinite}.caret.is-done{animation-duration:1.2s}@keyframes blink{50%{opacity:0}}.card{position:absolute;left:50%;top:50%;width:var(--card-w);aspect-ratio:4 / 5;margin:0;border-radius:var(--radius);background:transparent;perspective:1200px;box-shadow:none;transform-origin:center center;transition:transform .58s cubic-bezier(.22,1.25,.36,1);touch-action:none;-webkit-user-select:none;user-select:none;cursor:default}.card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .62s cubic-bezier(.22,1,.36,1);border-radius:var(--radius);box-shadow:0 18px 40px #30261829,0 2px 8px #30261814}.card.is-flipped .card-inner{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;overflow:hidden;border-radius:var(--radius);backface-visibility:hidden;-webkit-backface-visibility:hidden}.card-front{background:#e7e0d4}.card-back{display:flex;flex-direction:column;padding:22px 20px 18px;background:#f7f2ea;transform:rotateY(180deg)}.card-back h2{margin:0 0 12px;font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}.card-back p{margin:0;flex:1;font-size:12px;font-weight:400;letter-spacing:.02em;line-height:1.55}.card-back button{align-self:flex-start;margin-top:16px;padding:0;border:0;background:transparent;font:inherit;font-size:11px;font-weight:500;letter-spacing:.16em;color:var(--ink);cursor:pointer}.card-back button:hover,.card-back button:focus-visible{opacity:.55}.card img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}.card[data-slot=left]{z-index:1;transform:translate(-84%,calc(-50% + 18px)) rotate(-11deg) scale(.94)}.card[data-slot=center]{z-index:3;cursor:grab;transform:translate(-50%,calc(-50% - 8px)) rotate(3deg) scale(1.04)}.card[data-slot=right]{z-index:2;transform:translate(-18%,calc(-50% + 8px)) rotate(8deg) scale(.94)}.card[data-pass=true]{z-index:0}.card.is-flying-left,.card.is-flying-right{z-index:6;transition:transform .45s cubic-bezier(.2,.7,.2,1)}.card.is-flying-left{transform:translate(-190%,calc(-50% - 4px)) rotate(-22deg) scale(.98)}.card.is-flying-right{transform:translate(90%,calc(-50% - 4px)) rotate(24deg) scale(.98)}.card.is-snap{transition:none;animation:settle .35s ease}.stage.is-dragging .card[data-slot=center]{cursor:grabbing}@keyframes settle{0%{opacity:0}to{opacity:1}}.index,.skip{position:fixed;z-index:8;margin:0;font-size:11px;font-weight:500;letter-spacing:.16em;color:var(--ink)}.index{left:16px;bottom:22px}.skip{right:16px;bottom:22px;padding:0;border:0;background:transparent;font:inherit;font-size:11px;letter-spacing:.16em;color:var(--ink);cursor:pointer}.skip:hover,.skip:focus-visible{opacity:.55}@media(hover:hover)and (pointer:fine){.stage:not(.is-dragging) .card[data-slot=center]:hover{transform:translate(-50%,calc(-50% - 16px)) rotate(1deg) scale(1.05)}}@media(min-width:768px){:root{--card-w: min(360px, 32vw);--radius: 24px}.fan{width:min(880px,calc(100vw - 120px));margin:0 auto}.card[data-slot=left]{transform:translate(-112%,calc(-50% + 26px)) rotate(-11deg) scale(.94)}.card[data-slot=right]{transform:translate(8%,calc(-50% + 14px)) rotate(8deg) scale(.94)}}@media(prefers-reduced-motion:reduce){.card,.card-inner,.card.is-flying-left,.card.is-flying-right,.card.is-snap,.caret{transition:none;animation:none}}