:root{--bg-base: #050505;--bg-surface: #0a0a0a;--bg-card: #111111;--accent: #8b5cf6;--accent-rgb: 139, 92, 246;--text-main: #ffffff;--text-dim: rgba(255, 255, 255, .5);--glass-bg: rgba(8, 8, 12, .75);--glass-border: rgba(255, 255, 255, .09);--glow: rgba(139, 92, 246, .22);--glow-strong: rgba(139, 92, 246, .45);--shadow-card: 0 8px 32px -4px rgba(0, 0, 0, .7), 0 2px 8px rgba(0, 0, 0, .5);--shadow-card-hover: 0 24px 48px -8px rgba(0, 0, 0, .8), 0 0 0 1px rgba(var(--accent-rgb), .35), 0 0 40px -8px rgba(var(--accent-rgb), .3);--gradient-accent: linear-gradient(135deg, var(--accent), rgba(var(--accent-rgb), .6));--font-display: "DM Serif Display", Georgia, serif;--font-body: "DM Sans", system-ui, -apple-system, sans-serif;--z-popup: 100}[data-theme-mode=light]{--bg-base: #f8fafc;--bg-surface: #ffffff;--bg-card: #f1f5f9;--text-main: #0f172a;--text-dim: rgba(15, 23, 42, .5);--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(0, 0, 0, .07);--glow: rgba(var(--accent-rgb), .1);--glow-strong: rgba(var(--accent-rgb), .25)}[data-theme-preset=nebula]{--bg-base: #0f071a;--bg-surface: #160d26;--bg-card: #1c1232;--accent: #a855f7;--accent-rgb: 168, 85, 247;--glow: rgba(168, 85, 247, .25);--glow-strong: rgba(168, 85, 247, .5);--shadow-card-hover: 0 24px 48px -8px rgba(0, 0, 0, .8), 0 0 0 1px rgba(168, 85, 247, .4), 0 0 40px -8px rgba(168, 85, 247, .35)}[data-theme-preset=crimson]{--bg-base: #120303;--bg-surface: #1a0808;--bg-card: #250c0c;--accent: #ef4444;--accent-rgb: 239, 68, 68;--glow: rgba(239, 68, 68, .25);--glow-strong: rgba(239, 68, 68, .5);--shadow-card-hover: 0 24px 48px -8px rgba(0, 0, 0, .8), 0 0 0 1px rgba(239, 68, 68, .4), 0 0 40px -8px rgba(239, 68, 68, .35)}[data-theme-preset=emerald]{--bg-base: #031109;--bg-surface: #061a0e;--bg-card: #0a2514;--accent: #10b981;--accent-rgb: 16, 185, 129;--glow: rgba(16, 185, 129, .25);--glow-strong: rgba(16, 185, 129, .5);--shadow-card-hover: 0 24px 48px -8px rgba(0, 0, 0, .8), 0 0 0 1px rgba(16, 185, 129, .4), 0 0 40px -8px rgba(16, 185, 129, .35)}[data-theme-preset=cozy]{--bg-base: #0b0508;--bg-surface: #120712;--bg-card: #170616;--accent: #ff6ea2;--accent-rgb: 255, 110, 162;--glow: rgba(255, 110, 162, .18);--glow-strong: rgba(255, 110, 162, .36);--shadow-card-hover: 0 24px 48px -8px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 110, 162, .36), 0 0 40px -8px rgba(255, 110, 162, .25);--glass-bg: rgba(18, 7, 18, .64)}[data-accent=purple]{--accent: #a855f7;--accent-rgb: 168, 85, 247;--glow: rgba(168, 85, 247, .22);--glow-strong: rgba(168, 85, 247, .45)}[data-accent=blue]{--accent: #3b82f6;--accent-rgb: 59, 130, 246;--glow: rgba(59, 130, 246, .22);--glow-strong: rgba(59, 130, 246, .45)}[data-accent=green]{--accent: #10b981;--accent-rgb: 16, 185, 129;--glow: rgba(16, 185, 129, .22);--glow-strong: rgba(16, 185, 129, .45)}[data-accent=red]{--accent: #ef4444;--accent-rgb: 239, 68, 68;--glow: rgba(239, 68, 68, .22);--glow-strong: rgba(239, 68, 68, .45)}html,body{overflow-x:hidden;width:100%;transition:background-color .4s cubic-bezier(.4,0,.2,1),color .4s cubic-bezier(.4,0,.2,1)}body{background-color:var(--bg-base);background-image:radial-gradient(ellipse at 0% 0%,rgba(var(--accent-rgb),.12) 0px,transparent 55%),radial-gradient(ellipse at 100% 0%,rgba(var(--accent-rgb),.06) 0px,transparent 50%),radial-gradient(ellipse at 50% 100%,rgba(var(--accent-rgb),.05) 0px,transparent 60%);min-height:100vh;font-family:var(--font-body);color:var(--text-main)}h1,h2,h3,.font-display{font-family:var(--font-display)}@media(max-width:480px){h1.text-lg{font-size:1.1rem!important}.container{padding-left:1.25rem!important;padding-right:1.25rem!important}.movie-card{border-radius:12px!important}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-surface)}::-webkit-scrollbar-thumb{background:var(--bg-card);border-radius:4px;border:2px solid var(--bg-surface)}::-webkit-scrollbar-thumb:hover{background:var(--accent)}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);border:1px solid var(--glass-border);box-shadow:0 8px 40px #00000080,inset 0 1px #ffffff0d;border-radius:24px}.movie-card{position:relative;border-radius:16px;overflow:hidden;background:var(--bg-card);transition:transform .45s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease,border-color .25s ease;border:1px solid var(--glass-border);aspect-ratio:2/3;box-shadow:var(--shadow-card)}.movie-card img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.4,0,.2,1)}@media(hover:hover)and (pointer:fine){.movie-card:hover{transform:translateY(-10px) scale(1.01);box-shadow:var(--shadow-card-hover);border-color:rgba(var(--accent-rgb),.5)}.movie-card:hover img{transform:scale(1.08)}}.card-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.97) 0%,rgba(0,0,0,.55) 45%,transparent 100%);opacity:0;transition:opacity .35s ease;display:flex;flex-direction:column;justify-content:flex-end;padding:1.25rem}@media(max-width:480px){.card-overlay{padding:.75rem}}@media(hover:hover)and (pointer:fine){.movie-card:hover .card-overlay{opacity:1}}.card-badge{position:absolute;top:10px;right:10px;z-index:10;padding:3px 9px;border-radius:999px;font-size:7.5px;font-weight:900;text-transform:uppercase;letter-spacing:.12em;color:#fff;background:linear-gradient(135deg,rgba(var(--accent-rgb),.9),#f472b6d9);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);box-shadow:0 2px 12px rgba(var(--accent-rgb),.4),0 1px #ffffff1a inset;text-shadow:0 1px 3px rgba(0,0,0,.4)}.rank-badge{position:absolute;bottom:-6px;left:-2px;z-index:11;font-size:clamp(3.8rem,8vw,5.2rem);font-weight:900;line-height:1;letter-spacing:-.1em;font-family:var(--font-display);color:transparent;-webkit-text-stroke:3px rgba(255,255,255,.92);filter:drop-shadow(0 2px 10px rgba(0,0,0,.95));pointer-events:none;user-select:none}.rank-badge.top-ranked{-webkit-text-stroke:3px rgba(249,115,22,.97);filter:drop-shadow(0 0 14px rgba(249,115,22,.55)) drop-shadow(0 2px 10px rgba(0,0,0,.9))}.search-input{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:var(--text-main);transition:all .3s ease}.search-input:focus{background:#ffffff12;border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15),0 4px 24px #0000004d}.card-skeleton{background:linear-gradient(90deg,var(--bg-card) 0%,rgba(255,255,255,.04) 35%,rgba(255,255,255,.08) 50%,rgba(255,255,255,.04) 65%,var(--bg-card) 100%);background-size:300% 100%;animation:skeleton-wave 2s infinite ease-in-out}@keyframes skeleton-wave{0%{background-position:100% 0}to{background-position:-100% 0}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes cardEnter{0%{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes glowPulse{0%,to{box-shadow:0 0 20px var(--glow)}50%{box-shadow:0 0 40px var(--glow-strong)}}@keyframes backdropEnter{0%{transform:scale(1.06);opacity:.5}to{transform:scale(1.04);opacity:1}}@keyframes rippleOut{to{transform:scale(4);opacity:0}}@keyframes sectionFade{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.section-animate{animation:sectionFade .4s cubic-bezier(.22,1,.36,1) both}.card-animate{animation:cardEnter .45s cubic-bezier(.22,1,.36,1) both}.heart-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:9999px;background:transparent;transition:transform .28s cubic-bezier(.2,.8,.2,1),color .25s;color:#ffffffe6}.heart-pop{animation:heartPop .9s ease-out both}@keyframes heartPop{0%{transform:scale(1);filter:drop-shadow(0 0 0 rgba(0,0,0,0))}30%{transform:scale(1.28) rotate(-8deg)}60%{transform:scale(.96) rotate(4deg)}to{transform:scale(1) rotate(0)}}.hearted .heart-icon i{color:#ff6ea2;filter:drop-shadow(0 6px 18px rgba(255,110,162,.18))}.heart-sparkle{position:absolute;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fff,#fff9 30%,#ff6ea2cc 70%);opacity:.95;transform:translateY(0) scale(.6);animation:sparkleRise .7s ease-out forwards;pointer-events:none}@keyframes sparkleRise{to{transform:translateY(-24px) scale(1.2);opacity:0}}.cast-card{width:clamp(86px,13vw,112px);flex-shrink:0;text-align:center}.cast-card .cast-photo{width:clamp(78px,11vw,100px);height:clamp(78px,11vw,100px);border-radius:9999px;overflow:hidden;margin:0 auto .6rem;border:1px solid rgba(255,255,255,.06);box-shadow:0 8px 24px #0009;transition:transform .35s ease,box-shadow .35s ease}.cast-card:hover .cast-photo{transform:translateY(-6px) scale(1.03);box-shadow:0 18px 40px #000000b3,0 0 0 3px rgba(var(--accent-rgb),.08)}.cast-name{font-size:.78rem;font-weight:700;color:var(--text-main);line-height:1.2}.cast-role{font-size:.68rem;font-weight:500;color:var(--text-dim);line-height:1.2}@media(max-width:767px){#globalSearchContainer{display:none!important}}@media(min-width:768px){#mainContent{padding-bottom:2rem!important}}#bottomNav{padding-bottom:env(safe-area-inset-bottom,0px)}.bottom-nav-btn{color:#ffffff61;transition:color .25s,transform .15s;-webkit-tap-highlight-color:transparent;position:relative}.bottom-nav-btn:active{transform:scale(.92)}.bottom-nav-btn.active{color:#f472b6}.bottom-nav-btn.active i{filter:drop-shadow(0 0 8px rgba(244,114,182,.7))}.bottom-nav-btn.active:before{content:"";position:absolute;top:6px;left:50%;transform:translate(-50%);width:36px;height:36px;border-radius:12px;background:#f472b61f;border:1px solid rgba(244,114,182,.2);animation:fadeSlideUp .25s cubic-bezier(.34,1.56,.64,1) both;z-index:-1}#headerSearchWrap{display:flex;align-items:center;gap:0}#headerSearchExpand{max-width:0;overflow:hidden;opacity:0;transition:max-width .35s cubic-bezier(.4,0,.2,1),opacity .25s ease}#headerSearchExpand.open{max-width:240px;opacity:1}#headerSearchInput{background:#ffffff12;border:1px solid rgba(255,255,255,.12);color:#fff;border-radius:9999px;padding:.35rem 1rem;font-size:.875rem;outline:none;width:min(220px,55vw);transition:border-color .2s,box-shadow .2s}#headerSearchInput:focus{border-color:var(--accent);box-shadow:0 0 14px var(--glow)}#headerSearchInput::placeholder{color:#ffffff59}#mobileSearchOverlay{display:none}#mobileSearchOverlay.open{display:flex}.nav-btn{position:relative;color:#fff9;font-family:var(--font-body);font-weight:600;font-size:.85rem;padding:.5rem 1.2rem;border-radius:9999px;transition:all .3s ease}.nav-btn:hover{color:#fff;background:#ffffff0f}.nav-btn.active{color:#fff;background:#ffffff1a}.nav-btn.active:after{content:"";position:absolute;bottom:-2px;left:50%;width:50%;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);transform:translate(-50%);box-shadow:0 0 10px var(--glow)}.nav-select{border-radius:9999px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:#ffffffe0;font-size:.78rem;font-weight:700;padding:.48rem 1.9rem .48rem .9rem;outline:none;appearance:none;-webkit-appearance:none;transition:border-color .25s,box-shadow .25s,background-color .25s;background-image:linear-gradient(45deg,transparent 50%,rgba(255,255,255,.7) 50%),linear-gradient(135deg,rgba(255,255,255,.7) 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.nav-select:focus{border-color:rgba(var(--accent-rgb),.7);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.2);background-color:#ffffff17}.nav-select option{background:#0d0d12;color:#fff}#details-view{background:#08080a}.hero-backdrop{mask-image:linear-gradient(to bottom,black 0%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,black 20%,transparent 100%);opacity:.6}.loader{width:48px;height:48px;border:3px solid rgba(255,255,255,.1);border-radius:50%;border-top-color:var(--neon-purple);animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-spinner{width:48px;height:48px;border:3px solid rgba(255,255,255,.1);border-radius:50%;border-top-color:var(--accent);animation:spin 1s ease-in-out infinite}.text-glow{text-shadow:0 0 20px rgba(255,255,255,.2)}.perspective-1000{perspective:1000px}.rotate-y-6{transform:rotateY(12deg) rotateX(5deg)}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}#mobileMenuBackdrop{transition:opacity .35s ease;opacity:0;pointer-events:none}#mobileMenuBackdrop.open{opacity:1;pointer-events:auto}#mobileMenu{transition:transform .38s cubic-bezier(.4,0,.2,1)}#mobileMenu.menu-closed{transform:translate(100%);pointer-events:none}#mobileMenu:not(.menu-closed){transform:translate(0);pointer-events:auto}.layer-label{font-family:JetBrains Mono,Fira Code,monospace;font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;opacity:.5;font-weight:700}.rec-row{background:var(--bg-card);border:1px solid var(--glass-border);border-radius:20px;padding:2rem;margin-bottom:2rem;transition:all .3s ease}@media(max-width:480px){.rec-row{padding:1rem;border-radius:16px;margin-bottom:1rem}}.rec-row:hover{border-color:var(--accent);box-shadow:0 10px 30px -10px #00000080}.rec-pair{display:flex;align-items:center;justify-content:center;gap:2rem;margin-bottom:2rem}.rec-item-mini{width:140px;display:flex;flex-direction:column;align-items:center;text-align:center}.rec-item-mini img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:12px;border:1px solid var(--glass-border);margin-bottom:.75rem;box-shadow:0 8px 16px #0006}.rec-divider{display:flex;flex-direction:column;align-items:center;gap:.5rem;opacity:.3}.rec-divider i{font-size:1.5rem}.rec-explanation-box{background:#0003;border-radius:16px;padding:1.5rem;border:1px solid rgba(255,255,255,.03)}.rec-explanation-box ul{display:flex;flex-direction:column;gap:.5rem}.rec-explanation-box li{color:var(--text-dim);font-size:.9rem;display:flex;align-items:center;gap:.75rem}.rec-explanation-box li:before{content:"•";color:var(--accent);font-weight:900}@media(max-width:640px){.rec-pair{gap:1rem}.rec-item-mini{width:100px}}@keyframes settingsPanelIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes settingsBackdropIn{0%{opacity:0}to{opacity:1}}#settingsModal:not(.hidden) .settings-panel{animation:settingsPanelIn .38s cubic-bezier(.16,1,.3,1) forwards}#settingsModal:not(.hidden) .settings-backdrop{animation:settingsBackdropIn .25s ease forwards}.settings-section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:var(--text-dim);margin-bottom:16px}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--glass-border);transition:all .2s ease}.settings-row:hover{background:#ffffff05}.settings-row:last-child{border-bottom:none}.settings-label{font-size:14px;font-weight:500;color:var(--text-main)}.settings-desc{font-size:12px;color:var(--text-dim);margin-top:4px;line-height:1.4}.settings-chip{padding:8px 16px;border-radius:12px;font-size:13px;font-weight:500;color:var(--text-dim);background:var(--bg-card);border:1px solid var(--glass-border);transition:all .3s ease;cursor:pointer;white-space:nowrap}.settings-row .flex{flex-wrap:wrap;gap:6px}.settings-chip:hover{background:var(--bg-surface);color:var(--text-main);border-color:var(--accent)}.settings-chip-active,.settings-chip.active{background:var(--accent)!important;color:#fff!important;border-color:var(--accent)!important;box-shadow:0 0 20px var(--glow)}.settings-color-dot{width:36px;height:36px;border-radius:50%;border:3px solid transparent;transition:all .3s ease;cursor:pointer;position:relative}.settings-color-dot:hover{transform:scale(1.1);box-shadow:0 4px 12px #0006}.settings-color-dot-active,.settings-color-dot.active{border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--glow)}.settings-color-dot-active:after,.settings-color-dot.active:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:16px;font-weight:900;text-shadow:0 2px 4px rgba(0,0,0,.5)}.settings-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;border-radius:12px;font-size:14px;font-weight:600;transition:all .3s ease;cursor:pointer;border:none}.settings-btn-primary{background:linear-gradient(135deg,var(--accent),rgba(var(--accent-rgb),.7));color:#fff;box-shadow:0 4px 16px var(--glow)}.settings-btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px var(--glow)}.settings-btn-primary:active{transform:translateY(0)}.settings-btn-secondary{background:var(--bg-card);color:var(--accent);border:1px solid var(--accent)}.settings-btn-secondary:hover{background:rgba(var(--accent-rgb),.1)}.settings-input{background:var(--bg-card);border:1px solid var(--glass-border);border-radius:12px;color:var(--text-main);padding:12px 16px;font-size:14px;transition:all .3s ease}.settings-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 20px var(--glow);background:var(--bg-surface)}.settings-input::placeholder{color:var(--text-dim)}.movie-card{will-change:transform,box-shadow;contain:layout style}.cast-card .cast-photo,#mobileMenu{will-change:transform}.rec-row{content-visibility:auto;contain-intrinsic-size:auto 220px}.ambient-orbs{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}.ambient-orbs:before,.ambient-orbs:after{content:"";position:absolute;border-radius:50%;pointer-events:none;will-change:transform}.ambient-orbs:before{width:clamp(360px,52vw,740px);height:clamp(360px,52vw,740px);background:radial-gradient(circle at 40% 40%,rgba(var(--accent-rgb),.17) 0%,transparent 65%);top:-18%;left:-12%;animation:orbFloat 24s ease-in-out infinite}.ambient-orbs:after{width:clamp(260px,42vw,580px);height:clamp(260px,42vw,580px);background:radial-gradient(circle at 60% 60%,rgba(var(--accent-rgb),.11) 0%,transparent 65%);bottom:-14%;right:-8%;animation:orbFloat 30s ease-in-out infinite reverse;animation-delay:-12s}@keyframes orbFloat{0%,to{transform:translate(0) scale(1)}25%{transform:translate(38px,26px) scale(1.06)}50%{transform:translate(-26px,46px) scale(.94)}75%{transform:translate(17px,-17px) scale(1.03)}}.movie-card:after{content:"";position:absolute;top:0;left:-110%;width:58%;height:100%;background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.045) 42%,rgba(255,255,255,.08) 50%,rgba(255,255,255,.045) 58%,transparent 100%);transform:skew(-18deg);pointer-events:none;z-index:3;border-radius:inherit}@media(hover:hover)and (pointer:fine){.movie-card:hover:after{left:160%;transition:left .65s cubic-bezier(.4,0,.2,1)}}@keyframes glowBreath{0%,to{opacity:.65}50%{opacity:1}}.nav-btn.active:after{animation:glowBreath 3.2s ease-in-out infinite}@keyframes iconGlow{0%,to{filter:drop-shadow(0 0 5px rgba(244,114,182,.55))}50%{filter:drop-shadow(0 0 14px rgba(244,114,182,1))}}.bottom-nav-btn.active i{animation:iconGlow 3s ease-in-out infinite}@keyframes scrollBtnGlow{0%,to{box-shadow:0 4px 20px var(--glow)}50%{box-shadow:0 6px 32px var(--glow-strong)}}#scrollToTopBtn:not(.opacity-0){animation:scrollBtnGlow 2.8s ease-in-out infinite}.card-skeleton{animation-duration:1.45s!important;animation-timing-function:cubic-bezier(.4,0,.2,1)!important}.loading-spinner{animation-duration:.72s}::-webkit-scrollbar-thumb{transition:background .25s ease}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.ambient-orbs{display:none}}
