*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0c0e13;--panel: #12151d;--line: #222736;--text: #d7dbe6;--muted: #7a8194;--accent: #ffb347}body{display:flex;height:100vh;background:var(--bg);color:var(--text);font:13px/1.45 system-ui,-apple-system,sans-serif;overflow:hidden}#panel{width:300px;flex:none;background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;padding:14px 14px 40px}#panel h1{font-size:14px;letter-spacing:.35em;color:var(--accent);margin-bottom:12px}details{border-top:1px solid var(--line);padding:8px 0}summary{cursor:pointer;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:6px;-webkit-user-select:none;user-select:none}.row{display:flex;align-items:center;gap:8px;margin:6px 0}.row label{width:72px;flex:none;color:var(--muted)}.row input[type=range]{flex:1;accent-color:var(--accent)}.row select{flex:1;background:#1a1e2a;color:var(--text);border:1px solid var(--line);border-radius:4px;padding:4px}.row input[type=color]{width:34px;height:24px;border:1px solid var(--line);border-radius:4px;background:none;padding:0}.pair{display:flex;gap:6px;flex:1}.textinput{flex:1;background:#1a1e2a;color:var(--text);border:1px solid var(--line);border-radius:4px;padding:6px 8px;font:inherit}.textinput:focus{outline:none;border-color:var(--accent)}button,.filebtn{background:#1a1e2a;color:var(--text);border:1px solid var(--line);border-radius:5px;padding:6px 10px;cursor:pointer;font:inherit;text-align:center}button:hover,.filebtn:hover{border-color:var(--accent);color:var(--accent)}button:disabled{opacity:.4;cursor:default}.wide{flex:1}.ghost{background:none}.hint{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.footer{margin-top:14px}#stage{flex:1;display:flex;flex-direction:column;min-width:0}#canvas-wrap{flex:1;display:flex;align-items:center;justify-content:center;position:relative;min-height:0;padding:18px}#view{max-width:100%;max-height:100%;aspect-ratio:16 / 9;background:#000;border-radius:6px;box-shadow:0 8px 40px #0000008c}#drop-hint{position:absolute;bottom:26px;right:30px;color:var(--muted);font-size:11px;letter-spacing:.06em;pointer-events:none}#transport{flex:none;display:flex;align-items:center;gap:12px;padding:10px 18px 14px;border-top:1px solid var(--line);background:var(--panel)}#transport button{width:44px;height:32px;font-size:14px}#seek{flex:1;accent-color:var(--accent)}#time,#dur{color:var(--muted);font-variant-numeric:tabular-nums;width:44px;text-align:center}body.dragging #view{outline:2px dashed var(--accent);outline-offset:-2px}