#mxpro-dplayer {
    position: relative;
    overflow: hidden;
    background: #000;
    isolation: isolate;
}

/* Keep vertical page scrolling, suppress browser zoom/callouts on the media surface. */
#mxpro-dplayer .dplayer-video-wrap,
#mxpro-dplayer .dplayer-controller-mask { touch-action:pan-y; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; }
/* Icon names remain available to screen readers without covering open menus. */
#mxpro-dplayer [data-balloon]::before,
#mxpro-dplayer [data-balloon]::after { display:none !important; content:none !important; }
#mxpro-dplayer .mxpro-player-gesture-feedback {
    position:absolute; z-index:35; top:50%; left:50%; transform:translate(-50%,-50%);
    max-width:calc(100% - 32px); padding:10px 14px; border-radius:7px;
    background:rgba(0,0,0,.76); color:#fff; font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    text-align:center; pointer-events:none;
}
#mxpro-dplayer .mxpro-player-gesture-feedback[hidden] { display:none; }

#mxpro-dplayer .mxpro-player-cover {
    position: absolute;
    inset: 0;
    z-index: 5;
    overflow: hidden;
    background: #000;
    pointer-events: none;
    opacity: 1;
    transition: opacity .2s ease;
}

#mxpro-dplayer .mxpro-player-cover.is-hidden {
    opacity: 0;
}

#mxpro-dplayer .mxpro-player-cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

#mxpro-dplayer .mxpro-player-loading {
    position: absolute;
    z-index: 20;
    left: 16px;
    bottom: 48px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    max-width: calc(100% - 32px);
    padding: 10px 13px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 7px;
    background: rgba(0, 0, 0, .68);
    color: #fff;
    font: 13px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .8);
    pointer-events: none;
    transition: opacity .18s ease;
}

#mxpro-dplayer .mxpro-player-loading.is-hidden {
    opacity: 0;
}

#mxpro-dplayer .mxpro-player-loading-line[data-status="success"] {
    color: #a7f3c4;
}

#mxpro-dplayer .mxpro-player-loading-line[data-status="error"] {
    color: #ffb4a9;
}

#mxpro-dplayer .mxpro-player-loading-line[data-status="disabled"] {
    color: #d2d2d2;
}

#mxpro-dplayer .mxpro-player-pause-ad {
    position: absolute;
    z-index: 30;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(360px, 46%);
    max-height: calc(100% - 28px);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 8px;
    background: rgba(0, 0, 0, .88);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .42);
    overflow: hidden;
}

#mxpro-dplayer .mxpro-player-pause-ad[hidden] {
    display: none !important;
}

#mxpro-dplayer .mxpro-player-pause-ad-image-link {
    display: block;
    max-height: inherit;
    color: inherit;
    line-height: 0;
}

#mxpro-dplayer .mxpro-player-pause-ad-image-link img {
    display: block;
    width: 100%;
    max-height: min(300px, var(--mxpro-pause-ad-height, 44vh));
    object-fit: contain;
}

#mxpro-dplayer .mxpro-player-pause-ad-close {
    position: absolute;
    z-index: 1;
    top: 7px;
    right: 7px;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 50%;
    background: rgba(0, 0, 0, .72);
    color: #fff;
    font: 24px/1 Arial, sans-serif;
    cursor: pointer;
}

#mxpro-dplayer .mxpro-player-pause-ad-close:hover,
#mxpro-dplayer .mxpro-player-pause-ad-close:focus-visible {
    background: rgba(0, 0, 0, .95);
    outline: 2px solid rgba(255, 255, 255, .75);
    outline-offset: 2px;
}

