:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#181715;background:#f6f0e5;font-synthesis:none;--ink: #181715;--paper: #f6f0e5;--card: #fffdf8;--red: #e53535;--red-dark: #bc2424;--green: #1dcc6b;--green-dark: #118b2b;--yellow: #f5d84c;--muted: #716b61}*{box-sizing:border-box}html{min-width:320px}body{min-width:320px;min-height:100vh;margin:0;background:radial-gradient(circle at 8% 8%,rgba(245,216,76,.35),transparent 24rem),radial-gradient(circle at 90% 70%,rgba(46,234,84,.13),transparent 26rem),var(--paper)}button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}.skip-link{position:fixed;z-index:20;top:.75rem;left:.75rem;padding:.7rem 1rem;color:#fff;background:var(--ink);transform:translateY(-150%)}.skip-link:focus{transform:none}.app-shell{width:min(100% - 2rem,1080px);margin:auto}.site-header{display:flex;justify-content:space-between;align-items:center;gap:2rem;min-height:7rem;border-bottom:1px solid rgba(24,23,21,.18)}.brand{display:inline-flex;align-items:center;gap:.75rem;color:inherit;font-size:.78rem;font-weight:900;line-height:1;letter-spacing:-.02em;text-decoration:none;text-transform:uppercase}.brand-logo{display:block;width:3.25rem;height:3.25rem;object-fit:contain}.stats{display:flex;overflow:hidden;border:2px solid var(--ink);border-radius:.8rem;background:var(--card);box-shadow:4px 4px 0 var(--ink)}.stats div{display:grid;min-width:7.2rem;padding:.55rem .8rem;text-align:center}.stats div+div{border-left:2px solid var(--ink)}.stats strong{font:800 1.35rem/1 ui-monospace,monospace}.stats span{margin-top:.3rem;color:var(--muted);font-size:.58rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.game-card{min-height:36rem;margin:clamp(2rem,5vw,4rem) auto;padding:clamp(1.25rem,4vw,3.5rem);border:2px solid var(--ink);border-radius:1.8rem;background:#fffdf8e6;box-shadow:10px 10px 0 var(--ink);text-align:center}.timeline{display:grid;grid-template-columns:repeat(5,1fr);width:min(100%,38rem);margin:0 auto clamp(1.25rem,3vw,2rem);padding:0;list-style:none}.timeline-step{position:relative;display:grid;place-items:center}.timeline-step:not(:last-child):after{position:absolute;z-index:0;top:50%;left:50%;width:100%;height:3px;background:#d6cfc2;content:""}.timeline-step.is-done:not(:last-child):after{background:var(--ink)}.timeline-marker{position:relative;z-index:1;display:grid;width:2.55rem;height:2.55rem;place-items:center;border:2px solid var(--ink);border-radius:50%;background:var(--paper);font:800 .9rem/1 ui-monospace,monospace}.timeline-step.is-current .timeline-marker{background:var(--yellow);box-shadow:3px 3px 0 var(--ink);transform:translate(-2px,-2px)}.timeline-step.is-right .timeline-marker{color:#fff;background:var(--green-dark)}.timeline-step.is-wrong .timeline-marker{color:#fff;background:var(--red-dark)}.timeline-step.is-result-entering .timeline-marker{animation:timeline-result-in .52s cubic-bezier(.22,1,.36,1)}.timeline-step.is-current-entering .timeline-marker{animation:timeline-current-in .52s cubic-bezier(.22,1,.36,1)}.notice{display:flex;justify-content:center;align-items:center;gap:.7rem;min-height:3rem;color:var(--muted)}.notice.is-error{color:var(--red-dark)}.spinner{width:1rem;height:1rem;border:2px solid #ddd3c5;border-top-color:var(--ink);border-radius:50%;animation:spin .75s linear infinite}.notice.is-error .spinner{display:none}.stage-label,.result-kicker{margin:0 0 .75rem;color:var(--red-dark);font:800 .7rem/1 ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase}.stage-label{font-size:clamp(1rem,2vw,1.25rem);letter-spacing:.06em}h1{margin:0;font-size:clamp(2rem,5vw,4.3rem);line-height:.97;letter-spacing:-.06em}.dilemma{min-height:1.7em;margin:1rem auto 2.5rem;color:var(--muted);font-size:clamp(1rem,2vw,1.25rem)}.button-pair{display:grid;grid-template-columns:1fr 1.25fr;align-items:center;gap:clamp(1.5rem,7vw,6rem);width:min(100%,30rem);margin:auto;padding:1rem 0 2rem}.shape-button{position:relative;width:100%;aspect-ratio:1;padding:0;border:0;outline-offset:.55rem;background:transparent;cursor:pointer}.shape-check{aspect-ratio:1.15}.shape-art{position:absolute;inset:2%;width:96%;height:96%;overflow:visible;filter:drop-shadow(0 10px 6px rgba(0,0,0,.16))}.shape-solid{transform-box:fill-box;transform-origin:center;transition:transform .17s cubic-bezier(.3,.7,.4,1);will-change:transform}.shape-bottom,.shape-walls,.shape-walls-extended,.shape-walls-compressed{fill:#0b0b0b;stroke:#0b0b0b;stroke-linejoin:round;stroke-width:5}.shape-walls,.shape-walls-extended,.shape-walls-compressed{transform-box:fill-box;transform-origin:center}.shape-walls-extended,.shape-walls-compressed{opacity:0}.shape-top{stroke:#0b0b0b;stroke-linejoin:round;stroke-width:6;transform:translateY(0);transform-box:fill-box;transform-origin:center;will-change:transform}.shape-button:focus-visible{outline:4px solid #3278ff;border-radius:1rem}.shape-button:disabled{cursor:default}.has-result .shape-solid{opacity:.55}.has-result.picked-x .shape-x .shape-solid,.has-result.picked-check .shape-check .shape-solid{opacity:1}.vote-split{--x-share: 50%;--check-share: 50%;width:min(100%,40rem);min-height:5.7rem;margin:.25rem auto 0;visibility:hidden;opacity:0;transform:translateY(14px);transition:opacity .24s ease,transform .24s ease,visibility 0s linear .24s}.vote-split.is-visible{visibility:visible;opacity:1;transform:none;transition-delay:0s}.vote-split-labels{display:flex;justify-content:space-between;align-items:end;margin-bottom:.5rem}.vote-split-labels strong{font:900 clamp(1.35rem,3vw,2rem)/1 ui-monospace,monospace}.vote-split-track{display:flex;overflow:hidden;height:1.4rem;border:3px solid var(--ink);border-radius:999px;background:#ded8cd;box-shadow:3px 3px 0 var(--ink)}.vote-split-track span{transition:width 1.2s cubic-bezier(.22,1,.36,1),background-color 1.2s cubic-bezier(.22,1,.36,1),opacity 1.2s ease}.vote-split-x{width:var(--x-share);background:var(--red)}.vote-split-check{width:var(--check-share);background:var(--green)}.vote-split.is-revealing .vote-split-x{background:#ff8d8d}.vote-split.is-revealing .vote-split-check{background:#8bf09f}.vote-split-status{min-height:1.2em;margin:.65rem 0 0;color:var(--muted);font:700 .72rem/1.2 ui-monospace,monospace}.vote-split.is-error .vote-split-status{color:var(--red-dark)}.result-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2rem;width:100%;margin:-1.5rem auto 3rem;padding:clamp(1.25rem,3vw,2rem);border:2px solid var(--ink);border-radius:1.2rem;background:var(--card);box-shadow:7px 7px 0 var(--ink);text-align:left;animation:result-in .18s ease-out}.result-panel h2{margin:0;font-size:clamp(1.5rem,3vw,2.4rem);letter-spacing:-.04em}.result-panel p:not(.result-kicker){margin-bottom:0;color:var(--muted);line-height:1.6}.action-button{min-height:3.4rem;padding:.8rem 1.4rem;border:2px solid var(--ink);border-radius:.7rem;background:var(--yellow);box-shadow:4px 4px 0 var(--ink);font-weight:900;cursor:pointer;transition:transform .1s,box-shadow .1s}.action-button:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}.action-button:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}.action-button:focus-visible,.text-button:focus-visible{outline:3px solid #3278ff;outline-offset:3px}.finish-state{display:grid;min-height:24rem;place-content:center}.finish-state blockquote{max-width:30rem;margin:2rem auto;color:var(--muted);font:700 clamp(1.15rem,2.5vw,1.6rem)/1.45 Georgia,serif}footer{display:flex;justify-content:space-between;gap:2rem;padding:1rem 0 3rem;color:var(--muted);font-size:.78rem}.text-button{padding:0;border:0;background:none;color:inherit;text-decoration:underline;text-underline-offset:.2rem;cursor:pointer}[hidden]{display:none!important}@keyframes spin{to{transform:rotate(1turn)}}@keyframes result-in{0%{opacity:0;transform:translateY(10px)}}@keyframes timeline-result-in{0%{color:var(--ink);background:var(--yellow);box-shadow:3px 3px 0 var(--ink);transform:translate(-2px,-2px) scale(1)}45%{box-shadow:5px 5px 0 var(--ink);transform:translate(-3px,-3px) scale(1.22)}to{box-shadow:none;transform:none}}@keyframes timeline-current-in{0%{background:var(--paper);box-shadow:none;transform:none}45%{background:var(--yellow);box-shadow:5px 5px 0 var(--ink);transform:translate(-3px,-3px) scale(1.22)}to{background:var(--yellow);box-shadow:3px 3px 0 var(--ink);transform:translate(-2px,-2px)}}@media(max-width:640px){.site-header{align-items:flex-start;padding:1.2rem 0}.stats div{min-width:4.8rem;padding-inline:.35rem}.stats span{font-size:.5rem}.game-card{min-height:0;margin:1rem 0 2rem;border-radius:1.2rem;box-shadow:6px 6px 0 var(--ink)}.timeline{margin-bottom:1.5rem}.timeline-marker{width:2.1rem;height:2.1rem}.button-pair{gap:2rem}.shape-art{filter:drop-shadow(0 6px 4px rgba(0,0,0,.16))}.result-panel{grid-template-columns:1fr;gap:1.25rem;margin-top:-1rem;text-align:center}.result-panel .action-button{width:100%}footer{flex-direction:column;gap:.5rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}