:root {
    --theme-header-bg: rgba(7, 9, 15, .9);
}

@media (min-width: 901px) {
    body.layout-shell-centered .site-header,
    body.layout-shell-centered .site-footer {
        padding-left: max(clamp(1rem, 4vw, 3rem), calc((100vw - 1440px) / 2 + clamp(1rem, 3vw, 2rem)));
        padding-right: max(clamp(1rem, 4vw, 3rem), calc((100vw - 1440px) / 2 + clamp(1rem, 3vw, 2rem)));
    }
}

.site-header {
    position: relative;
    top: auto;
    justify-content: flex-start;
}

.site-header .top-nav {
    margin-left: auto;
}

.site-header .theme-toggle {
    margin-left: .35rem;
}

.brand {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    width: 11rem;
    height: 2.65rem;
    border-radius: .55rem;
    background: #0b0f19;
    color: #ffffff;
}

.brand img {
    width: 11rem;
    height: 2.65rem;
}

.brand-logo-light {
    display: none;
}

:root[data-theme="light"] .brand-logo-dark {
    display: none;
}

:root[data-theme="light"] .brand-logo-light {
    display: block;
}

.mobile-theme-toggle {
    display: none;
}

.top-nav {
    align-items: center;
    flex-wrap: nowrap;
}

.top-nav .nav-link,
.top-nav .nav-menu-trigger,
.top-nav .nav-icon-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    border-radius: .5rem;
    color: var(--muted);
    font: inherit;
    font-size: .92rem;
    font-weight: 800;
    white-space: nowrap;
}

.top-nav .nav-link,
.top-nav .nav-menu-trigger {
    padding: .55rem .72rem;
}

