*{box-sizing:border-box}html,body{margin:0;height:100%;background:#140b04;color:#f4eadd;font-family:system-ui,sans-serif}#app{position:relative;height:100%;overflow:hidden}#stage{display:block;width:100%;height:100%;touch-action:none}.screen{position:absolute;inset:0;display:grid;place-content:center;gap:.7rem;text-align:center;padding:1.4rem;z-index:6;background:radial-gradient(ellipse at center,#140b0480,#0a0602e0);overflow-y:auto}.screen[hidden],#hud[hidden]{display:none}.eyebrow{margin:0;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:#f0a45a}h1{margin:0;font-size:clamp(2.4rem,9vw,5rem);line-height:1;color:#ffb866;letter-spacing:-.02em}h2{margin:0;font-size:clamp(1.6rem,6vw,3rem);color:#ffb866;line-height:1.1}.lede{margin:0 auto;max-width:36rem;color:#e4d3bd;line-height:1.5}.how{margin:0 auto;max-width:38rem;color:#d9c6ae;line-height:1.5;font-size:.92rem}.primary{justify-self:center;padding:.8rem 2rem;border-radius:999px;border:1px solid #f0a45a;background:#f0a45a;color:#1a0d04;font-weight:800;cursor:pointer;font-size:1.05rem}.ghost{padding:.8rem 1.5rem;border-radius:999px;border:1px solid #a58a70;background:transparent;color:#f4eadd;font-weight:600;cursor:pointer;font-size:1rem}.hint{margin:0;font-size:.8rem;color:#cdb99f}.row{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:center}.stars{margin:0;font-size:2rem;letter-spacing:.25em;color:#ffb04e}.score-line{margin:0;font-weight:700}#levels{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}#levels button{display:grid;gap:.15rem;min-width:7.6rem;padding:.6rem .9rem;border-radius:.9rem;border:1px solid #6a4520;background:#1e1108;color:#f4eadd;cursor:pointer;font:inherit}#levels button[aria-checked=true]{border-color:#f0a45a;background:#4a2e14;box-shadow:0 0 0 1px #f0a45a inset}.lv-name{font-weight:700}.lv-meta{font-size:.74rem;color:#dcc8b0}#hud{position:absolute;inset:0;z-index:4;pointer-events:none;display:flex;flex-direction:column;gap:.4rem;padding:max(.6rem,env(safe-area-inset-top)) .75rem max(.6rem,env(safe-area-inset-bottom))}.hud-top{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.hud-top span{background:#0a0602d1;border:1px solid #6a4520;border-radius:999px;padding:.25rem .7rem;font-size:.82rem}.hud-top span.hot{color:#ffd27a;border-color:#f0a45a}.hud-top button{pointer-events:auto;margin-left:auto;padding:.3rem .8rem;border-radius:999px;border:1px solid #7fd6c4;background:#0a0602d1;color:#8fe0cf;cursor:pointer;font-size:.8rem}.heat-row{display:flex;align-items:center;gap:.6rem;font-size:.8rem}.heat-row span{background:#0a0602d1;border-radius:999px;padding:.2rem .6rem;min-width:5.6rem;border:1px solid #6a4520}.heat-row span.hot{color:#ff9a7a;border-color:#ff5a3a}.heat-bar{flex:1;height:12px;background:#0a0602d9;border:1px solid #6a4520;border-radius:999px;overflow:hidden}#heat-fill{height:100%;width:100%;background:#ff8c2e;transition:width .1s linear}.gauge-track{position:relative;height:22px;background:#0a0602e0;border:1px solid #6a4520;border-radius:999px;overflow:hidden}.gauge-zone{position:absolute;top:0;bottom:0;left:var(--zl, 30%);width:var(--zw, 40%);background:#52e67652;border-left:2px solid #52e676;border-right:2px solid #52e676}.gauge-zone.cold{background:#78beff57;border-color:#8ac8ff}.gauge-perfect{position:absolute;top:0;bottom:0;left:var(--pl, 40%);width:var(--pw, 20%);background:#fff59699}#pendulum-marker{position:absolute;top:0;bottom:0;width:6px;margin-left:-3px;background:#ffd27a;border-radius:3px;left:50%;box-shadow:0 0 6px #ffd27a}#hud-status{margin:0;text-align:center;font-size:.86rem;color:#ffe0b8;min-height:1.1em;text-shadow:0 1px 3px #000}#cold-banner{margin:0 auto;padding:.4rem 1rem;border-radius:999px;background:#245caaf0;border:1px solid #bfe0ff;color:#fff;font-weight:700;font-size:.86rem;text-align:center;max-width:94vw;animation:cold .7s ease-in-out infinite alternate}#cold-banner[hidden]{display:none}#cold-banner.active{background:#143c78f0;animation:none}@keyframes cold{to{transform:scale(1.04)}}.flash{position:absolute;left:0;right:0;top:44%;margin:0;text-align:center;font-weight:900;font-size:1.25rem;min-height:1.5rem;text-shadow:0 2px 4px #000}.flash.good{color:#6dfc92}.flash.perfect{color:#fff09a}.flash.bad{color:#ff8a7a}.touch-controls{pointer-events:auto;display:flex;gap:.75rem;margin-top:auto}.touch-controls[hidden]{display:none}.touch-controls button{padding:1.1rem 1rem;border-radius:16px;border:2px solid #ffb866;background:#a8622a;color:#fff;font-size:1.2rem;font-weight:900;letter-spacing:.12em;touch-action:manipulation;cursor:pointer}#strike-btn{flex:2}#bellows-btn{flex:1;border-color:#8ac8ff;background:#214a7a;font-size:.95rem}#bellows-btn:disabled{opacity:.45}#strike-btn:active{background:#e89a4a}button:focus-visible{outline:2px solid #ffd45a;outline-offset:3px}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:2;background:radial-gradient(ellipse at center,transparent 58%,rgba(8,3,1,.5))}@media(prefers-reduced-motion:reduce){#cold-banner{animation:none}}@media(max-height:520px){.how{display:none}}