/* Movie Hazard Analysis series pages. Loaded after fas.css; uses its tokens. */

/* risk chips: initial → residual */
.rk{display:inline-block;font-family:var(--f-mono);font-weight:600;font-size:.68rem;letter-spacing:.04em;text-transform:uppercase;color:#141414;border-radius:999px;padding:.22rem .6rem;white-space:nowrap}
.rk-arrow{color:var(--silk-dim);font-family:var(--f-mono);font-size:.8rem}
.ep-risk{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}

/* hub: episode grid */
.ep-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:var(--gap)}
.ep-card{position:relative;display:grid;grid-template-rows:auto 1fr;text-decoration:none;color:inherit;background:linear-gradient(180deg,var(--housing-2),#1b1e22);border:1px solid var(--seam);border-radius:var(--r-lg);overflow:hidden;transition:transform .3s ease,border-color .2s}
.ep-card:hover{transform:translateY(-4px);border-color:#4a4f56}
.ep-card img{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;background:#101214}
.ep-card .ep-meta{display:grid;gap:.45rem;align-content:start;padding:.9rem 1rem 1.1rem}
.ep-card h3{margin:0;font-family:var(--f-display);font-weight:800;font-stretch:75%;text-transform:uppercase;font-size:1.25rem;line-height:1.02;color:var(--silk)}
.ep-card h3 small{font-family:var(--f-mono);font-weight:400;font-size:.7rem;color:var(--silk-dim);letter-spacing:.04em}
.ep-card p{margin:0;font-size:.9rem;line-height:1.4;color:var(--silk-2)}
.ep-card:hover h3{color:var(--yellow)}

/* episode page: hero with the video */
.ep-hero .spec-grid{grid-template-columns:1fr minmax(0,340px)}
.ep-hero h1.display{font-size:clamp(2.6rem,7vw,5.4rem)}
.yt{position:relative;width:100%;aspect-ratio:9/16;border-radius:var(--r-lg);overflow:hidden;background:#101214;box-shadow:0 0 0 1px rgba(255,255,255,.06),0 30px 60px -28px rgba(0,0,0,.9)}
.yt img,.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.yt button,.yt a.yt-play{position:absolute;inset:0;display:grid;place-items:center;width:100%;border:0;padding:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.45));cursor:pointer}
.yt button span,.yt a.yt-play span{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--yellow);color:var(--yellow-ink);box-shadow:0 10px 30px rgba(0,0,0,.5);transition:transform .2s}
.yt button:hover span,.yt a.yt-play:hover span{transform:scale(1.08)}
.yt svg{width:30px;height:30px;margin-left:4px}
.yt-foot{display:flex;justify-content:space-between;gap:1rem;margin-top:.7rem;font-family:var(--f-mono);font-size:.7rem;color:var(--silk-dim)}
.yt-foot a{color:var(--silk-2)}

/* risk readout: two LCDs */
.readout{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:center;max-width:560px}
.readout .lcd{display:flex;justify-content:space-between;align-items:flex-end;gap:.75rem}
.readout .seg{font-size:2.4rem}
.readout .arrow{font-family:var(--f-mono);font-size:1.4rem;color:var(--yellow)}
.readout-note{font-size:.88rem;color:var(--silk-dim);margin:.8rem 0 0;max-width:62ch}

/* episode body */
.ep-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:clamp(2rem,5vw,4rem);align-items:start}
.ep-body h2{font-family:var(--f-display);font-stretch:75%;font-weight:800;text-transform:uppercase;font-size:clamp(1.5rem,3vw,2rem);line-height:1;margin:2.2rem 0 .8rem;color:var(--silk)}
.ep-body h2:first-child{margin-top:0}
.ep-body p,.ep-body li{color:var(--silk-2)}
.ep-body ol{padding-left:1.2rem;display:grid;gap:.35rem}
.ep-side{display:grid;gap:var(--gap);position:sticky;top:calc(var(--status-h) + 1.5rem)}
.ep-side .panel h3{margin:.4rem 0 .6rem;font-family:var(--f-display);font-weight:800;font-stretch:75%;text-transform:uppercase;font-size:1.4rem;line-height:1}
.ep-side .panel p{font-size:.95rem;color:var(--silk-2);margin:0 0 1rem}
.fineprint{font-size:.82rem;color:var(--silk-dim);max-width:75ch;margin:2.5rem 0 0;padding-top:1.2rem;border-top:1px solid var(--seam)}

/* prev / next */
.ep-pager{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.ep-pager a{display:grid;gap:.25rem;text-decoration:none;padding:1rem 1.2rem;border:1px solid var(--seam);border-radius:10px;background:var(--housing-2);transition:border-color .2s}
.ep-pager a:hover{border-color:var(--yellow)}
.ep-pager .next{text-align:right;grid-column:2}
.ep-pager b{font-family:var(--f-display);font-stretch:75%;text-transform:uppercase;font-size:1.1rem;color:var(--silk)}

@media (max-width:1000px){
  .ep-hero .spec-grid{grid-template-columns:1fr}
  .ep-hero .yt-wrap{max-width:300px;width:100%;margin:0 auto}
  .ep-body{grid-template-columns:1fr}
  .ep-side{position:static}
}
@media (max-width:560px){
  .ep-grid{grid-template-columns:1fr 1fr;gap:.75rem}
  .ep-card .ep-meta{padding:.7rem .75rem .9rem}
  .ep-card h3{font-size:1.05rem}
  .ep-card p{display:none}
  .readout{gap:.5rem}
  .readout .lcd{flex-direction:column;align-items:flex-start;gap:.2rem}
  .readout .seg{font-size:1.9rem}
  .readout .unit{margin-left:0}
  .ep-pager{grid-template-columns:1fr}
  .ep-pager .next{grid-column:1}
}
.ep-pdf{justify-self:start;font-family:var(--f-mono);font-size:.64rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--yellow);border:1px solid rgba(242,176,30,.4);border-radius:999px;padding:.18rem .55rem}
