:root{--ink: #0b0d1c;--mat: #121734;--kraft: #e9d6ac;--cream: #fbeed0;--verm: #e0412b;--vermDk: #8d1f10;--brass: #d6a64a;--brassHi: #ffe7a3;--spark: #ffb347;--teal: #1d9a8d;--display: Phosphate, "Phosphate Solid", Impact, Haettenschweiler, "Arial Narrow Bold", "Franklin Gothic Heavy", sans-serif;--text: Optima, "Optima nova", Candara, "Segoe UI", "Noto Sans", sans-serif}html,body{background:var(--ink);color:var(--cream);font-family:var(--text)}.stage{background:var(--ink)}.hud{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;align-items:flex-start;justify-content:space-between;padding:calc(8px + var(--safe-t)) calc(10px + var(--safe-r)) 0 calc(10px + var(--safe-l));pointer-events:none}.fbtn{pointer-events:auto;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#3a4170,#161b3a 70%);border:1.5px solid rgba(214,166,74,.7);box-shadow:inset 0 0 0 3px #0b0d1c99,0 3px 10px #00000080;color:var(--brassHi);text-decoration:none;transition:transform .12s ease}.fbtn:active{transform:scale(.92)}.fbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.mute .spk{fill:currentColor;stroke:none}.mute .off,.mute[aria-pressed=true] .wav{display:none}.mute[aria-pressed=true] .off{display:inline}.mute[aria-pressed=true]{color:#ffe7a380}.tally{display:flex;align-items:stretch;gap:0;margin-top:1px;border-radius:4px;overflow:hidden;color:#2a1608;background:var(--kraft);box-shadow:0 4px 12px #0000008c,inset 0 0 0 1px #5a321459;transform:rotate(-1.2deg)}.score{min-width:3ch;padding:5px 12px 3px;text-align:center;font-family:var(--display);font-size:30px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.02em}.score.pop{animation:pop .22s cubic-bezier(.2,1.6,.4,1)}@keyframes pop{50%{transform:scale(1.18)}}.streak{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:3px 9px;background:var(--verm);color:var(--cream)}.mult{font-family:var(--display);font-size:18px;line-height:1;opacity:.75}.mult.hot{opacity:1;color:#fff3c4;text-shadow:0 0 8px rgba(255,220,120,.9)}.mult.bump{animation:pop .3s cubic-bezier(.2,1.6,.4,1)}.pips{display:flex;gap:3px}.pips i{width:6px;height:6px;border-radius:50%;border:1.3px solid rgba(255,238,208,.85)}.pips i.on{background:#fff3c4;border-color:#fff3c4;box-shadow:0 0 5px #ffdc78e6}.toast{position:absolute;left:50%;top:calc(64px + var(--safe-t));transform:translate(-50%,-14px) rotate(1.5deg);opacity:0;pointer-events:none;padding:5px 14px 4px;border-radius:3px;font-family:var(--display);font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:#2a1608;background:linear-gradient(180deg,#f6e8c8,#e2c993);box-shadow:0 0 0 1.5px var(--brass),0 6px 14px #00000080,0 0 22px #ffb44673}.toast:before{content:"✹ ";color:var(--verm)}.toast.show{animation:toast 2.4s cubic-bezier(.2,1.4,.4,1) forwards}@keyframes toast{0%{opacity:0;transform:translate(-50%,-14px) rotate(1.5deg) scale(.8)}12%{opacity:1;transform:translate(-50%) rotate(-1deg) scale(1.08)}20%,80%{opacity:1;transform:translate(-50%) rotate(-1deg) scale(1)}to{opacity:0;transform:translate(-50%,-8px) rotate(-1deg) scale(.96)}}.streak{transition:background-color .3s ease,box-shadow .3s ease}.tally:has(.mult.hot) .streak{background:linear-gradient(180deg,#ff5a35,#c92e18);box-shadow:inset 0 0 12px #ffdc7873}.title,.card,.paused{position:absolute;z-index:2;pointer-events:none;text-align:center}.title{inset:0;display:flex;align-items:center;justify-content:center;padding:calc(60px + var(--safe-t)) 20px calc(40px + var(--safe-b))}.title.fade{animation:fadeOut .45s ease forwards}@keyframes fadeOut{to{opacity:0;transform:scale(1.04)}}.label{position:relative;width:min(320px,100%);padding:0 0 16px;border-radius:6px;overflow:hidden;color:#2a1608;background:linear-gradient(180deg,#f6e8c8,#e7d2a3);box-shadow:0 22px 50px #0009,inset 0 0 0 1px #5a321459;transform:rotate(-1deg)}.label:after{content:"";position:absolute;inset:6px;border:1.5px dashed rgba(141,31,16,.35);border-radius:3px;pointer-events:none}.band{background:var(--verm);color:var(--cream);font-family:var(--text);font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;padding:7px 10px 6px}.title h1{margin:10px 0 0;font-family:var(--display);font-weight:400;font-size:clamp(64px,22vw,88px);line-height:.95;letter-spacing:.06em;color:var(--ink);text-shadow:3px 3px 0 var(--verm)}.title h1 .u{position:relative}.title h1 .u:after{content:"";position:absolute;left:50%;top:.1em;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#fff6dc;box-shadow:0 0 10px 4px #ffaa46e6,0 0 24px 10px #ff782873;animation:flick .18s steps(2) infinite}@keyframes flick{50%{transform:scale(.8);opacity:.85}}.sub{margin:4px 0 0;font-size:15px;font-style:italic;color:#5a3418}.legend{display:flex;gap:8px;justify-content:center;margin:12px 14px 6px}.legend figure{margin:0;flex:1;height:74px;display:grid;place-items:center;border-radius:4px;background:var(--mat);box-shadow:inset 0 0 0 1px #84a0ff2e}.legend svg{width:100%;height:66px;overflow:visible}.legend .cord{fill:none;stroke:#c9a467;stroke-width:3.4;stroke-linecap:round}.legend .eye{fill:var(--brass);stroke:#5e3e10}.legend .lever{stroke:var(--brassHi);stroke-width:2.6;stroke-linecap:round;animation:lever 1.6s ease-in-out infinite;transform-origin:50px 40px}@keyframes lever{0%,8%{transform:rotate(72deg)}18%,85%{transform:rotate(0)}to{transform:rotate(72deg)}}.legend .spark{fill:#fff6dc;filter:drop-shadow(0 0 3px #ff9a3c)}.legend .hand rect{fill:var(--cream);stroke:#2b2030;stroke-width:1.4}.legend .hand{animation:tap 1.6s ease-in-out infinite}.legend .tap{fill:none;stroke:#ffe2a0;stroke-width:1.6;opacity:0;animation:ring 1.6s ease-out infinite;transform-origin:15.5px 34px}@keyframes tap{0%,to{transform:translateY(0)}15%{transform:translateY(3px)}30%{transform:translateY(0)}}@keyframes ring{10%{opacity:1;transform:scale(.4)}60%{opacity:0;transform:scale(1.6)}to{opacity:0}}.legend .rk{fill:var(--verm);stroke:#741409;stroke-width:.8}.legend .cap{fill:#fff8e6}.legend .capd{fill:#7c8594}.legend .fz{fill:none;stroke:#d8b46e;stroke-width:1.6}.legend .fzd{fill:none;stroke:#7d7f86;stroke-width:1.6}.legend .tw{fill:#fff6dc;filter:drop-shadow(0 0 2px #ffcf4a)}.legend .wisp{fill:none;stroke:#bec6d7b3;stroke-width:1.4}.legend .pud{fill:#3a96e6;stroke:#c4ecff;stroke-width:1}.legend .ok{fill:none;stroke:#9ff0a8;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.legend .no{stroke:#ff5b3a;stroke-width:3;stroke-linecap:round}.cta{margin-top:10px;font-family:var(--display);font-size:20px;letter-spacing:.12em;text-transform:uppercase;color:var(--vermDk);animation:breathe 2s ease-in-out infinite}@keyframes breathe{0%,to{opacity:.55}50%{opacity:1}}.best{margin-top:4px;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#6a4420}.card{left:50%;top:47%;width:min(300px,calc(100% - 44px));transform:translate(-50%,-44%) rotate(1deg) scale(.95);opacity:0;padding:0 0 16px;border-radius:6px;overflow:hidden;color:#2a1608;background:linear-gradient(180deg,#f6e8c8,#e7d2a3);box-shadow:0 26px 60px #000000a6,inset 0 0 0 1px #5a321459;transition:opacity .35s ease,transform .5s cubic-bezier(.2,1.4,.4,1)}.card.show{opacity:1;transform:translate(-50%,-50%) rotate(-1deg) scale(1)}.card .eyebrow{margin-top:12px;font-size:14px;font-style:italic;color:#6a3a18}.bigwrap{position:relative;display:grid;place-items:center}.rays{position:absolute;left:50%;top:50%;width:260px;height:260px;margin:-130px 0 0 -130px;border-radius:50%;opacity:0;pointer-events:none;background:repeating-conic-gradient(from 0deg,#e0412b38 0deg 9deg,#e0412b00 9deg 22.5deg);-webkit-mask:radial-gradient(circle,#000 25%,transparent 70%);mask:radial-gradient(circle,#000 25%,transparent 70%)}.card.record .rays{opacity:1;animation:spin 14s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.card:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;background:linear-gradient(105deg,transparent 35%,rgba(255,250,230,.7) 50%,transparent 65%);transform:translate(-120%)}.card.show:before{animation:sheen 1.1s .35s ease-out forwards}@keyframes sheen{0%{opacity:1;transform:translate(-120%)}to{opacity:1;transform:translate(120%)}}.big{position:relative;font-family:var(--display);font-size:76px;line-height:1;margin-top:4px;color:var(--ink);text-shadow:3px 3px 0 var(--verm);font-variant-numeric:tabular-nums}.unit{font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:#6a4420}.card.record .newbest{animation:badge .6s 1.1s cubic-bezier(.2,1.8,.4,1) both,shine 1.3s 1.7s ease-in-out infinite}@keyframes badge{0%{transform:scale(0) rotate(-12deg)}to{transform:scale(1) rotate(0)}}.newbest{display:inline-block;margin-top:10px;padding:5px 14px 4px;border-radius:3px;font-family:var(--display);font-size:16px;letter-spacing:.14em;text-transform:uppercase;color:#fff3c4;background:var(--ink);box-shadow:0 0 0 2px var(--brass),0 0 18px #ffb44699;animation:shine 1.3s ease-in-out infinite}.newbest:before{content:"✹ ";color:var(--spark)}@keyframes shine{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}.stats{display:grid;grid-template-columns:repeat(4,1fr);margin:14px 14px 0;border-top:1.5px dashed rgba(141,31,16,.4);padding-top:10px}.stats span{display:block;font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#6a4420}.stats b{display:block;margin-top:2px;font-family:var(--display);font-weight:400;font-size:22px;color:var(--ink)}.paused{inset:0;display:grid;place-items:center;background:#050610b3}.paused .cta{color:var(--cream)}@media(max-height:640px){.title h1{font-size:58px}.legend figure{height:62px}}@media(prefers-reduced-motion:reduce){.cta,.newbest,.legend .hand,.legend .tap,.title h1 .u:after{animation:none;opacity:1}.score.pop,.mult.bump,.card.record .rays,.card.show:before,.card.record .newbest{animation:none}.toast.show{animation:toastFade 2.4s linear forwards;transform:translate(-50%)}@keyframes toastFade{0%,80%{opacity:1}to{opacity:0}}}
