:root{--night: #1a0f09;--walnut: #3b2214;--red: #c8392b;--red-lo: #7d1f16;--cream: #f5e6c8;--gold: #e7b04a;--teal: #2c7391;--type: "Rockwell", "Roboto Slab", "Bookman Old Style", "Georgia", serif}html,body{background:var(--night);color:var(--cream);font-family:var(--type)}.stage{background:var(--night)}.hud{position:absolute;z-index:5;left:0;right:0;top:0;pointer-events:none;padding:calc(10px + var(--safe-t)) calc(12px + var(--safe-r)) 0 calc(12px + var(--safe-l));display:flex;align-items:flex-start;justify-content:space-between}.chip{pointer-events:auto;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:2px solid rgba(231,176,74,.85);color:var(--cream);text-decoration:none;padding:0;background:radial-gradient(circle at 35% 30%,#e0604a,var(--red) 45%,var(--red-lo));box-shadow:0 3px #4a120c,0 6px 14px #00000073,inset 0 1px #ffdcbe80;transition:transform .12s ease}.chip:active{transform:translateY(2px) scale(.96);box-shadow:0 1px #4a120c,0 3px 8px #0006}.chip svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.chip .spk{fill:currentColor;stroke-width:1.6}.mute .off{display:none}.mute[aria-pressed=true] .off{display:inline}.mute[aria-pressed=true] .on{display:none}.mute[aria-pressed=true]{background:radial-gradient(circle at 35% 30%,#8c6a52,#5a3a26 50%,#2e1a0e)}.score{font-weight:800;font-size:46px;line-height:1;letter-spacing:.02em;margin-top:2px;color:var(--cream);font-variant-numeric:tabular-nums;text-shadow:0 2px 0 #6a1712,0 4px 0 #2a0c06,0 8px 18px rgba(0,0,0,.55);transition:opacity .3s ease}.scorebox{display:flex;flex-direction:column;align-items:center}.score{position:relative}.score:after{content:"";position:absolute;z-index:-1;left:50%;top:50%;width:calc(100% + 34px);min-width:74px;height:58px;transform:translate(-50%,-50%);border-radius:16px;background:radial-gradient(ellipse at 50% 30%,#3c1e0e9e,#1a0f0980 70%);box-shadow:inset 0 0 0 1.5px #e7b04a8c,inset 0 2px #ffe39a2e,0 6px 14px #00000059}body.mode-title .score:after,body.mode-over .score:after{display:none}.streak{margin-top:8px;padding:3px 12px 4px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#3a1a0c;background:linear-gradient(#ffe39a,var(--gold));border-radius:4px 4px 12px 12px;box-shadow:0 2px #8a5a17,0 4px 10px #0006;opacity:0;transform:translateY(-6px) scale(.8);transition:opacity .25s ease,transform .25s ease}.streak b{font-size:15px}.streak.show{opacity:1;transform:none}.streak.show.pop{animation:pennant .36s cubic-bezier(.2,1.6,.4,1)}@keyframes pennant{0%{transform:rotate(-6deg) scale(1.25)}to{transform:none}}.toast{position:absolute;z-index:5;left:50%;top:calc(128px + var(--safe-t));transform:translate(-50%,-10px) scale(.8);pointer-events:none;padding:8px 20px;border-radius:999px;font-size:20px;font-weight:900;letter-spacing:.06em;color:#fff7e6;background:var(--teal);border:2px solid #ffe39a;box-shadow:0 3px #123a4b,0 10px 22px #00000073;opacity:0}.toast:empty{display:none}.toast.show{animation:toast 2.2s ease both}@keyframes toast{0%{opacity:0;transform:translate(-50%,-10px) scale(.7)}12%{opacity:1;transform:translate(-50%) scale(1.1)}20%{transform:translate(-50%) scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-14px) scale(1)}}.score.bump{animation:bump .32s cubic-bezier(.2,1.6,.4,1)}.score.gold{color:#ffe39a}@keyframes bump{0%{transform:scale(1.28) translateY(-2px)}to{transform:scale(1)}}body.mode-title .score,body.mode-over .score{opacity:0}.title,.over,.pause{position:absolute;inset:0;z-index:4;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(70px + var(--safe-t)) calc(20px + var(--safe-r)) calc(30px + var(--safe-b)) calc(20px + var(--safe-l));transition:opacity .35s ease}.title{justify-content:flex-start;background:linear-gradient(#1a0f099e,#1a0f091a 52%,#1a0f0900 70%,#1a0f098c)}body:not(.mode-title) .title{opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s .3s}.logo{margin:4vh 0 0;font-size:clamp(64px,22vw,104px);font-weight:900;line-height:1;letter-spacing:.01em;display:flex;gap:.02em}.logo span{display:inline-block;color:var(--cream);transform-origin:50% 90%;text-shadow:0 3px 0 var(--red-lo),0 6px 0 #3a0e08,0 12px 22px rgba(0,0,0,.55);animation:bob 2.4s ease-in-out infinite}.logo span:nth-child(1){color:#ff8a6a;animation-delay:0s}.logo span:nth-child(2){color:var(--cream);animation-delay:-.3s}.logo span:nth-child(3){color:#ffd27a;animation-delay:-.6s}.logo span:nth-child(4){color:#8fd2e8;animation-delay:-.9s}.logo span:nth-child(5){color:var(--cream);animation-delay:-1.2s}@keyframes bob{0%,to{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(5deg) translateY(-4px)}}.garland{width:min(300px,78vw);height:auto;margin-top:-6px;overflow:visible;filter:drop-shadow(0 4px 4px rgba(0,0,0,.45))}.garland .cord{fill:none;stroke:#faf0dce6;stroke-width:1.6}.garland .flags{transform-origin:50% 0;animation:flutter 3.2s ease-in-out infinite}@keyframes flutter{0%,to{transform:skew(-2deg)}50%{transform:skew(2deg) translateY(1px)}}.tag{margin:1.2vh 0 0;padding:6px 14px;border-radius:999px;background:#1a0f098c;font-size:18px;font-weight:700;letter-spacing:.03em;color:var(--cream);text-shadow:0 2px 6px rgba(0,0,0,.7)}.go{margin:14px 0 0;font-size:17px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--night);background:linear-gradient(#ffe39a,var(--gold));padding:11px 22px;border-radius:999px;box-shadow:0 3px #8a5a17,0 8px 18px #00000073;animation:breathe 1.6s ease-in-out infinite}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.title .go{margin-top:auto}.best{margin:12px 0 0;font-size:15px;letter-spacing:.08em;color:#f5e6c8d9;text-shadow:0 1px 4px #000}.best b{color:#ffe39a;font-size:18px}.hint{position:relative;width:132px;height:132px;margin-top:2vh;border-radius:50%;background:radial-gradient(circle,#1a0f098c 40%,#1a0f0900 70%)}.hint .ring{position:absolute;inset:6px;width:120px;height:120px;fill:none;stroke:#ffe39ad9;stroke-width:3.2;stroke-dasharray:7 7;stroke-linecap:round;stroke-linejoin:round;animation:dash 1.1s linear infinite}@keyframes dash{to{stroke-dashoffset:-28}}.hint .orbit{position:absolute;inset:0;animation:orbit 1.1s linear infinite}.hint .hand{position:absolute;left:66px;top:28px;width:56px;height:56px;margin:-4px 0 0 -24px;animation:orbit 1.1s linear infinite reverse;transform-origin:24px 4px}.hint .hand svg{width:56px;height:56px;fill:var(--cream);stroke:#3a1a0c;stroke-width:2.5;stroke-linejoin:round;filter:drop-shadow(0 4px 4px rgba(0,0,0,.5))}@keyframes orbit{to{transform:rotate(360deg)}}.play-hint{position:absolute;z-index:3;left:50%;bottom:calc(14% + var(--safe-b));margin:0 0 0 -66px;pointer-events:none;opacity:0;transition:opacity .4s ease}.play-hint.show{opacity:.95}.over{justify-content:flex-start;padding-top:calc(13vh + var(--safe-t));background:linear-gradient(#1a0f09b3,#1a0f0973 55%,#1a0f091a 75%,#1a0f0959)}.over:not([hidden]){animation:fade .3s ease both}.card{width:min(320px,86vw);padding:22px 20px 20px;border-radius:22px;color:var(--walnut);background:linear-gradient(#fbf1dc,#ecd8b2);border:3px solid var(--gold);box-shadow:0 0 0 6px var(--red),0 0 0 8px #4a120c,0 22px 40px #0009;outline:2px dashed rgba(200,57,43,.35);outline-offset:-11px;animation:drop .5s cubic-bezier(.2,1.4,.4,1) both}.card{position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:-20%;bottom:-20%;width:40%;left:-60%;pointer-events:none;background:linear-gradient(100deg,#fff0,#fffaeb8c,#fff0);transform:skew(-12deg);animation:gleam 1.1s .45s ease-out both}@keyframes gleam{0%{left:-60%}to{left:130%}}@keyframes drop{0%{transform:translateY(-30px) rotate(-3deg) scale(.92);opacity:0}to{transform:none;opacity:1}}@keyframes fade{0%{opacity:0}}.kicker{margin:0;font-size:15px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--red)}.big{font-size:84px;font-weight:900;line-height:1;margin:6px 0 2px;color:var(--walnut);text-shadow:0 3px 0 rgba(231,176,74,.7);font-variant-numeric:tabular-nums}.newbest{display:inline-block;margin:2px 0 6px;padding:5px 14px;border-radius:999px;font-weight:800;font-size:15px;letter-spacing:.08em;color:#fff7e6;background:var(--teal);box-shadow:0 2px #123a4b;animation:shine 1s ease-in-out infinite alternate}@keyframes shine{0%{transform:rotate(-3deg) scale(1)}to{transform:rotate(3deg) scale(1.08)}}.stats{display:flex;justify-content:center;gap:18px;margin:10px 0 2px}.stats div{min-width:64px}.stats dt{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#8a5a3a}.stats dd{margin:2px 0 0;font-size:24px;font-weight:800;color:var(--walnut);font-variant-numeric:tabular-nums}.card .go{display:inline-block;margin-top:16px}.pause{background:#1a0f09b3;font-size:28px;font-weight:800}.pause p{margin:0}@media(prefers-reduced-motion:reduce){.garland .flags,.logo span,.go,.newbest,.card,.card:before,.streak.show.pop{animation:none}.toast.show{animation:fade .3s ease both;opacity:1;transform:translate(-50%)}}@media(max-height:700px){.logo{margin-top:1vh;font-size:clamp(56px,18vw,84px)}.hint{transform:scale(.85);margin-top:0}.garland{width:min(240px,66vw)}.tag{font-size:16px}}