:root{--bg:#111318;--panel:#1a1d24;--panel2:#232731;--line:#2e3340;--text:#e8ecf2;--muted:#8b93a1;--accent:#4f8cff;--left:#ff9f43;--ok:#38d97a;--bad:#ff4d4f;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--bg:#f4f5f7;--panel:#fff;--panel2:#eef0f4;--line:#d9dde5;--text:#16181f;--muted:#5f6774;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font:15px/1.45 system-ui,-apple-system,Segoe UI,sans-serif}#layout{grid-template-columns:1fr 380px;height:100vh;display:grid}#stage{min-height:0;position:relative;overflow:hidden}#stage canvas{touch-action:none;width:100%;height:100%;display:block}#hud{pointer-events:none;text-shadow:0 1px 3px #000a;align-items:baseline;gap:14px;display:flex;position:absolute;top:12px;left:16px;right:16px}#hud-title{font-size:18px;font-weight:700}#hud-status{color:var(--muted)}#loading{background:var(--panel2);border-radius:8px;padding:8px 12px;font-size:13px;position:absolute;inset:auto 16px 16px auto}#loading:empty{display:none}#side{border-left:1px solid var(--line);background:var(--panel);flex-direction:column;gap:14px;padding:16px;display:flex;overflow-y:auto}header h1{margin:0;font-size:22px}header p{margin:4px 0 0}h2{margin:0 0 6px;font-size:16px}.muted{color:var(--muted)}.small{font-size:13px}.card{background:var(--panel2);border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:10px;padding:12px;display:flex}.card>p{margin:0}button,.filebtn{font:inherit;color:var(--text);background:color-mix(in srgb, var(--text) 9%, transparent);border:1px solid var(--line);cursor:pointer;text-align:center;border-radius:9px;justify-content:center;align-items:center;min-height:40px;padding:8px 12px;display:inline-flex}button:hover:not(:disabled),.filebtn:hover{background:color-mix(in srgb, var(--text) 16%, transparent)}button:disabled{opacity:.45;cursor:default}button.primary{color:#fff;background:#2f9e5b;border-color:#2f9e5b;font-weight:600}button.big{background:var(--accent);border-color:var(--accent);color:#fff;padding:14px;font-size:18px;font-weight:700}.row{flex-wrap:wrap;gap:8px;display:flex}.row>*{flex:1}.seg{border:1px solid var(--line);border-radius:9px;display:flex;overflow:hidden}.seg button{border:0;border-radius:0;flex:1;min-height:36px;font-size:14px}.seg button+button{border-left:1px solid var(--line)}.seg button.on{background:var(--accent);color:#fff}.slider{align-items:center;gap:10px;display:flex}.slider input{accent-color:var(--accent);flex:1}.slider output{text-align:right;font-variant-numeric:tabular-nums;min-width:3.2em}.status{min-height:1.4em;margin:0;font-weight:500}.status.ok{color:var(--ok)}#songs{flex-direction:column;gap:6px;max-height:360px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}#songs li{cursor:pointer;background:color-mix(in srgb, var(--text) 4%, transparent);border:1px solid #0000;border-radius:9px;align-items:center;gap:8px;padding:8px 10px;display:flex}#songs li:hover{border-color:var(--line)}#songs li.on{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}#songs .meta{flex:1;min-width:0}#songs .t{white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}#songs .c{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}#songs .c a{color:inherit}#songs .lvl{color:var(--left);letter-spacing:1px;font-size:11px}#songs .best{color:var(--ok);white-space:nowrap;font-size:12px}#songs .del{flex:0;min-height:30px;padding:2px 8px;font-size:13px}.field{color:var(--muted);flex-direction:column;gap:4px;font-size:13px;display:flex}.field input{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px}#add-msg:empty{display:none}#add-msg.err{color:var(--bad)}#add-msg.ok{color:var(--ok)}details summary{cursor:pointer;font-weight:600}.links{margin:8px 0 0;padding-left:18px}.links a{color:var(--accent)}.help ol{margin:8px 0 0;padding-left:18px}footer{padding:0 2px 8px}code{background:var(--bg);border-radius:4px;padding:1px 4px;font-size:12px}@media (max-width:860px){#layout{grid-template-rows:46vh auto;grid-template-columns:1fr;height:auto;min-height:100vh}#side{border-left:0;border-top:1px solid var(--line);padding:16px;overflow:visible}}