:root{--ink:#16161a;--paper:#f2e9d2;--yellow:#ffd42e;--blue:#2540dd;--red:#e23b26}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{color:var(--ink);background:var(--paper) var(--texture);touch-action:none;-webkit-user-select:none;user-select:none;background-size:280px;font-family:Inter,system-ui,sans-serif}#play{pointer-events:none;z-index:2;width:100vw;height:100dvh;position:fixed;inset:0}.top{z-index:3;pointer-events:none;flex-wrap:wrap-reverse;justify-content:space-between;align-items:center;gap:10px 24px;display:flex;position:fixed;top:14px;left:16px;right:16px}.top>*{pointer-events:auto}.hint{letter-spacing:.14em;text-transform:uppercase;opacity:.7;flex:280px;max-width:62ch;margin:0;font:700 11px/1.4 Space Mono,ui-monospace,monospace}.on-touch{display:none}@media (hover:none){.on-mouse{display:none}.on-touch{display:inline}}.hud{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px 14px;margin-left:auto;display:flex}.hud button{letter-spacing:.08em;text-transform:uppercase;background:var(--paper);color:var(--ink);border:3px solid var(--ink);cursor:pointer;white-space:nowrap;box-shadow:3px 3px 0 var(--ink);padding:9px 12px;font:700 12px/1 Space Mono,ui-monospace,monospace;transition:transform .12s,box-shadow .12s}.hud button:hover{box-shadow:4px 4px 0 var(--ink);transform:translate(-1px,-1px)}.hud button:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}.hud button:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.hud{justify-content:space-between;width:100%}.game{flex-wrap:wrap;align-items:center;gap:10px 14px;display:flex}.audio-wrap{position:relative}.eyebrow a{color:inherit;text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:2px}.eyebrow a:hover{color:var(--blue)}.blurb a.inline{color:inherit;text-underline-offset:3px;text-decoration:none;text-decoration-thickness:2px}.blurb a.inline:hover,.blurb a.inline:focus-visible{color:var(--blue);text-decoration:underline}.blurb a.inline:focus-visible,.eyebrow a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}.hud .audio-btn{align-items:center;gap:6px;padding:6px 10px;display:inline-flex}.audio-btn .ico{flex:none;width:16px;height:16px}.audio-btn .wave,.audio-btn[data-on=true] .mute{display:none}.audio-btn[data-on=true] .wave{display:inline}.audio-btn[data-on=true]{background:var(--yellow)}.audio{z-index:5;background:var(--paper,#fff);border:3px solid var(--ink);min-width:210px;box-shadow:4px 4px 0 var(--ink);flex-direction:column;align-items:stretch;gap:8px;padding:12px;display:flex;position:absolute;top:calc(100% + 10px);right:0}.audio[hidden],.song[hidden]{display:none}.audio .tog{justify-content:space-between}.song{letter-spacing:.1em;text-transform:uppercase;flex-direction:column;gap:4px;font:700 11px/1 Space Mono,ui-monospace,monospace;display:flex}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.song select{letter-spacing:.08em;text-transform:uppercase;background:var(--paper);color:var(--ink);border:3px solid var(--ink);cursor:pointer;min-height:34px;box-shadow:3px 3px 0 var(--ink);padding:6px 8px;font:700 12px/1 Space Mono,ui-monospace,monospace}.song select:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.hud .tog{align-items:center;gap:6px;padding:6px 8px;display:inline-flex}.tog .ico{flex:none;width:16px;height:16px}.tog .note{font:700 15px/1 system-ui,sans-serif}.tog .state{border:2px solid var(--ink);text-align:center;min-width:3.2ch;padding:3px 4px;font-size:10px}.tog[aria-pressed=true]{background:var(--yellow)}.tog[aria-pressed=true] .state{background:var(--ink);color:var(--yellow)}.tog .wave,.tog[aria-pressed=true] .mute{display:none}.tog[aria-pressed=true] .wave{display:inline}.score{white-space:nowrap;letter-spacing:.1em;text-transform:uppercase;margin:0;font:700 12px/1 Space Mono,ui-monospace,monospace}.score b{letter-spacing:.04em;vertical-align:-3px;margin-left:4px;font:400 24px/1 Bangers,Impact,sans-serif;display:inline-block}.score b.pop{animation:.4s cubic-bezier(.2,1.6,.4,1) pop}@keyframes pop{0%{color:var(--red);transform:scale(2.2)}to{transform:scale(1)}}.card{z-index:1;background:var(--paper) var(--texture);border:4px solid var(--ink);width:min(620px,100vw - 40px);box-shadow:6px 6px 0 var(--ink);background-size:280px;grid-template-columns:auto 1fr;align-items:stretch;gap:22px;margin:0;padding:20px 22px 22px;display:grid;position:fixed;bottom:20px;left:20px}.portrait{all:unset;cursor:pointer;box-sizing:border-box;background:var(--yellow);border:4px solid var(--ink);width:clamp(110px,19vw,170px);min-height:100%;transition:background .25s;display:block;overflow:hidden}.portrait:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.portrait img{object-fit:cover;width:100%;height:100%;transition:filter .25s;display:block}.portrait.xray{background:var(--ink)}.portrait.xray img{filter:invert()hue-rotate(180deg)brightness(1.15)}.copy{flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;display:flex}.sticker{--s:clamp(96px,14vw,132px);z-index:4;width:var(--s);height:var(--s);color:var(--ink);filter:drop-shadow(3px 6px 6px #16161a47);transform:translate(var(--x,-200px),var(--y,-200px)) rotate(var(--r,0deg)) scale(var(--k,0));cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:50%;text-decoration:none;transition:transform .45s cubic-bezier(.2,1.7,.4,1),filter .15s;display:block;position:fixed;top:0;left:0}.sticker .face{background:radial-gradient(circle at 32% 26%,#ffffff8c 0,#fff0 42%),var(--yellow);border:3px solid var(--ink);border-radius:50%;place-items:center;display:grid;position:absolute;inset:0;box-shadow:0 0 0 6px #fffdf6,0 0 0 7px #16161a2e}.sticker .ring{width:100%;height:100%;position:absolute;inset:0}.sticker .ring text{letter-spacing:.12em;fill:currentColor;font:700 9.5px Space Mono,ui-monospace,monospace}.sticker .mark{pointer-events:none;border-radius:22%;width:46%;height:46%;box-shadow:0 1px 2px #00000040}.sticker.lifted{cursor:grabbing;--k:1.08;filter:drop-shadow(8px 16px 14px #16161a4d)}@media (width<=600px){.sticker{--s:76px}.sticker .face{box-shadow:0 0 0 4px #fffdf6,0 0 0 5px #16161a2e}}.sticker:focus-visible{outline:3px solid var(--blue);outline-offset:10px}@media (prefers-reduced-motion:reduce){.sticker{transition:none}}h1{text-transform:uppercase;letter-spacing:.005em;margin:0 0 12px;font:400 clamp(38px,7vw,72px)/.9 Anton,Impact,sans-serif}.blurb{max-width:42ch;margin:0 0 16px;font-size:clamp(13px,1.5vw,15.5px);line-height:1.5}.cta{white-space:nowrap;letter-spacing:.08em;text-transform:uppercase;color:var(--paper);background:var(--blue);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:11px 14px;font:700 12px/1 Space Mono,ui-monospace,monospace;text-decoration:none;transition:transform .15s ease-out,box-shadow .12s;display:inline-block}.cta:hover{box-shadow:6px 6px 0 var(--ink)}.cta:active{box-shadow:1px 1px 0 var(--ink)}@media (width<=560px){.card{gap:14px;width:calc(100vw - 26px);padding:14px 14px 16px;bottom:10px;left:10px}.top{top:10px;left:10px;right:10px}.hint{letter-spacing:.1em;font-size:9px}.hud{gap:8px 10px}}@media (prefers-reduced-motion:reduce){.cta,.portrait,.portrait img{transition:none}.score b.pop{animation:none}}