.lesson-template .body .video-box,
.video-box {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
}

.academy-artplayer {
    position: relative;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 16 / 9;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 14px;
    background: #000;
    direction: ltr;
    font-family: inherit !important;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

body.single-post .wp-video.academy-article-video {
    display: block;
    width: 100% !important;
    max-width: 100%;
    height: auto !important;
    margin: 24px auto;
}

body.single-post .wp-video.academy-article-video .academy-artplayer,
body.single-post figure.wp-block-video .academy-artplayer {
    width: 100%;
    max-width: 100%;
}

.academy-artplayer,
.academy-artplayer .art-video-player {
    --art-font-color: #fff;
    --art-text-shadow-color: rgba(0, 0, 0, .8);
    color: #fff !important;
}

.academy-artplayer *,
.academy-artplayer *::before,
.academy-artplayer *::after {
    font-family: inherit !important;
}

/* Keep every piece of player UI text readable on ArtPlayer's dark overlays,
 * including settings, tooltips, notices and the custom right-click menu. */
html body .academy-artplayer .art-video-player,
html body .academy-artplayer .art-video-player *,
html body .academy-artplayer .art-video-player *::before,
html body .academy-artplayer .art-video-player *::after {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

html body .academy-artplayer .art-video-player .art-setting-item.art-current,
html body .academy-artplayer .art-video-player .art-selector-item.art-current {
    color: var(--art-theme) !important;
    -webkit-text-fill-color: var(--art-theme) !important;
}

.academy-artplayer .art-video-player,
.academy-artplayer video {
    width: 100%;
    height: 100%;
}

.academy-artplayer video {
    object-fit: contain;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

.academy-artplayer .art-bottom {
    background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .82) 100%);
}

.academy-artplayer .art-controls {
    gap: 0;
}

.academy-artplayer .art-control {
    margin: 0;
}

.academy-artplayer .academy-art-seek-icon {
    display: block;
    width: 23px;
    height: 23px;
    color: #fff;
}

.academy-artplayer .academy-art-state-icon {
    display: block;
    width: 34px;
    height: 34px;
    color: #fff;
}

.academy-artplayer .art-state {
    display: flex;
    width: 66px;
    height: 66px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(0, 0, 0, .62);
    box-shadow: 0 5px 22px rgba(0, 0, 0, .35);
}

.academy-artplayer .art-setting-panel {
    max-width: calc(100% - 24px);
    direction: rtl;
    font-family: inherit;
}

.academy-artplayer .art-setting-item {
    color: #fff !important;
    text-align: right;
}

.academy-artplayer .art-settings,
.academy-artplayer .art-settings *,
.academy-artplayer .art-setting-item-left,
.academy-artplayer .art-setting-item-right,
.academy-artplayer .art-selector-item,
.academy-artplayer .art-selector-item * {
    color: #fff !important;
}

.academy-artplayer .art-settings svg {
    fill: currentColor;
}

.academy-artplayer [class*="hint--"]::after {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-family: inherit;
}

.academy-artplayer [aria-label]::after,
.academy-artplayer .art-controls,
.academy-artplayer .art-controls *,
.academy-artplayer .art-control-time,
.academy-artplayer .art-control-time *,
.academy-artplayer .art-control-volume,
.academy-artplayer .art-control-volume *,
.academy-artplayer .art-volume-panel,
.academy-artplayer .art-volume-panel *,
.academy-artplayer .art-volume-value {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

html body .academy-artplayer .art-video-player .art-control-time,
html body .academy-artplayer .art-video-player .art-control-time *,
html body .academy-artplayer .art-video-player .art-control-volume,
html body .academy-artplayer .art-video-player .art-control-volume *,
html body .academy-artplayer .art-video-player .art-volume-panel,
html body .academy-artplayer .art-video-player .art-volume-panel *,
html body .academy-artplayer .art-video-player .art-volume-value,
html body .academy-artplayer .art-video-player [aria-label]::after,
html body .academy-artplayer .art-video-player [class*="hint--"]::after {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .8);
}

.academy-artplayer .art-notice,
.academy-artplayer .art-info,
.academy-artplayer .art-tooltip {
    font-family: inherit;
}

@media (max-width: 640px) {
    .academy-artplayer {
        border-radius: 10px;
    }

    .academy-artplayer .art-control {
        min-width: 34px;
    }

    .academy-artplayer .art-state {
        width: 56px;
        height: 56px;
    }
}