:root{--bg: #0b0d12;--panel: #141822;--panel-2: #1b2130;--text: #e6e9ef;--muted: #8b93a7;--accent: #ff5a67;--accent-2: #3ddc84;--border: #232a3a;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden}.brand{font-weight:700;font-size:16px;letter-spacing:.3px;white-space:nowrap}.hud{display:flex;gap:16px;flex-wrap:wrap}.hud-item{display:flex;flex-direction:column;align-items:flex-end;min-width:48px}.hud-item .label{font-size:10px;text-transform:uppercase;color:var(--muted);letter-spacing:.6px}.hud-item .value{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}.mute-btn{background:var(--panel-2);border:1px solid var(--border);border-radius:10px;padding:6px 10px;font-size:16px;line-height:1;cursor:pointer;align-self:center}.mute-btn:hover{filter:brightness(1.15)}.mute-btn.muted{border-color:var(--accent);opacity:.7}.sound-ctrls{display:flex;align-items:center;gap:10px;align-self:center}.sound-ctrls label{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--muted)}.sound-ctrls input[type=range]{width:74px;accent-color:var(--accent);cursor:pointer}.sound-settings{display:flex;align-items:center;gap:14px}.sound-settings .vol-label{flex:1;margin-bottom:0;display:flex;flex-direction:column;gap:6px}.sound-settings input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer}.dock{position:absolute;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;gap:18px;padding:10px 18px;background:linear-gradient(0deg,#080a0feb,#080a0f80);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-top:1px solid var(--border);flex-wrap:wrap}.dock-right{margin-left:auto;display:flex;align-items:center;gap:18px;flex-wrap:wrap}.mode-switch{display:flex;gap:4px}.tab{background:transparent;color:var(--muted);border:1px solid transparent;padding:8px 14px;border-radius:9px;cursor:pointer;font-size:13px;font-weight:600}.tab:hover{color:var(--text)}.tab.active{color:var(--text);background:var(--panel);border-color:var(--border)}.panel{display:none;position:absolute;top:0;right:0;bottom:0;left:0}.panel.active{display:block}#calc.panel.active{display:flex;align-items:center;justify-content:center;overflow:auto;padding:30px 20px 90px}.calc-wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,320px));gap:20px;align-items:start;justify-content:center;width:100%;max-width:1040px}.card{background:#141822eb;border:1px solid var(--border);border-radius:14px;padding:18px}.card.compact{padding:14px 16px}.card h2{margin:0 0 12px;font-size:15px}label{display:block;font-size:12px;color:var(--muted);margin-bottom:12px}input,select{width:100%;margin-top:6px;padding:10px 12px;background:var(--panel-2);border:1px solid var(--border);border-radius:9px;color:var(--text);font-size:14px}.row{display:flex;gap:12px}.row label{flex:1}.metrics{display:flex;gap:10px;margin-top:8px}.metrics>div{flex:1;background:var(--panel-2);border:1px solid var(--border);border-radius:10px;padding:12px;display:flex;flex-direction:column;align-items:center;gap:4px}.big{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}.metrics span:last-child{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.muted{color:var(--muted)}.small{font-size:12px}.result-row{display:flex;align-items:center;justify-content:space-between;margin-top:6px}.pill{background:var(--panel-2);border:1px solid var(--border);border-radius:999px;padding:6px 14px;font-weight:700;font-variant-numeric:tabular-nums}button.primary{background:var(--accent);color:#fff;border:none;padding:12px 22px;border-radius:10px;font-weight:700;font-size:14px;cursor:pointer}button.primary:hover{filter:brightness(1.08)}button.primary.small-btn{padding:8px 14px;font-size:13px}.stage{position:absolute;top:0;right:0;bottom:0;left:0;background:#000;overflow:hidden}.stage canvas{width:100%;height:100%;display:block;outline:none}.panel-settings{position:absolute;top:14px;right:14px;z-index:20;background:#0a0c12d1;border:1px solid var(--border);border-radius:12px;padding:12px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);max-width:240px}.panel-settings.wide{max-width:300px}.panel-settings label{margin-bottom:0}.crosshair{position:absolute;top:50%;left:50%;width:18px;height:18px;transform:translate(-50%,-50%);pointer-events:none;z-index:10}.crosshair:before,.crosshair:after{content:"";position:absolute;background:var(--accent-2)}.crosshair:before{top:50%;left:0;width:100%;height:2px;transform:translateY(-50%)}.crosshair:after{left:50%;top:0;height:100%;width:2px;transform:translate(-50%)}.hidden{display:none}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;background:#06080cb8;padding:20px}.overlay p{max-width:520px}.overlay.hidden{display:none}kbd{background:var(--panel-2);border:1px solid var(--border);border-radius:6px;padding:1px 6px;font-size:12px}.live-stats,.tune-progress{position:absolute;top:14px;left:14px;z-index:12;background:#0a0c12bf;border:1px solid var(--border);border-radius:10px;padding:8px 12px;font-size:12px;font-variant-numeric:tabular-nums;display:grid;gap:2px;min-width:150px}.log{display:grid;gap:4px;margin-top:10px;max-height:34vh;overflow:auto}.log-line{font-size:12px;padding:6px 10px;border-radius:8px;background:var(--panel-2);border:1px solid var(--border)}.log-line .up{color:var(--accent-2)}.log-line .down{color:var(--accent)}.result{margin-top:12px;padding:14px;border-radius:12px;background:linear-gradient(180deg,#16231a,#12191f);border:1px solid #244a2f}.result.hidden{display:none}.result .headline{font-size:20px;font-weight:800}