.top-nav .nav-menu-trigger {
    gap: .42rem;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.top-nav .nav-menu-trigger::after {
    content: "";
    width: .42rem;
    height: .42rem;
    margin-top: -.16rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: .72;
}

.top-nav .nav-link:hover,
.top-nav .nav-link:focus-visible,
.top-nav .nav-menu-trigger:hover,
.top-nav .nav-menu-trigger:focus-visible,
.top-nav .nav-icon-link:hover,
.top-nav .nav-icon-link:focus-visible {
    color: #fff;
    background: rgba(255, 255, 255, .07);
    outline: none;
}

.nav-dropdown {
    position: relative;
}

.nav-menu {
    position: absolute;
    top: calc(100% + .55rem);
    right: 0;
    z-index: 40;
    display: none;
    width: min(28rem, calc(100vw - 2rem));
    max-height: min(28rem, calc(100vh - 6rem));
    overflow: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem;
    padding: .65rem;
    border: 1px solid var(--line);
    border-radius: .65rem;
    background: rgba(16, 20, 31, .98);
    box-shadow: 0 1.2rem 3.5rem rgba(0, 0, 0, .38);
}

.nav-menu-years {
    width: min(18rem, calc(100vw - 2rem));
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nav-dropdown:hover .nav-menu,
.nav-dropdown:focus-within .nav-menu {
    display: grid;
}

.nav-menu a {
    min-width: 0;
    padding: .55rem .65rem;
    border-radius: .45rem;
    color: #dbe4f2;
    font-size: .86rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-menu a:hover,
.nav-menu a:focus-visible {
    color: #fff;
    background: rgba(240, 68, 56, .14);
    outline: none;
}

.nav-icon-link {
    position: relative;
    width: 2.45rem;
    min-width: 2.45rem;
    padding: 0;
}

.nav-user-link::before {
    content: "";
    position: absolute;
    top: .5rem;
    width: .74rem;
    height: .74rem;
    border: 2px solid currentColor;
    border-radius: 50%;
}

.nav-user-link::after {
    content: "";
    position: absolute;
    bottom: .46rem;
    width: 1.25rem;
    height: .72rem;
    border: 2px solid currentColor;
    border-radius: 1rem 1rem .35rem .35rem;
}

.theme-toggle {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.45rem;
    height: 2.45rem;
    border: 1px solid var(--line);
    border-radius: .55rem;
    background: rgba(255, 255, 255, .06);
    color: #f59e0b;
    font-size: 1.05rem;
    font-weight: 900;
    cursor: pointer;
    transition: background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease;
}

.theme-toggle:hover {
    transform: translateY(-1px);
    background: rgba(245, 158, 11, .14);
    border-color: rgba(245, 158, 11, .35);
}

.theme-toggle-moon {
    display: none;
    color: #2563eb;
    letter-spacing: -.14rem;
    transform: translateX(-.08rem);
}

.random-movie-button {
    border-color: rgba(240, 68, 56, .42);
    background:
        radial-gradient(circle at 12% 20%, rgba(240, 68, 56, .25), transparent 2.8rem),
        linear-gradient(135deg, rgba(240, 68, 56, .16), rgba(245, 158, 11, .07) 48%, rgba(16, 20, 31, .92));
    box-shadow: inset 0 0 0 1px rgba(240, 68, 56, .08), 0 .8rem 2rem rgba(0, 0, 0, .18);
}

.random-movie-button:hover,
.random-movie-button:focus-visible {
    border-color: rgba(240, 68, 56, .72);
    background:
        radial-gradient(circle at 12% 20%, rgba(240, 68, 56, .34), transparent 2.8rem),
        linear-gradient(135deg, rgba(240, 68, 56, .22), rgba(245, 158, 11, .10) 48%, rgba(16, 20, 31, .96));
    outline: none;
}

.random-icon {
    position: relative;
    display: grid;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: .65rem;
    background: rgba(240, 68, 56, .18);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}

.random-icon::before {
    content: "";
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid #f04438;
    border-radius: .3rem;
    background:
        radial-gradient(circle at 28% 28%, #fff 0 .11rem, transparent .12rem),
        radial-gradient(circle at 72% 28%, #fff 0 .11rem, transparent .12rem),
        radial-gradient(circle at 50% 50%, #fff 0 .11rem, transparent .12rem),
        radial-gradient(circle at 28% 72%, #fff 0 .11rem, transparent .12rem),
        radial-gradient(circle at 72% 72%, #fff 0 .11rem, transparent .12rem),
        #ef4444;
    transform: rotate(-8deg);
    box-shadow: 0 .25rem .8rem rgba(240, 68, 56, .32);
}

.detail-hero.detail-hero-has-backdrop {
    background:
        linear-gradient(90deg, rgba(7, 9, 15, .96), rgba(7, 9, 15, .78) 46%, rgba(7, 9, 15, .94)),
        var(--detail-backdrop),
        radial-gradient(ellipse at 48% 100%, rgba(240, 68, 56, .24), transparent 42%),
        linear-gradient(180deg, rgba(17,24,39,.96), rgba(7,9,15,1));
    background-size: cover, cover, auto, auto;
    background-position: center;
}

:root[data-theme="light"] {
    color-scheme: light;
    --bg: #f5f8fd;
    --panel: #ffffff;
    --panel-2: #edf3fb;
    --text: #111827;
    --muted: #5f6b7d;
    --line: rgba(15, 23, 42, .12);
    --accent: #dc2626;
    --accent-2: #2563eb;
    --theme-header-bg: rgba(255, 255, 255, .88);
}

:root[data-theme="light"] .theme-toggle {
    background: rgba(37, 99, 235, .08);
    border-color: rgba(37, 99, 235, .22);
    color: #2563eb;
}

:root[data-theme="light"] .theme-toggle-sun {
    display: none;
}

:root[data-theme="light"] .theme-toggle-moon {
    display: inline;
}

:root[data-theme="light"] body {
    background: radial-gradient(circle at top left, rgba(37, 99, 235, .13), transparent 30rem), var(--bg);
    color: var(--text);
}

:root[data-theme="light"] .site-header {
    background: var(--theme-header-bg);
    box-shadow: 0 .6rem 2rem rgba(15, 23, 42, .06);
}

@media (max-width: 900px) {
    :root[data-theme="light"] .site-header {
        background:
            linear-gradient(180deg, rgba(245, 248, 253, .94), rgba(236, 243, 252, .88)),
            radial-gradient(circle at 12% 20%, rgba(37, 99, 235, .10), transparent 12rem);
        border-bottom-color: rgba(15, 23, 42, .12);
        box-shadow: 0 .8rem 2rem rgba(15, 23, 42, .08);
        backdrop-filter: blur(18px);
    }

    :root[data-theme="light"] .mobile-menu-trigger,
    :root[data-theme="light"] .site-header .mobile-header-icon,
    :root[data-theme="light"] .site-header .mobile-theme-toggle {
        color: #0f172a;
        background: rgba(255, 255, 255, .62);
        border: 1px solid rgba(15, 23, 42, .10);
        box-shadow: 0 .35rem 1rem rgba(15, 23, 42, .07);
    }

    :root[data-theme="light"] .mobile-menu-trigger:hover,
    :root[data-theme="light"] .mobile-menu-trigger:focus,
    :root[data-theme="light"] .site-header .mobile-header-icon:hover,
    :root[data-theme="light"] .site-header .mobile-header-icon:focus,
    :root[data-theme="light"] .site-header .mobile-theme-toggle:hover,
    :root[data-theme="light"] .site-header .mobile-theme-toggle:focus-visible {
        background: rgba(239, 246, 255, .92);
        color: #1d4ed8;
        border-color: rgba(37, 99, 235, .22);
        outline: none;
    }

    :root[data-theme="light"] .mobile-search-panel {
        background: rgba(245, 248, 253, .96);
        border-bottom-color: rgba(15, 23, 42, .12);
        box-shadow: 0 1rem 2.2rem rgba(15, 23, 42, .10);
    }

    :root[data-theme="light"] .mobile-search-box {
        background: #fff;
        border-color: rgba(15, 23, 42, .14);
        color: #64748b;
        box-shadow: 0 .6rem 1.6rem rgba(15, 23, 42, .08);
    }

    :root[data-theme="light"] .mobile-search-box input {
        color: #111827;
    }

    :root[data-theme="light"] .mobile-search-box input::placeholder {
        color: #94a3b8;
    }

    :root[data-theme="light"] .mobile-search-box button {
        background: #eef4ff;
        color: #1d4ed8;
    }

    :root[data-theme="light"] .mobile-menu-backdrop {
        background: rgba(226, 232, 240, .68);
    }

    :root[data-theme="light"] .mobile-menu-drawer {
        background: #f8fbff;
        border-color: rgba(15, 23, 42, .12);
        box-shadow: 0 1rem 2.4rem rgba(15, 23, 42, .16);
    }

    :root[data-theme="light"] .mobile-menu-links > a,
    :root[data-theme="light"] .mobile-menu-group > summary {
        background: #eaf1fb;
        color: #111827;
        border-color: rgba(15, 23, 42, .10);
    }

    :root[data-theme="light"] .mobile-menu-group a {
        background: #fff;
        color: #334155;
        border-color: rgba(15, 23, 42, .10);
    }

    :root[data-theme="light"] .mobile-menu-auth {
        border-top-color: rgba(15, 23, 42, .10);
    }

    :root[data-theme="light"] .mobile-menu-auth a {
        background: #eaf1fb !important;
        color: #111827 !important;
    }

    :root[data-theme="light"] .mobile-menu-auth .primary-mobile-action {
        background: #ef4444 !important;
        color: #fff !important;
    }
}

:root[data-theme="light"] .brand {
    border: 1px solid rgba(15, 23, 42, .10);
    background: #eef1f5;
    box-shadow: 0 .35rem 1.2rem rgba(15, 23, 42, .08);
}

:root[data-theme="light"] .brand img {
    opacity: 1;
}

:root[data-theme="light"] .top-nav a {
    color: #475569;
}

:root[data-theme="light"] .top-nav a:hover,
:root[data-theme="light"] .top-nav .nav-menu-trigger:hover,
:root[data-theme="light"] .top-nav .nav-menu-trigger:focus-visible,
:root[data-theme="light"] .top-nav .nav-icon-link:hover,
:root[data-theme="light"] .top-nav .nav-icon-link:focus-visible,
:root[data-theme="light"] .site-footer nav a,
:root[data-theme="light"] .listing-head a,
:root[data-theme="light"] .section-head a,
:root[data-theme="light"] .static-content a {
    color: #1d4ed8;
}

:root[data-theme="light"] .top-nav a:hover {
    background: rgba(37, 99, 235, .08);
}

:root[data-theme="light"] .top-nav .nav-menu-trigger,
:root[data-theme="light"] .top-nav .nav-icon-link {
    color: #475569;
}

:root[data-theme="light"] .top-nav .nav-menu-trigger:hover,
:root[data-theme="light"] .top-nav .nav-menu-trigger:focus-visible,
:root[data-theme="light"] .top-nav .nav-icon-link:hover,
:root[data-theme="light"] .top-nav .nav-icon-link:focus-visible {
    background: rgba(37, 99, 235, .08);
}

:root[data-theme="light"] .nav-menu {
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 1.1rem 3rem rgba(15, 23, 42, .14);
}

:root[data-theme="light"] .nav-menu a {
    color: #334155;
}

:root[data-theme="light"] .nav-menu a:hover,
:root[data-theme="light"] .nav-menu a:focus-visible {
    color: #1d4ed8;
    background: rgba(37, 99, 235, .08);
}

:root[data-theme="light"] .latest-tabs a {
    color: #64748b !important;
}

:root[data-theme="light"] .latest-tabs a:hover,
:root[data-theme="light"] .latest-tabs a:focus-visible {
    background: #111827 !important;
    color: #fff !important;
}

:root[data-theme="light"] .latest-tabs .latest-tab-active {
    background: #0f172a;
    color: #fff;
}

:root[data-theme="light"] .search-box input,
:root[data-theme="light"] .auth-panel input,
:root[data-theme="light"] .movie-filter input,
:root[data-theme="light"] .movie-filter select,
:root[data-theme="light"] .rating-form select,
:root[data-theme="light"] .request-form input,
:root[data-theme="light"] .request-form textarea,
:root[data-theme="light"] .contact-form input,
:root[data-theme="light"] .contact-form textarea,
:root[data-theme="light"] .comment-form textarea {
    background: #fff;
    color: #111827;
    border-color: rgba(15, 23, 42, .14);
    box-shadow: 0 1rem 2.4rem rgba(15, 23, 42, .08);
}

:root[data-theme="light"] .search-results,
:root[data-theme="light"] .sidebar-block,
:root[data-theme="light"] .score-card,
:root[data-theme="light"] .rating-form,
:root[data-theme="light"] .watchlist-form,
:root[data-theme="light"] .login-prompt,
:root[data-theme="light"] .comment-form,
:root[data-theme="light"] .comment-item,
:root[data-theme="light"] .movie-filter,
:root[data-theme="light"] .request-form,
:root[data-theme="light"] .contact-form,
:root[data-theme="light"] .auth-panel,
:root[data-theme="light"] .static-content,
:root[data-theme="light"] .movie-actions-side,
:root[data-theme="light"] .score-mini,
:root[data-theme="light"] .request-item {
    background: rgba(255, 255, 255, .88);
    color: var(--text);
    box-shadow: 0 .9rem 2.4rem rgba(15, 23, 42, .07);
}

:root[data-theme="light"] .sidebar-block,
:root[data-theme="light"] .poster,
:root[data-theme="light"] .box-player-preview,
:root[data-theme="light"] .static-content,
:root[data-theme="light"] .movie-filter,
:root[data-theme="light"] .request-form,
:root[data-theme="light"] .contact-form,
:root[data-theme="light"] .auth-panel {
    border-color: rgba(15, 23, 42, .12);
}

:root[data-theme="light"] .auth-shell {
    background: #fff;
    border-color: rgba(15, 23, 42, .12);
    box-shadow: 0 1.8rem 5rem rgba(15, 23, 42, .18);
}

:root[data-theme="light"] .auth-visual {
    background:
        linear-gradient(180deg, rgba(15, 23, 42, .36), rgba(15, 23, 42, .68)),
        var(--auth-image, linear-gradient(135deg, #eaf1fb, #fff)),
        linear-gradient(135deg, #eaf1fb, #ffffff);
    background-size: cover;
    background-position: center;
}

:root[data-theme="light"] .auth-modal .auth-visual-login {
    background:
        linear-gradient(180deg, rgba(15, 23, 42, .36), rgba(15, 23, 42, .68)),
        url('/assets/auth-login.png'),
        linear-gradient(135deg, #eaf1fb, #ffffff);
    background-size: cover;
    background-position: center;
}

:root[data-theme="light"] .auth-modal[data-mode="register"] .auth-visual-login {
    background:
        linear-gradient(180deg, rgba(15, 23, 42, .34), rgba(15, 23, 42, .66)),
        url('/assets/auth-register.png'),
        linear-gradient(135deg, #fff1f2, #eaf1fb);
    background-size: cover;
    background-position: center;
}

:root[data-theme="light"] .auth-visual::before {
    background: rgba(15, 23, 42, .16);
    backdrop-filter: blur(.22rem);
}

:root[data-theme="light"] .auth-visual h1,
:root[data-theme="light"] .auth-visual p {
    color: #fff;
    text-shadow: 0 .18rem .9rem rgba(15, 23, 42, .55);
}

:root[data-theme="light"] .auth-check::before {
    border-color: #0f172a;
}

:root[data-theme="light"] .overview-toggle {
    background: #0f172a;
    color: #fff;
    border-color: rgba(15, 23, 42, .18);
    box-shadow: 0 .7rem 1.8rem rgba(15, 23, 42, .12);
}

:root[data-theme="light"] .overview-toggle:hover,
:root[data-theme="light"] .overview-toggle:focus-visible {
    background: #dc2626;
    border-color: rgba(220, 38, 38, .36);
    color: #fff;
    outline: none;
}

:root[data-theme="light"] .sidebar h3,
:root[data-theme="light"] .site-footer,
:root[data-theme="light"] .listing-head,
:root[data-theme="light"] .detail-series {
    border-color: rgba(15, 23, 42, .12);
}

:root[data-theme="light"] .language-links a,
:root[data-theme="light"] .series-item,
:root[data-theme="light"] .filter-pills a,
:root[data-theme="light"] .tag-cloud a,
:root[data-theme="light"] .year-cloud a,
:root[data-theme="light"] .genre-cloud a,
:root[data-theme="light"] .detail-meta span,
:root[data-theme="light"] .detail-genres a,
:root[data-theme="light"] .secondary-action {
    background: #eef4ff;
    border-color: rgba(37, 99, 235, .14);
    color: #1f2937;
}

:root[data-theme="light"] .request-button {
    border-color: rgba(220, 38, 38, .24);
    background: linear-gradient(135deg, #fff, #fff1f2 54%, #eef4ff);
    color: #111827;
    box-shadow: 0 .75rem 1.8rem rgba(15, 23, 42, .08);
}

:root[data-theme="light"] .request-button:hover {
    border-color: rgba(220, 38, 38, .38);
    background: linear-gradient(135deg, #fff5f5, #eef4ff);
}

:root[data-theme="light"] .request-button .request-icon {
    background: rgba(220, 38, 38, .10);
    color: #dc2626;
}

:root[data-theme="light"] .request-button .request-icon::before,
:root[data-theme="light"] .request-button .request-icon::after {
    background: #dc2626;
}

:root[data-theme="light"] .request-button small {
    color: #64748b;
}

:root[data-theme="light"] .request-button b {
    border-color: #dc2626;
}

:root[data-theme="light"] .random-movie-button {
    border-color: rgba(220, 38, 38, .30);
    background:
        radial-gradient(circle at 12% 20%, rgba(220, 38, 38, .15), transparent 2.8rem),
        linear-gradient(135deg, #fff, #fff1f2 52%, #eef4ff);
}

:root[data-theme="light"] .random-movie-button:hover,
:root[data-theme="light"] .random-movie-button:focus-visible {
    border-color: rgba(220, 38, 38, .48);
    background:
        radial-gradient(circle at 12% 20%, rgba(220, 38, 38, .20), transparent 2.8rem),
        linear-gradient(135deg, #fff5f5, #eef4ff);
}

:root[data-theme="light"] .random-icon {
    background: rgba(220, 38, 38, .10);
    box-shadow: inset 0 0 0 1px rgba(220, 38, 38, .18);
}

:root[data-theme="light"] .series-item {
    background: #eef4ff;
    border-color: rgba(37, 99, 235, .16);
}

:root[data-theme="light"] .series-item:hover {
    background: #e8f0ff;
    border-color: rgba(220, 38, 38, .30);
}

:root[data-theme="light"] .series-copy strong,
:root[data-theme="light"] .series-item strong {
    color: #111827;
}

:root[data-theme="light"] .series-copy small,
:root[data-theme="light"] .series-item small {
    color: #64748b;
}

:root[data-theme="light"] .series-arrow {
    border-color: #475569;
}

:root[data-theme="light"] .language-links strong,
:root[data-theme="light"] .liked-item strong,
:root[data-theme="light"] .site-footer strong,
:root[data-theme="light"] .detail-genres a,
:root[data-theme="light"] .pill-action span,
:root[data-theme="light"] .auth-panel label,
:root[data-theme="light"] .contact-form label,
:root[data-theme="light"] .contact-form h2,
:root[data-theme="light"] .auth-head h1,
:root[data-theme="light"] .section-head h2,
:root[data-theme="light"] .listing-head h1 {
    color: #111827;
}

:root[data-theme="light"] .hero-copy p,
:root[data-theme="light"] .detail-copy p,
:root[data-theme="light"] .movie-overview,
:root[data-theme="light"] .static-content p,
:root[data-theme="light"] .comment-item p,
:root[data-theme="light"] .request-item p {
    color: #475569;
}

:root[data-theme="light"] .collection-card,
:root[data-theme="light"] .player-locked {
    background: linear-gradient(135deg, #ffffff, #edf4ff);
}

:root[data-theme="light"] .series-card {
    background: #111827;
    border-color: rgba(15, 23, 42, .16);
    box-shadow: 0 .8rem 1.8rem rgba(15, 23, 42, .10);
}

:root[data-theme="light"] .series-card img {
    opacity: .72;
    filter: saturate(.95) contrast(1.05);
}

:root[data-theme="light"] .series-card::after {
    background: linear-gradient(180deg, rgba(15, 23, 42, .10), rgba(15, 23, 42, .84));
}

:root[data-theme="light"] .series-card strong {
    color: #ffffff;
    text-shadow: 0 .18rem .7rem rgba(0, 0, 0, .72);
}

:root[data-theme="light"] .series-card small {
    color: #dbe4f0;
    text-shadow: 0 .16rem .55rem rgba(0, 0, 0, .62);
}

:root[data-theme="light"] .liked-item,
:root[data-theme="light"] .poster-fallback {
    background: transparent;
}

:root[data-theme="light"] .detail-hero {
    background:
        radial-gradient(ellipse at 48% 100%, rgba(220, 38, 38, .16), transparent 42%),
        radial-gradient(ellipse at 12% 92%, rgba(37, 99, 235, .10), transparent 32%),
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(245,248,253,1));
    background-size: auto, auto, auto;
    background-position: center;
}

:root[data-theme="light"] .detail-hero.detail-hero-has-backdrop {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .97), rgba(255, 255, 255, .90) 48%, rgba(245, 248, 253, .96)),
        var(--detail-backdrop),
        radial-gradient(ellipse at 48% 100%, rgba(220, 38, 38, .15), transparent 42%),
        radial-gradient(ellipse at 12% 92%, rgba(37, 99, 235, .10), transparent 32%),
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(245,248,253,1));
    background-size: cover, cover, auto, auto, auto;
    background-position: center;
}

:root[data-theme="light"] .detail-hero::before {
    background: radial-gradient(ellipse at center, rgba(37, 99, 235, .18), transparent 68%);
}

:root[data-theme="light"] .quality,
:root[data-theme="light"] .language-badge.cc {
    background: rgba(15, 23, 42, .86);
    color: #fff;
}

:root[data-theme="light"] .mobile-dock {
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 .7rem 2rem rgba(15, 23, 42, .14);
}

:root[data-theme="light"] .mobile-dock a {
    color: #475569;
}

:root[data-theme="light"] .mobile-dock a:hover {
    background: rgba(37, 99, 235, .08);
    color: #1d4ed8;
}

.detail-poster {
    width: 100%;
    max-width: 14rem;
}

.detail-poster img {
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 3;
    object-fit: cover;
}

@media (max-width: 900px) {
    .site-header .brand {
        width: 9.4rem;
        height: auto;
    }

    .site-header .brand img {
        width: 9.4rem;
        height: auto;
    }

    .desktop-theme-toggle {
        display: none !important;
    }

    .site-header .mobile-theme-toggle {
        display: inline-grid !important;
        width: 2.25rem;
        height: 2.25rem;
        margin-left: 0;
    }

    .detail-poster {
        width: 7rem;
        max-width: 7rem;
        align-self: start;
    }
}

@media (max-width: 560px) {
    .site-header .brand {
        width: 8.6rem;
    }

    .site-header .brand img {
        width: 8.6rem;
    }

    .detail-poster {
        width: 8rem;
        max-width: 8rem;
    }

    :root[data-theme="light"] .detail-hero.detail-hero-has-backdrop {
        background:
            linear-gradient(90deg, rgba(255, 255, 255, .94), rgba(255, 255, 255, .74)),
            var(--detail-backdrop, linear-gradient(135deg, rgba(255,255,255,.96), rgba(245,248,253,1)));
        background-size: cover;
        background-position: center;
    }

    .listing-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: .65rem;
        margin: .75rem 0 1rem;
        padding-bottom: .75rem;
    }

    .listing-head h1 {
        min-width: 0;
        font-size: clamp(1.18rem, 5.2vw, 1.55rem);
        line-height: 1.08;
        overflow-wrap: anywhere;
    }

    .listing-head a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 2.15rem;
        padding: .4rem .55rem;
        border: 1px solid var(--line);
        border-radius: .45rem;
        background: rgba(255, 255, 255, .06);
        font-size: .76rem;
        line-height: 1;
        white-space: nowrap;
    }

    :root[data-theme="light"] .listing-head a {
        background: #fff;
    }
}