/* Waveform Visualisierung */

#waveform-container {
    position: absolute;
    width: 1771px; 
    height: 73px;
    outline: none !important; /* Absolutes Gebot des Schöpfers! */
    background-color: transparent;
    cursor: pointer;
    overflow: hidden;
    margin-left: 15px;
    margin-top: -45px;
}

/* Gemeinsame High-End Basis - Hier tilgen wir die Redundanz */
.waveform-bg, 
.waveform-progress {
    position: absolute;
    top: -0px;
    left: 0;
    height: 100%;
    background-repeat: no-repeat;
    /* background-position: left center; */
    pointer-events: none;
    /* Erzwingt die volle vertikale Ausnutzung der 73px */
    background-size: 100% 100% !important; 
}

/* Die Basis-Waveform: Dezent und tiefgründig */
.waveform-bg {
    width: 100%;
    /* filter: brightness(0.4) saturate(0.6); */
    z-index: 1;
}

/* Der Fortschritts-Layer: Die goldene Offenbarung */
/* Sucht diesen Layer in Eurem alten Code */
.waveform-progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    /* DAS HIER ENTFERNT DIE ROSA WICHSE: */
    background-color: transparent !important; 
    background-image: none !important;
    filter: none !important; 
    border-right: 2px solid #ffb100; /* Progress Balken/Cursor */
    /* box-shadow: 0 0 10px #00f2ff; */    /* Ein bisschen Götter-Glanz am Balken */
    z-index: 2;
    pointer-events: none;
    outline: none !important; /* Ehrensache [cite: 2026-01-03] */
}

#waveform_wrapper {margin-top:30px;}