:root{--bg: #15161a;--panel: #1c1d23;--panel2: #23242b;--line: rgba(255,255,255,.09);--text: #e7e7ea;--muted: #9a9aa3;--accent: #7f77dd;--beat: #d4537e;--ok: #1d9e75;--bad: #e24b4a}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:13px/1.4 Segoe UI,system-ui,sans-serif}.app{display:flex;flex-direction:column;height:100vh}.topbar{display:flex;align-items:center;gap:12px;padding:8px 12px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:8px}.brand-logo{width:26px;height:26px;object-fit:contain;border-radius:4px}.logo{font-weight:600;font-size:14px;letter-spacing:-.2px}.modesw{display:flex;gap:0;border:1px solid var(--line);border-radius:6px;overflow:hidden}.modesw button{border:0;border-radius:0;background:var(--panel);padding:5px 12px;color:var(--muted);cursor:pointer}.modesw button.on{background:var(--accent);color:#fff}.status{font-size:12px;padding:2px 8px;border-radius:6px;background:var(--panel2);color:var(--muted)}.status.ok{color:var(--ok)}.status.bad{color:var(--bad)}.topbar .status{margin-left:auto}.download-btn{display:inline-flex;align-items:center;justify-content:center;padding:6px 14px;border-radius:6px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;text-decoration:none;font-weight:600;font-size:12px;box-shadow:0 2px 8px #10b98140;transition:all .2s ease;border:1px solid rgba(255,255,255,.15);cursor:pointer}.download-btn:hover{background:linear-gradient(135deg,#059669,#047857);box-shadow:0 4px 12px #10b98166;transform:translateY(-1px)}.cols{flex:1;display:grid;grid-template-columns:200px 1fr 220px;min-height:0}.left,.right{background:var(--panel);border-right:1px solid var(--line);padding:10px;display:flex;flex-direction:column;gap:8px;overflow:auto}.right{border-right:0;border-left:1px solid var(--line)}.tabs{display:flex;gap:4px;flex-wrap:wrap}.tab{font-size:11px;padding:4px 8px;border-radius:6px;color:var(--muted);background:transparent;border:1px solid transparent}.tab:hover{background:var(--panel2)}.tab.on{color:var(--text);background:var(--panel2);border-color:var(--line)}.lib{flex:1;display:flex;flex-direction:column;gap:4px;min-height:60px}.item{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:6px;background:var(--panel2);cursor:grab}.item .nm{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item.audio{color:#9fe1cb}.item .tag{font-size:10px;color:#afa9ec;background:#7f77dd33;padding:1px 5px;border-radius:4px}.additem{flex:none;padding:1px 7px;font-size:14px;line-height:1;border-radius:6px}.hint{color:var(--muted);font-size:12px}.aipanel{display:flex;flex-direction:column;gap:8px;overflow:auto}.pair{border:1px solid var(--line);border-radius:8px;padding:7px;display:flex;flex-direction:column;gap:5px;background:var(--panel2)}.pairhead{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted)}.pairpick{text-align:left;font-size:11px;padding:5px 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.aiprompt{width:100%;resize:vertical;font:inherit;font-size:12px;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:6px}.libbtns{display:flex;gap:6px}.libbtns button{flex:1}.center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px}.stage{display:flex;align-items:center;justify-content:center}.canvas{background:#0c0d10;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden}.frame{width:100%;height:100%;object-fit:contain;display:block}.ph{color:var(--muted);font-size:12px}.ph.dashed{border:1.5px dashed rgba(127,119,221,.6);color:#afa9ec;padding:24px;border-radius:6px}.transport{display:flex;align-items:center;gap:10px;width:100%;max-width:460px}.transport input[type=range]{flex:1}.play{width:34px;height:34px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:13px;background:var(--accent);border-color:var(--accent);color:#fff}.play:hover{background:#6b63cf}.time{color:var(--muted);font-size:12px;min-width:90px;text-align:right}.split{flex:none;font-size:12px;padding:6px 10px}.split.on{background:var(--accent);border-color:var(--accent);color:#fff}.audiobtns{display:flex;flex-direction:column;gap:6px}.zoompanel{display:flex;align-items:center;gap:10px;width:100%;max-width:460px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px 12px}.zoompanel input[type=range]{flex:1}.zlabel{color:var(--muted);font-size:12px;white-space:nowrap}.zval{color:var(--muted);min-width:42px;text-align:right}.right h4{margin:6px 0 2px;font-size:12px;color:var(--muted);font-weight:500}.right select{width:100%}.right select:disabled{opacity:.4}.section{display:flex;flex-direction:column;gap:6px;padding-bottom:10px;margin-bottom:4px;border-bottom:1px solid var(--line)}.sechead{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;font-weight:500}.sechead .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.x{padding:2px 6px;font-size:12px;color:var(--muted)}.muted{color:var(--muted);font-weight:400;font-size:11px}.codecnote{color:var(--beat);font-size:11px;max-width:460px;margin:0;text-align:center}.fld{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted)}.fld input{width:100%}.fldrow{display:flex;gap:8px}.fldrow .fld{flex:1}.fldrow button{flex:1;font-size:12px}.fldrow button.on{background:var(--accent);border-color:var(--accent);color:#fff}@keyframes kbin{0%{transform:scale(1)}to{transform:scale(var(--kb, 1.2))}}@keyframes kbout{0%{transform:scale(var(--kb, 1.2))}to{transform:scale(1)}}.job{font-size:12px;padding:6px 8px;border-radius:6px;background:var(--panel2)}.job.error{color:var(--bad)}.job.done{color:var(--ok)}select,button,input{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:6px 8px}button{cursor:pointer}button:hover{background:#2c2d35}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button:disabled{opacity:.5;cursor:default}input[type=range]{flex:1;min-width:120px;padding:0}.timeline{border-top:1px solid var(--line);background:var(--panel);padding:8px 12px;display:flex;flex-direction:column;gap:5px}.ruler{color:var(--muted);font-size:11px;display:flex;align-items:center}.tlzoom{margin-left:auto;display:flex;align-items:center;gap:6px}.tlzoom button{padding:1px 8px;font-size:13px;line-height:1;border-radius:6px}.tlscroll{overflow-x:auto;overflow-y:hidden;padding-bottom:4px}.tllanes{position:relative;display:flex;flex-direction:column;gap:5px;min-width:100%}.playline{position:absolute;top:0;bottom:0;width:2px;background:var(--beat);pointer-events:none;z-index:5}.track{display:flex;gap:4px;min-height:28px;border-radius:6px;padding:3px;align-items:stretch}.track.vid{background:#7f77dd24}.track.aud{background:#1d9e7524}.clip{display:flex;align-items:center;gap:5px;font-size:11px;color:#fff;padding:3px 8px;border-radius:4px;white-space:nowrap;overflow:hidden;cursor:grab;flex-basis:0;min-width:14px}.clip.v{background:var(--accent)}.clip.a{background:var(--ok)}.clip.sel{outline:2px solid #fff}.clip.playing{box-shadow:inset 0 -3px 0 var(--beat)}.clip .dot{width:6px;height:6px;border-radius:50%;background:#9fe1cb;flex:none}.clip .muted{font-size:11px;font-style:normal;flex:none}.track.rel{position:relative;display:block}.clip.abs{position:absolute;top:3px;bottom:3px;justify-content:space-between;overflow:hidden}.clip.abs .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.segx{padding:0 4px;font-size:10px;color:#fff;background:transparent;border:0;line-height:1}.drophint{color:var(--muted);font-size:11px;padding:4px 8px}
