:root{--bg: #0b0b0b;--panel: #141414;--panel2: #1b1b1b;--text: #f2f2f2;--sub: #b7b7b7;--accent: #4ecdc4;--danger: #ff6b6b;--border: #2a2a2a}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}button{border:0;border-radius:10px;padding:10px 12px;cursor:pointer;background:var(--accent);color:#001;font-weight:700}button.secondary{background:var(--panel2);color:var(--text);border:1px solid var(--border)}button.danger{background:var(--danger);color:#120}input[type=range]{width:100%}.app{display:grid;grid-template-rows:64px 1fr;height:100vh}.header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border);background:#0f0f0f}.main{display:grid;grid-template-columns:320px 1fr 320px;gap:10px;padding:10px;overflow:hidden}.panel,.timeline{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:12px;overflow:auto}.h2{font-size:14px;letter-spacing:.04em;color:var(--sub);margin:0 0 10px;text-transform:uppercase}.row{display:flex;gap:10px;align-items:center}.col{display:flex;flex-direction:column;gap:8px}.trackCard{border:1px solid var(--border);border-radius:12px;padding:10px;margin-bottom:10px;background:#101010}.small{font-size:12px;color:var(--sub)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.waveWrap{border:1px solid var(--border);border-radius:12px;padding:8px;background:#0d0d0d}