*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
--accent:#e50914;
--bg:#0a0a0a;
--bg-elevated:#141414;
--bg-card:#1a1a1a;
--text:#fff;
--text-muted:#999;
--text-soft:#ccc;
--border:#222;
--border-input:#333;
--nav-bg:linear-gradient(180deg,#141414 0%,#0a0a0a 100%);
--hero-overlay:linear-gradient(90deg,#0a0a0a 35%,rgba(10,10,10,.4) 70%,transparent),linear-gradient(0deg,#0a0a0a,rgba(10,10,10,.2) 40%,transparent);
--shadow:rgba(0,0,0,.6);
--btn-secondary:#333;
--placeholder-bg:linear-gradient(135deg,#1a1a1a,#0d0d0d);
}
html[data-theme="light"]{
--bg:#f4f4f5;
--bg-elevated:#fff;
--bg-card:#fff;
--text:#111;
--text-muted:#666;
--text-soft:#444;
--border:#e5e5e5;
--border-input:#d4d4d4;
--nav-bg:linear-gradient(180deg,#fff 0%,#f4f4f5 100%);
--hero-overlay:linear-gradient(90deg,#f4f4f5 35%,rgba(244,244,245,.5) 70%,transparent),linear-gradient(0deg,#f4f4f5,rgba(244,244,245,.3) 40%,transparent);
--shadow:rgba(0,0,0,.15);
--btn-secondary:#e5e5e5;
--placeholder-bg:linear-gradient(135deg,#e5e5e5,#f4f4f5);
}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.5;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
main{flex:1;max-width:1400px;width:100%;margin:0 auto;padding:20px}
.main-nav{background:var(--nav-bg);padding:0;position:sticky;top:0;z-index:1000;border-bottom:1px solid var(--border)}
.nav-bar{max-width:1400px;margin:0 auto;padding:12px 20px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px}
.site-logo{font-size:1.4rem;font-weight:700;color:var(--accent);flex-shrink:0;white-space:nowrap}
.nav-actions{display:flex;align-items:center;gap:10px;justify-self:end}
.nav-collapse{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;padding:0}
.nav-menu{display:flex;list-style:none;gap:4px;flex-wrap:wrap;align-items:center;margin:0;padding:0;justify-content:center}
.nav-menu a{padding:8px 14px;border-radius:4px;transition:background .2s;font-size:.95rem;display:block}
.nav-menu a:hover{background:var(--bg-card)}
/* --- Submenu & Dropdown styles --- */
.nav-menu li {
    position: relative;
    display: flex;
    align-items: center;
}
.nav-menu .has-children > a {
    padding-right: 8px;
}
.submenu-toggle {
    background: transparent;
    border: none;
    color: var(--text-soft);
    cursor: pointer;
    font-size: 0.75rem;
    padding: 6px;
    margin-left: -4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: color 0.2s, background-color 0.2s;
}
.submenu-toggle:hover {
    color: var(--text);
    background-color: var(--bg-card);
}
.sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--bg-card);
    border: 1px solid var(--border-input);
    border-radius: 8px;
    list-style: none;
    min-width: 200px;
    box-shadow: 0 8px 24px var(--shadow);
    padding: 6px 0;
    margin-top: 4px;
    z-index: 1100;
}
.sub-menu li {
    display: block;
    width: 100%;
}
.sub-menu a {
    display: block;
    padding: 8px 16px;
    font-size: 0.9rem;
    border-radius: 0;
    transition: background 0.15s;
    border-bottom: none !important;
}
.sub-menu a:hover {
    background: var(--bg-elevated);
}
@media(min-width:769px) {
    .nav-menu .has-children:hover > .sub-menu,
    .nav-menu .has-children:focus-within > .sub-menu {
        display: block;
    }
}
.search-box{position:relative;min-width:0}
.search-box input{padding:8px 14px;border-radius:20px;border:1px solid var(--border-input);background:var(--bg-card);color:var(--text);width:200px;max-width:100%}
.search-box input::placeholder{color:var(--text-muted);opacity:1}
.search-box input::-webkit-input-placeholder{color:var(--text-muted);opacity:1}
.search-desktop{display:block}
.search-mobile{display:none;width:100%}
.search-results{position:absolute;top:100%;right:0;background:var(--bg-card);border:1px solid var(--border-input);border-radius:8px;min-width:280px;display:none;z-index:100;max-height:400px;overflow-y:auto;box-shadow:0 8px 24px var(--shadow)}
.search-results a{display:flex;gap:10px;padding:10px;border-bottom:1px solid var(--border)}
.search-results img{width:40px;height:60px;object-fit:cover;border-radius:4px;flex-shrink:0}
.theme-toggle{display:flex;align-items:center;gap:2px;background:var(--bg-card);border:1px solid var(--border-input);border-radius:8px;padding:3px;flex-shrink:0}
.header-theme-toggle .theme-btn{padding:7px 10px;font-size:1rem;line-height:1}
.theme-btn{padding:8px 12px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:6px;font-size:.85rem;font-weight:600;transition:background .2s,color .2s}
.theme-btn.active{background:var(--accent);color:#fff}
.theme-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hamburger{display:none;background:none;border:none;color:var(--text);font-size:1.6rem;cursor:pointer;padding:4px 8px;line-height:1;flex-shrink:0}
.home-page-h1{font-size:clamp(1.5rem,3vw,2rem);font-weight:700;margin-bottom:20px;line-height:1.3;border-left:4px solid var(--accent);padding-left:14px}
.home-hero-title{font-size:2.4rem;margin:8px 0 12px;line-height:1.2}
.home-page-content{font-size:1rem;line-height:1.75;color:var(--text-soft);word-wrap:break-word;overflow-wrap:break-word}
.home-page-content h2,.home-page-content h3,.home-page-content h4{margin:1.25rem 0 .75rem;color:var(--text);line-height:1.35;font-weight:600}
.home-page-content h2{font-size:clamp(1.25rem,2.5vw,1.5rem)}
.home-page-content h3{font-size:clamp(1.1rem,2vw,1.25rem)}
.home-page-content h4{font-size:clamp(1rem,1.8vw,1.1rem)}
.home-page-content p{margin:0 0 1rem}
.home-page-content ul,.home-page-content ol{margin:0 0 1rem 1.25rem;padding-left:1rem}
.home-page-content li{margin-bottom:.35rem}
.home-page-content a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.home-page-content a:hover{opacity:.85}
.home-page-content img{max-width:100%;height:auto;border-radius:8px;margin:1rem 0;display:block}
.home-page-content blockquote{margin:1rem 0;padding:12px 16px;border-left:4px solid var(--accent);background:var(--bg-card);border-radius:0 8px 8px 0}
.home-content-section{margin-top:24px;margin-bottom:8px}
.section-title{font-size:1.3rem;margin:24px 0 16px;padding-left:12px;border-left:4px solid var(--accent)}
.content-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}
.content-card{display:block;transition:transform .2s}
.content-card:hover{transform:scale(1.03)}
.card-poster{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:2/3;background:var(--bg-card)}
.card-poster img{width:100%;height:100%;object-fit:cover}
.quality-badge,.rating-badge{position:absolute;padding:2px 6px;font-size:.7rem;border-radius:3px;font-weight:600}
.quality-badge{top:6px;left:6px;background:var(--accent);color:#fff}
.rating-badge{top:6px;right:6px;background:rgba(0,0,0,.8);color:#fff}
.card-info{padding:8px 4px}
.card-info h3{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-year,.card-genre,.card-country{font-size:.75rem;color:var(--text-muted);display:block}
/* --- Premium Hero Stream Styling & Layout Fix --- */
.hero-stream {
    position: relative;
    min-height: 400px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 24px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    display: flex;
    align-items: stretch;
}
.hero-backdrop {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center top;
    z-index: 1;
}
.hero-backdrop::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, var(--bg-elevated) 30%, rgba(10, 10, 10, 0.4) 70%, transparent 100%),
                linear-gradient(0deg, var(--bg-elevated) 0%, rgba(10, 10, 10, 0.2) 50%, transparent 100%);
    z-index: 2;
}
html[data-theme="light"] .hero-backdrop::after {
    background: linear-gradient(90deg, var(--bg-elevated) 30%, rgba(240, 240, 240, 0.4) 70%, transparent 100%),
                linear-gradient(0deg, var(--bg-elevated) 0%, rgba(240, 240, 240, 0.2) 50%, transparent 100%);
}
.hero-content {
    position: relative;
    z-index: 3;
    display: flex;
    gap: 32px;
    padding: 40px;
    align-items: flex-end;
    width: 100%;
}
.hero-poster {
    width: 200px;
    border-radius: 8px;
    box-shadow: 0 12px 36px var(--shadow);
    flex-shrink: 0;
    border: 1px solid var(--border);
}
.hero-meta {
    flex: 1;
    color: var(--text);
}
.hero-meta h1 {
    font-size: 2.2rem;
    font-weight: 800;
    margin-bottom: 12px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.hero-tags span{background:var(--bg-card);padding:4px 10px;border-radius:4px;font-size:.85rem}
.watch-btn{display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:#fff!important;padding:12px 28px;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;margin-top:12px;transition:transform .15s,box-shadow .15s}
.watch-btn:hover{transform:scale(1.04);box-shadow:0 4px 20px rgba(229,9,20,.4)}
.watch-btn-lg{font-size:1.15rem;padding:14px 32px}
.watch-btn-secondary{background:var(--btn-secondary);margin-left:8px}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.player-section{margin:0 0 24px;border-radius:12px;overflow:hidden;background:#000;box-shadow:0 8px 32px var(--shadow);position:relative}
.player-top{margin-top:0}
.player-with-backdrop{background-size:cover;background-position:center center;background-color:#000}
.player-backdrop-overlay{position:absolute;inset:0;background:rgba(0,0,0,.30);backdrop-filter:blur(1px);z-index:1;transition:opacity .35s ease}
html[data-theme="light"] .player-backdrop-overlay{background:rgba(0,0,0,.35)}
.player-section.player-active .player-backdrop-overlay{opacity:0;pointer-events:none}
.player-frame{width:100%;aspect-ratio:16/9;border:none;background:#000;position:relative;z-index:2}
.player-visible{display:block}
.player-placeholder{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;background:transparent;min-height:360px;position:relative;z-index:2}
.player-with-backdrop .player-placeholder{min-height:min(56.25vw,70vh)}
.player-play-btn{width:88px;height:88px;border-radius:50%;border:3px solid rgba(255,255,255,.9);background:var(--accent);color:#fff;font-size:2.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s,background .15s;box-shadow:0 4px 32px rgba(0,0,0,.55);line-height:1;padding:0 0 0 6px}
.player-play-btn:hover{transform:scale(1.08);box-shadow:0 8px 36px rgba(229,9,20,.55);background:#f40612}
html[data-theme="light"] .player-play-btn{border-color:rgba(255,255,255,.95);box-shadow:0 4px 28px rgba(0,0,0,.3)}
.player-no-stream{color:#fff;font-size:1rem;background:rgba(0,0,0,.55);padding:14px 28px;border-radius:8px;backdrop-filter:blur(4px)}
html[data-theme="light"] .player-no-stream{color:#fff;background:rgba(0,0,0,.65)}
.pagination{display:flex;gap:8px;justify-content:center;margin:24px 0;flex-wrap:wrap;align-items:center}
.pagination a,.pagination span{padding:8px 14px;background:var(--bg-card);border-radius:4px;border:1px solid var(--border)}
.pagination a.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.pagination-ellipsis{color:var(--text-muted);padding:8px 4px;background:transparent;border:none}
.card-language{font-size:.75rem;color:var(--text-muted);display:block}
/* --- Homepage: content-driven landing page --- */
.homepage-hero-section{padding:48px 0 32px;text-align:center}
.homepage-hero-inner{max-width:720px;margin:0 auto}
.homepage-hero-section .home-page-h1{text-align:center;border-left:none;padding-left:0;font-size:clamp(1.6rem,4vw,2.6rem);margin-bottom:28px;line-height:1.25;background:linear-gradient(135deg,var(--text) 40%,var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.homepage-search-wrap{position:relative;max-width:600px;margin:0 auto 8px}
.homepage-search-form{position:relative}
.homepage-search-box{position:relative;display:flex;align-items:center}
.homepage-search-icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;display:flex;align-items:center}
.homepage-search-box input{width:100%;padding:16px 20px 16px 52px;font-size:1.1rem;border-radius:50px;border:2px solid var(--border-input);background:var(--bg-card);color:var(--text);transition:border-color .25s,box-shadow .25s;box-shadow:0 4px 20px rgba(0,0,0,.15)}
.homepage-search-box input::placeholder{color:var(--text-muted);opacity:1}
.homepage-search-box input:focus{outline:none;border-color:var(--accent);box-shadow:0 4px 28px rgba(229,9,20,.18)}
.homepage-search-results{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--bg-card);border:1px solid var(--border-input);border-radius:12px;display:none;z-index:100;max-height:400px;overflow-y:auto;box-shadow:0 12px 36px var(--shadow)}
.homepage-search-results a{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);align-items:center;transition:background .15s}
.homepage-search-results a:hover{background:var(--bg-elevated)}
.homepage-search-results img{width:44px;height:66px;object-fit:cover;border-radius:6px;flex-shrink:0}
.homepage-search-results .sr-info{flex:1;text-align:left}
.homepage-search-results .sr-title{font-weight:600;font-size:.95rem;display:block}
.homepage-search-results .sr-meta{font-size:.8rem;color:var(--text-muted)}
.homepage-hero-download{margin-top:20px;display:flex;justify-content:center}
.btn-download-hero{display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:#fff!important;padding:12px 24px;border-radius:30px;font-size:0.95rem;font-weight:600;transition:transform .15s,box-shadow .15s,background-color .15s;box-shadow:0 4px 15px rgba(229,9,20,0.3);text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.btn-download-hero:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(229,9,20,0.5);background-color:#f40612}
.btn-download-hero .download-icon{animation:bounce-down 2s infinite;flex-shrink:0}
@keyframes bounce-down{
  0%,20%,50%,80%,100%{transform:translateY(0)}
  40%{transform:translateY(-4px)}
  60%{transform:translateY(-2px)}
}
.homepage-page-content{margin-top:0}
.home-page-content-extra{margin-top:24px;padding-top:24px;border-top:1px solid var(--border)}
/* --- (kept for archive pages that still use rows) --- */
.content-row-section{margin-bottom:36px}
.row-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.row-header h2{font-size:1.25rem;font-weight:600;border-left:4px solid var(--accent);padding-left:12px}
.row-link{color:var(--accent);font-size:.9rem}
.content-row{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.content-row .content-card{flex:0 0 150px;scroll-snap-align:start}
.content-row .card-poster{aspect-ratio:2/3}
.empty-msg{color:var(--text-muted);padding:20px}
.hero-compact{min-height:auto;margin-bottom:20px}
.hero-compact .hero-content{min-height:auto;padding:24px 0}
.episode-subtitle{font-size:1.1rem;color:var(--text-soft);font-weight:400;margin:6px 0 0}
.info-section{background:var(--bg-elevated);border-radius:12px;padding:24px;margin:24px 0;border:1px solid var(--border)}
.info-section h2{margin-bottom:16px;font-size:1.2rem}
.cast-list{display:flex;flex-wrap:wrap;gap:8px}
.cast-list span{background:var(--bg-card);padding:6px 12px;border-radius:20px;font-size:.85rem}
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;align-items:center}
.filter-bar select,.filter-bar input{padding:8px 12px;border-radius:6px;border:1px solid var(--border-input);background:var(--bg-card);color:var(--text)}
.genre-grid,.country-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.genre-grid a,.country-grid a{background:var(--bg-card);padding:16px;border-radius:8px;text-align:center;transition:background .2s;border:1px solid var(--border)}
.genre-grid a:hover,.country-grid a:hover{background:var(--bg-elevated)}
.breadcrumb{font-size:.85rem;color:var(--text-muted);margin-bottom:16px}
.breadcrumb a{color:var(--accent)}
.episode-list{display:grid;gap:8px}
.episode-list a{display:flex;gap:12px;padding:12px;background:var(--bg-card);border-radius:8px;align-items:center;border:1px solid var(--border)}
.episode-list img{width:120px;height:68px;object-fit:cover;border-radius:4px;flex-shrink:0}
.main-footer{background:var(--bg-elevated);padding:24px 20px;margin-top:40px;border-top:1px solid var(--border)}
.footer-inner{max-width:1400px;margin:0 auto;text-align:center}
.footer-copy{color:var(--text-muted);font-size:.9rem}
@media(min-width:769px){
.nav-collapse{display:flex!important}
.search-mobile{display:none}
}
@media(max-width:768px){
.hamburger{display:block}
.nav-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}
.nav-collapse{display:none;flex-direction:column;align-items:stretch;width:100%;order:3;padding:12px 0 0;border-top:1px solid var(--border);background:transparent;justify-content:flex-start}
.nav-collapse.open{display:flex}
.nav-menu{flex-direction:column;width:100%;gap:0;justify-content:flex-start}
.nav-menu a{padding:12px 14px;border-bottom:1px solid var(--border)}
.nav-menu li {
    flex-wrap: wrap;
    width: 100%;
}
.nav-menu .has-children {
    justify-content: space-between;
}
.nav-menu .has-children > a {
    flex: 1;
}
.nav-menu .submenu-toggle {
    padding: 12px 16px;
    font-size: 1rem;
    margin-left: 0;
}
.nav-menu .sub-menu {
    position: static;
    display: none;
    width: 100%;
    background: var(--bg-elevated);
    box-shadow: none;
    border: none;
    border-left: 2px solid var(--accent);
    margin-top: 0;
    border-radius: 0;
    padding: 0 0 0 12px;
}
.nav-menu .has-children.open-submenu > .sub-menu {
    display: block;
}
.nav-menu .sub-menu a {
    padding: 10px 14px;
    font-size: 0.9rem;
}
.search-desktop{display:none}
.search-mobile{display:block}
.search-mobile .search-results{left:0;right:0;min-width:100%}
.hero-stream {
    flex-direction: column;
    min-height: auto;
}
.hero-backdrop {
    position: relative;
    height: 200px;
    width: 100%;
}
.hero-backdrop::after {
    background: linear-gradient(0deg, var(--bg-elevated) 0%, transparent 100%) !important;
}
.hero-content {
    flex-direction: column;
    align-items: center;
    padding: 24px;
    margin-top: -80px;
    text-align: center;
    width: 100%;
}
.hero-poster {
    width: 130px;
    box-shadow: 0 8px 24px var(--shadow);
}
.hero-meta h1 {
    font-size: 1.6rem;
    text-shadow: none;
    margin-top: 12px;
}
.hero-tags {
    justify-content: center;
}
.home-hero-content {
    flex-direction: column;
    padding: 20px;
}
.home-hero-poster {
    width: 140px;
}
.home-hero-title{font-size:1.8rem}
.home-page-h1{font-size:1.35rem}
.homepage-hero-section{padding:28px 0 20px}
.homepage-hero-section .home-page-h1{font-size:clamp(1.3rem,5vw,1.8rem)}
.homepage-search-box input{padding:14px 16px 14px 46px;font-size:1rem}
.player-with-backdrop .player-placeholder{min-height:220px}
.player-play-btn{width:68px;height:68px;font-size:1.75rem;padding-left:4px}
/* Mobile Grid: 3 columns */
.content-grid{grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:10px}
.card-info{padding:6px 2px}
.card-info h3{font-size:.78rem}
.card-year,.card-genre,.card-country,.card-language{font-size:.68rem}
.quality-badge,.rating-badge{font-size:.6rem;padding:1px 4px}
.section-title{font-size:1.1rem;margin:18px 0 12px}
.content-row .content-card{flex:0 0 120px}
.genre-grid,.country-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px}
.genre-grid a,.country-grid a{padding:12px 8px;font-size:.85rem}
}
@media(max-width:480px){
.content-grid{grid-template-columns:repeat(3,1fr);gap:8px}
.card-poster{border-radius:6px}
.card-info h3{font-size:.72rem}
.card-year,.card-genre,.card-country,.card-language{font-size:.62rem}
.card-info{padding:4px 2px}
.content-row .content-card{flex:0 0 100px}
.episodes-list-grid{grid-template-columns:repeat(2,1fr);gap:8px}
.movie-detail-layout{padding:16px}
.movie-detail-left{width:120px;flex:0 0 120px}
.movie-detail-title{font-size:1.3rem}
}
@media(min-width:769px) and (max-width:1024px){
.search-box input{width:160px}
.player-with-backdrop .player-placeholder{min-height:400px}
}

/* --- Episode Navigation & Sibling List --- */
.player-episode-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 24px;
    gap: 16px;
}
.ep-nav-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    transition: all 0.2s ease;
    cursor: pointer;
    color: var(--text);
}
.ep-nav-btn:hover:not(.disabled) {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent);
    transform: translateY(-1px);
}
.ep-nav-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.ep-nav-status {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-soft);
}
.season-episodes-section {
    margin-top: 32px;
}
.episodes-list-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
    margin-top: 16px;
}
.episode-list-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, border-color 0.2s ease;
}
.episode-list-card:hover {
    transform: translateY(-2px);
    border-color: var(--accent);
}
.episode-list-card.active {
    border-color: var(--accent);
    box-shadow: 0 0 10px rgba(229, 9, 20, 0.2);
}
.episode-card-poster {
    position: relative;
    aspect-ratio: 16/9;
    background: var(--bg-elevated);
    overflow: hidden;
}
.episode-card-poster img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.episode-poster-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-muted);
}
.episode-number-badge {
    position: absolute;
    bottom: 8px;
    left: 8px;
    background: rgba(0,0,0,0.8);
    color: #fff;
    padding: 2px 6px;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 4px;
}
.playing-overlay {
    position: absolute;
    inset: 0;
    background: rgba(229, 9, 20, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
}
.playing-text {
    color: #fff;
    font-weight: 800;
    font-size: 0.85rem;
    letter-spacing: 1px;
}
.episode-card-info {
    padding: 12px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.episode-card-info h4 {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.episode-airdate {
    font-size: 0.75rem;
    color: var(--text-muted);
}

@media (max-width: 576px) {
    .player-episode-nav {
        flex-direction: column;
        gap: 10px;
        text-align: center;
        padding: 10px;
    }
    .player-episode-nav .ep-nav-btn {
        width: 100%;
        justify-content: center;
    }
    .episodes-list-grid {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 12px;
    }
}

/* --- Movie Detail Layout Redesign --- */
.movie-detail-container {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    margin-bottom: 32px;
}
.movie-detail-backdrop {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0.05;
    filter: blur(20px);
    z-index: 1;
    pointer-events: none;
}
.movie-detail-layout {
    position: relative;
    z-index: 2;
    display: flex;
    gap: 32px;
    padding: 32px;
}
.movie-detail-left {
    width: 240px;
    flex: 0 0 240px;
}
.movie-poster-wrap {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 8px 32px var(--shadow);
}
.movie-poster-img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 2/3;
    object-fit: cover;
}
.movie-quality-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--accent);
    color: #fff;
    padding: 3px 8px;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 4px;
}
.movie-detail-right {
    flex: 1;
}
.movie-detail-title {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 12px;
    color: var(--text);
    line-height: 1.25;
}
.movie-detail-meta {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.meta-badge {
    background: var(--bg-card);
    border: 1px solid var(--border);
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-soft);
}
.meta-badge.rating {
    border-color: rgba(255, 193, 7, 0.4);
    color: #ffc107;
}
.movie-detail-genres {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}
.genre-tag {
    background: rgba(229, 9, 20, 0.1);
    color: var(--accent);
    border: 1px solid rgba(229, 9, 20, 0.2);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
}
.movie-detail-synopsis {
    margin-bottom: 24px;
}
.movie-detail-synopsis h3 {
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: var(--text);
}
.movie-detail-synopsis p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--text-soft);
}
.movie-detail-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border);
}
.info-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.info-label {
    font-size: 0.75rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.info-value {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-soft);
}
.movie-detail-cast h3 {
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--text);
}
.cast-tags-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.cast-tag {
    background: var(--bg-card);
    border: 1px solid var(--border);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    color: var(--text-soft);
    transition: all 0.2s ease;
}
.cast-tag:hover {
    border-color: var(--accent);
    color: #fff;
}

@media (max-width: 768px) {
    .movie-detail-layout {
        flex-direction: column;
        align-items: center;
        gap: 24px;
        padding: 24px;
    }
    .movie-detail-left {
        width: 160px;
        flex: 0 0 160px;
    }
    .movie-detail-title {
        font-size: 1.6rem;
        text-align: center;
    }
    .movie-detail-meta, .movie-detail-genres {
        justify-content: center;
    }
    .movie-detail-synopsis {
        text-align: center;
    }
    .movie-detail-info-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 12px;
    }
    .cast-tags-list {
        justify-content: center;
    }
}