diff --git a/css/style.css b/css/style.css
index dde2d41..4a6c0cb 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1 +1,1741 @@
-@keyframes slideIn{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px);filter:blur(4px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes toast-in{0%{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes toast-out{0%{transform:translateX(0);opacity:1}to{transform:translateX(100%);opacity:0}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}:root{--primary:#e6b980;--primary-dark:#b8860b;--primary-light:#f5d3ab;--secondary:#1a1410;--secondary-dark:#0f0b08;--secondary-light:#251e18;--accent:#8e1b1b;--accent-gold:#ffd700;--accent-green:#2d5a27;--accent-blue:#1b3b5f;--text-primary:#f5f1e8;--text-secondary:#d1c7b7;--text-soft:#a89f91;--text-muted:#7a7267;--bg-primary:#0a0806;--bg-secondary:#120e0b;--bg-tertiary:#1c1712;--bg-glass:rgba(10, 8, 6, 0.8);--border-color:rgba(212, 165, 116, 0.15);--border-glow:0 0 10px rgba(212, 165, 116, 0.2);--shadow-sm:0 4px 12px rgba(0, 0, 0, 0.5);--shadow-md:0 8px 24px rgba(0, 0, 0, 0.7);--shadow-lg:0 16px 48px rgba(0, 0, 0, 0.9);--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--radius-sm:4px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--font-sans:'Inter', -apple-system, system-ui, sans-serif;--font-serif:'Merriweather', serif;--font-display:'Cinzel', serif;--transition-fast:150ms cubic-bezier(0.4, 0, 0.2, 1);--transition-base:300ms cubic-bezier(0.4, 0, 0.2, 1);--transition-slow:500ms cubic-bezier(0.4, 0, 0.2, 1)}body.light-mode{--primary:#e50914;--secondary:#ffffff;--secondary-dark:#f5f5f5;--secondary-light:#eeeeee;--text-primary:#1a1a1a;--text-secondary:#404040;--text-soft:#666666;--text-muted:#999999;--bg-primary:#ffffff;--bg-secondary:#f5f5f5;--bg-tertiary:#eeeeee;--bg-hover:#e0e0e0;--border-color:#d0d0d0}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6;transition:background-color var(--transition-base),color var(--transition-base);overflow-x:hidden}.skip-link{position:absolute;top:-100px;left:var(--spacing-md);background:var(--primary);color:#fff;padding:var(--spacing-sm) var(--spacing-md);z-index:9999;transition:top var(--transition-fast);text-decoration:none;font-weight:700;border-radius:0 0 var(--radius-md) var(--radius-md)}.skip-link:focus{top:0}:focus-visible{outline:3px solid var(--primary-light);outline-offset:2px;border-radius:var(--radius-sm)}.card:focus-visible{outline-offset:4px}@media (prefers-reduced-motion:reduce){*,::after,::before{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important;transition-duration:0s!important;transition-delay:0s!important}}body.theme-neon{--primary:#00ffcc;--primary-dark:#00ccaa;--bg-primary:#0a0a1a;--bg-secondary:#12122a;--accent:#ff00ff}body.theme-neon .premium-gradient-text{background:linear-gradient(90deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}.theme-switcher:hover #themeMenu{display:block}.theme-opt.active{color:var(--primary);font-weight:700}body.modal-open{overflow:hidden}.glass-card,.premium-gradient{border:1px solid var(--border-color)}.glass-card{background:var(--bg-glass);backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.premium-gradient{background:linear-gradient(135deg,var(--secondary-dark) 0%,var(--secondary) 100%)}.premium-gradient-text{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 50%,var(--primary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700}.gold-glow{box-shadow:var(--border-glow)}.floating{animation:float 6s ease-in-out infinite}.navbar{background:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:var(--spacing-md) var(--spacing-lg);position:sticky;top:0;z-index:var(--z-dropdown);border-bottom:1px solid var(--border-color);transition:all var(--transition-base)}.navbar.scrolled{background:var(--bg-secondary);padding:var(--spacing-sm) var(--spacing-lg);box-shadow:var(--shadow-md)}.navbar-container{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-lg)}.navbar-brand{display:flex;align-items:center;gap:var(--spacing-md);cursor:pointer;transition:transform var(--transition-base)}.navbar-brand:hover{transform:scale(1.05)}.brand-icon,.brand-title{font-weight:700;background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%)}.brand-icon{width:32px;height:32px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:#fff}.brand-title{font-family:var(--font-display);font-size:20px;letter-spacing:1px;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.brand-subtitle{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--text-soft);margin-top:-4px}.navbar-nav{display:flex;gap:var(--spacing-lg);align-items:center}.nav-link{background:0 0;border:0;color:var(--text-secondary);cursor:pointer;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-base);font-size:14px;font-weight:500}.action-btn:hover,.nav-link:hover{background-color:var(--bg-hover);color:var(--primary)}.nav-link:hover{transform:translateY(-2px)}.action-btn,.nav-link,.navbar-actions{display:flex;align-items:center}.navbar-actions{gap:var(--spacing-md)}.action-btn{background:0 0;border:0;width:36px;height:36px;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;justify-content:center;transition:all var(--transition-base);font-size:18px}.action-btn:hover{transform:scale(1.1)}.action-btn,.badge-btn{position:relative}.badge{position:absolute;top:-8px;right:-8px;background:var(--primary);color:#fff;width:20px;height:20px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}.hero{position:relative;height:60vh;min-height:500px;overflow:hidden;margin-bottom:var(--spacing-2xl)}.hero-background,.hero-overlay{position:absolute;top:0;left:0;width:100%;height:100%}.hero-background{background-size:cover;background-position:center;background-repeat:no-repeat;filter:brightness(.6);transition:all var(--transition-slow)}.hero-overlay{background:linear-gradient(135deg,rgba(20,20,20,.9)0,rgba(20,20,20,.5) 50%,transparent 100%);z-index:2}.hero-container{position:relative;height:100%;z-index:3;display:flex;align-items:center;max-width:1400px;margin:0 auto;padding:var(--spacing-lg)}.hero-content{max-width:600px;animation:slideIn .8s ease-out}.hero-badge,.hero-title{font-weight:700;margin-bottom:var(--spacing-md)}.hero-badge{display:inline-block;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-full);font-size:12px;text-transform:uppercase;letter-spacing:1px}.hero-title{font-family:var(--font-display);font-size:clamp(32px,5vw,56px);line-height:1.2;text-shadow:0 4px 12px rgba(0,0,0,.5)}.hero-description,.hero-meta{margin-bottom:var(--spacing-lg)}.hero-description{font-size:18px;color:var(--text-secondary);line-height:1.6}.hero-meta{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.meta-item{background-color:rgba(229,9,20,.2);color:var(--text-secondary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-size:14px;border:1px solid var(--border-color);transition:all var(--transition-base)}.meta-item:hover{background-color:var(--primary);color:#fff;border-color:var(--primary)}.hero-actions{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.btn{padding:12px 28px;border:0;border-radius:var(--radius-md);font-size:15px;font-weight:600;cursor:pointer;transition:all var(--transition-base);display:inline-flex;align-items:center;gap:var(--spacing-sm);text-transform:uppercase;letter-spacing:.5px}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;box-shadow:var(--shadow-md)}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);background:linear-gradient(135deg,var(--primary-dark),var(--primary))}.btn-primary:active{transform:translateY(0)}.btn-secondary{background-color:rgba(255,255,255,.15);color:#fff;border:2px solid #fff;backdrop-filter:blur(10px)}.btn-secondary:hover{background-color:rgba(255,255,255,.25);transform:translateY(-2px)}.btn-lg{padding:16px 32px;font-size:16px}.hero-thumbnail{flex:1;display:none}@media (min-width:1024px){.hero-thumbnail{display:block}}.search-section{background-color:var(--bg-secondary);padding:var(--spacing-xl) var(--spacing-lg);margin:var(--spacing-2xl)0;border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color)}.container{max-width:1400px;margin:0 auto}.search-wrapper{margin-bottom:var(--spacing-lg)}.search-input-group{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:var(--spacing-md);color:var(--text-soft);pointer-events:none}.search-input{width:100%;padding:12px var(--spacing-md) 12px 40px;background-color:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);font-size:15px;transition:all var(--transition-base)}.search-input:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px rgba(229,9,20,.1)}.search-input::placeholder{color:var(--text-muted)}.search-kbd-hint{position:absolute;right:var(--spacing-md);background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:2px 6px;font-size:12px;color:var(--text-soft);pointer-events:none;transition:opacity var(--transition-fast),transform var(--transition-fast);font-family:var(--font-sans);box-shadow:inset 0-1px 0 rgba(0,0,0,.5)}.search-input:focus+.search-kbd-hint,.search-input:not(:placeholder-shown)+.search-kbd-hint{opacity:0;transform:scale(.8)}.search-clear{position:absolute;right:var(--spacing-md);background:0 0;border:0;color:var(--text-soft);cursor:pointer;font-size:18px;transition:color var(--transition-base)}.search-clear:hover{color:var(--primary)}.search-dropdown{position:absolute;top:100%;left:0;right:0;background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-top:none;border-radius:0 0 var(--radius-md) var(--radius-md);max-height:400px;overflow-y:auto;z-index:var(--z-dropdown);display:none}.filter-wrapper,.suggestion-item{display:flex;align-items:center;gap:var(--spacing-md)}.suggestion-item{padding:var(--spacing-md);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-base);border-bottom:1px solid var(--border-color)}.suggestion-item.active,.suggestion-item:hover{background-color:var(--bg-hover);color:var(--primary);padding-left:var(--spacing-lg)}.filter-wrapper{flex-wrap:wrap}.filter-label{font-size:14px;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:.5px}.filter-tags{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.chip,.filter-tag{padding:var(--spacing-sm) var(--spacing-md);background-color:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius-full);cursor:pointer;font-size:13px;font-weight:500;transition:all var(--transition-base)}.chip:hover,.filter-tag:hover{border-color:var(--primary);color:var(--primary)}.chip.active,.filter-tag.active{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border-color:var(--primary)}.stats-section{padding:var(--spacing-2xl) var(--spacing-lg)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-lg)}.stat-card,.stat-icon{display:flex;align-items:center}.stat-card{background:linear-gradient(135deg,var(--bg-tertiary),var(--bg-secondary));padding:var(--spacing-lg);border-radius:var(--radius-lg);border:1px solid var(--border-color);gap:var(--spacing-lg);transition:all var(--transition-base);cursor:pointer}.stat-card:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:var(--shadow-md)}.stat-icon{width:56px;height:56px;background:linear-gradient(135deg,var(--primary),var(--accent));border-radius:var(--radius-md);justify-content:center;color:#fff;font-size:24px;flex-shrink:0}.stat-content{flex:1}.stat-label{color:var(--text-soft);font-size:13px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--spacing-sm)}.stat-value{font-size:28px;font-weight:700;color:var(--text-primary)}.episodes-section{padding:var(--spacing-2xl) var(--spacing-lg)}.section-header{margin-bottom:var(--spacing-2xl)}.section-title{font-family:var(--font-display);font-size:clamp(28px,4vw,40px);font-weight:700;margin-bottom:var(--spacing-md)}.section-subtitle{color:var(--text-soft);font-size:14px}.episodes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--spacing-lg)}.card{background-color:var(--bg-tertiary);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all var(--transition-base),outline-color var(--transition-base);border:1px solid var(--border-color);display:flex;flex-direction:column;height:100%;outline:2px solid transparent;outline-offset:3px}.card.animate-in{animation:fadeInUp 600ms cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--index, 0)*80ms)}.card:focus-visible,.card:hover{transform:scale(1.02) translateY(-8px);border-color:var(--primary);box-shadow:0 0 24px rgba(230,185,128,.15),var(--shadow-lg)}.card:focus-visible{outline-color:var(--primary)}.card-thumb-wrapper{position:relative;overflow:hidden;aspect-ratio:16/9;background:linear-gradient(135deg,var(--bg-secondary),var(--bg-tertiary))}.card-thumb-wrapper img{width:100%;height:100%;object-fit:cover;transition:all var(--transition-base)}.card:hover .card-thumb-wrapper img{transform:scale(1.05);filter:brightness(.8)}.card-thumb-overlay,.play-icon{display:flex;align-items:center;justify-content:center;transition:all var(--transition-base)}.card-thumb-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:0 0;opacity:0}.card:hover .card-thumb-overlay{background:rgba(0,0,0,.4);opacity:1}.play-icon{width:50px;height:50px;background:linear-gradient(135deg,var(--primary),var(--primary-light));border-radius:var(--radius-full);color:#fff;font-size:20px}.duration-badge{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);background-color:rgba(0,0,0,.8);color:#fff;padding:4px 8px;border-radius:var(--radius-sm);font-size:12px;font-weight:600}.progress-bar-container{position:absolute;bottom:0;left:0;width:100%;height:3px;background-color:rgba(255,255,255,.2)}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));transition:width .3s ease}.watch-later-btn{position:absolute;top:var(--spacing-md);right:var(--spacing-md);width:40px;height:40px;background:rgba(0,0,0,.6);border:2px solid #fff;border-radius:var(--radius-md);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-base);font-size:18px;backdrop-filter:blur(5px)}.card:hover .play-icon,.watch-later-btn:hover{transform:scale(1.1)}.watch-later-btn.active,.watch-later-btn:hover{background:var(--primary);border-color:var(--primary)}.card-copy{padding:var(--spacing-md);flex:1;display:flex;flex-direction:column}.card-title{font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-sm);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card:hover .card-title,.footer-section ul li a:hover{color:var(--primary)}.card-meta{display:flex;gap:var(--spacing-sm);align-items:center;font-size:12px;color:var(--text-soft);margin-top:auto}.card-tag{background-color:rgba(229,9,20,.2);color:var(--primary);padding:2px 8px;border-radius:var(--radius-sm);font-weight:500}.modal,.video-player iframe{top:0;left:0;width:100%;height:100%}.modal{position:fixed;background-color:rgba(0,0,0,.95);display:none;flex-direction:column;z-index:var(--z-modal);overflow-y:auto;backdrop-filter:blur(5px)}.modal-content{position:relative;background-color:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-color);border-radius:var(--radius-lg);max-width:900px;width:90%;margin:var(--spacing-lg) auto;overflow:hidden;animation:slideIn .3s ease-out}.modal-close{position:absolute;top:var(--spacing-md);right:var(--spacing-md);width:40px;height:40px;background:rgba(0,0,0,.6);border:0;border-radius:var(--radius-md);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10;transition:all var(--transition-base);font-size:24px}.modal-close:hover{background:var(--primary);transform:scale(1.1)}.modal-header{padding:var(--spacing-lg);border-bottom:1px solid var(--border-color)}.modal-title{font-size:24px;font-weight:700}.modal-body{padding:var(--spacing-lg)}.video-player{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:var(--radius-md);background:#000;margin-bottom:var(--spacing-lg)}.video-player iframe{position:absolute}.modal-actions{display:flex;gap:var(--spacing-md);flex-wrap:wrap;margin-top:var(--spacing-lg)}.modal-action-btn{flex:1;min-width:120px;padding:12px var(--spacing-md);background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);transition:all var(--transition-base);font-weight:600}.modal-action-btn:hover{background-color:var(--primary);border-color:var(--primary);color:#fff}.panel-header,.side-panel{top:0;background-color:var(--bg-secondary)}.side-panel{position:fixed;right:-350px;width:350px;height:100vh;z-index:var(--z-modal);transition:right var(--transition-base);box-shadow:var(--shadow-lg);overflow-y:auto}.side-panel[aria-hidden=false]{right:0}.panel-header{padding:var(--spacing-lg);border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;position:sticky;z-index:10}.panel-header h2{font-size:20px;font-weight:700}.panel-close{background:0 0;border:0;color:var(--text-primary);cursor:pointer;font-size:24px;transition:all var(--transition-base)}.panel-close:hover{color:var(--primary);transform:scale(1.1)}.panel-content{padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md)}.empty-state{padding:var(--spacing-2xl) var(--spacing-lg);text-align:center;color:var(--text-soft)}#toast-container,.loading-state{display:flex;flex-direction:column}.loading-state{align-items:center;justify-content:center;padding:var(--spacing-2xl) var(--spacing-lg);gap:var(--spacing-lg)}.spinner{width:50px;height:50px;border-radius:var(--radius-full);border:3px solid var(--border-color);border-top-color:var(--primary);animation:spin .8s linear infinite}.error-state{text-align:center;padding:var(--spacing-2xl) var(--spacing-lg)}.error-icon{font-size:48px;margin-bottom:var(--spacing-md);color:var(--primary)}.empty-state-card i,.error-state h3{font-size:20px;margin-bottom:var(--spacing-md)}.error-state p,.footer-section h4{color:var(--text-soft);margin-bottom:var(--spacing-lg)}.skeleton-card{border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-secondary);padding:1rem}.skeleton{background:linear-gradient(90deg,var(--bg-tertiary) 0%,var(--bg-hover) 50%,var(--bg-tertiary) 100%);background-size:200% 100%;animation:shimmer 2s infinite;border-radius:4px}.skeleton-thumb{width:100%;height:180px;margin-bottom:12px}.skeleton-title{width:90%;height:24px;margin-bottom:8px}.skeleton-meta{width:40%;height:16px}#toast-container{position:fixed;bottom:2rem;right:2rem;z-index:10000;gap:.5rem}.toast{padding:.75rem 1.25rem;border-radius:8px;background:var(--bg-tertiary);border-left:4px solid var(--primary);display:flex;align-items:center;gap:.75rem;animation:toast-in .3s ease-out forwards;min-width:250px}.toast.success{border-left-color:var(--accent-green)}.toast.warning{border-left-color:var(--accent-orange)}.toast.info{border-left-color:var(--accent-blue)}.empty-state-card{text-align:center;padding:var(--spacing-2xl) var(--spacing-lg);color:var(--text-soft)}.empty-state-card i{font-size:48px;opacity:.5}.social-links a,.toast{border-radius:var(--radius-md)}.toast{position:fixed;bottom:-100px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;padding:16px 24px;z-index:var(--z-toast);transition:bottom var(--transition-base);box-shadow:var(--shadow-lg);max-width:90%}.toast.show{bottom:24px}.footer{background:var(--bg-secondary);border-top:1px solid var(--border-color);padding:var(--spacing-2xl)0 var(--spacing-lg);margin-top:var(--spacing-2xl)}.footer-content{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--spacing-2xl);margin-bottom:var(--spacing-2xl)}@media (max-width:992px){.footer-content{grid-template-columns:1fr 1fr}}@media (max-width:576px){.footer-content{grid-template-columns:1fr}}.footer-section h4{color:var(--text-primary);font-family:var(--font-display);font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em}.footer-section p{color:var(--text-soft);font-size:.9rem;line-height:1.6;max-width:300px}.footer-section ul{list-style:none;padding:0}.footer-section ul li{margin-bottom:var(--spacing-sm)}.footer-section ul li a{color:var(--text-soft);text-decoration:none;font-size:.9rem;transition:color var(--transition-fast)}.social-links{display:flex;gap:var(--spacing-md)}.social-links a{width:36px;height:36px;background:var(--bg-tertiary);border:1px solid var(--border-color);display:flex;align-items:center;justify-content:center;color:var(--text-soft);transition:all var(--transition-fast)}.social-links a:hover{background-color:var(--primary);transform:translateY(-4px)}.footer-bottom{text-align:center;padding-top:var(--spacing-lg);border-top:1px solid var(--border-color);color:var(--text-soft);font-size:13px}@media (max-width:768px){.navbar-container,.navbar-nav{gap:var(--spacing-md)}.hero-container{padding:var(--spacing-md)}.hero-title{font-size:28px}.episodes-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--spacing-md)}.side-panel{width:100%;right:-100%}.search-section{padding:var(--spacing-lg)}.stats-grid{grid-template-columns:1fr}.filter-wrapper{flex-direction:column;align-items:flex-start}}@media (max-width:480px){.container{padding:0}.episodes-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:var(--spacing-sm)}.hero-title{font-size:20px}.hero-actions{flex-direction:column}.btn,.btn-lg{width:100%;justify-content:center}.section-title{font-size:22px}.modal-content{width:95%;margin:var(--spacing-md) auto}}.hide{display:none!important}.show{display:block!important}.text-center{text-align:center}.mt-1{margin-top:var(--spacing-sm)}.mt-2{margin-top:var(--spacing-md)}.mt-3{margin-top:var(--spacing-lg)}.mb-1{margin-bottom:var(--spacing-sm)}.mb-2{margin-bottom:var(--spacing-md)}.mb-3{margin-bottom:var(--spacing-lg)}.p-1{padding:var(--spacing-sm)}.p-2{padding:var(--spacing-md)}.p-3{padding:var(--spacing-lg)}mark{background-color:rgba(255,215,0,.3);color:var(--accent);padding:2px 4px;border-radius:3px}.scroll-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border:0;border-radius:var(--radius-full);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;z-index:99;opacity:0;visibility:hidden;transition:all var(--transition-base);box-shadow:var(--shadow-lg)}.scroll-to-top:hover{transform:translateY(-5px);box-shadow:0 8px 15px rgba(0,0,0,.3)}.scroll-to-top.show{opacity:1;visibility:visible}.menu-toggle{display:none;background:0 0;border:0;cursor:pointer;padding:var(--spacing-sm);flex-direction:column;gap:5px}.menu-toggle span{display:block;width:25px;height:2px;background-color:var(--text-primary);transition:var(--transition-base)}@media (max-width:768px){.menu-toggle,body.mobile-nav-active .navbar-nav{display:flex}.navbar-nav{display:none;position:absolute;top:100%;left:0;width:100%;background:var(--bg-secondary);flex-direction:column;padding:var(--spacing-lg);border-bottom:1px solid var(--border-color)}}.search-section{display:none;transition:var(--transition-base)}.search-section.active{display:block;animation:fadeIn .3s ease-out}.copy-feedback{position:absolute;top:-30px;left:50%;transform:translateX(-50%) translateY(10px);background:var(--primary);color:var(--secondary-dark);padding:4px 8px;border-radius:var(--radius-sm);font-size:10px;font-weight:700;pointer-events:none;opacity:0;transition:all var(--transition-fast);z-index:100;white-space:nowrap}.copy-feedback.show{opacity:1;transform:translateX(-50%) translateY(0)}.copy-feedback::after{content:"";position:absolute;top:100%;left:50%;margin-left:-4px;border-width:4px;border-style:solid;border-color:var(--primary) transparent transparent transparent}
\ No newline at end of file
+/* ============================================
+ * YT STUDIO - Professional Design System
+ * Netflix/YouTube/Amazon-inspired Colors
+ * ============================================ */
+
+:root {
+  /* Primary Colors - Premium Studio */
+  --primary: #e6b980;
+  /* Deep Gold / Bronze */
+  --primary-dark: #b8860b;
+  /* Dark Gold */
+  --primary-light: #f5d3ab;
+  /* Light Gold / Champagne */
+
+  /* Secondary Colors - Obsidian */
+  --secondary: #1a1410;
+  /* Warm Black */
+  --secondary-dark: #0f0b08;
+  /* Obsidian */
+  --secondary-light: #251e18;
+  /* Dark Coffee */
+
+  /* Accent Colors - Crimson & Emerald */
+  --accent: #8e1b1b;
+  /* Crimson Red */
+  --accent-gold: #ffd700;
+  /* Pure Gold */
+  --accent-green: #2d5a27;
+  /* Deep Forest Green */
+  --accent-blue: #1b3b5f;
+  /* Midnight Blue */
+
+  /* Neutral Colors */
+  --text-primary: #f5f1e8;
+  /* Parchment White */
+  --text-secondary: #d1c7b7;
+  /* Soft Beige */
+  --text-soft: #a89f91;
+  /* Muted Stone */
+  --text-muted: #7a7267;
+  /* Antique Gray */
+
+  /* Background Colors - Layered */
+  --bg-primary: #0a0806;
+  /* Deepest background */
+  --bg-secondary: #120e0b;
+  /* Secondary layer */
+  --bg-tertiary: #1c1712;
+  /* Card / Panel layer */
+  --bg-glass: rgba(10, 8, 6, 0.8);
+  /* Glassmorphism base */
+
+  /* Border & Shadows - Premium */
+  --border-color: rgba(212, 165, 116, 0.15);
+  /* Golden tint borders */
+  --border-glow: 0 0 10px rgba(212, 165, 116, 0.2);
+  --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.5);
+  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.7);
+  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.9);
+
+  /* Spacing */
+  --spacing-xs: 4px;
+  --spacing-sm: 8px;
+  --spacing-md: 16px;
+  --spacing-lg: 24px;
+  --spacing-xl: 32px;
+  --spacing-2xl: 48px;
+
+  /* Border Radius - Refined */
+  --radius-sm: 4px;
+  --radius-md: 10px;
+  --radius-lg: 16px;
+  --radius-xl: 24px;
+  --radius-full: 9999px;
+
+  /* Typography */
+  --font-sans: 'Inter', -apple-system, system-ui, sans-serif;
+  --font-serif: 'Merriweather', serif;
+  --font-display: 'Cinzel', serif;
+
+  /* Transitions */
+  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  --transition-base: 300ms cubic-bezier(0.4, 0, 0.2, 1);
+  --transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+/* Light Mode */
+body.light-mode {
+  --primary: #e50914;
+  --secondary: #ffffff;
+  --secondary-dark: #f5f5f5;
+  --secondary-light: #eeeeee;
+
+  --text-primary: #1a1a1a;
+  --text-secondary: #404040;
+  --text-soft: #666666;
+  --text-muted: #999999;
+
+  --bg-primary: #ffffff;
+  --bg-secondary: #f5f5f5;
+  --bg-tertiary: #eeeeee;
+  --bg-hover: #e0e0e0;
+
+  --border-color: #d0d0d0;
+}
+
+/* ============================================
+ * BASE STYLES
+ * ============================================ */
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+html {
+  scroll-behavior: smooth;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+body {
+  font-family: var(--font-sans);
+  background-color: var(--bg-primary);
+  color: var(--text-primary);
+  line-height: 1.6;
+  transition: background-color var(--transition-base), color var(--transition-base);
+  overflow-x: hidden;
+}
+
+/* Accessibility: Skip Link */
+.skip-link {
+  position: absolute;
+  top: -100px;
+  left: var(--spacing-md);
+  background: var(--primary);
+  color: white;
+  padding: var(--spacing-sm) var(--spacing-md);
+  z-index: 9999;
+  transition: top var(--transition-fast);
+  text-decoration: none;
+  font-weight: 700;
+  border-radius: 0 0 var(--radius-md) var(--radius-md);
+}
+
+.skip-link:focus {
+  top: 0;
+}
+
+/* Accessibility: Enhanced Focus States */
+:focus-visible {
+  outline: 3px solid var(--primary-light);
+  outline-offset: 2px;
+  border-radius: var(--radius-sm);
+}
+
+.card:focus-visible {
+  outline-offset: 4px;
+}
+
+/* Accessibility: Reduced Motion */
+@media (prefers-reduced-motion: reduce) {
+
+  *,
+  ::before,
+  ::after {
+    animation-delay: -1ms !important;
+    animation-duration: 1ms !important;
+    animation-iteration-count: 1 !important;
+    background-attachment: initial !important;
+    scroll-behavior: auto !important;
+    transition-duration: 0s !important;
+    transition-delay: 0s !important;
+  }
+}
+
+  /* Theme Engine & Presets */
+
+  body.theme-neon {
+    --primary: #00ffcc;
+    --primary-dark: #00ccaa;
+    --bg-primary: #0a0a1a;
+    --bg-secondary: #12122a;
+    --accent: #ff00ff;
+  }
+
+  body.theme-neon .premium-gradient-text {
+    background: linear-gradient(90deg, var(--primary), var(--accent));
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+  }
+
+
+  .theme-opt.active {
+    color: var(--primary);
+    font-weight: bold;
+  }
+
+  body.modal-open {
+    overflow: hidden;
+  }
+
+  /* ============================================
+ * GLASSMORPHISM & PREMIUM UTILITIES
+ * ============================================ */
+
+  .glass-card {
+    background: var(--bg-glass);
+    backdrop-filter: blur(12px) saturate(180%);
+    -webkit-backdrop-filter: blur(12px) saturate(180%);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-lg);
+    box-shadow: var(--shadow-md);
+  }
+
+  .premium-gradient {
+    background: linear-gradient(135deg, var(--secondary-dark) 0%, var(--secondary) 100%);
+    border: 1px solid var(--border-color);
+  }
+
+  .premium-gradient-text {
+    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 50%, var(--primary) 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    font-weight: 700;
+  }
+
+  .gold-glow {
+    box-shadow: var(--border-glow);
+  }
+
+  .floating {
+    animation: float 6s ease-in-out infinite;
+  }
+
+  /* ============================================
+ * ANIMATIONS
+ * ============================================ */
+
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+      transform: translateY(10px);
+    }
+
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  @keyframes slideIn {
+    from {
+      opacity: 0;
+      transform: translateX(-20px);
+    }
+
+    to {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+
+  @keyframes pulse {
+
+    0%,
+    100% {
+      opacity: 1;
+    }
+
+    50% {
+      opacity: 0.5;
+    }
+  }
+
+  @keyframes shimmer {
+    0% {
+      background-position: -1000px 0;
+    }
+
+    100% {
+      background-position: 1000px 0;
+    }
+  }
+
+  @keyframes float {
+
+    0%,
+    100% {
+      transform: translateY(0px);
+    }
+
+    50% {
+      transform: translateY(-20px);
+    }
+  }
+
+  /* ============================================
+ * NAVBAR / HEADER
+ * ============================================ */
+
+  .navbar {
+    background: var(--bg-glass);
+    backdrop-filter: blur(12px);
+    -webkit-backdrop-filter: blur(12px);
+    padding: var(--spacing-md) var(--spacing-lg);
+    position: sticky;
+    top: 0;
+    z-index: var(--z-dropdown);
+    border-bottom: 1px solid var(--border-color);
+    transition: all var(--transition-base);
+  }
+
+  .navbar.scrolled {
+    background: var(--bg-secondary);
+    padding: var(--spacing-sm) var(--spacing-lg);
+    box-shadow: var(--shadow-md);
+  }
+
+  .navbar-container {
+    max-width: 1400px;
+    margin: 0 auto;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--spacing-lg);
+  }
+
+  .navbar-brand {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+    cursor: pointer;
+    transition: transform var(--transition-base);
+  }
+
+  .navbar-brand:hover {
+    transform: scale(1.05);
+  }
+
+  .brand-icon {
+    width: 32px;
+    height: 32px;
+    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
+    border-radius: var(--radius-md);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    font-weight: bold;
+  }
+
+  .brand-title {
+    font-family: var(--font-display);
+    font-size: 20px;
+    font-weight: 700;
+    letter-spacing: 1px;
+    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+  }
+
+  .brand-subtitle {
+    font-size: 11px;
+    letter-spacing: 2px;
+    text-transform: uppercase;
+    color: var(--text-soft);
+    margin-top: -4px;
+  }
+
+  .navbar-nav {
+    display: flex;
+    gap: var(--spacing-lg);
+    align-items: center;
+  }
+
+  .nav-link {
+    background: none;
+    border: none;
+    color: var(--text-secondary);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-sm);
+    padding: var(--spacing-sm) var(--spacing-md);
+    border-radius: var(--radius-md);
+    transition: all var(--transition-base);
+    font-size: 14px;
+    font-weight: 500;
+  }
+
+  .nav-link:hover {
+    color: var(--primary);
+    background-color: var(--bg-hover);
+    transform: translateY(-2px);
+  }
+
+  .navbar-actions {
+    display: flex;
+    gap: var(--spacing-md);
+    align-items: center;
+  }
+
+  .action-btn {
+    background: none;
+    border: none;
+    width: 36px;
+    height: 36px;
+    border-radius: var(--radius-md);
+    color: var(--text-secondary);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all var(--transition-base);
+    position: relative;
+    font-size: 18px;
+  }
+
+  .action-btn:hover {
+    background-color: var(--bg-hover);
+    color: var(--primary);
+    transform: scale(1.1);
+  }
+
+  .badge-btn {
+    position: relative;
+  }
+
+  .badge {
+    position: absolute;
+    top: -8px;
+    right: -8px;
+    background: var(--primary);
+    color: white;
+    width: 20px;
+    height: 20px;
+    border-radius: var(--radius-full);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 11px;
+    font-weight: 700;
+  }
+
+  /* ============================================
+ * HERO SECTION
+ * ============================================ */
+
+  .hero {
+    position: relative;
+    height: 60vh;
+    min-height: 500px;
+    overflow: hidden;
+    margin-bottom: var(--spacing-2xl);
+  }
+
+  .hero-background {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-size: cover;
+    background-position: center;
+    background-repeat: no-repeat;
+    filter: brightness(0.6);
+    transition: all var(--transition-slow);
+  }
+
+  .hero-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(135deg,
+        rgba(20, 20, 20, 0.9) 0%,
+        rgba(20, 20, 20, 0.5) 50%,
+        transparent 100%);
+    z-index: 2;
+  }
+
+  .hero-container {
+    position: relative;
+    height: 100%;
+    z-index: 3;
+    display: flex;
+    align-items: center;
+    max-width: 1400px;
+    margin: 0 auto;
+    padding: var(--spacing-lg);
+  }
+
+  .hero-content {
+    max-width: 600px;
+    animation: slideIn 0.8s ease-out;
+  }
+
+  .hero-badge {
+    display: inline-block;
+    background: linear-gradient(135deg, var(--primary), var(--accent));
+    color: white;
+    padding: var(--spacing-sm) var(--spacing-md);
+    border-radius: var(--radius-full);
+    font-size: 12px;
+    font-weight: 700;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+    margin-bottom: var(--spacing-md);
+  }
+
+  .hero-title {
+    font-family: var(--font-display);
+    font-size: clamp(32px, 5vw, 56px);
+    font-weight: 700;
+    line-height: 1.2;
+    margin-bottom: var(--spacing-md);
+    text-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
+  }
+
+  .hero-description {
+    font-size: 18px;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-lg);
+    line-height: 1.6;
+  }
+
+  .hero-meta {
+    display: flex;
+    gap: var(--spacing-md);
+    margin-bottom: var(--spacing-lg);
+    flex-wrap: wrap;
+  }
+
+  .meta-item {
+    background-color: rgba(229, 9, 20, 0.2);
+    color: var(--text-secondary);
+    padding: var(--spacing-sm) var(--spacing-md);
+    border-radius: var(--radius-md);
+    font-size: 14px;
+    border: 1px solid var(--border-color);
+    transition: all var(--transition-base);
+  }
+
+  .meta-item:hover {
+    background-color: var(--primary);
+    color: white;
+    border-color: var(--primary);
+  }
+
+  .hero-actions {
+    display: flex;
+    gap: var(--spacing-md);
+    flex-wrap: wrap;
+  }
+
+  .btn {
+    padding: 12px 28px;
+    border: none;
+    border-radius: var(--radius-md);
+    font-size: 15px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all var(--transition-base);
+    display: inline-flex;
+    align-items: center;
+    gap: var(--spacing-sm);
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+  }
+
+  .btn-primary {
+    background: linear-gradient(135deg, var(--primary), var(--primary-light));
+    color: white;
+    box-shadow: var(--shadow-md);
+  }
+
+  .btn-primary:hover {
+    transform: translateY(-2px);
+    box-shadow: var(--shadow-lg);
+    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
+  }
+
+  .btn-primary:active {
+    transform: translateY(0);
+  }
+
+  .btn-secondary {
+    background-color: rgba(255, 255, 255, 0.15);
+    color: white;
+    border: 2px solid white;
+    backdrop-filter: blur(10px);
+  }
+
+  .btn-secondary:hover {
+    background-color: rgba(255, 255, 255, 0.25);
+    transform: translateY(-2px);
+  }
+
+  .btn-lg {
+    padding: 16px 32px;
+    font-size: 16px;
+  }
+
+  .hero-thumbnail {
+    flex: 1;
+    display: none;
+  }
+
+  @media (min-width: 1024px) {
+    .hero-thumbnail {
+      display: block;
+    }
+  }
+
+  /* ============================================
+ * SEARCH & FILTER SECTION
+ * ============================================ */
+
+  .search-section {
+    background-color: var(--bg-secondary);
+    padding: var(--spacing-xl) var(--spacing-lg);
+    margin: var(--spacing-2xl) 0;
+    border-top: 1px solid var(--border-color);
+    border-bottom: 1px solid var(--border-color);
+  }
+
+  .container {
+    max-width: 1400px;
+    margin: 0 auto;
+  }
+
+  .search-wrapper {
+    margin-bottom: var(--spacing-lg);
+  }
+
+  .search-input-group {
+    position: relative;
+    display: flex;
+    align-items: center;
+  }
+
+  .search-icon {
+    position: absolute;
+    left: var(--spacing-md);
+    color: var(--text-soft);
+    pointer-events: none;
+  }
+
+  .search-input {
+    width: 100%;
+    padding: 12px var(--spacing-md) 12px 40px;
+    background-color: var(--bg-tertiary);
+    border: 2px solid var(--border-color);
+    border-radius: var(--radius-md);
+    color: var(--text-primary);
+    font-size: 15px;
+    transition: all var(--transition-base);
+  }
+
+  .search-input:focus {
+    outline: none;
+    border-color: var(--primary);
+    box-shadow: 0 0 0 3px rgba(229, 9, 20, 0.1);
+  }
+
+  .search-input::placeholder {
+    color: var(--text-muted);
+  }
+
+  .search-kbd-hint {
+    position: absolute;
+    right: var(--spacing-md);
+    background: var(--bg-secondary);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-sm);
+    padding: 2px 6px;
+    font-size: 12px;
+    color: var(--text-soft);
+    pointer-events: none;
+    transition: opacity var(--transition-fast), transform var(--transition-fast);
+    font-family: var(--font-sans);
+    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.5);
+  }
+
+  .search-input:focus + .search-kbd-hint,
+  .search-input:not(:placeholder-shown) + .search-kbd-hint {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+
+  .search-clear {
+    position: absolute;
+    right: var(--spacing-md);
+    background: none;
+    border: none;
+    color: var(--text-soft);
+    cursor: pointer;
+    font-size: 18px;
+    transition: color var(--transition-base);
+  }
+
+  .search-clear:hover {
+    color: var(--primary);
+  }
+
+  .search-dropdown {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    right: 0;
+    background-color: var(--bg-tertiary);
+    border: 1px solid var(--border-color);
+    border-top: none;
+    border-radius: 0 0 var(--radius-md) var(--radius-md);
+    max-height: 400px;
+    overflow-y: auto;
+    z-index: var(--z-dropdown);
+    display: none;
+  }
+
+  .suggestion-item {
+    padding: var(--spacing-md);
+    color: var(--text-secondary);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+    transition: all var(--transition-base);
+    border-bottom: 1px solid var(--border-color);
+  }
+
+  .suggestion-item:hover,
+  .suggestion-item.active {
+    background-color: var(--bg-hover);
+    color: var(--primary);
+    padding-left: var(--spacing-lg);
+  }
+
+  .filter-wrapper {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+    flex-wrap: wrap;
+  }
+
+  .filter-label {
+    font-size: 14px;
+    font-weight: 600;
+    color: var(--text-soft);
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+  }
+
+  .filter-tags {
+    display: flex;
+    gap: var(--spacing-sm);
+    flex-wrap: wrap;
+  }
+
+  .filter-tag,
+  .chip {
+    padding: var(--spacing-sm) var(--spacing-md);
+    background-color: var(--bg-tertiary);
+    color: var(--text-secondary);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-full);
+    cursor: pointer;
+    font-size: 13px;
+    font-weight: 500;
+    transition: all var(--transition-base);
+  }
+
+  .filter-tag:hover,
+  .chip:hover {
+    border-color: var(--primary);
+    color: var(--primary);
+  }
+
+  .filter-tag.active,
+  .chip.active {
+    background: linear-gradient(135deg, var(--primary), var(--primary-light));
+    color: white;
+    border-color: var(--primary);
+  }
+
+  /* ============================================
+ * STATS SECTION
+ * ============================================ */
+
+  .stats-section {
+    padding: var(--spacing-2xl) var(--spacing-lg);
+  }
+
+  .stats-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+    gap: var(--spacing-lg);
+  }
+
+  .stat-card {
+    background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary));
+    padding: var(--spacing-lg);
+    border-radius: var(--radius-lg);
+    border: 1px solid var(--border-color);
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-lg);
+    transition: all var(--transition-base);
+    cursor: pointer;
+  }
+
+  .stat-card:hover {
+    border-color: var(--primary);
+    transform: translateY(-4px);
+    box-shadow: var(--shadow-md);
+  }
+
+  .stat-icon {
+    width: 56px;
+    height: 56px;
+    background: linear-gradient(135deg, var(--primary), var(--accent));
+    border-radius: var(--radius-md);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    font-size: 24px;
+    flex-shrink: 0;
+  }
+
+  .stat-content {
+    flex: 1;
+  }
+
+  .stat-label {
+    color: var(--text-soft);
+    font-size: 13px;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+    margin-bottom: var(--spacing-sm);
+  }
+
+  .stat-value {
+    font-size: 28px;
+    font-weight: 700;
+    color: var(--text-primary);
+  }
+
+  /* ============================================
+ * EPISODES SECTION
+ * ============================================ */
+
+  .episodes-section {
+    padding: var(--spacing-2xl) var(--spacing-lg);
+  }
+
+  .section-header {
+    margin-bottom: var(--spacing-2xl);
+  }
+
+  .section-title {
+    font-family: var(--font-display);
+    font-size: clamp(28px, 4vw, 40px);
+    font-weight: 700;
+    margin-bottom: var(--spacing-md);
+  }
+
+  .section-subtitle {
+    color: var(--text-soft);
+    font-size: 14px;
+  }
+
+  .episodes-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
+    gap: var(--spacing-lg);
+  }
+
+  .card {
+    background-color: var(--bg-tertiary);
+    border-radius: var(--radius-lg);
+    overflow: hidden;
+    cursor: pointer;
+    transition: all var(--transition-base);
+    border: 1px solid var(--border-color);
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+  }
+
+  .card:hover {
+    transform: translateY(-8px);
+    border-color: var(--primary);
+    box-shadow: 0 0 20px rgba(230, 185, 128, 0.2), var(--shadow-lg);
+  }
+
+  .card-thumb-wrapper {
+    position: relative;
+    overflow: hidden;
+    aspect-ratio: 16 / 9;
+    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary));
+  }
+
+  .card-thumb-wrapper img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    transition: all var(--transition-base);
+  }
+
+  .card:hover .card-thumb-wrapper img {
+    transform: scale(1.05);
+    filter: brightness(0.8);
+  }
+
+  .card-thumb-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all var(--transition-base);
+    opacity: 0;
+  }
+
+  .card:hover .card-thumb-overlay {
+    background: rgba(0, 0, 0, 0.4);
+    opacity: 1;
+  }
+
+  .play-icon {
+    width: 50px;
+    height: 50px;
+    background: linear-gradient(135deg, var(--primary), var(--primary-light));
+    border-radius: var(--radius-full);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    font-size: 20px;
+    transition: all var(--transition-base);
+  }
+
+  .card:hover .play-icon {
+    transform: scale(1.1);
+  }
+
+  .duration-badge {
+    position: absolute;
+    top: var(--spacing-sm);
+    right: var(--spacing-sm);
+    background-color: rgba(0, 0, 0, 0.8);
+    color: white;
+    padding: 4px 8px;
+    border-radius: var(--radius-sm);
+    font-size: 12px;
+    font-weight: 600;
+  }
+
+  .progress-bar-container {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 3px;
+    background-color: rgba(255, 255, 255, 0.2);
+  }
+
+  .progress-bar-fill {
+    height: 100%;
+    background: linear-gradient(90deg, var(--primary), var(--accent));
+    transition: width 0.3s ease;
+  }
+
+  .watch-later-btn {
+    position: absolute;
+    top: var(--spacing-md);
+    right: var(--spacing-md);
+    width: 40px;
+    height: 40px;
+    background: rgba(0, 0, 0, 0.6);
+    border: 2px solid white;
+    border-radius: var(--radius-md);
+    color: white;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all var(--transition-base);
+    font-size: 18px;
+    backdrop-filter: blur(5px);
+  }
+
+  .watch-later-btn:hover {
+    background: var(--primary);
+    border-color: var(--primary);
+    transform: scale(1.1);
+  }
+
+  .watch-later-btn.active {
+    background: var(--primary);
+    border-color: var(--primary);
+  }
+
+  .card-copy {
+    padding: var(--spacing-md);
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .card-title {
+    font-size: 15px;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-sm);
+    line-height: 1.4;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .card:hover .card-title {
+    color: var(--primary);
+  }
+
+  .card-meta {
+    display: flex;
+    gap: var(--spacing-sm);
+    align-items: center;
+    font-size: 12px;
+    color: var(--text-soft);
+    margin-top: auto;
+  }
+
+  .card-tag {
+    background-color: rgba(229, 9, 20, 0.2);
+    color: var(--primary);
+    padding: 2px 8px;
+    border-radius: var(--radius-sm);
+    font-weight: 500;
+  }
+
+  /* ============================================
+ * MODAL
+ * ============================================ */
+
+  .modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.95);
+    display: none;
+    flex-direction: column;
+    z-index: var(--z-modal);
+    overflow-y: auto;
+    backdrop-filter: blur(5px);
+  }
+
+  .modal-content {
+    position: relative;
+    background-color: var(--bg-glass);
+    backdrop-filter: blur(12px);
+    -webkit-backdrop-filter: blur(12px);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-lg);
+    max-width: 900px;
+    width: 90%;
+    margin: var(--spacing-lg) auto;
+    overflow: hidden;
+    animation: slideIn 0.3s ease-out;
+  }
+
+  .modal-close {
+    position: absolute;
+    top: var(--spacing-md);
+    right: var(--spacing-md);
+    width: 40px;
+    height: 40px;
+    background: rgba(0, 0, 0, 0.6);
+    border: none;
+    border-radius: var(--radius-md);
+    color: white;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 10;
+    transition: all var(--transition-base);
+    font-size: 24px;
+  }
+
+  .modal-close:hover {
+    background: var(--primary);
+    transform: scale(1.1);
+  }
+
+  .modal-header {
+    padding: var(--spacing-lg);
+    border-bottom: 1px solid var(--border-color);
+  }
+
+  .modal-title {
+    font-size: 24px;
+    font-weight: 700;
+  }
+
+  .modal-body {
+    padding: var(--spacing-lg);
+  }
+
+  .video-player {
+    position: relative;
+    width: 100%;
+    padding-bottom: 56.25%;
+    height: 0;
+    overflow: hidden;
+    border-radius: var(--radius-md);
+    background: #000;
+    margin-bottom: var(--spacing-lg);
+  }
+
+  .video-player iframe {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+  }
+
+  .modal-actions {
+    display: flex;
+    gap: var(--spacing-md);
+    flex-wrap: wrap;
+    margin-top: var(--spacing-lg);
+  }
+
+  .modal-action-btn {
+    flex: 1;
+    min-width: 120px;
+    padding: 12px var(--spacing-md);
+    background-color: var(--bg-tertiary);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-md);
+    color: var(--text-secondary);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--spacing-sm);
+    transition: all var(--transition-base);
+    font-weight: 600;
+  }
+
+  .modal-action-btn:hover {
+    background-color: var(--primary);
+    border-color: var(--primary);
+    color: white;
+  }
+
+  /* ============================================
+ * WATCH LATER PANEL
+ * ============================================ */
+
+  .side-panel {
+    position: fixed;
+    right: -350px;
+    top: 0;
+    width: 350px;
+    height: 100vh;
+    background-color: var(--bg-secondary);
+    z-index: var(--z-modal);
+    transition: right var(--transition-base);
+    box-shadow: var(--shadow-lg);
+    overflow-y: auto;
+  }
+
+  .side-panel[aria-hidden="false"] {
+    right: 0;
+  }
+
+  .panel-header {
+    padding: var(--spacing-lg);
+    border-bottom: 1px solid var(--border-color);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    position: sticky;
+    top: 0;
+    background-color: var(--bg-secondary);
+    z-index: 10;
+  }
+
+  .panel-header h2 {
+    font-size: 20px;
+    font-weight: 700;
+  }
+
+  .panel-close {
+    background: none;
+    border: none;
+    color: var(--text-primary);
+    cursor: pointer;
+    font-size: 24px;
+    transition: all var(--transition-base);
+  }
+
+  .panel-close:hover {
+    color: var(--primary);
+    transform: scale(1.1);
+  }
+
+  .panel-content {
+    padding: var(--spacing-lg);
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-md);
+  }
+
+  .empty-state {
+    padding: var(--spacing-2xl) var(--spacing-lg);
+    text-align: center;
+    color: var(--text-soft);
+  }
+
+  /* ============================================
+ * LOADING & ERROR STATES
+ * ============================================ */
+
+  .loading-state {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: var(--spacing-2xl) var(--spacing-lg);
+    gap: var(--spacing-lg);
+  }
+
+  .spinner {
+    width: 50px;
+    height: 50px;
+    border-radius: var(--radius-full);
+    border: 3px solid var(--border-color);
+    border-top-color: var(--primary);
+    animation: spin 0.8s linear infinite;
+  }
+
+  @keyframes spin {
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  .error-state {
+    text-align: center;
+    padding: var(--spacing-2xl) var(--spacing-lg);
+  }
+
+  .error-icon {
+    font-size: 48px;
+    margin-bottom: var(--spacing-md);
+    color: var(--primary);
+  }
+
+  .error-state h3 {
+    font-size: 20px;
+    margin-bottom: var(--spacing-md);
+  }
+
+  .error-state p {
+    color: var(--text-soft);
+    margin-bottom: var(--spacing-lg);
+  }
+
+  .skeleton-card {
+    border-radius: var(--radius-lg);
+    overflow: hidden;
+    background: var(--bg-secondary);
+    padding: 1rem;
+  }
+
+  .skeleton {
+    background: linear-gradient(90deg, var(--bg-tertiary) 0%, var(--bg-hover) 50%, var(--bg-tertiary) 100%);
+    background-size: 200% 100%;
+    animation: shimmer 2s infinite;
+    border-radius: 4px;
+  }
+
+  .skeleton-thumb {
+    width: 100%;
+    height: 180px;
+    margin-bottom: 12px;
+  }
+
+  .skeleton-title {
+    width: 90%;
+    height: 24px;
+    margin-bottom: 8px;
+  }
+
+  .skeleton-meta {
+    width: 40%;
+    height: 16px;
+  }
+
+  /* Toast Notifications */
+  #toast-container {
+    position: fixed;
+    bottom: 2rem;
+    right: 2rem;
+    z-index: 10000;
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+  }
+
+  .toast {
+    padding: 0.75rem 1.25rem;
+    border-radius: 8px;
+    background: var(--bg-tertiary);
+    color: white;
+    box-shadow: var(--shadow-lg);
+    border-left: 4px solid var(--primary);
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    animation: toast-in 0.3s ease-out forwards;
+    min-width: 250px;
+  }
+
+  .toast.success {
+    border-left-color: var(--accent-green);
+  }
+
+  .toast.warning {
+    border-left-color: var(--accent-orange);
+  }
+
+  .toast.info {
+    border-left-color: var(--accent-blue);
+  }
+
+  @keyframes toast-in {
+    from {
+      transform: translateX(100%);
+      opacity: 0;
+    }
+
+    to {
+      transform: translateX(0);
+      opacity: 1;
+    }
+  }
+
+  @keyframes toast-out {
+    from {
+      transform: translateX(0);
+      opacity: 1;
+    }
+
+    to {
+      transform: translateX(100%);
+      opacity: 0;
+    }
+  }
+
+  .empty-state-card {
+    text-align: center;
+    padding: var(--spacing-2xl) var(--spacing-lg);
+    color: var(--text-soft);
+  }
+
+  .empty-state-card i {
+    font-size: 48px;
+    margin-bottom: var(--spacing-md);
+    opacity: 0.5;
+  }
+
+  /* ============================================
+ * TOAST
+ * ============================================ */
+
+  .toast {
+    position: fixed;
+    bottom: -100px;
+    left: 50%;
+    transform: translateX(-50%);
+    background: linear-gradient(135deg, var(--primary), var(--accent));
+    color: white;
+    padding: 16px 24px;
+    border-radius: var(--radius-md);
+    z-index: var(--z-toast);
+    transition: bottom var(--transition-base);
+    box-shadow: var(--shadow-lg);
+    max-width: 90%;
+  }
+
+  .toast.show {
+    bottom: 24px;
+  }
+
+  /* ============================================
+   * FOOTER
+   * ============================================ */
+  .footer {
+    background: var(--bg-secondary);
+    border-top: 1px solid var(--border-color);
+    padding: var(--spacing-2xl) 0 var(--spacing-lg);
+    margin-top: var(--spacing-2xl);
+  }
+
+  .footer-content {
+    display: grid;
+    grid-template-columns: 2fr 1fr 1fr 1fr;
+    gap: var(--spacing-2xl);
+    margin-bottom: var(--spacing-2xl);
+  }
+
+  @media (max-width: 992px) {
+    .footer-content {
+      grid-template-columns: 1fr 1fr;
+    }
+  }
+
+  @media (max-width: 576px) {
+    .footer-content {
+      grid-template-columns: 1fr;
+    }
+  }
+
+  .footer-section h4 {
+    color: var(--text-primary);
+    font-family: var(--font-display);
+    font-size: 1rem;
+    font-weight: 700;
+    margin-bottom: var(--spacing-lg);
+    text-transform: uppercase;
+    letter-spacing: 0.1em;
+  }
+
+  .footer-section p {
+    color: var(--text-soft);
+    font-size: 0.9rem;
+    line-height: 1.6;
+    max-width: 300px;
+  }
+
+  .footer-section ul {
+    list-style: none;
+    padding: 0;
+  }
+
+  .footer-section ul li {
+    margin-bottom: var(--spacing-sm);
+  }
+
+  .footer-section ul li a {
+    color: var(--text-soft);
+    text-decoration: none;
+    font-size: 0.9rem;
+    transition: color var(--transition-fast);
+  }
+
+  .footer-section ul li a:hover {
+    color: var(--primary);
+  }
+
+  .social-links {
+    display: flex;
+    gap: var(--spacing-md);
+  }
+
+  .social-links a {
+    width: 36px;
+    height: 36px;
+    background: var(--bg-tertiary);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-md);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--text-soft);
+    transition: all var(--transition-fast);
+  }
+
+  .social-links a:hover {
+    background-color: var(--primary);
+    transform: translateY(-4px);
+  }
+
+  .footer-bottom {
+    text-align: center;
+    padding-top: var(--spacing-lg);
+    border-top: 1px solid var(--border-color);
+    color: var(--text-soft);
+    font-size: 13px;
+  }
+
+  /* ============================================
+ * RESPONSIVE
+ * ============================================ */
+
+  @media (max-width: 768px) {
+    .navbar-container {
+      gap: var(--spacing-md);
+    }
+
+    .navbar-nav {
+      gap: var(--spacing-md);
+    }
+
+    .hero-container {
+      padding: var(--spacing-md);
+    }
+
+    .hero-title {
+      font-size: 28px;
+    }
+
+    .episodes-grid {
+      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+      gap: var(--spacing-md);
+    }
+
+    .side-panel {
+      width: 100%;
+      right: -100%;
+    }
+
+    .search-section {
+      padding: var(--spacing-lg);
+    }
+
+    .stats-grid {
+      grid-template-columns: 1fr;
+    }
+
+    .filter-wrapper {
+      flex-direction: column;
+      align-items: flex-start;
+    }
+  }
+
+  @media (max-width: 480px) {
+    .container {
+      padding: 0;
+    }
+
+    .episodes-grid {
+      grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
+      gap: var(--spacing-sm);
+    }
+
+    .hero-title {
+      font-size: 20px;
+    }
+
+    .hero-actions {
+      flex-direction: column;
+    }
+
+    .btn,
+    .btn-lg {
+      width: 100%;
+      justify-content: center;
+    }
+
+    .section-title {
+      font-size: 22px;
+    }
+
+    .modal-content {
+      width: 95%;
+      margin: var(--spacing-md) auto;
+    }
+  }
+
+  /* ============================================
+ * UTILITY CLASSES
+ * ============================================ */
+
+  .hide {
+    display: none !important;
+  }
+
+  .show {
+    display: block !important;
+  }
+
+  .text-center {
+    text-align: center;
+  }
+
+  .mt-1 {
+    margin-top: var(--spacing-sm);
+  }
+
+  .mt-2 {
+    margin-top: var(--spacing-md);
+  }
+
+  .mt-3 {
+    margin-top: var(--spacing-lg);
+  }
+
+  .mb-1 {
+    margin-bottom: var(--spacing-sm);
+  }
+
+  .mb-2 {
+    margin-bottom: var(--spacing-md);
+  }
+
+  .mb-3 {
+    margin-bottom: var(--spacing-lg);
+  }
+
+  .p-1 {
+    padding: var(--spacing-sm);
+  }
+
+  .p-2 {
+    padding: var(--spacing-md);
+  }
+
+  .p-3 {
+    padding: var(--spacing-lg);
+  }
+
+  mark {
+    background-color: rgba(255, 215, 0, 0.3);
+    color: var(--accent);
+    padding: 2px 4px;
+    border-radius: 3px;
+  }
+
+  /* Scroll to Top */
+  .scroll-to-top {
+    position: fixed;
+    bottom: 30px;
+    right: 30px;
+    width: 50px;
+    height: 50px;
+    background: linear-gradient(135deg, var(--primary), var(--accent));
+    color: white;
+    border: none;
+    border-radius: var(--radius-full);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 20px;
+    z-index: 99;
+    opacity: 0;
+    visibility: hidden;
+    transition: all var(--transition-base);
+    box-shadow: var(--shadow-lg);
+  }
+
+  .scroll-to-top:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
+  }
+
+  .scroll-to-top.show {
+    opacity: 1;
+    visibility: visible;
+  }
+/* Mobile Menu Enhancements */
+.menu-toggle {
+  display: none;
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: var(--spacing-sm);
+  flex-direction: column;
+  gap: 5px;
+}
+
+.menu-toggle span {
+  display: block;
+  width: 25px;
+  height: 2px;
+  background-color: var(--text-primary);
+  transition: var(--transition-base);
+}
+
+@media (max-width: 768px) {
+  .menu-toggle {
+    display: flex;
+  }
+
+  .navbar-nav {
+    display: none;
+    position: absolute;
+    top: 100%;
+    left: 0;
+    width: 100%;
+    background: var(--bg-secondary);
+    flex-direction: column;
+    padding: var(--spacing-lg);
+    border-bottom: 1px solid var(--border-color);
+  }
+
+  body.mobile-nav-active .navbar-nav {
+    display: flex;
+  }
+}
+
+.search-section {
+    display: none;
+    transition: var(--transition-base);
+}
+
+.search-section.active {
+    display: block;
+    animation: fadeIn 0.3s ease-out;
+}
+
+@keyframes fadeIn {
+    from { opacity: 0; transform: translateY(-10px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+/* Palette Utility Fallbacks */
+.hidden { display: none !important; }
+@keyframes slideIn{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px);filter:blur(4px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes toast-in{0%{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes toast-out{0%{transform:translateX(0);opacity:1}to{transform:translateX(100%);opacity:0}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}:root{--primary:#e6b980;--primary-dark:#b8860b;--primary-light:#f5d3ab;--secondary:#1a1410;--secondary-dark:#0f0b08;--secondary-light:#251e18;--accent:#8e1b1b;--accent-gold:#ffd700;--accent-green:#2d5a27;--accent-blue:#1b3b5f;--text-primary:#f5f1e8;--text-secondary:#d1c7b7;--text-soft:#a89f91;--text-muted:#7a7267;--bg-primary:#0a0806;--bg-secondary:#120e0b;--bg-tertiary:#1c1712;--bg-glass:rgba(10, 8, 6, 0.8);--border-color:rgba(212, 165, 116, 0.15);--border-glow:0 0 10px rgba(212, 165, 116, 0.2);--shadow-sm:0 4px 12px rgba(0, 0, 0, 0.5);--shadow-md:0 8px 24px rgba(0, 0, 0, 0.7);--shadow-lg:0 16px 48px rgba(0, 0, 0, 0.9);--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--radius-sm:4px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--font-sans:'Inter', -apple-system, system-ui, sans-serif;--font-serif:'Merriweather', serif;--font-display:'Cinzel', serif;--transition-fast:150ms cubic-bezier(0.4, 0, 0.2, 1);--transition-base:300ms cubic-bezier(0.4, 0, 0.2, 1);--transition-slow:500ms cubic-bezier(0.4, 0, 0.2, 1)}body.light-mode{--primary:#e50914;--secondary:#ffffff;--secondary-dark:#f5f5f5;--secondary-light:#eeeeee;--text-primary:#1a1a1a;--text-secondary:#404040;--text-soft:#666666;--text-muted:#999999;--bg-primary:#ffffff;--bg-secondary:#f5f5f5;--bg-tertiary:#eeeeee;--bg-hover:#e0e0e0;--border-color:#d0d0d0}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6;transition:background-color var(--transition-base),color var(--transition-base);overflow-x:hidden}.skip-link{position:absolute;top:-100px;left:var(--spacing-md);background:var(--primary);color:#fff;padding:var(--spacing-sm) var(--spacing-md);z-index:9999;transition:top var(--transition-fast);text-decoration:none;font-weight:700;border-radius:0 0 var(--radius-md) var(--radius-md)}.skip-link:focus{top:0}:focus-visible{outline:3px solid var(--primary-light);outline-offset:2px;border-radius:var(--radius-sm)}.card:focus-visible{outline-offset:4px}@media (prefers-reduced-motion:reduce){*,::after,::before{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important;transition-duration:0s!important;transition-delay:0s!important}}body.theme-neon{--primary:#00ffcc;--primary-dark:#00ccaa;--bg-primary:#0a0a1a;--bg-secondary:#12122a;--accent:#ff00ff}body.theme-neon .premium-gradient-text{background:linear-gradient(90deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}.theme-switcher:hover #themeMenu{display:block}.theme-opt.active{color:var(--primary);font-weight:700}body.modal-open{overflow:hidden}.glass-card,.premium-gradient{border:1px solid var(--border-color)}.glass-card{background:var(--bg-glass);backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.premium-gradient{background:linear-gradient(135deg,var(--secondary-dark) 0%,var(--secondary) 100%)}.premium-gradient-text{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 50%,var(--primary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700}.gold-glow{box-shadow:var(--border-glow)}.floating{animation:float 6s ease-in-out infinite}.navbar{background:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:var(--spacing-md) var(--spacing-lg);position:sticky;top:0;z-index:var(--z-dropdown);border-bottom:1px solid var(--border-color);transition:all var(--transition-base)}.navbar.scrolled{background:var(--bg-secondary);padding:var(--spacing-sm) var(--spacing-lg);box-shadow:var(--shadow-md)}.navbar-container{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-lg)}.navbar-brand{display:flex;align-items:center;gap:var(--spacing-md);cursor:pointer;transition:transform var(--transition-base)}.navbar-brand:hover{transform:scale(1.05)}.brand-icon,.brand-title{font-weight:700;background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%)}.brand-icon{width:32px;height:32px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:#fff}.brand-title{font-family:var(--font-display);font-size:20px;letter-spacing:1px;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.brand-subtitle{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--text-soft);margin-top:-4px}.navbar-nav{display:flex;gap:var(--spacing-lg);align-items:center}.nav-link{background:0 0;border:0;color:var(--text-secondary);cursor:pointer;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-base);font-size:14px;font-weight:500}.action-btn:hover,.nav-link:hover{background-color:var(--bg-hover);color:var(--primary)}.nav-link:hover{transform:translateY(-2px)}.action-btn,.nav-link,.navbar-actions{display:flex;align-items:center}.navbar-actions{gap:var(--spacing-md)}.action-btn{background:0 0;border:0;width:36px;height:36px;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;justify-content:center;transition:all var(--transition-base);font-size:18px}.action-btn:hover{transform:scale(1.1)}.action-btn,.badge-btn{position:relative}.badge{position:absolute;top:-8px;right:-8px;background:var(--primary);color:#fff;width:20px;height:20px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}.hero{position:relative;height:60vh;min-height:500px;overflow:hidden;margin-bottom:var(--spacing-2xl)}.hero-background,.hero-overlay{position:absolute;top:0;left:0;width:100%;height:100%}.hero-background{background-size:cover;background-position:center;background-repeat:no-repeat;filter:brightness(.6);transition:all var(--transition-slow)}.hero-overlay{background:linear-gradient(135deg,rgba(20,20,20,.9)0,rgba(20,20,20,.5) 50%,transparent 100%);z-index:2}.hero-container{position:relative;height:100%;z-index:3;display:flex;align-items:center;max-width:1400px;margin:0 auto;padding:var(--spacing-lg)}.hero-content{max-width:600px;animation:slideIn .8s ease-out}.hero-badge,.hero-title{font-weight:700;margin-bottom:var(--spacing-md)}.hero-badge{display:inline-block;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-full);font-size:12px;text-transform:uppercase;letter-spacing:1px}.hero-title{font-family:var(--font-display);font-size:clamp(32px,5vw,56px);line-height:1.2;text-shadow:0 4px 12px rgba(0,0,0,.5)}.hero-description,.hero-meta{margin-bottom:var(--spacing-lg)}.hero-description{font-size:18px;color:var(--text-secondary);line-height:1.6}.hero-meta{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.meta-item{background-color:rgba(229,9,20,.2);color:var(--text-secondary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-size:14px;border:1px solid var(--border-color);transition:all var(--transition-base)}.meta-item:hover{background-color:var(--primary);color:#fff;border-color:var(--primary)}.hero-actions{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.btn{padding:12px 28px;border:0;border-radius:var(--radius-md);font-size:15px;font-weight:600;cursor:pointer;transition:all var(--transition-base);display:inline-flex;align-items:center;gap:var(--spacing-sm);text-transform:uppercase;letter-spacing:.5px}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;box-shadow:var(--shadow-md)}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);background:linear-gradient(135deg,var(--primary-dark),var(--primary))}.btn-primary:active{transform:translateY(0)}.btn-secondary{background-color:rgba(255,255,255,.15);color:#fff;border:2px solid #fff;backdrop-filter:blur(10px)}.btn-secondary:hover{background-color:rgba(255,255,255,.25);transform:translateY(-2px)}.btn-lg{padding:16px 32px;font-size:16px}.hero-thumbnail{flex:1;display:none}@media (min-width:1024px){.hero-thumbnail{display:block}}.search-section{background-color:var(--bg-secondary);padding:var(--spacing-xl) var(--spacing-lg);margin:var(--spacing-2xl)0;border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color)}.container{max-width:1400px;margin:0 auto}.search-wrapper{margin-bottom:var(--spacing-lg)}.search-input-group{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:var(--spacing-md);color:var(--text-soft);pointer-events:none}.search-input{width:100%;padding:12px var(--spacing-md) 12px 40px;background-color:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);font-size:15px;transition:all var(--transition-base)}.search-input:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px rgba(229,9,20,.1)}.search-input::placeholder{color:var(--text-muted)}.search-kbd-hint{position:absolute;right:var(--spacing-md);background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:2px 6px;font-size:12px;color:var(--text-soft);pointer-events:none;transition:opacity var(--transition-fast),transform var(--transition-fast);font-family:var(--font-sans);box-shadow:inset 0-1px 0 rgba(0,0,0,.5)}.search-input:focus+.search-kbd-hint,.search-input:not(:placeholder-shown)+.search-kbd-hint{opacity:0;transform:scale(.8)}.search-clear{position:absolute;right:var(--spacing-md);background:0 0;border:0;color:var(--text-soft);cursor:pointer;font-size:18px;transition:color var(--transition-base)}.search-clear:hover{color:var(--primary)}.search-dropdown{position:absolute;top:100%;left:0;right:0;background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-top:none;border-radius:0 0 var(--radius-md) var(--radius-md);max-height:400px;overflow-y:auto;z-index:var(--z-dropdown);display:none}.filter-wrapper,.suggestion-item{display:flex;align-items:center;gap:var(--spacing-md)}.suggestion-item{padding:var(--spacing-md);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-base);border-bottom:1px solid var(--border-color)}.suggestion-item.active,.suggestion-item:hover{background-color:var(--bg-hover);color:var(--primary);padding-left:var(--spacing-lg)}.filter-wrapper{flex-wrap:wrap}.filter-label{font-size:14px;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:.5px}.filter-tags{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.chip,.filter-tag{padding:var(--spacing-sm) var(--spacing-md);background-color:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius-full);cursor:pointer;font-size:13px;font-weight:500;transition:all var(--transition-base)}.chip:hover,.filter-tag:hover{border-color:var(--primary);color:var(--primary)}.chip.active,.filter-tag.active{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border-color:var(--primary)}.stats-section{padding:var(--spacing-2xl) var(--spacing-lg)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-lg)}.stat-card,.stat-icon{display:flex;align-items:center}.stat-card{background:linear-gradient(135deg,var(--bg-tertiary),var(--bg-secondary));padding:var(--spacing-lg);border-radius:var(--radius-lg);border:1px solid var(--border-color);gap:var(--spacing-lg);transition:all var(--transition-base);cursor:pointer}.stat-card:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:var(--shadow-md)}.stat-icon{width:56px;height:56px;background:linear-gradient(135deg,var(--primary),var(--accent));border-radius:var(--radius-md);justify-content:center;color:#fff;font-size:24px;flex-shrink:0}.stat-content{flex:1}.stat-label{color:var(--text-soft);font-size:13px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--spacing-sm)}.stat-value{font-size:28px;font-weight:700;color:var(--text-primary)}.episodes-section{padding:var(--spacing-2xl) var(--spacing-lg)}.section-header{margin-bottom:var(--spacing-2xl)}.section-title{font-family:var(--font-display);font-size:clamp(28px,4vw,40px);font-weight:700;margin-bottom:var(--spacing-md)}.section-subtitle{color:var(--text-soft);font-size:14px}.episodes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--spacing-lg)}.card{background-color:var(--bg-tertiary);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all var(--transition-base),outline-color var(--transition-base);border:1px solid var(--border-color);display:flex;flex-direction:column;height:100%;outline:2px solid transparent;outline-offset:3px}.card.animate-in{animation:fadeInUp 600ms cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--index, 0)*80ms)}.card:focus-visible,.card:hover{transform:scale(1.02) translateY(-8px);border-color:var(--primary);box-shadow:0 0 24px rgba(230,185,128,.15),var(--shadow-lg)}.card:focus-visible{outline-color:var(--primary)}.card-thumb-wrapper{position:relative;overflow:hidden;aspect-ratio:16/9;background:linear-gradient(135deg,var(--bg-secondary),var(--bg-tertiary))}.card-thumb-wrapper img{width:100%;height:100%;object-fit:cover;transition:all var(--transition-base)}.card:hover .card-thumb-wrapper img{transform:scale(1.05);filter:brightness(.8)}.card-thumb-overlay,.play-icon{display:flex;align-items:center;justify-content:center;transition:all var(--transition-base)}.card-thumb-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:0 0;opacity:0}.card:hover .card-thumb-overlay{background:rgba(0,0,0,.4);opacity:1}.play-icon{width:50px;height:50px;background:linear-gradient(135deg,var(--primary),var(--primary-light));border-radius:var(--radius-full);color:#fff;font-size:20px}.duration-badge{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);background-color:rgba(0,0,0,.8);color:#fff;padding:4px 8px;border-radius:var(--radius-sm);font-size:12px;font-weight:600}.progress-bar-container{position:absolute;bottom:0;left:0;width:100%;height:3px;background-color:rgba(255,255,255,.2)}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));transition:width .3s ease}.watch-later-btn{position:absolute;top:var(--spacing-md);right:var(--spacing-md);width:40px;height:40px;background:rgba(0,0,0,.6);border:2px solid #fff;border-radius:var(--radius-md);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-base);font-size:18px;backdrop-filter:blur(5px)}.card:hover .play-icon,.watch-later-btn:hover{transform:scale(1.1)}.watch-later-btn.active,.watch-later-btn:hover{background:var(--primary);border-color:var(--primary)}.card-copy{padding:var(--spacing-md);flex:1;display:flex;flex-direction:column}.card-title{font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-sm);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card:hover .card-title,.footer-section ul li a:hover{color:var(--primary)}.card-meta{display:flex;gap:var(--spacing-sm);align-items:center;font-size:12px;color:var(--text-soft);margin-top:auto}.card-tag{background-color:rgba(229,9,20,.2);color:var(--primary);padding:2px 8px;border-radius:var(--radius-sm);font-weight:500}.modal,.video-player iframe{top:0;left:0;width:100%;height:100%}.modal{position:fixed;background-color:rgba(0,0,0,.95);display:none;flex-direction:column;z-index:var(--z-modal);overflow-y:auto;backdrop-filter:blur(5px)}.modal-content{position:relative;background-color:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-color);border-radius:var(--radius-lg);max-width:900px;width:90%;margin:var(--spacing-lg) auto;overflow:hidden;animation:slideIn .3s ease-out}.modal-close{position:absolute;top:var(--spacing-md);right:var(--spacing-md);width:40px;height:40px;background:rgba(0,0,0,.6);border:0;border-radius:var(--radius-md);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10;transition:all var(--transition-base);font-size:24px}.modal-close:hover{background:var(--primary);transform:scale(1.1)}.modal-header{padding:var(--spacing-lg);border-bottom:1px solid var(--border-color)}.modal-title{font-size:24px;font-weight:700}.modal-body{padding:var(--spacing-lg)}.video-player{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:var(--radius-md);background:#000;margin-bottom:var(--spacing-lg)}.video-player iframe{position:absolute}.modal-actions{display:flex;gap:var(--spacing-md);flex-wrap:wrap;margin-top:var(--spacing-lg)}.modal-action-btn{flex:1;min-width:120px;padding:12px var(--spacing-md);background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);transition:all var(--transition-base);font-weight:600}.modal-action-btn:hover{background-color:var(--primary);border-color:var(--primary);color:#fff}.panel-header,.side-panel{top:0;background-color:var(--bg-secondary)}.side-panel{position:fixed;right:-350px;width:350px;height:100vh;z-index:var(--z-modal);transition:right var(--transition-base);box-shadow:var(--shadow-lg);overflow-y:auto}.side-panel[aria-hidden=false]{right:0}.panel-header{padding:var(--spacing-lg);border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;position:sticky;z-index:10}.panel-header h2{font-size:20px;font-weight:700}.panel-close{background:0 0;border:0;color:var(--text-primary);cursor:pointer;font-size:24px;transition:all var(--transition-base)}.panel-close:hover{color:var(--primary);transform:scale(1.1)}.panel-content{padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md)}.empty-state{padding:var(--spacing-2xl) var(--spacing-lg);text-align:center;color:var(--text-soft)}#toast-container,.loading-state{display:flex;flex-direction:column}.loading-state{align-items:center;justify-content:center;padding:var(--spacing-2xl) var(--spacing-lg);gap:var(--spacing-lg)}.spinner{width:50px;height:50px;border-radius:var(--radius-full);border:3px solid var(--border-color);border-top-color:var(--primary);animation:spin .8s linear infinite}.error-state{text-align:center;padding:var(--spacing-2xl) var(--spacing-lg)}.error-icon{font-size:48px;margin-bottom:var(--spacing-md);color:var(--primary)}.empty-state-card i,.error-state h3{font-size:20px;margin-bottom:var(--spacing-md)}.error-state p,.footer-section h4{color:var(--text-soft);margin-bottom:var(--spacing-lg)}.skeleton-card{border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-secondary);padding:1rem}.skeleton{background:linear-gradient(90deg,var(--bg-tertiary) 0%,var(--bg-hover) 50%,var(--bg-tertiary) 100%);background-size:200% 100%;animation:shimmer 2s infinite;border-radius:4px}.skeleton-thumb{width:100%;height:180px;margin-bottom:12px}.skeleton-title{width:90%;height:24px;margin-bottom:8px}.skeleton-meta{width:40%;height:16px}#toast-container{position:fixed;bottom:2rem;right:2rem;z-index:10000;gap:.5rem}.toast{padding:.75rem 1.25rem;border-radius:8px;background:var(--bg-tertiary);border-left:4px solid var(--primary);display:flex;align-items:center;gap:.75rem;animation:toast-in .3s ease-out forwards;min-width:250px}.toast.success{border-left-color:var(--accent-green)}.toast.warning{border-left-color:var(--accent-orange)}.toast.info{border-left-color:var(--accent-blue)}.empty-state-card{text-align:center;padding:var(--spacing-2xl) var(--spacing-lg);color:var(--text-soft)}.empty-state-card i{font-size:48px;opacity:.5}.social-links a,.toast{border-radius:var(--radius-md)}.toast{position:fixed;bottom:-100px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;padding:16px 24px;z-index:var(--z-toast);transition:bottom var(--transition-base);box-shadow:var(--shadow-lg);max-width:90%}.toast.show{bottom:24px}.footer{background:var(--bg-secondary);border-top:1px solid var(--border-color);padding:var(--spacing-2xl)0 var(--spacing-lg);margin-top:var(--spacing-2xl)}.footer-content{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--spacing-2xl);margin-bottom:var(--spacing-2xl)}@media (max-width:992px){.footer-content{grid-template-columns:1fr 1fr}}@media (max-width:576px){.footer-content{grid-template-columns:1fr}}.footer-section h4{color:var(--text-primary);font-family:var(--font-display);font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em}.footer-section p{color:var(--text-soft);font-size:.9rem;line-height:1.6;max-width:300px}.footer-section ul{list-style:none;padding:0}.footer-section ul li{margin-bottom:var(--spacing-sm)}.footer-section ul li a{color:var(--text-soft);text-decoration:none;font-size:.9rem;transition:color var(--transition-fast)}.social-links{display:flex;gap:var(--spacing-md)}.social-links a{width:36px;height:36px;background:var(--bg-tertiary);border:1px solid var(--border-color);display:flex;align-items:center;justify-content:center;color:var(--text-soft);transition:all var(--transition-fast)}.social-links a:hover{background-color:var(--primary);transform:translateY(-4px)}.footer-bottom{text-align:center;padding-top:var(--spacing-lg);border-top:1px solid var(--border-color);color:var(--text-soft);font-size:13px}@media (max-width:768px){.navbar-container,.navbar-nav{gap:var(--spacing-md)}.hero-container{padding:var(--spacing-md)}.hero-title{font-size:28px}.episodes-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--spacing-md)}.side-panel{width:100%;right:-100%}.search-section{padding:var(--spacing-lg)}.stats-grid{grid-template-columns:1fr}.filter-wrapper{flex-direction:column;align-items:flex-start}}@media (max-width:480px){.container{padding:0}.episodes-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:var(--spacing-sm)}.hero-title{font-size:20px}.hero-actions{flex-direction:column}.btn,.btn-lg{width:100%;justify-content:center}.section-title{font-size:22px}.modal-content{width:95%;margin:var(--spacing-md) auto}}.hide{display:none!important}.show{display:block!important}.text-center{text-align:center}.mt-1{margin-top:var(--spacing-sm)}.mt-2{margin-top:var(--spacing-md)}.mt-3{margin-top:var(--spacing-lg)}.mb-1{margin-bottom:var(--spacing-sm)}.mb-2{margin-bottom:var(--spacing-md)}.mb-3{margin-bottom:var(--spacing-lg)}.p-1{padding:var(--spacing-sm)}.p-2{padding:var(--spacing-md)}.p-3{padding:var(--spacing-lg)}mark{background-color:rgba(255,215,0,.3);color:var(--accent);padding:2px 4px;border-radius:3px}.scroll-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border:0;border-radius:var(--radius-full);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;z-index:99;opacity:0;visibility:hidden;transition:all var(--transition-base);box-shadow:var(--shadow-lg)}.scroll-to-top:hover{transform:translateY(-5px);box-shadow:0 8px 15px rgba(0,0,0,.3)}.scroll-to-top.show{opacity:1;visibility:visible}.menu-toggle{display:none;background:0 0;border:0;cursor:pointer;padding:var(--spacing-sm);flex-direction:column;gap:5px}.menu-toggle span{display:block;width:25px;height:2px;background-color:var(--text-primary);transition:var(--transition-base)}@media (max-width:768px){.menu-toggle,body.mobile-nav-active .navbar-nav{display:flex}.navbar-nav{display:none;position:absolute;top:100%;left:0;width:100%;background:var(--bg-secondary);flex-direction:column;padding:var(--spacing-lg);border-bottom:1px solid var(--border-color)}}.search-section{display:none;transition:var(--transition-base)}.search-section.active{display:block;animation:fadeIn .3s ease-out}.copy-feedback{position:absolute;top:-30px;left:50%;transform:translateX(-50%) translateY(10px);background:var(--primary);color:var(--secondary-dark);padding:4px 8px;border-radius:var(--radius-sm);font-size:10px;font-weight:700;pointer-events:none;opacity:0;transition:all var(--transition-fast);z-index:100;white-space:nowrap}.copy-feedback.show{opacity:1;transform:translateX(-50%) translateY(0)}.copy-feedback::after{content:"";position:absolute;top:100%;left:50%;margin-left:-4px;border-width:4px;border-style:solid;border-color:var(--primary) transparent transparent transparent}
diff --git a/index.html b/index.html
index cf65cec..a2630d4 100644
--- a/index.html
+++ b/index.html
@@ -102,7 +102,7 @@ <h1 class="brand-title">Ruh Al Tarikh</h1>
           <i class="fas fa-download"></i>
         </button>
         <div class="theme-switcher relative">
-          <button id="themeToggleBtn" class="action-btn" aria-label="Toggle Theme" title="Toggle Theme">
+          <button id="themeToggleBtn" class="action-btn" aria-label="Toggle Theme" title="Toggle Theme" aria-haspopup="menu" aria-expanded="false">
             <i class="fas fa-moon"></i>
           </button>
           <div id="themeMenu" class="hidden absolute top-full right-0 mt-2 bg-bg-secondary border border-white/10 rounded-lg shadow-xl z-50 py-2 min-width-[150px]">
diff --git a/js/app.js b/js/app.js
index d105f9b..4a958d5 100644
--- a/js/app.js
+++ b/js/app.js
@@ -67,6 +67,7 @@ const DOM = {
     body: document.body,
     grid: document.getElementById('grid'),
     modal: document.getElementById('modal'),
+    modalSaveBtn: document.getElementById('modalSaveBtn'),
     player: document.getElementById('player'),
     closeModal: document.getElementById('close'),
     toast: document.getElementById('toast'),
@@ -97,6 +98,7 @@ const DOM = {
 
     // Theme & UI
     themeToggle: document.getElementById('themeToggleBtn'),
+    themeMenu: document.getElementById('themeMenu'),
     menuToggle: document.getElementById('menuToggleBtn'),
     scrollToTop: document.getElementById('scrollToTop'),
 
@@ -512,6 +514,17 @@ function openVideo(video) {
 
     if (DOM.transcriptPanel) DOM.transcriptPanel.setAttribute('aria-hidden', 'true');
     if (DOM.sharePanel) DOM.sharePanel.setAttribute('aria-hidden', 'true');
+
+    // Update modal save button state
+    if (DOM.modalSaveBtn) {
+        const isSaved = AppState.watchLater.some(v => v.id === video.id);
+        DOM.modalSaveBtn.classList.toggle('active', isSaved);
+        const icon = DOM.modalSaveBtn.querySelector('i');
+        if (icon) {
+            icon.className = isSaved ? 'fas fa-bookmark' : 'far fa-bookmark';
+        }
+        DOM.modalSaveBtn.setAttribute('aria-label', isSaved ? 'Remove from Watch Later' : 'Save for later');
+    }
 }
 
 function closeVideo() {
@@ -561,6 +574,17 @@ function toggleWatchLater(video) {
     if (AppState.hero && AppState.hero.id === video.id) renderHero(AppState.hero);
     renderGrid();
     if (DOM.watchLaterContainer) renderWatchLater();
+
+    // Sync modal save button if open
+    if (DOM.modalSaveBtn && AppState.current && AppState.current.id === video.id) {
+        const isSaved = AppState.watchLater.some(v => v.id === video.id);
+        DOM.modalSaveBtn.classList.toggle('active', isSaved);
+        const icon = DOM.modalSaveBtn.querySelector('i');
+        if (icon) {
+            icon.className = isSaved ? 'fas fa-bookmark' : 'far fa-bookmark';
+        }
+        DOM.modalSaveBtn.setAttribute('aria-label', isSaved ? 'Remove from Watch Later' : 'Save for later');
+    }
 }
 
 function openWatchLater() {
@@ -945,8 +969,23 @@ function setupRecommendedSection() {
 // EVENT LISTENERS
 // ============================================
 function bindEvents() {
-    // Theme toggle
-    if (DOM.themeToggle) DOM.themeToggle.addEventListener('click', toggleTheme);
+    // Theme toggle & Menu
+    if (DOM.themeToggle && DOM.themeMenu) {
+        DOM.themeToggle.addEventListener('click', (e) => {
+            e.stopPropagation();
+            const isExpanded = DOM.themeToggle.getAttribute('aria-expanded') === 'true';
+            DOM.themeToggle.setAttribute('aria-expanded', !isExpanded);
+            DOM.themeMenu.classList.toggle('hidden');
+        });
+
+        // Close theme menu when clicking outside
+        document.addEventListener('click', (e) => {
+            if (!DOM.themeToggle.contains(e.target) && !DOM.themeMenu.contains(e.target)) {
+                DOM.themeMenu.classList.add('hidden');
+                DOM.themeToggle.setAttribute('aria-expanded', 'false');
+            }
+        });
+    }
 
     // Mobile Menu Toggle
     if (DOM.menuToggle) {
@@ -1054,6 +1093,7 @@ function bindEvents() {
     if (DOM.closeTranscript) DOM.closeTranscript.addEventListener('click', () => { DOM.transcriptPanel.style.display = 'none'; DOM.transcriptPanel.setAttribute('aria-hidden', 'true'); DOM.body.style.overflow = ''; DOM.body.classList.remove('modal-open'); if (AppState.lastFocused) { AppState.lastFocused.focus(); AppState.lastFocused = null; } });
     const shareEpBtn = document.getElementById('shareEpisode');
     if (shareEpBtn) shareEpBtn.addEventListener('click', openShare);
+    if (DOM.modalSaveBtn) DOM.modalSaveBtn.addEventListener('click', () => AppState.current && toggleWatchLater(AppState.current));
     const transBtn = document.getElementById('toggleTranscript');
     if (transBtn) transBtn.addEventListener('click', openTranscript);
     const copyLinkBtn = document.getElementById('copyLinkBtn');