/* Native settings remain reachable on phones; tall menus scroll within the player. */
#mxpro-dplayer .mxpro-player-settings > .dplayer-setting-box { max-height:max(44px,calc(var(--mxpro-player-height,300px) - 72px)); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
#mxpro-dplayer .mxpro-player-auto-next:focus-visible { outline:2px solid #fff; outline-offset:-2px; }
/* Reuse DPlayer's actual speed panel, item markup, colors and selection listeners. */
#mxpro-dplayer .mxpro-player-speed { position:relative; display:inline-block; width:48px; height:38px; vertical-align:middle; }
#mxpro-dplayer .mxpro-player-speed .mxpro-player-speed-toggle { width:48px; color:#eee; font:13px/22px Arial,sans-serif; }
#mxpro-dplayer .mxpro-player-speed .mxpro-player-speed-box { max-height:max(60px,calc(var(--mxpro-player-height,300px) - 64px)); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
#mxpro-dplayer .mxpro-player-speed-box[hidden],
#mxpro-dplayer .dplayer-setting-speed[hidden] { display:none !important; }
#mxpro-dplayer .mxpro-player-speed-toggle:focus-visible,
#mxpro-dplayer .dplayer-setting-speed-item:focus-visible { outline:2px solid #fff; outline-offset:-2px; }
#mxpro-dplayer.mxpro-speed-open .dplayer-controller,
#mxpro-dplayer.mxpro-speed-open .dplayer-controller-mask { transform:translateY(0); opacity:1; }
#mxpro-dplayer .dplayer-full .dplayer-full-in-icon { display:none !important; }
#mxpro-dplayer .mxpro-player-pip { color:#fff; }
#mxpro-dplayer .mxpro-player-pip[aria-pressed="true"] { color:#a7f3c4; }
#mxpro-dplayer .mxpro-player-pip:focus-visible { outline:2px solid #fff; outline-offset:-3px; }
#mxpro-dplayer .mxpro-danmaku-auth { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:8px; padding:0 8px; color:#eee; font-size:13px; line-height:1.45; text-align:center; }
#mxpro-dplayer .mxpro-danmaku-auth-message { min-width:0; overflow-wrap:anywhere; }
#mxpro-dplayer .mxpro-danmaku-login { display:inline-flex; flex:none; align-items:center; min-height:38px; padding:0 4px; color:#fff; font-size:13px; text-decoration:underline; text-underline-offset:3px; }
#mxpro-dplayer .mxpro-danmaku-auth[hidden],
#mxpro-dplayer .mxpro-danmaku-login[hidden] { display:none; }
#mxpro-dplayer.mxpro-danmaku-locked .dplayer-comment-box .dplayer-send-icon,
#mxpro-dplayer.mxpro-danmaku-locked .dplayer-comment-box .dplayer-comment-setting-icon { display:none; }
#mxpro-dplayer.mxpro-danmaku-locked .dplayer-comment-input { visibility:hidden; }
#mxpro-dplayer .mxpro-danmaku-login:focus-visible { outline:2px solid #fff; outline-offset:-2px; }
/* Phone controls keep native icons; compact time leaves room for danmaku and speed. */
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-controller { height:41px; padding:0 10px; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-bar-wrap { width:calc(100% - 20px); }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-icons-left { left:10px; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-icons-right { right:10px; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-controller:not(.dplayer-controller-comment) .dplayer-icons-right { display:flex; align-items:center; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-icons-left > :not(.dplayer-play-icon):not(.dplayer-time),
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-icons-right > :not(.dplayer-full):not(.dplayer-comment):not(.mxpro-player-speed):not(.mxpro-player-pip):not(.mxpro-player-settings) { display:none !important; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-play-icon { display:inline-block; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-time { display:inline-block; min-width:32px; height:38px; font-size:0; text-align:center; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-time .dplayer-ptime { font-size:11px; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-time .dplayer-dtime { display:none; }
#mxpro-dplayer.mxpro-player-mobile-inline .dplayer-comment-box { left:10px; right:10px; }
#mxpro-dplayer.mxpro-player-mobile-inline .mxpro-danmaku-auth { font-size:12px; }
/* Reserve space for hour-long timestamps on the narrowest phones without shrinking icons. */
@media (max-width:360px) {
    #mxpro-dplayer.mxpro-player-mobile-inline .dplayer-controller { padding-inline:4px; }
    #mxpro-dplayer.mxpro-player-mobile-inline .dplayer-bar-wrap { width:calc(100% - 8px); }
    #mxpro-dplayer.mxpro-player-mobile-inline .dplayer-icons-left { left:4px; }
    #mxpro-dplayer.mxpro-player-mobile-inline .dplayer-icons-right { right:4px; }
    #mxpro-dplayer.mxpro-player-mobile-inline .dplayer-comment-box { left:4px; right:4px; }
}
/* Portrait fullscreen may need two rows, but retains the original icon sizes. */
#mxpro-dplayer.mxpro-player-compact .dplayer-controller {
    height: auto;
    padding: 13px 8px 0;
    display: flex;
    flex-direction: column;
}
#mxpro-dplayer.mxpro-player-compact .dplayer-bar-wrap { top: 0; bottom: auto; width: calc(100% - 16px); }
#mxpro-dplayer.mxpro-player-compact .dplayer-icons-left,
#mxpro-dplayer.mxpro-player-compact .dplayer-icons-right {
    position: static;
    width: 100%;
    height: auto;
    min-height: 38px;
}
#mxpro-dplayer.mxpro-player-compact .dplayer-controller:not(.dplayer-controller-comment) .dplayer-icons-right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
}
#mxpro-dplayer.mxpro-player-compact .dplayer-icons-right > * { flex-shrink: 0; height: 38px; }
#mxpro-dplayer.mxpro-player-compact .dplayer-icons-right .dplayer-icon { width: 40px; height: 38px; margin: 0; }
#mxpro-dplayer.mxpro-player-compact .dplayer-icons-right .mxpro-player-speed-toggle { width:48px; }
#mxpro-dplayer.mxpro-player-compact .dplayer-comment-box { position: relative; left: auto; right: auto; width: 100%; }
#mxpro-dplayer.mxpro-player-compact .dplayer-controller-mask { height: 145px; }
#mxpro-dplayer.mxpro-player-compact .dplayer-notice { bottom: 100px; max-width: calc(100% - 60px); }

/* Fullscreen episode popup uses DPlayer's native dark setting panel. */
#mxpro-dplayer .mxpro-player-episodes { position:relative; display:inline-block; width:48px; height:38px; vertical-align:middle; }
#mxpro-dplayer .mxpro-player-episodes-toggle { width:48px; color:#eee; font:13px/22px Arial,sans-serif; }
#mxpro-dplayer .mxpro-player-episodes[hidden],
#mxpro-dplayer .mxpro-player-episodes-box[hidden],
#mxpro-dplayer .mxpro-player-episode-grid[hidden],
#mxpro-dplayer .mxpro-player-episode-status[hidden] { display:none !important; }
#mxpro-dplayer .mxpro-player-episodes-box {
    display:flex; flex-direction:column; width:320px; max-width:calc(100vw - 24px);
    height:auto; max-height:max(90px,calc(var(--mxpro-player-height,300px) - 76px));
    padding:6px; box-sizing:border-box; overflow:hidden; background:rgba(28,28,28,.94);
    border:1px solid rgba(255,255,255,.09); border-radius:2px; color:#eee;
    font:13px/1.5 Arial,sans-serif; text-align:left;
}
#mxpro-dplayer .mxpro-player-episode-sources { display:flex; flex:none; gap:2px; max-width:100%; overflow-x:auto; overscroll-behavior:contain; scrollbar-width:thin; border-bottom:1px solid rgba(255,255,255,.12); }
#mxpro-dplayer .mxpro-player-episode-source,
#mxpro-dplayer .mxpro-player-episode-item { appearance:none; border:0; border-radius:2px; margin:0; min-width:0; padding:5px 8px; height:auto; min-height:36px; background:transparent; color:inherit; font:inherit; cursor:pointer; }
#mxpro-dplayer .mxpro-player-episode-source { flex:none; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#mxpro-dplayer .mxpro-player-episode-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; padding-top:6px; }
#mxpro-dplayer .mxpro-player-episode-item { text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#mxpro-dplayer .mxpro-player-episode-source[aria-selected="true"],
#mxpro-dplayer .mxpro-player-episode-item.is-active { background:rgba(255,255,255,.16); color:#fff; }
#mxpro-dplayer .mxpro-player-episode-item:disabled { opacity:.55; cursor:wait; }
#mxpro-dplayer .mxpro-player-episode-source:hover,
#mxpro-dplayer .mxpro-player-episode-item:hover { background:rgba(255,255,255,.1); }
#mxpro-dplayer .mxpro-player-episodes-toggle:focus-visible,
#mxpro-dplayer .mxpro-player-episode-source:focus-visible,
#mxpro-dplayer .mxpro-player-episode-item:focus-visible { outline:2px solid #eee; outline-offset:-2px; }
#mxpro-dplayer .mxpro-player-episode-status { flex:none; margin:6px 4px 0; color:#ddd; font-size:12px; }
#mxpro-dplayer.mxpro-episodes-open .dplayer-controller,
#mxpro-dplayer.mxpro-episodes-open .dplayer-controller-mask { transform:translateY(0); opacity:1; }
/* One dismissible HTML announcement; never draw it over fullscreen playback. */
#mxpro-dplayer .mxpro-player-marquee { position:absolute; z-index:25; top:8px; left:8px; right:8px; display:flex; align-items:center; height:36px; overflow:hidden; border-radius:3px; background:rgba(20,20,20,.68); color:#eee; font:13px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
#mxpro-dplayer .mxpro-player-marquee[hidden],
#mxpro-dplayer.mxpro-player-fullscreen .mxpro-player-marquee,
#mxpro-dplayer:fullscreen .mxpro-player-marquee,
#mxpro-dplayer.dplayer-fulled .mxpro-player-marquee { display:none !important; }
#mxpro-dplayer .mxpro-player-marquee-viewport { flex:1; min-width:0; height:100%; overflow:hidden; }
#mxpro-dplayer .mxpro-player-marquee-content { display:inline-flex; align-items:center; gap:8px; min-height:100%; width:max-content; padding-left:100%; box-sizing:content-box; white-space:nowrap; animation:mxpro-marquee var(--mxpro-marquee-duration,20s) linear infinite; }
#mxpro-dplayer .mxpro-player-marquee-content a { color:inherit; text-decoration:underline; text-underline-offset:3px; }
#mxpro-dplayer .mxpro-player-marquee-content p { margin:0; }
#mxpro-dplayer .mxpro-player-marquee-content img { max-height:28px; width:auto; }
#mxpro-dplayer .mxpro-player-marquee-close { display:grid; flex:none; place-items:center; width:36px; height:36px; padding:0; border:0; background:transparent; color:#eee; font:23px/1 Arial,sans-serif; cursor:pointer; }
#mxpro-dplayer .mxpro-player-marquee:hover .mxpro-player-marquee-content,
#mxpro-dplayer .mxpro-player-marquee:focus-within .mxpro-player-marquee-content { animation-play-state:paused; }
#mxpro-dplayer .mxpro-player-marquee-close:hover { background:rgba(255,255,255,.12); }
#mxpro-dplayer .mxpro-player-marquee :focus-visible { outline:2px solid #eee; outline-offset:-2px; }
@keyframes mxpro-marquee { from { transform:translateX(0); } to { transform:translateX(-100%); } }
@media (prefers-reduced-motion:reduce) {
    #mxpro-dplayer .mxpro-player-marquee-viewport { overflow-x:auto; }
    #mxpro-dplayer .mxpro-player-marquee-content { padding-inline:10px; animation:none; }
}

.mxpro-player-error {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 220px;
    place-items: center;
    padding: 24px;
    box-sizing: border-box;
    background: #080808;
    color: #ddd;
    font-size: 15px;
    text-align: center;
}

@media (max-width: 600px) {
    #mxpro-dplayer .mxpro-player-loading {
        left: 10px;
        bottom: 42px;
        gap: 3px;
        max-width: calc(100% - 20px);
        padding: 8px 10px;
        font-size: 11px;
    }

    #mxpro-dplayer .mxpro-player-pause-ad {
        width: min(260px, 62%);
        max-height: calc(100% - 16px);
    }

    #mxpro-dplayer .mxpro-player-pause-ad-image-link img {
        max-height: min(34vh, var(--mxpro-pause-ad-height, 34vh));
    }
}
