/* GLOBAL THEME-ARMOR */
.ut-custom-player {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 480px !important;
    display: block !important;
    margin: 20px 0 !important;
    border: 1px solid #d4d4d4 !important;
    border-radius: 6px !important;
    background: #eeeeee !important;
    overflow: hidden !important;
    font-family: inherit;
    position: relative;
    color: #111111 !important;
    --ut-audio-surface: #eeeeee;
    --ut-audio-border: #d4d4d4;
    --ut-audio-text: #111111;
    --ut-audio-muted: #6b6b6b;
    --ut-audio-blue: #0073aa;
    --ut-audio-track: #888888;
}

.ut-custom-player * { box-sizing: border-box !important; }

.ut-audio-engine {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
}

.ut-custom-player > .ut-toggle-bar {
    background: var(--ut-audio-surface) !important;
    border-bottom: 0 !important;
    border-radius: 6px !important;
    color: var(--ut-audio-text) !important;
    font-family: inherit !important;
}

.ut-custom-player > .ut-toggle-bar > div:first-child {
    background: var(--ut-audio-muted) !important;
    border-radius: 6px !important;
    position: relative !important;
}

.ut-custom-player > .ut-toggle-bar > div:first-child > div {
    display: none !important;
}

.ut-custom-player > .ut-toggle-bar > div:first-child::before {
    content: "" !important;
    width: 30px !important;
    height: 30px !important;
    display: block !important;
    background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='white'%3E%3Cpath d='M5.25 12v8h5.9l7.6 5.45V6.55L11.15 12H5.25z'/%3E%3Cpath d='M23.75 9.75v3.4c1.1.72 1.75 1.72 1.75 2.85s-.65 2.13-1.75 2.85v3.4C26.9 21.1 29 18.75 29 16s-2.1-5.1-5.25-6.25z'/%3E%3C/svg%3E") !important;
}

.ut-custom-player > .ut-toggle-bar > div:nth-child(2) {
    color: var(--ut-audio-text) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-family: inherit !important;
}

.ut-custom-player .ut-expand-arrow {
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform-origin: center !important;
}

.ut-custom-player .ut-expand-arrow svg {
    display: none !important;
}

.ut-custom-player .ut-expand-arrow::before {
    content: "" !important;
    width: 9px !important;
    height: 9px !important;
    border-color: var(--ut-audio-text) !important;
    border-style: solid !important;
    border-width: 0 2px 2px 0 !important;
    transform: translateY(-2px) rotate(45deg) !important;
}

.ut-custom-player .ut-expanded-content {
    background: var(--ut-audio-surface) !important;
    padding: 10px 12px 12px !important;
    display: none !important;
}

.ut-custom-player.is-expanded .ut-expanded-content {
    display: block !important;
}

.ut-custom-player .ut-seeker {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 30px !important;
    margin: 0 !important;
    background: transparent !important;
    accent-color: var(--ut-audio-blue) !important;
    cursor: pointer !important;
    --ut-audio-progress: 0%;
}

.ut-custom-player .ut-seeker::-webkit-slider-runnable-track {
    height: 6px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(to right, var(--ut-audio-blue) 0%, var(--ut-audio-blue) var(--ut-audio-progress), var(--ut-audio-track) var(--ut-audio-progress), var(--ut-audio-track) 100%) !important;
}

.ut-custom-player .ut-seeker::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    margin-top: -6px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--ut-audio-blue) !important;
}

.ut-custom-player .ut-seeker::-moz-range-track {
    height: 6px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--ut-audio-track) !important;
}

.ut-custom-player .ut-seeker::-moz-range-progress {
    height: 6px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--ut-audio-blue) !important;
}

.ut-custom-player .ut-seeker::-moz-range-thumb {
    width: 18px !important;
    height: 18px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--ut-audio-blue) !important;
}

