.hero{height:auto;min-height:min(90vh,900px)}
.hero>.wrap{min-height:inherit;padding-top:120px}
.hc{max-width:680px}
.htitle.xlong{font-size:clamp(26px,2.7vw,40px);line-height:1.12;letter-spacing:-.025em;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.orig{font-size:15px;color:var(--tx3);margin:-6px 0 14px;letter-spacing:-.01em;max-width:620px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.htitle{overflow-wrap:anywhere}
.hc .eyebrow,.hc .orig,.hc .meta,.hc .hnote{text-shadow:0 1px 10px rgba(0,0,0,.75)}
.hc .htitle,.hc .hdesc{text-shadow:0 2px 18px rgba(0,0,0,.55)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 60% 75% at 18% 62%,rgba(0,0,0,.5),transparent 70%)}
.hdesc{cursor:pointer;transition:color .2s}
.hdesc:hover{color:#fff}
.more-d{display:inline-flex;align-items:center;gap:4px;margin-top:6px;color:var(--tx);font-weight:600;font-size:15px}
.more-d:hover{text-decoration:underline}

/* App Store style facts */
.facts{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(128px,1fr);overflow-x:auto;scrollbar-width:none;margin-top:8px;padding:18px 0;border-top:1px solid var(--sep);border-bottom:1px solid var(--sep)}
.facts::-webkit-scrollbar{display:none}
.fact{position:relative;text-align:center;padding:0 14px;min-width:0}
.fact+.fact::before{content:"";position:absolute;left:0;top:12%;bottom:12%;width:1px;background:var(--sep)}
.fact small{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--tx3);white-space:nowrap}
.fact b{display:block;margin:7px 0 3px;font-size:22px;font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--tx2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fact b.sm{font-size:17px;padding-top:3px}
.fact span{display:block;font-size:12px;color:var(--tx3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fact .stars{letter-spacing:1px;color:var(--tx3)}
.fact .stars i{font-style:normal;color:var(--tx2)}
.fact.live b{color:var(--green)}

/* local nav (apple.com product pages) */
.lnav{position:fixed;top:48px;left:0;right:0;z-index:55;background:rgba(22,22,23,.8);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:.5px solid rgba(255,255,255,.12);transform:translateY(-110%);opacity:0;pointer-events:none;transition:transform .45s var(--ease),opacity .3s}
.lnav.on{transform:none;opacity:1;pointer-events:auto}
.lnav .wrap{display:flex;align-items:center;gap:14px;height:52px}
.lnav img{width:26px;aspect-ratio:2/3;border-radius:4px;object-fit:cover;flex-shrink:0}
.lnav b{font-size:17px;font-weight:600;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.lnav nav{display:flex;gap:20px;margin-left:auto;flex-shrink:0}
.lnav nav a{font-size:12px;color:var(--tx2);transition:color .2s}
.lnav nav a:hover,.lnav nav a.on{color:var(--tx)}
.lnav .bplay{height:28px;padding:0 14px;font-size:12px;flex-shrink:0}
.lnav .bplay:hover{transform:none}

/* screenshots + lightbox */
.rail.shots{grid-auto-columns:clamp(260px,30vw,420px)}
.shot{display:block;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:var(--t2);outline:.5px solid rgba(255,255,255,.1);outline-offset:-.5px;cursor:zoom-in}
.shot img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.shot:hover img{transform:scale(1.05)}
.lb{position:fixed;inset:0;z-index:120;background:rgba(0,0,0,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .25s var(--ease)}
.lb.on{opacity:1;pointer-events:auto}
.lb img{max-width:min(1400px,92vw);max-height:84vh;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.lb .x{position:absolute;top:18px;right:18px}
.lb .nv{position:absolute;top:50%;margin-top:-24px}
.lb .nv.l{left:18px}.lb .nv.r{right:18px}
.lb .cnt{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:13px;color:var(--tx2);background:rgba(40,40,42,.7);padding:5px 12px;border-radius:99px}

/* description sheet */
.dm{position:fixed;inset:0;z-index:115;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .25s var(--ease)}
.dm.on{opacity:1;pointer-events:auto}
.dm .pn{position:relative;width:min(720px,100%);max-height:84vh;display:flex;flex-direction:column;border-radius:24px;background:rgba(30,30,32,.94);backdrop-filter:saturate(180%) blur(40px);-webkit-backdrop-filter:saturate(180%) blur(40px);border:.5px solid rgba(255,255,255,.12);box-shadow:0 40px 100px rgba(0,0,0,.6);overflow:hidden;transform:translateY(16px) scale(.98);transition:transform .35s var(--ease)}
.dm.on .pn{transform:none}
.dm .hd{display:flex;gap:16px;align-items:center;padding:22px 64px 18px 24px;border-bottom:1px solid var(--sep)}
.dm .hd img{width:54px;aspect-ratio:2/3;border-radius:8px;object-fit:cover;flex-shrink:0}
.dm .hd h3{font-size:20px;font-weight:700;letter-spacing:-.025em;line-height:1.2;overflow-wrap:anywhere}
.dm .hd p{font-size:13px;color:var(--tx3);margin-top:3px;overflow-wrap:anywhere}
.dm .bd{overflow-y:auto;padding:20px 24px 26px;font-size:16px;line-height:1.65;color:rgba(245,245,247,.88)}
.dm .bd p+p{margin-top:12px}
.dm .bd .chips{margin-top:20px}
.dm .x{position:absolute;top:16px;right:16px}
.stat{display:inline-flex;align-items:center;gap:6px}
.stat i{width:7px;height:7px;border-radius:50%;background:var(--green)}
.stat.soon i{background:var(--yellow)}
.stat.done i{background:var(--tx3)}

/* episodes */
.eph{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.eph h2{font-size:clamp(21px,2vw,24px);font-weight:600;letter-spacing:-.025em}
.eph .sp{flex:1}
.eph .cnt{font-size:14px;color:var(--tx3)}
.tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0 4px}
.ep .ct{-webkit-line-clamp:1}
.ep.off{pointer-events:none}
.ep.off .art{opacity:.45}
.ep .lbl.ok{background:rgba(48,209,88,.85);color:#000}
.ep.cur .art{box-shadow:0 0 0 2px var(--tx)}

/* air schedule */
.air{border-radius:18px;background:var(--t1);overflow:hidden}
.ar{display:grid;grid-template-columns:44px minmax(0,1fr) auto 130px;align-items:center;gap:14px;padding:12px 18px;font-size:14px}
.ar+.ar{border-top:1px solid var(--sep)}
a.ar{transition:background .2s}
a.ar:hover{background:rgba(255,255,255,.05)}
.ar .an{font-size:13px;font-weight:600;color:var(--tx4);font-variant-numeric:tabular-nums}
.ar .at{min-width:0}
.ar .at b{display:block;font-weight:600;letter-spacing:-.015em}
.ar .at small{display:block;font-size:13px;color:var(--tx3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar .ad{font-size:13px;color:var(--tx2);white-space:nowrap;font-variant-numeric:tabular-nums}
.ar .as{font-size:13px;color:var(--tx3);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.ar .as.ok{color:var(--green);font-weight:600}
.ar.nx{background:rgba(48,209,88,.07)}
.ar.nx .an,.ar.nx .as{color:var(--green)}
.air .moreb{display:flex;justify-content:center;width:100%;padding:14px;border-top:1px solid var(--sep);font-size:14px}

/* cast */
.cast{grid-auto-columns:clamp(96px,9vw,120px)}
.cast a{display:block;text-align:center}
.cast .ph{width:100%;aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--t2);outline:.5px solid rgba(255,255,255,.1);outline-offset:-.5px;transition:transform .45s var(--ease)}
.cast a:hover .ph{transform:scale(1.05)}
.cast .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.cast b{display:block;margin-top:10px;font-size:14px;font-weight:500;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cast small{display:block;font-size:12px;color:var(--tx3);margin-top:2px}

/* info */
.info{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 40px;padding:28px 0 0;border-top:1px solid var(--sep)}
.info h4{font-size:14px;font-weight:600;color:var(--tx);margin-bottom:4px}
.info p{font-size:14px;color:var(--tx3);line-height:1.5}
.info p a{color:var(--tx2)}
.info p a:hover{color:var(--tx);text-decoration:underline}
.scores{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin-top:32px;padding:24px;border-radius:18px;background:var(--t1)}
.scores .big{font-size:64px;font-weight:700;letter-spacing:-.04em;line-height:1}
.scores .big small{display:block;font-size:13px;font-weight:500;color:var(--tx3);letter-spacing:-.01em;margin-top:6px}
.bars{flex:1;min-width:240px;display:grid;gap:5px}
.bar{display:grid;grid-template-columns:22px 1fr 60px;align-items:center;gap:10px;font-size:12px;color:var(--tx3);font-variant-numeric:tabular-nums}
.bar span{height:6px;border-radius:99px;background:var(--t3);overflow:hidden}
.bar span i{display:block;height:100%;border-radius:99px;background:var(--tx2)}
.bar em{font-style:normal;text-align:right}
.dubs{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.dubs span{font-size:12.5px;padding:4px 10px;border-radius:99px;background:var(--t2);color:var(--tx2)}

/* trailer modal */
.modal{position:fixed;inset:0;z-index:110;background:rgba(0,0,0,.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:grid;place-items:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .25s var(--ease)}
.modal.on{opacity:1;pointer-events:auto}
.modal .box{width:min(1100px,100%);aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.modal iframe{width:100%;height:100%;border:0}
.modal .x{position:absolute;top:18px;right:18px}

.notfound{min-height:70vh;display:grid;place-items:center;text-align:center;padding:120px 20px}
.notfound h1{font-size:40px;font-weight:700;letter-spacing:-.03em}
.notfound p{color:var(--tx3);margin:8px 0 22px}

@media (max-width:1068px){.info{grid-template-columns:1fr 1fr}.lnav nav{display:none}.lnav .bplay{margin-left:auto}}
@media (max-width:734px){
  .hero{height:auto;min-height:0}
  .hero>.wrap{padding-top:88px;padding-bottom:36px;min-height:0}
  .hero::before{background:linear-gradient(to top,rgba(0,0,0,.55) 0%,rgba(0,0,0,.45) 55%,rgba(0,0,0,.2) 100%)}
  .hc{max-width:100%}
  .facts{grid-auto-columns:104px;margin:0 calc(var(--px) * -1);padding:16px var(--px)}
  .fact{padding:0 10px}
  .fact b{font-size:18px}
  .lnav{top:48px}
  .lnav .wrap{height:48px;gap:10px}
  .lnav b{font-size:14px}
  .dm{padding:0;place-items:end stretch}
  .dm .pn{width:100%;max-height:88vh;border-radius:22px 22px 0 0;transform:translateY(100%)}
  .lb .nv{display:none}
  .lb img{max-width:100vw;max-height:78vh;border-radius:0}
  .info{grid-template-columns:1fr;gap:20px}
  .tools{flex-direction:column;align-items:stretch}
  .tools .pop,.tools .pop select{width:100%}
  .tools .seg{width:100%}
  .eph{gap:8px}
  .scores{padding:18px;gap:18px}
  .scores .big{font-size:48px}
  .cta .bplay{width:100%}
  .ar{grid-template-columns:30px minmax(0,1fr) auto;gap:4px 10px;padding:11px 14px}
  .ar .ad{grid-column:2;grid-row:2;font-size:12px;color:var(--tx3)}
  .ar .as{grid-column:3;grid-row:1/span 2}
  .ar .an{grid-row:1/span 2}
}
/* mobile hero: readable on bright frames, fades into the page with no visible step; facts fit the screen */
@media (max-width:734px){
  .hero::before{background:linear-gradient(to top,rgba(0,0,0,.86) 0%,rgba(0,0,0,.72) 45%,rgba(0,0,0,.45) 75%,rgba(0,0,0,.3) 100%);
    -webkit-mask-image:linear-gradient(to bottom,#000 80%,transparent 100%);mask-image:linear-gradient(to bottom,#000 80%,transparent 100%)}
  .hero .hc :is(.eyebrow,.orig,.meta,.hnote,.hdesc){text-shadow:0 1px 10px rgba(0,0,0,.55)}
  .ambient img{filter:blur(110px) saturate(1.3) brightness(.28)}
  /* facts: one compact row that scrolls sideways, fading out at the edge */
  .facts{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:92px;overflow-x:auto;scroll-snap-type:x proximity;overscroll-behavior-x:contain;
    margin:0 calc(var(--px) * -1);padding:14px var(--px);
    -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent)}
  .fact{padding:0 8px;scroll-snap-align:start}
  .fact small{font-size:10px}
  .fact b{font-size:17px;margin:5px 0 2px}
  .fact b.sm{font-size:15px}
  .fact span{font-size:11px}
}
@media (min-width:735px) and (max-width:1068px){
  .hero::before{background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.65) 50%,rgba(0,0,0,.4) 100%);-webkit-mask-image:linear-gradient(to bottom,#000 80%,transparent 100%);mask-image:linear-gradient(to bottom,#000 80%,transparent 100%)}
  .ambient img{filter:blur(110px) saturate(1.3) brightness(.3)}
}
/* air schedule: a short box that scrolls on its own instead of a page-long list */
.air-l{max-height:348px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;position:relative}
.ar.nx{background:rgba(48,209,88,.08)}
@media (max-width:734px){
  .air-l{max-height:300px}
  .ar{padding:9px 14px;gap:10px}
  .ar .at small{font-size:12px}
}
/* eyebrow items: the dot belongs to the item, and on phones the next-episode note takes its own line without one */
.hero .hc .eyebrow .es::before{content:"·";margin-right:6px;opacity:.75}
@media (max-width:734px){ .hero .hc .eyebrow .enx{flex-basis:100%} .hero .hc .eyebrow .enx::before{display:none} }
