
:root{--bg:#050507;--panel:#0d0d12;--panel2:#12121a;--text:#faf9fc;--muted:#a7a2b0;--purple:#8e2eff;--purple2:#5b18bb;--line:#25222d}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}
.topbar{height:68px;position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:24px;padding:0 4vw;background:rgba(5,5,7,.95);backdrop-filter:blur(18px);border-bottom:1px solid #19171e}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:20px;white-space:nowrap}.brand b{color:var(--purple)}.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:linear-gradient(145deg,var(--purple),#bb5eff);clip-path:polygon(0 0,100% 0,76% 100%,24% 100%);font-weight:900}
nav{display:flex;gap:20px;font-size:14px;color:#d8d5de}nav a.active,nav a:hover{color:#fff}.actions{margin-left:auto;display:flex;align-items:center;gap:9px}.primary,.watch-btn{border:0;background:linear-gradient(135deg,var(--purple),var(--purple2));color:#fff;padding:11px 16px;border-radius:8px;font-weight:800}.ghost,.icon{border:1px solid #34313d;background:#111117;color:#fff;padding:10px 13px;border-radius:8px}.icon{width:41px}.menu-btn{display:none;background:none;border:0;color:#fff;font-size:25px}
.hero{min-height:56vh;position:relative;display:flex;align-items:flex-end;padding:7vh 6vw 5vh;background:radial-gradient(circle at 75% 25%,rgba(143,46,255,.28),transparent 22%),linear-gradient(100deg,#09080d 10%,#17111f 48%,#07070a 100%);overflow:hidden}.hero:after{content:"";position:absolute;right:4vw;top:12%;width:43vw;height:66%;border-radius:28px;background:linear-gradient(130deg,rgba(255,255,255,.08),transparent 45%),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 2px,transparent 2px 48px);transform:perspective(700px) rotateY(-10deg);box-shadow:0 0 90px rgba(132,44,255,.17)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,7,.97),rgba(5,5,7,.55) 48%,rgba(5,5,7,.04) 78%),linear-gradient(0deg,#050507 0,transparent 33%)}
.hero-content{position:relative;z-index:2;max-width:650px}.eyebrow{display:inline-block;color:#ca9dff;font-weight:800;font-size:12px;letter-spacing:.18em;margin-bottom:10px}.hero h1{font-size:clamp(44px,6vw,82px);line-height:.9;margin:0 0 20px;letter-spacing:-.06em}.hero h1 span{color:var(--purple)}.hero p{max-width:620px;color:#cec9d4;font-size:17px;line-height:1.55}.meta{display:flex;gap:10px;align-items:center;color:#bcb7c6;font-size:13px;margin:16px 0}.rating{border:1px solid #5b5666;padding:2px 7px;border-radius:4px}.hero-buttons{display:flex;gap:10px;margin:18px 0 10px}.secondary{border:1px solid #3a3542;background:#111117;color:white;padding:11px 16px;border-radius:8px}.hero small{color:#8e8995}
.section{padding:32px 5vw}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-title>div{display:flex;align-items:center;gap:10px}.section-title h2{font-size:22px;margin:0}.accent{width:4px;height:22px;border-radius:4px;background:var(--purple)}.text-btn{background:none;border:0;color:#a48daf}
.quick{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.quick a{background:linear-gradient(145deg,#121018,#09090d);border:1px solid #22202a;border-radius:12px;padding:18px;text-align:center;font-weight:700}.quick span{display:block;font-size:24px;margin-bottom:7px}
.carousel,.grid{display:grid;gap:13px}.carousel{grid-auto-flow:column;grid-auto-columns:minmax(180px,1fr);overflow-x:auto;padding-bottom:8px}.grid{grid-template-columns:repeat(6,1fr)}.card{min-width:0}.poster{position:relative;aspect-ratio:2/3;border-radius:10px;overflow:hidden;border:1px solid #2b2835;display:flex;align-items:flex-end;padding:14px;background:#15131a}.poster:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 65% 25%,rgba(255,255,255,.14),transparent 25%),linear-gradient(145deg,var(--c1),var(--c2))}.poster:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.82),transparent 60%)}.poster-title{position:relative;z-index:2;font-size:20px;line-height:.95;font-weight:900;text-transform:uppercase}.badge{position:absolute;top:9px;left:9px;z-index:3;background:#7e25e9;padding:5px 7px;border-radius:5px;font-size:9px;font-weight:900}.card h3{font-size:14px;margin:9px 0 4px}.card p{font-size:12px;color:#8f8b96;margin:0}.card-actions{display:flex;gap:6px;margin-top:8px}.card-actions a,.card-actions button{flex:1;border:1px solid #2b2835;background:#0f0f14;color:white;border-radius:6px;padding:8px;font-size:11px;text-align:center}.card-actions a{background:#20112e;border-color:#4f2373}
.page-hero{padding:56px 5vw 24px;background:radial-gradient(circle at 85% 20%,rgba(143,46,255,.22),transparent 22%),linear-gradient(180deg,#0d0b12,#050507)}.page-hero h1{font-size:46px;margin:6px 0 10px}.page-hero p{color:var(--muted);max-width:720px}.filterbar{display:flex;gap:9px;flex-wrap:wrap;padding:0 5vw 10px}.filterbar button{border:1px solid #2a2732;background:#0f0f14;color:#d8d4df;padding:9px 13px;border-radius:999px}.filterbar button.active{background:#4b1a72;border-color:#8040af;color:white}
.live-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.live-card{background:#0c0c11;border:1px solid #24212d;border-radius:14px;overflow:hidden}.live-art{height:170px;display:grid;place-items:center;text-align:center;font-size:32px;font-weight:900;letter-spacing:-.05em}.purple{background:linear-gradient(135deg,#8b2cff,#26103e)}.red{background:linear-gradient(135deg,#fe315d,#3b0c1b)}.cyan{background:linear-gradient(135deg,#0f95ba,#102442)}.live-copy{padding:18px}.live-copy>span{font-size:10px;color:#ff5571;font-weight:800}.live-copy p{color:#8f8b96;font-size:13px}.live-copy h3{margin:7px 0}
.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.price-card{border:1px solid #30293a;background:linear-gradient(180deg,#14101a,#0b0a0e);border-radius:14px;padding:22px}.price-card.featured{border-color:#7f39a9;box-shadow:0 0 45px rgba(143,46,255,.12)}.price-card h3{margin:0 0 7px}.price{font-size:34px;font-weight:900;color:#c06fff}.price-card ul{color:#aaa4b2;padding-left:18px;min-height:130px}.cta{margin-top:12px;width:100%}
.watch-layout{display:grid;grid-template-columns:2fr 1fr;gap:22px;padding:28px 5vw}.player{aspect-ratio:16/9;border-radius:14px;background:radial-gradient(circle at center,rgba(140,48,255,.23),transparent 28%),#020203;display:grid;place-items:center;align-content:center;text-align:center;border:1px solid #2c2834}.play-circle{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:#8b2cff;font-size:25px;margin-bottom:16px}.player small{color:#817b88}.watch-info{background:#0d0c11;border:1px solid #25222d;border-radius:14px;padding:20px}.watch-info h1{margin:6px 0 10px}.watch-info p{color:#aaa5b0;line-height:1.55}.ad-note{margin-top:14px;border:1px dashed #5c476c;border-radius:10px;padding:12px;color:#bca8c8;font-size:12px}
.search-panel{position:fixed;top:68px;left:0;right:0;z-index:49;background:#09090d;border-bottom:1px solid #2a2732;padding:15px 5vw;display:none}.search-panel.open{display:block}.search-panel input{width:100%;background:#111117;border:1px solid #34313d;color:white;border-radius:9px;padding:13px}.search-results{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.search-results a{background:#121018;border:1px solid #27232f;padding:10px;border-radius:8px;font-size:13px}
footer{border-top:1px solid #1d1b23;margin-top:40px;padding:44px 5vw;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;background:#07070a}footer h4{margin:0 0 12px}footer a,footer span,footer p{display:block;color:#8f8b96;font-size:13px;margin:8px 0}
@media(max-width:1100px){.grid{grid-template-columns:repeat(4,1fr)}.price-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){nav{display:none;position:absolute;top:68px;left:0;right:0;background:#09090d;flex-direction:column;padding:18px 5vw;border-bottom:1px solid #23212a}nav.open{display:flex}.menu-btn{display:block}.actions .ghost,.actions .icon{display:none}.hero{min-height:52vh;padding:4vh 5vw 4vh}.hero:after{width:70vw;opacity:.5}.quick{grid-template-columns:repeat(3,1fr)}.live-grid{grid-template-columns:1fr}.watch-layout{grid-template-columns:1fr}.search-results{grid-template-columns:repeat(2,1fr)}footer{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.topbar{padding:0 16px;gap:12px}.brand{font-size:16px}.actions .primary{padding:9px 11px;font-size:12px}.hero{min-height:auto;padding:54px 18px 34px}.hero:after{top:8%;height:44%;width:78vw;opacity:.35}.hero-content{padding-top:120px}.hero h1{font-size:48px}.hero p{font-size:14px}.section{padding:26px 16px}.quick{grid-template-columns:repeat(2,1fr)}.carousel{grid-auto-columns:46vw}.grid{grid-template-columns:repeat(2,1fr)}.page-hero{padding:38px 16px 20px}.page-hero h1{font-size:36px}.filterbar{padding:0 16px 10px}.price-grid{grid-template-columns:1fr}.search-results{grid-template-columns:1fr}.watch-layout{padding:20px 16px}footer{grid-template-columns:1fr;padding:40px 18px}}

.brand-logo{height:34px;width:auto;display:block}
.poster-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.poster:before,.poster:after{pointer-events:none}
.poster.has-image:before{display:none}
.poster.has-image:after{background:linear-gradient(0deg,rgba(0,0,0,.72),transparent 58%)}
.mylist-empty{padding:40px;border:1px dashed #38313f;border-radius:14px;text-align:center;color:#aaa4b2;background:#0d0c11}

.auth-shell{min-height:calc(100vh - 68px);display:grid;place-items:center;padding:36px 16px;background:
radial-gradient(circle at 75% 20%,rgba(143,46,255,.24),transparent 25%),#050507}
.auth-card{width:min(470px,100%);background:#0d0c12;border:1px solid #2b2632;border-radius:18px;padding:28px;box-shadow:0 26px 70px rgba(0,0,0,.45)}
.auth-card h1{margin:7px 0 8px}.auth-card>p{color:#aaa4b1;margin:0 0 22px}
.form-row{display:grid;gap:7px;margin:13px 0}.form-row label{font-size:12px;color:#c9c4cf;font-weight:700}
.form-row input{width:100%;background:#111017;border:1px solid #35313d;color:#fff;border-radius:9px;padding:13px 14px;outline:none}
.form-row input:focus{border-color:#7e37a8;box-shadow:0 0 0 3px rgba(143,46,255,.1)}
.auth-submit{width:100%;margin-top:10px}.auth-link{text-align:center;color:#aaa3b0;font-size:13px;margin-top:16px}.auth-link a{color:#c27cff}
.notice{display:none;margin:12px 0;border-radius:9px;padding:10px 12px;font-size:13px}.notice.show{display:block}.notice.error{background:#30131a;color:#ff9cac;border:1px solid #66202d}.notice.success{background:#12301f;color:#97f7b8;border:1px solid #205d39}
.account-chip{display:flex;align-items:center;gap:8px;background:#111017;border:1px solid #302b38;padding:7px 10px;border-radius:999px}
.avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#8f2eff,#5520a8);font-weight:900}
.profile-grid{display:grid;grid-template-columns:320px 1fr;gap:20px;padding:28px 5vw}
.profile-card,.profile-section{background:#0d0c11;border:1px solid #26222d;border-radius:14px;padding:20px}
.profile-card .big-avatar{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#8f2eff,#5220a7);font-size:34px;font-weight:900;margin-bottom:14px}
.profile-stat{display:flex;justify-content:space-between;border-top:1px solid #211e27;padding:12px 0;color:#aaa4b1}.profile-stat b{color:white}
.row-scroll{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(180px,1fr);gap:13px;overflow-x:auto;padding-bottom:8px}
.progressbar{height:4px;background:#23202a;border-radius:10px;overflow:hidden;margin-top:7px}.progressbar span{display:block;height:100%;background:#8f2eff}
.profile-actions{display:flex;gap:9px;flex-wrap:wrap}
.account-nav{display:none}
@media(max-width:900px){.profile-grid{grid-template-columns:1fr}.account-nav{display:inline-flex}}


/* V9: clearer empty My List state */
.mylist-empty-actions{
  display:flex;
  flex-direction:column;
  gap:20px;
  align-items:center;
  text-align:center;
}
.empty-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:center;
}
.empty-actions a{
  text-decoration:none;
}
@media (max-width: 600px){
  .empty-actions{
    width:100%;
    flex-direction:column;
  }
  .empty-actions a{
    width:100%;
    box-sizing:border-box;
    text-align:center;
  }
}
