.audio-timeline { margin:18px 0; padding:18px; border:1px solid #d7e7e1; border-radius:16px; background:#f4faf7; }
.audio-timeline h3 { margin:0 0 8px; font-size:18px; }
.audio-timeline canvas { display:block; width:100%; height:65px; cursor:crosshair; border-radius:8px; }
.audio-timeline .timeline-legend { font-size:12px; line-height:1.6; color:#526a61; }
.audio-timeline input[type=range] { width:100%; padding:0; accent-color:#147d78; }
.audio-timeline input:not([type=range]) { width:100%; box-sizing:border-box; padding:10px; border:1px solid #b7d5ca; border-radius:9px; font:inherit; }
.audio-timeline button { margin:8px 8px 0 0; }
.audio-timeline .timeline-mark { display:flex; align-items:center; gap:8px; }
.audio-timeline .timeline-mark button:first-child { color:#795a00; background:#fff3c9; text-align:left; overflow-wrap:anywhere; }