:root{--velvet: #12091a;--velvet2: #1d0f24;--pearl: #f4ecff;--dim: rgba(244, 236, 255, .6);--saffron: #ffb000;--magenta: #ff3d9a;--teal: #19d3c5;--ultra: #5a78ff;--iris: conic-gradient(from 200deg, #ffb000, #ff3d9a, #a65bff, #5a78ff, #19d3c5, #b8f24a, #ffb000);--face: "Skia", "Optima", "Candara", "Segoe UI", system-ui, sans-serif}html,body{background:#07040b;color:var(--pearl);font-family:var(--face)}.stage{background:var(--velvet)}.hud{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;align-items:flex-start;justify-content:space-between;padding:calc(10px + var(--safe-t)) calc(12px + var(--safe-r)) 0 calc(12px + var(--safe-l));pointer-events:none}.lens{border-radius:50%;border:1.5px solid transparent;background:radial-gradient(circle at 38% 32%,#2a1736,#110818 72%) padding-box,var(--iris) border-box;box-shadow:0 6px 18px #00000073,inset 0 0 10px #ffffff0d}.btn{pointer-events:auto;width:46px;height:46px;display:grid;place-items:center;color:var(--pearl);text-decoration:none;transition:transform .12s ease;padding:0}.btn:active{transform:scale(.9) rotate(-8deg)}.btn:focus-visible,.pill:focus-visible{outline:2px solid var(--saffron);outline-offset:3px}.btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;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:var(--dim)}.board{display:flex;flex-direction:column;align-items:center}.score{min-width:4ch;text-align:center;font:600 32px/1 var(--face);font-variant-numeric:tabular-nums;letter-spacing:.04em;background:linear-gradient(90deg,#ffe2a0,#fff,#c9d6ff);-webkit-background-clip:text;background-clip:text;color:transparent;transition:transform .25s cubic-bezier(.2,1.6,.4,1)}.score.pop{transform:scale(1.08)}.meta{display:flex;gap:10px;margin-top:5px;align-items:center}.mult{padding:2px 10px 3px;font:600 13px/1.2 var(--face);letter-spacing:.05em;border-radius:20px;border:1px solid transparent;background:linear-gradient(#170b1f,#170b1f) padding-box,var(--iris) border-box;transition:transform .3s cubic-bezier(.2,1.6,.4,1)}.mult.hot{color:#170b1f;background:var(--iris)}.mult.pop{transform:scale(1.25)}.lives{display:inline-flex;gap:5px}.lives i{position:relative;width:13px;height:13px;border-radius:50%;display:block;border:1px solid transparent;background:radial-gradient(circle at 35% 30%,#fff,#d9ccff 55%,#8e7bd6) padding-box,var(--iris) border-box;transition:opacity .3s,transform .4s}.lives i.gone{background:radial-gradient(#170b1f,#170b1f) padding-box,linear-gradient(#9a8aa8,#9a8aa8) border-box;transform:scale(.88)}.lives i.gone:after{content:"";position:absolute;left:1px;right:1px;top:50%;height:1.4px;background:#f4ecff;transform:rotate(-38deg)}.lives.shake{animation:shake .5s ease}@keyframes shake{20%{transform:translate(-4px)}40%{transform:translate(4px)}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)) 14px calc(20px + var(--safe-b));background:#07040bb8}.plate{position:relative;width:min(296px,calc(100vw - 40px));margin:0 auto;padding:16px 18px 14px;border-radius:22px;border:1.2px solid transparent;background:radial-gradient(130% 100% at 50% 0%,#2a1634ed,#0f0816f0) padding-box,var(--iris) border-box;box-shadow:0 24px 60px #0009}.plate.wide{width:min(372px,calc(100vw - 24px));max-height:calc(100vh - 60px);overflow:auto}.kicker{font:400 12px/1.3 var(--face);letter-spacing:.24em;text-transform:uppercase;color:var(--dim)}.title{left:0;right:0;top:0;padding:calc(70px + var(--safe-t)) 20px 0;transition:opacity .45s ease,transform .45s ease}.title.fade{opacity:0;transform:translateY(-14px) scale(.98)}.title .plate{background:radial-gradient(130% 100% at 50% 0%,#2a1634d1,#0f0816db) padding-box,var(--iris) border-box}h1{margin:2px 0 4px;font:400 46px/1 var(--face);letter-spacing:.06em;background:linear-gradient(100deg,#ffd27a,#ff7ab8 35%,#b69cff 60%,#7fe7ff);-webkit-background-clip:text;background-clip:text;color:transparent}.legend svg{width:132px;height:132px;margin:8px auto 2px;display:block;overflow:visible}.legend .rimc{fill:#05030980;stroke:#f4ecff59;stroke-width:1}.legend .spin{animation:lspin 14s linear infinite;transform-origin:0 0}.legend .ink{fill:none;stroke:#ffb000;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:40;stroke-dashoffset:40;animation:ldraw 4s ease-in-out infinite}.legend .ink.m{stroke:#ff3d9a}.legend .beads circle{fill:#19d3c5;animation:lbead 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.legend .finger ellipse{fill:#fff0fad9;stroke:#1e0a2899;stroke-width:1}.legend .finger{animation:lfinger 4s ease-in-out infinite}@keyframes ldraw{0%{stroke-dashoffset:40}55%,85%{stroke-dashoffset:0}to{stroke-dashoffset:0;opacity:0}}@keyframes lbead{0%,50%{opacity:1;transform:scale(1)}58%{opacity:1;transform:scale(1.8)}66%,to{opacity:0;transform:scale(.4)}}@keyframes lfinger{0%{transform:translate(-6px,4px)}55%{transform:translate(-6px,-38px)}85%{transform:translate(-6px,-38px);opacity:1}to{transform:translate(-6px,-38px);opacity:0}}@keyframes lspin{to{transform:rotate(360deg)}}.cta{margin-top:8px;font:400 17px/1.2 var(--face);letter-spacing:.06em;color:var(--pearl);animation:breathe 2.4s ease-in-out infinite}@keyframes breathe{50%{opacity:.55}}.best{margin-top:5px;font:600 13px/1.2 var(--face);letter-spacing:.1em;color:var(--dim)}.row2{display:flex;justify-content:center;gap:8px;margin-top:12px}.pill{pointer-events:auto;display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 16px;border-radius:22px;border:1px solid transparent;background:linear-gradient(#1b0d24,#1b0d24) padding-box,var(--iris) border-box;color:var(--pearl);font:400 14px/1 var(--face);letter-spacing:.08em}.pill svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}.pill.solid{margin-top:12px;background:var(--iris);color:#170b1f;font-weight:600}.pill:active{transform:scale(.95)}.card{left:0;right:0;top:50%;transform:translateY(-46%) scale(.96);opacity:0;transition:opacity .4s ease,transform .5s cubic-bezier(.2,1.3,.4,1)}.card.show{opacity:1;transform:translateY(-50%)}.big{font:600 50px/1.05 var(--face);letter-spacing:.03em;margin-top:2px;background:linear-gradient(90deg,#ffe2a0,#fff,#c9d6ff);-webkit-background-clip:text;background-clip:text;color:transparent}.newbest{display:inline-block;margin:4px 0 2px;padding:4px 14px;border-radius:16px;background:var(--iris);color:#170b1f;font:600 13px/1.2 var(--face);letter-spacing:.18em;text-transform:uppercase;animation:glint 1.2s ease-in-out infinite alternate}@keyframes glint{to{filter:brightness(1.25);transform:scale(1.05)}}.keep{display:block;width:150px;height:188px;object-fit:cover;margin:10px auto 6px;border-radius:14px;box-shadow:0 8px 22px #00000080}.rows{margin:6px auto 0;max-width:220px}.row{display:flex;justify-content:space-between;font:400 13px/1.75 var(--face);letter-spacing:.06em;color:var(--dim);border-bottom:1px solid rgba(244,236,255,.08)}.row b{color:var(--pearl);font-weight:600;font-variant-numeric:tabular-nums}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.grid figure{margin:0}.grid img{width:100%;aspect-ratio:4 / 5;object-fit:cover;border-radius:50% 50% 14px 14px;border:1px solid rgba(244,236,255,.2);display:block}.grid figcaption{margin-top:3px;font:400 11px/1.3 var(--face);color:var(--dim);display:flex;justify-content:space-between;letter-spacing:.04em}.grid figcaption b{color:var(--pearl);font-weight:600}.grid figcaption i{font-style:normal;color:var(--saffron)}.empty{color:var(--dim);font-size:14px;letter-spacing:.06em}.paused{inset:0;display:grid;place-items:center;background:#07040b8c}@media(prefers-reduced-motion:reduce){.legend .spin,.cta,.newbest{animation:none}.legend .ink{stroke-dashoffset:0;animation:none}.legend .finger,.legend .beads circle{animation:none}}.grid figure{cursor:pointer}.grid figure.pinned img{border-color:var(--saffron);box-shadow:0 0 0 1px var(--saffron)}.grid figure.pinned figcaption b:before{content:"✦";color:var(--saffron)}.keep.big-keep{width:min(220px,58vw);height:auto;aspect-ratio:4 / 5;margin:12px auto 4px}.row2.btns{flex-wrap:wrap}.pill.ad:after{content:"AD";margin-left:2px;padding:2px 5px;border-radius:8px;font:600 9px/1.2 var(--face);letter-spacing:.1em;color:#170b1f;background:var(--saffron)}
