:root{
  --ease:cubic-bezier(.32,.72,0,1);
  --spring:cubic-bezier(.34,1.4,.64,1);
  --sf:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter","Segoe UI",system-ui,sans-serif;
  --display:var(--sf);
  --glass:linear-gradient(150deg,rgba(255,255,255,.15) 0%,rgba(255,255,255,.045) 48%,rgba(255,255,255,.085) 100%);
  --glass-dark:linear-gradient(150deg,rgba(40,44,54,.74),rgba(18,20,26,.72));
  --glass-line:rgba(255,255,255,.2);
  --glass-edge:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(255,255,255,.07),inset 1px 0 0 rgba(255,255,255,.1),inset -1px 0 0 rgba(255,255,255,.05);
  --glass-drop:0 18px 50px -14px rgba(0,0,0,.65),0 2px 8px rgba(0,0,0,.25);
  --blur:blur(26px) saturate(190%);
  --r-lg:28px;--r-md:18px;--r-sm:12px;
}
body,button,input,select,textarea{font-family:var(--sf)}
body{-webkit-font-smoothing:antialiased;letter-spacing:-.011em}
h1,h2,h3,h4,.price,.rank,.stat b,.kpi b{font-family:var(--sf)!important}
h1,h2,h3{letter-spacing:-.034em}

body::before{content:"";position:fixed;inset:-25vmax;z-index:-1;pointer-events:none;will-change:transform;
  background:
    radial-gradient(38vmax 38vmax at 14% 8%,rgba(16,110,235,.26),transparent 62%),
    radial-gradient(42vmax 42vmax at 92% 78%,rgba(0,185,255,.15),transparent 62%),
    radial-gradient(34vmax 34vmax at 72% 16%,rgba(96,64,230,.13),transparent 62%);
  animation:ambient 38s ease-in-out infinite alternate}
@keyframes ambient{from{transform:translate3d(-2%,-1%,0) rotate(0)}to{transform:translate3d(3%,2%,0) rotate(6deg)}}

.links,.btn,.sheet,.hov,.acc-card,.plan,.perk,.kpi,.adm-card,.auth-card,.umenu,.notif,.filters button,.ep,.pf-av,.tmdb-list,.toast,.tabbar,.at,.adm-side,.seg,.search2,.field input,.field select,.field textarea{
  --hl:radial-gradient(220px circle at var(--mx,-999px) var(--my,-999px),rgba(255,255,255,.2),transparent 70%)}

.nav{top:0;left:0;right:0;height:76px;padding:0 max(16px,2.2vw);border-radius:0;gap:14px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;
  background:linear-gradient(to bottom,rgba(6,8,12,.72),rgba(6,8,12,0));border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
  transition:background .5s var(--ease),transform .6s var(--ease)}
