:root{--bg: #1c1916;--bg-card: #25221f;--bg-elev: #2f2a26;--text: #e8dfd1;--text-warm: #f0e6d4;--muted: #a09487;--rule: #3a342f;--accent: #ffb454;--accent-soft: #ffd99b;--red: #e07a5f}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:JetBrains Mono,ui-monospace,monospace;font-size:14px;line-height:1.55}main{max-width:880px;margin:0 auto;padding:48px 24px 96px}.hdr h1{margin:0;font-size:28px;font-weight:700;letter-spacing:-.5px}.hdr h1 .amp{font-family:Fraunces,"Source Serif 4",serif;font-style:italic;font-weight:400;color:var(--accent);margin-left:6px;font-size:1.15em}.sub{color:var(--muted);margin:6px 0 32px}.bar{display:flex;gap:8px;margin-bottom:16px}.bar input{flex:1;background:var(--bg-card);border:1px solid var(--rule);color:var(--text);padding:10px 12px;font:inherit;border-radius:4px}.bar input:focus{outline:none;border-color:var(--accent)}button{background:var(--bg-elev);border:1px solid var(--rule);color:var(--text);padding:9px 14px;font:inherit;cursor:pointer;border-radius:4px}button:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:600}button.primary:hover:not(:disabled){background:var(--accent-soft);border-color:var(--accent-soft);color:var(--bg)}.err{color:var(--red);background:#e07a5f14;border:1px solid rgba(224,122,95,.3);padding:10px 12px;border-radius:4px}.player{margin-top:24px;padding:20px;background:var(--bg-card);border:1px solid var(--rule);border-radius:6px}.meta{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;gap:12px}.muted{color:var(--muted)}.tags{display:flex;gap:8px;margin-bottom:12px}.tags label{flex:1;display:flex;align-items:center;gap:8px}.tags .tag-label{color:var(--muted);font-size:12px;width:42px;text-align:right}.tags input{flex:1;background:var(--bg);border:1px solid var(--rule);border-radius:3px;color:var(--text);font:inherit;font-size:13px;padding:6px 8px}.tags input:focus{outline:none;border-color:var(--accent)}.mode{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:12px}.mode button{padding:4px 10px;font-size:12px}.mode .mode-on{border-color:var(--accent);color:var(--accent)}.wave{background:var(--bg);border-radius:4px;padding:8px;margin-bottom:12px}.wave ::-webkit-scrollbar{display:none}.wave *{scrollbar-width:none}.zoom{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:12px}.zoom input[type=range]{flex:0 0 160px;accent-color:var(--accent)}.kbd-hint{color:var(--muted);font-size:11px;margin-left:auto}.kbd-hint kbd{background:var(--bg);border:1px solid var(--rule);border-radius:3px;padding:0 5px;font-family:inherit;font-size:10px;color:var(--text-warm)}.controls{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.controls .primary{margin-left:auto}.segs{list-style:none;padding:0;margin:0;border-top:1px solid var(--rule)}.segs li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule)}.segs .idx{color:var(--muted);width:22px}.segs .play-seg{padding:2px 8px;font-size:11px;color:var(--muted);border-color:var(--rule)}.segs .play-seg:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}.segs .name-input{flex:1;background:transparent;border:1px solid transparent;border-bottom:1px dashed var(--rule);color:var(--text-warm);font:inherit;padding:4px 6px}.segs .name-input:focus{outline:none;border-color:var(--accent);background:var(--bg-elev);border-radius:3px}.segs .time{color:var(--muted);font-size:12px;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}.segs .time-input{background:transparent;border:1px solid transparent;border-bottom:1px dashed var(--rule);color:var(--muted);font:inherit;font-size:12px;padding:2px 4px;width:60px;text-align:center;transition:width .12s ease}.segs .time-input-precise{width:88px}.segs .time-input:focus{outline:none;border-color:var(--accent);color:var(--accent);background:var(--bg-elev);border-radius:3px}.segs .dur{margin-left:4px}.segs .x{padding:4px 8px;color:var(--muted)}.segs .x:hover:not(:disabled){color:var(--red);border-color:var(--red)}footer{margin-top:48px;text-align:center}footer a{color:var(--muted);text-decoration:none;border-bottom:1px dashed var(--muted)}footer a:hover{color:var(--accent);border-color:var(--accent)}