:root{--bg:#12141c;--fg:#f5f6fa;--accent:#ff6b6b;--accent2:#ffd43b;--panel:#14161eeb;--muted:#9aa0b0;font-family:ui-monospace,SFMono-Regular,JetBrains Mono,Menlo,Consolas,monospace}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);height:100%;color:var(--fg);overscroll-behavior:none;margin:0;padding:0;overflow:hidden}#app,#scene{width:100%;height:100%;position:fixed;inset:0}#scene{touch-action:none;cursor:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='44'%20height='44'%20viewBox='0%200%2044%2044'%3E%3Ctext%20x='22'%20y='37'%20font-size='38'%20text-anchor='middle'%3E%E2%9C%8B%3C/text%3E%3C/svg%3E") 22 26,grab;display:block}#scene.grabbing{cursor:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='44'%20height='44'%20viewBox='0%200%2044%2044'%3E%3Ctext%20x='22'%20y='37'%20font-size='38'%20text-anchor='middle'%3E%E2%9C%8A%3C/text%3E%3C/svg%3E") 22 22,grabbing}#ui-root{pointer-events:none;z-index:10;position:fixed;inset:0}#ui-root button,#ui-root input,#ui-root .overlay{pointer-events:auto}.hud{top:max(12px, env(safe-area-inset-top));justify-content:space-between;align-items:flex-start;gap:12px;padding:0 16px;display:flex;position:absolute;left:0;right:0}.hud .stats{flex-direction:column;gap:2px;display:flex}.hud .score{letter-spacing:.5px;text-shadow:0 1px 3px #000000a6,0 0 14px #0006;font-size:clamp(22px,5vw,34px);font-weight:700}.hud .combo{color:var(--accent2);text-shadow:0 1px 3px #000000a6,0 0 10px #0006;min-height:1.2em;font-size:clamp(14px,3.5vw,20px);transition:transform 80ms}.hud .combo.pop{transform:scale(1.35)}.hud .right{align-items:center;gap:8px;display:flex}.gauge{bottom:max(16px, env(safe-area-inset-bottom));text-align:center;-webkit-backdrop-filter:blur(6px);background:#0f11188c;border-radius:14px;width:min(360px,80vw);padding:10px 14px 8px;position:absolute;left:50%;transform:translate(-50%)}.gauge .bar{background:#ffffff24;border-radius:8px;height:12px;overflow:hidden}.gauge .fill{background:linear-gradient(90deg, var(--accent), var(--accent2));transform-origin:0;width:100%;height:100%;transition:width .18s}.gauge .label{color:#dfe3ec;text-shadow:0 1px 2px #00000080;margin-top:5px;font-size:12px}.icon-btn{background:var(--panel);color:var(--fg);cursor:pointer;border:1px solid #ffffff1a;border-radius:10px;width:40px;height:40px;font-size:18px}.icon-btn:active{transform:scale(.94)}.overlay{justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.card{background:var(--panel);text-align:center;border:1px solid #ffffff14;border-radius:18px;width:min(420px,92vw);padding:28px 26px;box-shadow:0 24px 60px #00000080}.card h1{margin:0 0 6px;font-size:clamp(22px,6vw,30px)}.card .sub{color:var(--muted);margin-bottom:18px;font-size:14px}.toast{color:var(--accent2);margin-top:12px;font-size:13px}.card .best{color:var(--muted);margin-top:14px;font-size:13px}.btn{cursor:pointer;background:var(--accent);color:#fff;border:none;border-radius:12px;margin-top:18px;padding:12px 22px;font-family:inherit;font-size:16px;font-weight:700;display:inline-block}.btn.secondary{color:var(--fg);background:#ffffff1f}.btn:active{transform:scale(.96)}.row{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.result-figure{border-radius:14px;width:100%;margin:0 auto 6px;display:block}.new-best{color:var(--accent2);margin-bottom:8px;font-weight:700}.icon-btn.muted{opacity:.55}.sound-wrap{position:relative}.volume-popup{background:var(--panel);border:1px solid #ffffff1a;border-radius:10px;justify-content:center;width:40px;padding:12px 0;display:flex;position:absolute;top:46px;right:0}.volume-popup input[type=range]{writing-mode:vertical-lr;width:22px;height:130px;accent-color:var(--accent);cursor:pointer;direction:rtl}.hidden{display:none!important}