.audio-panel {
    margin: 10px auto;
    padding: 10px 16px;
    background: #17231f;
    border: 1px solid #344b40;
    border-radius: 10px;
    max-width: 1400px;
    color: #d8e8df;
    font: 14px/1.6 -apple-system, "PingFang SC", sans-serif
}

.audio-panel summary {
    cursor: pointer;
    min-height: 30px
}

.audio-settings {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
    margin: 10px 0
}

.audio-settings label {
    display: flex;
    gap: 6px;
    align-items: center
}

.audio-settings button,
.audio-settings select {
    min-height: 44px;
    font-size: 14px
}

.audio-settings input[type=range] {
    width: 100px
}

.audio-panel p {
    font-size: 12px;
    color: #a9c1b4
}

.dealer-subtitle {
    padding: 5px 0;
    color: #ecce8c
}

.audio-settings select {
    max-width: 280px
}

@media(max-width:600px) {
    .audio-panel {
        margin: 8px 10px;
        padding: 8px 12px
    }

    .audio-settings {
        display: grid;
        grid-template-columns: 1fr
    }

    .audio-settings select {
        max-width: 220px
    }

    .audio-settings button {
        min-height: 44px
    }
}

/* === VIEWPORT FIT audio chrome === */
body.play-page>.audio-panel {
    margin: 0;
    padding: 2px 12px;
    border-radius: 0
}

body.play-page>.audio-panel .dealer-subtitle {
    padding: 1px 0;
    font-size: 11px;
    line-height: 1.3;
    max-height: 1.4em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

body.play-page>.audio-panel details summary {
    min-height: 24px;
    font-size: 12px
}

body.play-page>.audio-panel details:not([open]) {
    margin: 0
}

@media (max-height:760px) {
    body.play-page>.audio-panel .dealer-subtitle {
        display: none
    }
}

.audio-mute-btn { font-size: 15px; }