.nav.scrolled{background:linear-gradient(to bottom,rgba(6,8,12,.86),rgba(6,8,12,0));border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding-block:0}
.nav.hide{transform:translateY(-130%)}
.nav .logo{justify-self:start}
.nav-right{justify-self:end;margin-left:0}
.links{justify-self:center;display:flex;gap:2px;padding:5px;border-radius:99px;background:var(--hl),var(--glass);border:1px solid var(--glass-line);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--glass-edge),0 12px 34px -12px rgba(0,0,0,.6)}
.links.nav-glass,.links{--hl:radial-gradient(180px circle at var(--mx,-999px) var(--my,-999px),rgba(255,255,255,.22),transparent 70%)}
.links a{border-radius:99px;padding:9px 15px;font-weight:550;color:#e8eaf0;transition:background .3s var(--ease),color .3s}
.links a:hover{background:rgba(255,255,255,.12)!important;color:#fff}
.links a.active{background:rgba(255,255,255,.2)!important;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 2px 10px rgba(0,0,0,.25)}
.nsearch{border-radius:99px;height:40px}
.nsearch.open{background:rgba(0,0,0,.55);border-color:rgba(255,255,255,.4)}
.icon-btn{border-radius:50%;transition:background .3s,transform .4s var(--ease)}
.icon-btn:hover{background:rgba(255,255,255,.12);transform:scale(1.06);color:#fff}
.nav-right{gap:8px}
.btn-premium{border-radius:99px;height:40px;padding:0 15px;background:linear-gradient(180deg,rgba(255,214,130,.95),rgba(255,160,60,.92))!important;color:#2a1700;border:1px solid rgba(255,255,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 8px 24px -8px rgba(255,170,60,.7)}
.avatar{border-radius:50%;width:38px;height:38px;border:1px solid rgba(255,255,255,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.avatar:hover{transform:scale(1.07);box-shadow:0 0 0 3px rgba(255,255,255,.3)}
.avatar.av-img{border-radius:50%}
main[data-page]:not([data-page="home"]):not([data-page="title"]){padding-top:104px}
.adm{padding-top:84px}.adm-side{top:84px;height:calc(100vh - 84px)}

.btn{height:48px;padding:0 26px;border-radius:99px;font-weight:600;letter-spacing:-.01em;border:1px solid transparent;
  transition:transform .5s var(--ease),background .35s,box-shadow .35s,border-color .35s}
.btn:hover{transform:translateY(-1px) scale(1.02)}
.btn:active{transform:scale(.95);transition-duration:.12s}
.btn-primary{background:linear-gradient(180deg,#58bcff 0%,#1a8cf0 52%,#0b66c9 100%);color:#fff;border-color:rgba(255,255,255,.38);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -10px 18px rgba(0,50,130,.35),0 12px 30px -10px rgba(25,140,255,.75)}
.btn-primary:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -10px 18px rgba(0,50,130,.3),0 16px 38px -10px rgba(40,160,255,.95)}
.btn-ghost,.hero .btn-ghost,.tpage .btn-ghost{background:var(--hl),var(--glass);border:1px solid var(--glass-line);color:#fff;
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--glass-edge),0 8px 24px -10px rgba(0,0,0,.5)}
.btn-ghost:hover,.hero .btn-ghost:hover,.tpage .btn-ghost:hover{background:var(--hl),linear-gradient(150deg,rgba(255,255,255,.22),rgba(255,255,255,.08));border-color:rgba(255,255,255,.4)}
.btn-light{background:linear-gradient(180deg,#fff,#e9edf5);color:#0a0c12;box-shadow:inset 0 1px 0 #fff,0 12px 30px -10px rgba(255,255,255,.35)}
.btn-light:hover{background:linear-gradient(180deg,#fff,#f3f6fb);box-shadow:inset 0 1px 0 #fff,0 16px 36px -10px rgba(255,255,255,.5)}
.btn-danger{border-radius:99px}
.btn-sm{height:38px;padding:0 16px;font-size:.88rem}
.mylist-btn.on{background:var(--hl),linear-gradient(150deg,rgba(255,255,255,.28),rgba(255,255,255,.1))!important}

.hero{margin:12px max(12px,1.6vw) 0;height:min(calc(100vh - 24px),900px);min-height:560px;border-radius:34px;border:1px solid rgba(255,255,255,.1);
  box-shadow:0 40px 100px -30px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.4)}
.hero::after{background:
  linear-gradient(77deg,rgba(6,8,12,.88) 0%,rgba(6,8,12,.55) 30%,rgba(6,8,12,0) 64%),
  linear-gradient(to top,rgba(8,8,8,.96) 1%,rgba(8,8,8,.7) 16%,rgba(8,8,8,0) 48%),
  linear-gradient(to bottom,rgba(6,8,12,.55) 0%,rgba(6,8,12,0) 22%)}
.slide{padding-inline:clamp(26px,4.4vw,72px);transition:opacity 1.1s var(--ease),visibility 1.1s}
.slide h1{font-weight:750;letter-spacing:-.045em;line-height:.94}
.feat-tag{padding:7px 14px 7px 12px;border-radius:99px;background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--glass-edge);letter-spacing:.14em;font-size:.7rem}
.feat-tag i{height:14px;width:4px}
.slide-copy>*{will-change:transform,opacity}
.slide.on .slide-copy>*{animation:rise 1s var(--ease) backwards}
.slide.on .slide-copy>:nth-child(1){animation-delay:.1s}.slide.on .slide-copy>:nth-child(2){animation-delay:.18s}.slide.on .slide-copy>:nth-child(3){animation-delay:.26s}
.slide.on .slide-copy>:nth-child(4){animation-delay:.34s}.slide.on .slide-copy>:nth-child(5){animation-delay:.42s}.slide.on .slide-copy>:nth-child(6){animation-delay:.5s}
@keyframes rise{from{opacity:0;transform:translate3d(0,26px,0)}}
.meta .chip,.hov-meta .chip{border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);padding:2px 10px;backdrop-filter:blur(10px)}
.hero-side{padding:9px 16px;border-radius:99px;background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(18px) saturate(170%);-webkit-backdrop-filter:blur(18px) saturate(170%);box-shadow:var(--glass-edge)}
.hero .dots button{height:5px;border-radius:99px;background:rgba(255,255,255,.3)}
.hero .dots button.on{background:rgba(255,255,255,.25)}

.rows{margin-top:-84px}
.row-head h2{font-size:clamp(1.15rem,1.7vw,1.6rem);font-weight:700;letter-spacing:-.03em}
.more-link{padding:5px 12px;border-radius:99px;background:rgba(255,255,255,.08);color:#9fd6ff}
.more-link:hover{background:rgba(255,255,255,.16)}
.card .poster{border-radius:16px;box-shadow:0 0 0 1px rgba(255,255,255,.09),0 14px 34px -14px rgba(0,0,0,.85)!important;transition:filter .4s var(--ease),box-shadow .4s!important}
.card:hover .poster{filter:brightness(1.1) saturate(1.1)}
.card .tag{border-radius:99px;padding:4px 9px;background:rgba(10,12,18,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18);font-weight:700}
.card .tag.early{background:linear-gradient(180deg,rgba(80,185,255,.9),rgba(20,120,225,.9))}
.card .pbadge{height:5px;border-radius:99px;left:8px;right:8px;bottom:8px;background:rgba(255,255,255,.25);backdrop-filter:blur(6px)}
.card .pbadge i{border-radius:99px}
.rail.top .rank{-webkit-text-stroke:2px rgba(255,255,255,.4)}
.hov{border-radius:22px;background:var(--glass-dark);border:1px solid var(--glass-line);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  box-shadow:var(--glass-edge),0 30px 70px -14px rgba(0,0,0,.85);transition:transform .45s var(--ease),opacity .25s}
.hov-img::after{background:linear-gradient(to top,rgba(24,26,32,.95) 0%,transparent 55%)}
.rbtn{border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(10px);transition:transform .4s var(--ease),background .25s,border-color .25s}
.rbtn:hover{transform:scale(1.12);background:rgba(255,255,255,.24);border-color:#fff}
.rbtn.rplay{background:linear-gradient(180deg,#fff,#dfe5ef);border-color:#fff;color:#000}
.rbtn.rplay.prem{background:linear-gradient(180deg,#58bcff,#0b66c9);border-color:rgba(255,255,255,.5);color:#fff}
.qadd{backdrop-filter:blur(10px)}

.filters button,.tabs button{border-radius:99px;background:var(--hl),var(--glass);border:1px solid var(--glass-line);color:#e0e3ea;font-weight:550;
  backdrop-filter:blur(16px) saturate(170%);-webkit-backdrop-filter:blur(16px) saturate(170%);box-shadow:var(--glass-edge);transition:transform .4s var(--ease),background .3s,color .3s}
.filters button.on,.tabs button.on{background:linear-gradient(180deg,#fff,#dfe5ef);color:#0a0c12;border-color:#fff;box-shadow:0 8px 24px -8px rgba(255,255,255,.4)}
.filters button:hover{transform:translateY(-2px)}

.thero{border-radius:0 0 40px 40px;box-shadow:0 30px 80px -30px rgba(0,0,0,.9)}
.tposter .poster{border-radius:22px;box-shadow:0 40px 90px -20px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.16)}
.tmain h1{font-weight:750;letter-spacing:-.045em}
.gl{border-radius:99px;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);backdrop-filter:blur(10px)}
.ep{border-radius:20px;border:1px solid transparent;margin-top:6px;transition:background .35s var(--ease),transform .5s var(--ease),border-color .35s}
.ep:hover,.ep:focus-visible{background:var(--hl),var(--glass);border-color:var(--glass-line);transform:translateY(-2px);box-shadow:var(--glass-edge)}
.ep-img{border-radius:14px}
.eplist{border-top:0}.ep{border-bottom:0}

.sheet,.login,.auth-card,.acc-card,.plan,.perk{background:var(--hl),var(--glass-dark);border:1px solid var(--glass-line);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--glass-edge),var(--glass-drop)}
.sheet{border-radius:var(--r-lg);animation:sheetIn .6s var(--ease) both}
@keyframes sheetIn{from{opacity:0;transform:translate3d(0,34px,0) scale(.95)}}
.modal,.modal:has(.player){background:rgba(4,6,10,.55);backdrop-filter:blur(26px) saturate(150%);-webkit-backdrop-filter:blur(26px) saturate(150%);animation:fade .4s var(--ease)}
.close{border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(12px);box-shadow:var(--glass-edge)}
.acc-card,.perk{border-radius:var(--r-md)}
.plan{border-radius:var(--r-lg);transition:transform .6s var(--ease),box-shadow .5s}
.plan:hover{transform:translateY(-8px) scale(1.01)}
.plan.best{background:var(--hl),var(--glass-dark) padding-box,linear-gradient(135deg,#58bcff,#2ed3f0,#58bcff) border-box;border:1.5px solid transparent;box-shadow:var(--glass-edge),0 40px 90px -30px rgba(27,156,242,.6)}
.plan .pill{border-radius:99px;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.perk{transition:transform .5s var(--ease)}.perk:hover{transform:translateY(-6px);background:var(--hl),var(--glass-dark)}
.auth-card{padding:38px 34px;border-radius:var(--r-lg)}
.umenu,.notif,.tmdb-list{border-radius:20px;background:var(--hl),var(--glass-dark);border:1px solid var(--glass-line);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--glass-edge),var(--glass-drop);animation:menuIn .35s var(--ease) both;transform-origin:top right}
@keyframes menuIn{from{opacity:0;transform:translateY(-8px) scale(.94)}}
.umenu a,.umenu button{border-radius:12px;transition:background .2s}
.notif{overflow:hidden}
.toast{background:var(--glass-dark);color:#fff;border:1px solid var(--glass-line);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--glass-edge),var(--glass-drop);transition:transform .6s var(--ease),opacity .4s}

.field input,.field select,.field textarea,.acc-card input,.adm-bar select,.at-user select,.promo-new input{background:var(--hl),rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:14px;box-shadow:inset 0 1px 2px rgba(0,0,0,.35);transition:border-color .3s,box-shadow .3s,background .3s}
.field input:focus,.field select:focus,.field textarea:focus,.acc-card input:focus{border-color:rgba(88,188,255,.9);box-shadow:inset 0 1px 2px rgba(0,0,0,.35),0 0 0 4px rgba(40,150,255,.25)}
.search2{background:var(--hl),rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(14px)}
.search2:focus-within{border-color:rgba(88,188,255,.9);box-shadow:0 0 0 4px rgba(40,150,255,.2)}

.controls{background:rgba(14,16,22,.62);backdrop-filter:blur(24px) saturate(170%);-webkit-backdrop-filter:blur(24px) saturate(170%);border-top:1px solid rgba(255,255,255,.12)}
.controls button{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);transition:transform .35s var(--ease),background .25s}
.controls button:hover{transform:scale(1.1);background:rgba(255,255,255,.26)}
.player{border-radius:var(--r-lg)}.player.fill{border-radius:0}

.pf-av{border-radius:26%;border:1px solid var(--glass-line);box-shadow:var(--glass-edge),0 18px 40px -14px rgba(0,0,0,.8)}
.pf:hover .pf-av,.pf:focus-visible .pf-av{transform:scale(1.08);box-shadow:var(--glass-edge),0 0 0 3px rgba(255,255,255,.9),0 26px 50px -14px rgba(0,0,0,.9)}
.pf-opt img{border-radius:26%}.pf-k{border-radius:16px;background:rgba(255,255,255,.04)}

.tabbar{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));border-radius:26px;border:1px solid var(--glass-line);background:var(--hl),var(--glass-dark);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--glass-edge),var(--glass-drop);padding:8px}
.tabbar a{border-radius:18px;transition:background .3s,color .3s,transform .4s var(--ease)}
.tabbar a.active{background:rgba(255,255,255,.14)}
.tabbar a:active{transform:scale(.92)}

.adm-side{background:var(--glass-dark);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-right:1px solid var(--glass-line);margin:0}
.adm-side nav a{border-radius:14px}
.adm-side nav a.on{background:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.kpi,.adm-card,.at{background:var(--hl),var(--glass-dark);border:1px solid var(--glass-line);border-radius:var(--r-md);backdrop-filter:blur(20px) saturate(170%);-webkit-backdrop-filter:blur(20px) saturate(170%);box-shadow:var(--glass-edge),0 14px 40px -18px rgba(0,0,0,.7)}
.seg{background:var(--hl),rgba(255,255,255,.07);border-color:var(--glass-line);border-radius:99px}
.seg button{border-radius:99px}.seg button.on{background:rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.at-row:hover{background:rgba(255,255,255,.05)}
.adm .table,.table{background:var(--glass-dark);border:1px solid var(--glass-line);border-radius:var(--r-md);backdrop-filter:blur(18px)}
.footer{border-top:1px solid rgba(255,255,255,.08)}
.skel-hero{border-radius:34px}.skel-row i{border-radius:16px}

@media (max-width:1180px){.btn-premium{padding:0 11px;font-size:.78rem}.nav-right .btn-sm{padding:0 12px}.links a{padding:8px 10px;font-size:.84rem}}
@media (max-width:1100px){.links a{padding:8px 9px}.nsearch.open input{width:min(180px,26vw)}}
@media (max-width:860px){
  .nav{height:60px;padding:0 14px;display:flex}
  .links{display:none}
  .hero{margin:8px 8px 0;border-radius:26px;height:min(80vh,660px)}
  .rows{margin-top:-40px}
  main[data-page]:not([data-page="home"]):not([data-page="title"]){padding-top:84px}
  .adm{padding-top:70px}.adm-side{top:70px;height:auto;border-right:0;border-bottom:1px solid var(--glass-line)}
  .thero{border-radius:0 0 28px 28px}
}
@media (prefers-reduced-motion:reduce){body::before{animation:none}.slide.on .slide-copy>*{animation:none}.sheet,.umenu,.notif,.tmdb-list{animation:none}}

.hero-vid{position:absolute;inset:0;z-index:1;overflow:hidden;opacity:0;transition:opacity 1.5s var(--ease);pointer-events:none;background:#000;container-type:size}
.hero-vid.on{opacity:1}
.hero-vid iframe{position:absolute;top:50%;left:50%;width:max(100%,calc(100vh * 1.7778));height:max(100%,calc(100vw * .5625));border:0;transform:translate(-50%,-50%) scale(1.25);pointer-events:none}
@supports (width:1cqw){.hero-vid iframe{width:max(100cqw,177.78cqh);height:max(100cqh,56.25cqw)}}
@media (prefers-reduced-motion:reduce){.hero-vid{display:none}}