.ut-custom-player .ut-total-duration,
.ut-custom-player .ut-current-time,
.ut-custom-player .ut-speed-reset {
    color: var(--ut-audio-text) !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.ut-custom-player .ut-player-status {
    margin: -4px 0 12px !important;
    color: var(--ut-audio-text) !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.ut-custom-player .ut-controls-row {
    gap: 6px !important;
}

.ut-custom-player .ut-controls-row > div:nth-child(3) {
    margin-left: 8px !important;
}

.ut-custom-player .ut-controls-row > div:first-child,
.ut-custom-player .ut-play-btn,
.ut-custom-player .ut-speed-down,
.ut-custom-player .ut-speed-reset,
.ut-custom-player .ut-speed-up,
.ut-custom-player .ut-marker-container button {
    border-radius: 6px !important;
    box-shadow: none !important;
    font-family: inherit !important;
}

.ut-custom-player .ut-controls-row > div:first-child,
.ut-custom-player .ut-speed-down,
.ut-custom-player .ut-speed-reset,
.ut-custom-player .ut-speed-up,
.ut-custom-player .ut-marker-container button {
    background: #f8f8f8 !important;
    border: 1px solid var(--ut-audio-border) !important;
    color: var(--ut-audio-text) !important;
}

.ut-custom-player .ut-play-btn {
    background: var(--ut-audio-blue) !important;
    border: 0 !important;
}

.ut-custom-player .ut-speed-down svg rect,
.ut-custom-player .ut-speed-up svg path {
    fill: var(--ut-audio-text) !important;
}

.ut-marker-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    width: 100%;
    margin-bottom: 15px;
}

.ut-marker-container button {
    min-height: 44px !important;
    height: 44px;
    padding: 0 12px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer;
    text-transform: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-align: left !important;
}

.ut-time-reset-zone { cursor: pointer !important; }

@media (max-width: 480px) {
    .ut-marker-container { grid-template-columns: 1fr; }

    .ut-custom-player .ut-controls-row {
        flex-wrap: wrap !important;
        column-gap: 5px !important;
        row-gap: 7px !important;
    }

    .ut-custom-player .ut-controls-row > div:nth-child(3) {
        margin-left: 2px !important;
    }

    .ut-custom-player > .ut-toggle-bar > div:nth-child(2) {
        font-size: 20px !important;
    }

    .ut-custom-player .ut-total-duration {
        width: 52px !important;
        font-size: 18px !important;
    }

    .ut-custom-player .ut-current-time,
    .ut-custom-player .ut-speed-reset {
        font-size: 18px !important;
    }

    .ut-custom-player .ut-controls-row > div:first-child {
        width: 64px !important;
        height: 46px !important;
    }

    .ut-custom-player .ut-play-btn {
        width: 62px !important;
        height: 46px !important;
    }

    .ut-custom-player .ut-speed-down,
    .ut-custom-player .ut-speed-up {
        width: 42px !important;
        height: 46px !important;
    }

    .ut-custom-player .ut-speed-reset {
        width: 68px !important;
        min-width: 68px !important;
        height: 46px !important;
    }

    .ut-custom-player .ut-marker-container button {
        min-height: 50px !important;
        height: 50px !important;
        font-size: 18px !important;
        padding: 0 14px !important;
    }
}

@media (max-width: 360px) {
    .ut-custom-player .ut-controls-row > div:nth-child(3) {
        width: 100% !important;
        margin-left: 0 !important;
    }
}

    .ut-custom-player.ut-align-center {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .ut-custom-player.ut-audio-mt-10 { margin-top: 2.5rem !important; }
    .ut-custom-player.ut-audio-mb-8 { margin-bottom: 2rem !important; }

    .ut-custom-player .ut-track-meta {
        margin-top: 10px !important;
        color: #555555 !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        line-height: 1.35 !important;
    }

    .ut-custom-player .ut-track-meta p,
    .ut-custom-player .ut-track-meta div {
        margin: 0 0 6px !important;
    }

    .ut-custom-player .ut-meta-separator {
        margin: 0 8px !important;
        color: #b8b8b8 !important;
    }

    .ut-custom-player .ut-download-link {
        color: var(--ut-audio-blue) !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        text-decoration: underline !important;
    }