:root{--sky:#0b1026;--ink:#f7f1e3;--gold:#ffd56b;--blush:#ff8fab;--panel:#0a0e22b8}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:radial-gradient(1200px 600px at 50% -10%, #24306a 0%, transparent 55%), radial-gradient(800px 500px at 80% 110%, #3a1d55 0%, transparent 50%), var(--sky);height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;margin:0;font-family:Nunito,Fredoka,system-ui,sans-serif;overflow:hidden}#app{min-height:100%;place-items:center;min-height:100dvh;padding:16px;display:grid}.stage{aspect-ratio:16/10;touch-action:none;background:#0b1026;border-radius:28px;width:min(920px,100%);max-height:min(86dvh,720px);position:relative;overflow:hidden;box-shadow:0 0 0 1px #ffd56b2e,0 30px 80px #00000073,0 0 120px #5a8cff2e}canvas{cursor:pointer;touch-action:none;outline:none;width:100%;height:100%;display:block}.hud{pointer-events:none;text-shadow:0 2px 10px #0000008c;justify-content:space-between;align-items:flex-start;padding:18px 108px 0 32px;display:flex;position:absolute;inset:0 0 auto}.hud-label,.high{letter-spacing:.08em;text-transform:uppercase;opacity:.75;font-size:12px}.hud-value{color:var(--gold);font-family:Fredoka,sans-serif;font-size:32px;font-weight:700;line-height:1}.hud-right{text-align:right}.lives{justify-content:flex-end;gap:6px;margin-bottom:4px;display:flex}.heart{color:var(--blush);filter:drop-shadow(0 2px 4px #00000059);font-size:20px;line-height:1}.heart.gone{color:#ffffff38}.heart.fresh{filter:drop-shadow(0 0 8px #ff8fab);animation:.35s pop}.combo{color:var(--gold);background:#ffd56b2e;border:1px solid #ffd56b66;border-radius:999px;margin-top:8px;padding:6px 14px;font-family:Fredoka,sans-serif;font-weight:700;animation:.25s pop}.hint{color:var(--gold);background:#ffd56b33;border:1px solid #ffd56b73;border-radius:999px;margin-top:10px;padding:8px 14px;font-family:Fredoka,sans-serif;font-weight:700;animation:.25s pop,1.1s ease-in-out infinite pulse}.hint[hidden]{display:none!important}.overlay{z-index:4;text-align:center;background:linear-gradient(#080c200d,#080c2047);place-content:center;justify-items:center;gap:8px;padding:20px 18px;display:grid;position:absolute;inset:0}#title-screen h1{font-size:clamp(34px,6.4vw,58px)}.overlay>*{min-width:0;max-width:100%}.overlay[hidden],.hud[hidden],button[hidden]{display:none!important}.badge{letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-size:12px}h1,h2{letter-spacing:-.03em;margin:0;font-family:Fredoka,sans-serif;font-size:clamp(42px,8vw,72px)}h2{font-size:clamp(36px,6vw,56px)}.tag,.final-score,.best-line,.how{color:#f7f1e3db;overflow-wrap:break-word;width:min(22rem,100%);max-width:100%;margin:0}.final-score{font-size:20px}.best-line{color:var(--gold);font-weight:800}.levels{flex-wrap:wrap;justify-content:center;gap:8px;width:100%;max-width:33rem;margin-top:4px;display:flex}.level-btn{text-align:left;color:#2a1b07;cursor:pointer;background:linear-gradient(#ffe38a,#ffc24a);border:0;border-radius:16px;flex:9.6rem;min-width:9.6rem;max-width:10.6rem;padding:10px 12px 11px;font:800 16px/1.1 Fredoka,sans-serif;box-shadow:0 7px #c4891a,0 12px 20px #00000038}.level-btn small{opacity:.82;margin-top:5px;font:700 13px/1 Nunito,sans-serif;display:block}.level-btn .diff{letter-spacing:.02em;opacity:.7;margin-top:7px;font:700 11px/1 Nunito,sans-serif;display:block}.level-btn.sunset{background:linear-gradient(#ffd4a8,#ff9a4a);box-shadow:0 7px #c46a22,0 12px 20px #00000038}.level-btn.cloud{background:linear-gradient(#c8f0dd,#6ad0a8);box-shadow:0 7px #2f9a72,0 12px 20px #00000038}.level-btn.hard{background:linear-gradient(#ffc2d4,#ff8fab);box-shadow:0 7px #c45a78,0 12px 20px #00000038}.level-btn.comet{color:#1b1233;background:linear-gradient(#e0d4ff,#9a7cff);box-shadow:0 7px #5a3db8,0 12px 20px #00000038}.level-btn.peak{color:#1b1233;background:linear-gradient(#d4c4ff,#8b6cff);box-shadow:0 7px #4a2898,0 12px 20px #00000038}.level-btn:hover,.play:hover{transform:translateY(-1px)}.play{color:#2a1b07;cursor:pointer;background:linear-gradient(#ffe38a,#ffc24a);border:0;border-radius:999px;margin-top:10px;padding:14px 28px;font:800 18px/1 Fredoka,sans-serif;box-shadow:0 10px #c4891a,0 18px 30px #00000047}.play.alt{color:var(--ink);background:#ffffff1f;margin-top:8px;box-shadow:0 6px #00000040,0 10px 18px #0000002e}.play:active{transform:translateY(6px);box-shadow:0 4px #c4891a,0 8px 16px #00000047}.how{flex-wrap:wrap;justify-content:center;gap:8px;width:100%;max-width:20rem;margin-top:8px;display:flex}.how span{background:#ffffff14;border-radius:999px;padding:6px 10px;font-size:13px}.icon-btn{width:40px;height:40px;color:var(--ink);cursor:pointer;z-index:5;background:#ffffff1f;border:0;border-radius:50%;font:700 16px/1 Fredoka,sans-serif;position:absolute;top:14px}.mute{right:14px}.pause-btn{right:60px}.icon-btn.muted{opacity:.45}@keyframes pop{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes pulse{50%{transform:scale(1.06)}}@media (max-width:700px){.stage{aspect-ratio:3/4;border-radius:20px;max-height:92dvh}.hud{padding:16px 96px 0 22px}.hud-value{font-size:24px}.overlay{padding:20px 16px}.tag{font-size:15px}h1{font-size:44px}.how{max-width:16rem}}