:root{--plum: #2a0c18;--plum2: #5a1426;--mauve: #8a2a3a;--coral: #e0aa4c;--gilt: #c8963c;--cream: #fbf1e4;--cream2: #f1e0cc;--pearl: #fff4e6;--rose: #ff6f86;--mint: #5fe0b4;--gold: #ffc64a;--sky: #7db8ff;--sans: Optima, Candara, "Segoe UI", "Gill Sans", "Trebuchet MS", system-ui, sans-serif;--serif: "Palatino", "Palatino Linotype", "Book Antiqua", Georgia, serif}html,body{background:#160810;color:var(--pearl);font-family:var(--sans)}.stage{background:#2a0e1a}.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}.pill{background:#2a0c1873;border:1px solid rgba(232,190,110,.55);border-radius:22px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.btn{pointer-events:auto;width:44px;height:44px;display:grid;place-items:center;color:var(--pearl);text-decoration:none;padding:0;transition:transform .15s cubic-bezier(.3,1.6,.5,1),background .2s ease}.btn:active{transform:scale(.9);background:#fff4e640}.btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width: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:#fff4e680}.board{display:flex;flex-direction:column;align-items:center;gap:5px}.score{min-width:4.5ch;padding:3px 18px 1px;text-align:center;font:italic 700 28px/1.1 var(--serif);font-variant-numeric:lining-nums tabular-nums;color:var(--plum);background:linear-gradient(180deg,#fffaf2,var(--cream2));border-radius:18px;border:1.5px solid #c8963c;box-shadow:0 6px 18px #14040a80,0 0 0 1px #5a280a66,inset 0 -2px #a06e2840;transition:transform .25s cubic-bezier(.2,1.6,.4,1)}.score.pop{transform:scale(1.12)}.meta{display:flex;gap:6px;align-items:center}.mult{display:inline-flex;align-items:center;min-width:30px;justify-content:center;padding:2px 8px;font:700 13px/1.3 var(--sans);letter-spacing:.06em;color:var(--pearl);background:#2a0c18c7;border:1px solid rgba(232,190,110,.5);border-radius:10px;transition:transform .3s cubic-bezier(.2,1.6,.4,1),background .3s ease}.mult.hot{background:linear-gradient(180deg,#f6d68a,#c8963c);color:var(--plum);border-color:#fff0c8}.mult.pop{transform:scale(1.3)}.ens{display:inline-flex;align-items:flex-end;gap:2px;height:20px;padding:3px 7px;background:#2a0c18c7;border:1px solid rgba(232,190,110,.5);border-radius:10px}.ens i{width:4px;border-radius:2px;background:var(--pearl);transition:opacity .25s ease,transform .25s ease,background .25s ease}.ens i:nth-child(1){height:5px}.ens i:nth-child(2){height:6px}.ens i:nth-child(3){height:7px}.ens i:nth-child(4){height:8px}.ens i:nth-child(5){height:9px}.ens i:nth-child(6){height:10px}.ens i:nth-child(7){height:11px}.ens i:nth-child(8){height:12px}.ens i:nth-child(9){height:13px}.ens i:nth-child(10){height:14px}.ens i.off{opacity:.16;transform:scaleY(.5)}.ens.low i:not(.off){background:var(--coral);animation:tremble .35s ease-in-out infinite alternate}.ens.hit{animation:shake .45s ease}@keyframes tremble{0%{transform:translateY(0)}to{transform:translateY(-2px)}}@keyframes shake{20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}.title,.card,.paused,.calib,.gallery{position:absolute;inset:0;z-index:2;text-align:center;display:flex;align-items:center;justify-content:center;padding:calc(64px + var(--safe-t)) 18px calc(28px + var(--safe-b))}.title,.card,.paused{pointer-events:none}.calib,.gallery{z-index:4;pointer-events:auto;background:#16060e99}.title{align-items:flex-end;background:radial-gradient(ellipse 90% 55% at 50% 52%,#16060e8c,#16060e1a 75%,#16060e00);transition:opacity .45s ease}.title.fade{opacity:0}.prog{position:relative;width:min(320px,calc(100vw - 36px));padding:22px 18px 18px;color:var(--plum);border-radius:16px;background:linear-gradient(180deg,#fffaf2,var(--cream) 40%,var(--cream2));box-shadow:0 26px 60px #0e020899,0 0 0 1.5px #b8862e,0 0 0 3px #501e0a59,0 2px #fff9 inset}.prog:before{content:"";position:absolute;inset:7px;border:1.5px solid rgba(184,134,46,.85);border-radius:11px;pointer-events:none}.prog:after{content:"";position:absolute;inset:11px;border:.5px solid rgba(138,42,58,.45);border-radius:8px;pointer-events:none}.prog.wide{width:min(360px,calc(100vw - 28px));max-height:100%;display:flex;flex-direction:column}.kicker{font:600 10.5px/1 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--mauve);padding-left:.32em}h1{margin:8px 0 0;font:italic 700 62px/1 var(--serif);letter-spacing:.01em;color:var(--plum)}h1:after{content:"";display:block;width:92px;height:2px;margin:10px auto 0;background:linear-gradient(90deg,transparent,var(--coral),transparent)}.sub{margin:10px 0 0;font:italic 16px/1.3 var(--serif);color:var(--mauve)}.legend{display:flex;justify-content:center;gap:10px;margin:14px 0 6px}.legend svg{width:120px;height:84px;border-radius:10px;background:radial-gradient(ellipse 80% 70% at 50% 60%,#6a1c2c,#2a0812);box-shadow:inset 0 0 0 1px #e8be6e8c}.legend .path{fill:none;stroke:#fff4e659;stroke-width:2;stroke-linecap:round}.legend .pt{fill:#fff4e6b3}.legend .orb{fill:#fff4dc;filter:drop-shadow(0 0 4px #ffd98a)}.legend text{fill:#fff4e699;font:600 8px var(--sans);text-anchor:middle}.legend .shell{fill:none;stroke:#d8a850;stroke-width:3}.legend .rib{fill:none;stroke:var(--rose);stroke-width:2;animation:blink 1.3s ease-in-out infinite}.legend .sec{fill:var(--rose);animation:blink 1.3s ease-in-out infinite}.legend .sec.b{fill:#ffc64a80;animation:none}.legend .arrow{fill:none;stroke:#fff4dc;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;animation:flick 1.3s cubic-bezier(.5,0,.2,1) infinite}@keyframes blink{0%,to{opacity:.45}50%{opacity:1}}@keyframes flick{0%,40%{transform:translate(14px);opacity:0}55%{opacity:1}85%{transform:translate(-6px);opacity:1}to{transform:translate(-6px);opacity:0}}.cta{margin-top:12px;font:600 12.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--plum);animation:breathe 1.8s ease-in-out infinite}@keyframes breathe{0%,to{opacity:.55}50%{opacity:1}}.best{margin-top:8px;font:italic 14px var(--serif);color:var(--mauve)}.tools{display:flex;justify-content:center;gap:8px;margin-top:14px}.chip{pointer-events:auto;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:22px;border:1px solid rgba(184,134,46,.7);background:#ffffff8c;color:var(--plum);font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;transition:transform .15s ease,background .2s ease}.chip:active{transform:scale(.95);background:#fff}.chip svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.chip.main{background:var(--plum);color:var(--cream);border-color:var(--plum)}.card .prog{opacity:0;transform:translateY(18px) scale(.97);transition:opacity .45s ease,transform .55s cubic-bezier(.2,1.4,.4,1)}.card.show .prog{opacity:1;transform:none}.card.show .prog:before{animation:sheen 1.4s .5s ease-out 1}.prog .shine{position:absolute;inset:0;border-radius:16px;overflow:hidden;pointer-events:none}.card.show .prog .shine:after{content:"";position:absolute;top:-20%;bottom:-20%;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skew(-18deg);animation:sweep 1.3s .55s ease-out 1 forwards}@keyframes sweep{to{left:130%}}@keyframes sheen{0%{border-color:#b8862ed9}40%{border-color:#ffecaa}to{border-color:#b8862ed9}}.card.show .big{animation:bigpop .7s .1s cubic-bezier(.2,1.6,.4,1) both}@keyframes bigpop{0%{transform:scale(.7);opacity:0}to{transform:none;opacity:1}}.card.show .row{animation:rowin .4s ease both}.card.show .row:nth-child(2){animation-delay:.12s}.card.show .row:nth-child(3){animation-delay:.24s}@keyframes rowin{0%{opacity:0;transform:translate(8px)}to{opacity:1;transform:none}}.score{position:relative;overflow:hidden}.score.pop{color:#7a2f55;box-shadow:0 6px 18px #14081e73,0 0 18px #ffbe788c,inset 0 -2px #7a3f672e}.split{display:flex;gap:14px;align-items:center;margin-top:12px;text-align:left}.keep{width:132px;aspect-ratio:3 / 4;flex:none;border-radius:4px;background:var(--cream2);box-shadow:0 6px 16px #2a0c1866;transform:rotate(-2.5deg);object-fit:cover}.nums{flex:1;min-width:0}.big{font:italic 700 44px/1 var(--serif);color:var(--plum);font-variant-numeric:lining-nums}.label{font:600 10px/1.4 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--mauve)}.newbest{display:inline-block;margin-top:6px;padding:3px 10px;border-radius:10px;background:linear-gradient(180deg,#f6d68a,#c8963c);color:var(--plum);font:700 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;animation:glow 1.2s ease-in-out infinite}@keyframes glow{0%,to{box-shadow:0 0 #f0be5a00}50%{box-shadow:0 0 16px #f0be5acc}}.rows{margin-top:8px}.row{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dotted rgba(44,26,68,.3);font:13px/1.3 var(--sans)}.row b{font:italic 700 15px/1.2 var(--serif)}.metro{width:120px;height:130px;margin:10px auto 0;display:block}.metro .body{fill:var(--plum)}.metro .face{fill:#5a1426}.metro .arm{stroke:var(--cream);stroke-width:2.5;stroke-linecap:round}.metro .weight{fill:var(--gold)}.metro .pivot{fill:var(--coral)}.metro.tick .pivot{fill:#fff}#cArm{transform-origin:60px 100px}.calib .hand{position:relative;height:34px}.calib .hand i{position:absolute;left:50%;top:0;width:22px;height:30px;margin-left:-11px;border-radius:11px 11px 9px 9px;background:var(--plum);opacity:.8;animation:tap .667s ease-in infinite}.calib .hand i:after{content:"";position:absolute;left:50%;bottom:-4px;width:26px;height:6px;margin-left:-13px;border-radius:50%;background:#ff8f6b80}@keyframes tap{0%{transform:translateY(-6px)}85%{transform:translateY(2px)}to{transform:translateY(-6px)}}.calib.done .hand{visibility:hidden}.dots{display:flex;justify-content:center;gap:7px;margin-top:8px;min-height:12px}.dots i{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--plum);transition:background .15s ease,transform .2s cubic-bezier(.3,1.8,.5,1)}.dots i.lead{border-style:dotted;opacity:.5}.dots i.on{background:var(--coral);border-color:var(--coral);transform:scale(1.2)}.cres{min-height:22px;margin-top:8px;font:italic 700 18px/1.2 var(--serif)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;overflow-y:auto;padding:4px;max-height:60vh}.grid figure{margin:0}.grid img{width:100%;aspect-ratio:3 / 4;border-radius:3px;box-shadow:0 4px 10px #2c1a444d;display:block;background:var(--cream2)}.grid figcaption{margin-top:4px;font:italic 12px/1.2 var(--serif);color:var(--mauve)}.empty{margin-top:16px;font:italic 15px var(--serif);color:var(--mauve)}.paused{background:#16060e8c}.paused .cta{color:var(--pearl);font-size:15px}@media(max-height:700px){h1{font-size:50px}.legend svg{width:104px;height:73px}.prog{padding:18px 16px 14px}}@media(prefers-reduced-motion:reduce){.card.show .big,.card.show .row,.card.show .prog .shine:after,.card.show .prog:before{animation:none}.cta,.legend .rib,.legend .sec,.legend .arrow,.ens.low i,.newbest,.calib .hand i{animation:none}}.grid figure{cursor:pointer}.grid figure.pinned img{box-shadow:0 0 0 2px var(--gilt),0 4px 10px #2c1a444d}.grid figure.pinned figcaption:before{content:"★";color:var(--gilt)}.big-keep{display:block;width:min(250px,64vw);height:auto;aspect-ratio:3 / 4;margin:14px auto 0;border-radius:3px;box-shadow:0 6px 16px #2c1a4459}.chip.ad:after{content:"AD";margin-left:2px;padding:1px 4px;border-radius:4px;font:700 9px/1.2 var(--sans);letter-spacing:.08em;background:#0000002e}#over .tools{margin-top:10px}
