/* capture-extra — additive styles (loaded after style.css). */

/* Waveform wrapper: holds the canvas plus a playback progress overlay. */
.clip-wave {
    position: relative;
}

/* Faint track pinned to the bottom edge of the waveform. */
.clip-progress {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2px;
    height: 2px;
    background: color-mix(in srgb, var(--fg-dim) 30%, transparent);
    border-radius: 1px;
    overflow: hidden;
    pointer-events: none;
}

/* Fill grows 0→1 via scaleX (set from JS while this row is playing). */
.clip-progress-fill {
    height: 100%;
    background: var(--blue);
    transform: scaleX(0);
    transform-origin: left center;
}

/* Only reveal the track on the row that's actually playing. */
.clip-row:not([data-playing="true"]) .clip-progress { opacity: 0; }