:root{--plum: #2a1530;--plum2: #3d2040;--sand: #f4e2c8;--sandDk: #c9a27c;--clay: #b8603f;--gold: #ffd166;--teal: #74eadc;--rose: #e8577a;--ember: #ffb04a;--type: Optima, Candara, "Segoe UI", "Noto Sans", sans-serif}html,body{background:#1c0e20;color:var(--sand);font-family:var(--type)}.stage{background:#3a2236}.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}.slab{background:linear-gradient(180deg,#4a2842eb,#2a1530eb);border-radius:14px 11px 15px 10px;box-shadow:inset 0 0 0 1.5px #74eadc8c,0 4px 10px #14061459}.btn{pointer-events:auto;width:44px;height:44px;display:grid;place-items:center;border:0;color:var(--sand);text-decoration:none;transition:transform .12s ease}.btn:active{transform:scale(.92)}.btn 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:#f4e2c880}.board{display:flex;flex-direction:column;align-items:center}.score{min-width:4ch;padding:3px 18px 2px;text-align:center;font:600 30px/1.05 var(--type);letter-spacing:.06em;font-variant-numeric:tabular-nums;color:var(--sand);text-shadow:0 2px 0 rgba(42,21,48,.8),0 0 14px rgba(255,176,74,.35);transition:transform .25s cubic-bezier(.2,1.6,.4,1)}.score.pop{transform:scale(1.12)}.meta{display:flex;gap:6px;margin-top:2px;align-items:center}.mult{padding:2px 9px 1px;font:700 13px/1.3 var(--type);letter-spacing:.1em;color:var(--sand);background:#2a1530bf;border-radius:9px 7px 10px 6px;box-shadow:inset 0 0 0 1px #f4e2c859;transition:transform .3s cubic-bezier(.2,1.6,.4,1),background .3s ease}.mult.hot{background:linear-gradient(180deg,var(--ember),var(--clay));color:#2a1530;box-shadow:none}.mult.pop{transform:scale(1.3)}.cairns{display:inline-flex;gap:2px;padding:2px 6px;background:#2a1530bf;border-radius:9px 7px 10px 6px}.cairns svg{width:16px;height:16px;fill:var(--sand);transition:opacity .3s ease,transform .4s ease}.cairns svg.gone{opacity:.25;transform:translateY(3px) scaleY(.5)}.cairns.shake{animation:shake .5s ease}@keyframes shake{20%{transform:translate(-4px) rotate(-3deg)}40%{transform:translate(4px) rotate(3deg)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}.title,.card,.paused,.sheet{position:absolute;z-index:2;text-align:center}.title,.card,.paused{pointer-events:none}.sheet{inset:0;z-index:4;display:grid;place-items:center;padding:calc(20px + var(--safe-t)) 16px calc(20px + var(--safe-b));background:#1c0a1e8c}.tablet{position:relative;width:min(316px,calc(100vw - 36px));margin:0 auto;padding:20px 18px 18px;color:var(--sand);background:radial-gradient(120% 70% at 30% 0%,rgba(255,196,140,.16),transparent 60%),linear-gradient(180deg,#4c263ef5,#2a1530f7);border-radius:26px 20px 30px 18px/20px 28px 18px 26px;box-shadow:inset 0 0 0 2px #c9a27c73,inset 0 0 0 6px #2a153099,inset 0 0 0 7.5px #74eadc99,0 24px 60px #14061480}.tablet.wide{width:min(360px,calc(100vw - 28px));max-height:calc(100vh - 60px);overflow:auto}.kicker{font:600 11px/1.3 var(--type);letter-spacing:.3em;text-transform:uppercase;color:var(--teal);padding-left:.3em}.title{inset:0;display:flex;align-items:flex-start;justify-content:center;padding:calc(60px + var(--safe-t)) 20px calc(40px + var(--safe-b));background:radial-gradient(ellipse 85% 50% at 50% 50%,#1c0a1e73,#1c0a1e00 80%)}.title.fade{animation:fadeOut .45s ease forwards}@keyframes fadeOut{to{opacity:0;transform:translateY(-10px) scale(.98)}}.title h1{margin:8px 0 0;font:600 clamp(42px,13vw,54px)/1 var(--type);letter-spacing:.14em;padding-left:.14em;text-transform:uppercase;background:linear-gradient(180deg,#fff3dc 15%,var(--ember) 55%,var(--rose) 92%);-webkit-background-clip:text;background-clip:text;color:transparent}.inlay{display:flex;align-items:center;justify-content:center;gap:6px;margin:8px 0 0}.inlay i{width:58px;height:2px;background:linear-gradient(90deg,transparent,var(--teal))}.inlay i:last-child{transform:scaleX(-1)}.inlay b{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold)}.legend{margin:10px auto 0;width:170px;height:92px;display:grid;place-items:center;border-radius:16px 12px 18px 10px;background:#1c0a1e73}.legend svg{width:160px;height:88px;overflow:visible;fill:none;stroke-linecap:round;stroke-linejoin:round}.legend .wall{stroke:var(--teal);stroke-width:3;opacity:.8}.legend .rim{stroke:#f4e2c859;stroke-width:1.4}.legend .sock{stroke:var(--sand);stroke-width:1.6;fill:#5a2c22}.legend .call{fill:var(--gold);animation:callA 3s ease-in-out infinite}.legend .echo{fill:var(--teal);animation:echoA 3s ease-in-out infinite}.legend .wave{stroke:var(--teal);stroke-width:2;stroke-dasharray:3 4;animation:waveA 3s linear infinite}@keyframes callA{0%,8%{opacity:0;transform:scale(.4);transform-origin:60px 26px}14%,70%{opacity:1;transform:scale(1)}85%,to{opacity:0}}@keyframes echoA{0%,62%{opacity:0}70%,88%{opacity:1}to{opacity:0}}@keyframes waveA{0%,12%{opacity:0;stroke-dashoffset:40}20%{opacity:1}66%{opacity:1;stroke-dashoffset:0}75%,to{opacity:0}}.cta{margin-top:14px;font:600 14px/1.3 var(--type);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);animation:breathe 2.2s ease-in-out infinite;padding-left:.22em}@keyframes breathe{0%,to{opacity:.55}50%{opacity:1}}.best{margin-top:6px;font:600 12px/1 var(--type);letter-spacing:.22em;text-transform:uppercase;color:var(--sandDk)}.row2{display:flex;gap:10px;justify-content:center;margin-top:14px}.pill{pointer-events:auto;min-height:44px;padding:0 16px;display:inline-flex;align-items:center;gap:7px;border:0;color:var(--sand);background:#1c0a1e8c;border-radius:22px 18px 24px 16px;box-shadow:inset 0 0 0 1.5px #74eadc8c;font:600 12px/1 var(--type);letter-spacing:.16em;text-transform:uppercase}.pill svg{width:18px;height:18px;fill:none;stroke:var(--teal);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.pill:active{transform:scale(.95)}.pill.gold{background:linear-gradient(180deg,var(--gold),var(--ember));color:var(--plum);box-shadow:none}.card{left:50%;top:50%;transform:translate(-50%,-46%) scale(.96);opacity:0;transition:opacity .35s ease,transform .5s cubic-bezier(.2,1.4,.4,1)}.card.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.big{font:600 58px/1 var(--type);margin-top:6px;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff3dc 15%,var(--ember) 65%,var(--rose));-webkit-background-clip:text;background-clip:text;color:transparent}.newbest{display:inline-block;margin-top:6px;padding:6px 14px 5px;font:700 12px/1 var(--type);letter-spacing:.24em;text-transform:uppercase;color:var(--plum);background:linear-gradient(180deg,var(--gold),var(--ember));border-radius:12px 9px 13px 8px;animation:shine 1.4s ease-in-out infinite}@keyframes shine{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}.keep{display:block;width:116px;height:auto;aspect-ratio:2 / 3;object-fit:cover;margin:10px auto 0;border-radius:6px;box-shadow:0 0 0 2px var(--sand),0 8px 20px #0006;transform:rotate(-2.5deg)}.rows{margin:10px 4px 0}.row{display:flex;justify-content:space-between;align-items:baseline;padding:5px 2px 3px;border-bottom:1px solid rgba(116,234,220,.18);font:600 11px/1.2 var(--type);letter-spacing:.18em;text-transform:uppercase;color:var(--sandDk)}.row b{font:600 18px/1 var(--type);color:var(--sand);font-variant-numeric:tabular-nums;letter-spacing:.04em}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}.grid figure{margin:0}.grid img{width:100%;aspect-ratio:2 / 3;object-fit:cover;border-radius:4px;box-shadow:0 0 0 1.5px var(--sand),0 4px 10px #00000059}.grid figure:nth-child(odd) img{transform:rotate(-1.5deg)}.grid figure:nth-child(2n) img{transform:rotate(1.5deg)}.grid figcaption{margin-top:5px;font:600 11px/1 var(--type);letter-spacing:.08em;color:var(--gold)}.empty{margin:18px 0;font:italic 14px/1.3 var(--type);color:var(--sandDk)}.sub{margin:8px 0 0;font:500 15px/1.3 var(--type);letter-spacing:.06em;color:var(--sand)}.drum{position:relative;width:120px;height:120px;margin:16px auto 8px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#f1d3ae,#c98a5f 65%,#8a5a40);box-shadow:inset 0 0 0 4px #5a2d1e66,0 10px 24px #00000059}.drum i{position:absolute;inset:-10px;border-radius:50%;border:3px solid var(--gold);opacity:0}.drum.hit{animation:hit .22s ease-out}.drum.hit i{animation:ring .5s ease-out}.drum.you i{border-color:var(--teal)}@keyframes hit{0%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes ring{0%{opacity:1;transform:scale(.85)}to{opacity:0;transform:scale(1.25)}}.dots{display:flex;gap:8px;justify-content:center;min-height:14px}.dots span{width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1.5px #f4e2c880}.dots span.on{background:var(--teal);box-shadow:none}.dots span.lead{box-shadow:inset 0 0 0 1.5px #ffd16699}.dots span.lead.on{background:var(--gold)}.result{margin:10px 0 0;min-height:1.3em;font:600 13px/1.3 var(--type);letter-spacing:.1em;color:var(--sandDk)}.paused{inset:0;display:grid;place-items:center;background:#1c0a1e99}@media(max-height:700px){.tablet{padding-top:14px;padding-bottom:14px}.title h1{font-size:42px}.legend{height:84px}.legend svg{height:80px}.big{font-size:46px}.keep{width:92px}.row{padding:4px 2px 2px}}@media(prefers-reduced-motion:reduce){.cta,.newbest,.legend .call,.legend .echo,.legend .wave{animation:none;opacity:1}.score,.mult{transition:none}.cairns.shake,.drum.hit,.drum.hit i{animation:none}}.card .tablet:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,222,170,.14) 48%,transparent 60%);background-size:260% 100%;background-position:130% 0}.card.show .tablet:before{animation:sheen 2.4s ease-out .3s 1 both}@keyframes sheen{to{background-position:-30% 0}}.card .row{opacity:0;transform:translateY(6px)}.card.show .row{animation:rowIn .45s ease-out forwards}.card.show .row:nth-child(2){animation-delay:.1s}.card.show .row:nth-child(3){animation-delay:.2s}.card.show .row:nth-child(4){animation-delay:.3s}@keyframes rowIn{to{opacity:1;transform:none}}.card.show .big{animation:bigIn .7s cubic-bezier(.2,1.5,.4,1) both;filter:drop-shadow(0 0 12px rgba(255,176,74,.45))}@keyframes bigIn{0%{transform:scale(.6);opacity:0}}.score.pop{text-shadow:0 2px 0 rgba(42,21,48,.8),0 0 22px rgba(255,209,102,.8)}.mult.hot{box-shadow:0 0 14px #ffb04a99}@media(prefers-reduced-motion:reduce){.card.show .tablet:before,.card.show .row,.card.show .big{animation:none;opacity:1;transform:none}}.grid figure{cursor:pointer}.grid figure.pinned img{box-shadow:0 0 0 2px var(--gold),0 4px 10px #00000059}.grid figure.pinned figcaption:before{content:"★";color:var(--gold)}.big-keep{display:block;width:min(200px,54vw);aspect-ratio:2 / 3;margin:14px auto 6px;border-radius:4px;box-shadow:0 0 0 1.5px var(--sand),0 6px 16px #0006}.dcap{margin:4px 0 10px;font:600 13px/1.3 var(--type);letter-spacing:.08em;color:var(--sand)}.dbtns{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.pill.gold svg{stroke:var(--plum)}.pill.ad:after{content:"AD";margin-left:2px;padding:1px 4px;border-radius:4px;font:700 9px/1.2 var(--type);letter-spacing:.08em;background:#00000038}