:root{--bg: #14161a;--panel: #1b1e25;--panel-2: #232733;--line: #2e3341;--line-strong: #454c5e;--text: #e6e9ef;--muted: #949cb0;--dim: #6b7285;--accent: #6ea8fe;--accent-dim: #2f5a9e;--stress: #f0b429;--ok: #4ade80;--warn: #fb923c;--danger: #f87171;--radius: 6px;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:14px/1.5 ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}button{font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);padding:6px 11px;cursor:pointer}button:hover:not(:disabled){border-color:var(--line-strong);background:#2a2f3c}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--accent-dim);border-color:var(--accent)}button.primary:hover:not(:disabled){background:#3568b5}button.ghost{background:transparent}button.danger:hover:not(:disabled){border-color:var(--danger);color:var(--danger)}input,textarea,select{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:6px 8px}input:focus,textarea:focus,select:focus{outline:1px solid var(--accent);border-color:var(--accent)}textarea{resize:vertical;line-height:1.7;font-family:ui-monospace,Cascadia Code,monospace}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:14px;padding:10px 14px;background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap}.topbar h1{font-size:15px;font-weight:600;margin:0;letter-spacing:.3px}.spacer{flex:1}.readout{display:flex;gap:16px;align-items:center}.stat{display:flex;flex-direction:column;line-height:1.25}.stat .k{font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:var(--dim)}.stat .v{font-size:13px;font-variant-numeric:tabular-nums}.stat .v.weak{color:var(--warn)}.main{display:flex;flex:1;min-height:0}.sidebar{width:330px;flex-shrink:0;display:flex;flex-direction:column;background:var(--panel);border-right:1px solid var(--line);overflow-y:auto}.stage{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.panel{padding:12px 14px;border-bottom:1px solid var(--line)}.panel h2{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--dim);margin:0 0 9px;font-weight:600}.row{display:flex;gap:8px;align-items:center}.row+.row{margin-top:8px}.lines{display:flex;flex-direction:column}.line-item{display:flex;flex-direction:column;gap:3px;padding:8px 14px;border-bottom:1px solid var(--line);cursor:pointer;border-left:3px solid transparent}.line-item:hover{background:var(--panel-2)}.line-item.selected{background:var(--panel-2);border-left-color:var(--accent)}.line-head{display:flex;align-items:baseline;gap:7px}.line-num{font-size:10px;color:var(--dim);font-variant-numeric:tabular-nums;min-width:16px}.line-text{flex:1;font-size:13px}.line-text.unplaced{color:var(--muted)}.line-meta{display:flex;gap:8px;font-size:10.5px;color:var(--dim);padding-left:23px}.pill{font-size:10px;padding:1px 6px;border-radius:9px;background:var(--panel-2);border:1px solid var(--line);color:var(--muted)}.pill.section{border-color:var(--accent-dim);color:var(--accent)}.pill.rhyme{border-color:#4a3f6b;color:#b39ddb}.pill.done{border-color:#2f6b47;color:var(--ok)}.pill.lock{border-color:var(--stress);color:var(--stress)}.options{display:flex;flex-direction:column;gap:6px}.option{display:flex;align-items:center;gap:9px;padding:7px 9px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;text-align:left}.option:hover{border-color:var(--line-strong)}.option.active{border-color:var(--accent);background:#223050}.option .feel{flex:1;font-size:12.5px}.option .detail{font-size:10.5px;color:var(--dim);font-variant-numeric:tabular-nums}.scroller{flex:1;overflow:auto;min-height:0}.timeline{position:relative}.grid-canvas{display:block;cursor:pointer}.piano-roll{display:block;background:var(--bg)}.stage-section{border-top:1px solid var(--line);background:var(--panel);padding:6px 14px;display:flex;align-items:center;gap:12px;font-size:11px;color:var(--dim)}.legend{display:flex;gap:12px;align-items:center}.legend span{display:flex;align-items:center;gap:5px}.swatch{width:10px;height:10px;border-radius:2px;display:inline-block}.kar{border-top:1px solid var(--line);background:#101218;padding:12px 16px 10px;min-height:84px}.kar--empty{color:var(--dim);font-size:12px;padding:18px 16px}.kar__now{display:flex;flex-wrap:wrap;align-items:flex-end;gap:2px 4px;line-height:1.15}.kar__sec{font-size:9.5px;text-transform:uppercase;letter-spacing:.9px;color:var(--dim);border:1px solid var(--line);border-radius:9px;padding:1px 7px;margin-right:10px;align-self:center}.kar__syl{display:inline-flex;flex-direction:column;align-items:center;padding:2px 5px 1px;border-radius:4px;transition:background-color .06s linear,color .06s linear}.kar__syl b{font-size:21px;font-weight:400;color:var(--muted);font-variant-ligatures:none}.kar__syl b.is-stressed{color:var(--text);font-weight:500}.kar__syl i{font-style:normal;font-size:9.5px;letter-spacing:.4px;color:var(--dim);font-variant-numeric:tabular-nums;margin-top:1px}.kar__syl.is-done b{color:var(--dim)}.kar__syl.is-done i{color:#4a5062}.kar__syl.is-now{background:var(--accent);transition:none}.kar__syl.is-now b,.kar__syl.is-now b.is-stressed{color:#0b1220;font-weight:500}.kar__syl.is-now i{color:#0b1220;opacity:.75}.kar__next{margin-top:9px;font-size:12.5px;color:var(--dim);display:flex;align-items:center;cursor:pointer}.kar__next:hover{color:var(--muted)}.mixer{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.fader{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted)}.fader input[type=range]{width:78px;accent-color:var(--accent)}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;height:100%;color:var(--muted);text-align:center;padding:40px}.empty h2{color:var(--text);font-size:17px;margin:0;text-transform:none;letter-spacing:0}.empty p{margin:0;max-width:440px;line-height:1.65}.hint{font-size:11px;color:var(--dim);line-height:1.55}.error{background:#3a1f22;border:1px solid var(--danger);color:#fca5a5;padding:8px 11px;border-radius:var(--radius);font-size:12px}.banner{background:#3a2f1a;border:1px solid var(--stress);color:#fcd34d;padding:7px 11px;border-radius:var(--radius);font-size:11.5px}.project-list{display:flex;flex-direction:column;gap:6px;width:min(520px,100%)}.project-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;text-align:left}.project-row:hover{border-color:var(--accent)}.project-row .name{flex:1;font-size:14px}.project-row .meta{font-size:11px;color:var(--dim)}