/* 0.6.87 — Film / Serie detail polish. Scope: detail cards only. */

/* The hero owns the title while it is visible; the fixed topbar takes over after scroll. */
.detail-rich .detail-topbar .topbar-copy h1{
  opacity:0;
  transform:translateY(2px);
  transition:opacity .14s ease,transform .14s ease;
}
.detail-rich.detail-title-visible .detail-topbar .topbar-copy h1{
  opacity:1;
  transform:none;
}

/* Personal dossier: more readable tiles; Series contains personal choices only. */
#moviePersonalGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
#moviePersonalGrid .detail-dossier-item{min-height:86px;padding:10px 7px}
#moviePersonalGrid .detail-dossier-item strong{font-size:12px}
#moviePersonalGrid .detail-dossier-item small{font-size:7.2px}
#seriesPersonalGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
#seriesPersonalGrid .detail-dossier-item{min-height:82px;padding:9px 5px}
#seriesPersonalGrid .detail-dossier-item strong{font-size:10.5px}
#seriesPersonalGrid .detail-dossier-item small{font-size:6.8px}

/* Series progress should inform, not dominate the page. */
.series-progress-panel{padding:10px 12px}
.series-progress-panel .detail-kicker{margin-bottom:7px}
.series-progress-summary{align-items:center;justify-content:space-between;gap:14px;margin-bottom:7px}
.series-progress-summary strong{font-size:22px;line-height:1}
.series-progress-summary span{font-size:8.5px;margin:0;text-align:right}
.detail-progress{height:5px;background:var(--surface3)}
.detail-progress span{background:var(--lime)}

/* Next episode is an archive action, never a streaming/play affordance. */
.next-episode-main{grid-template-columns:72px minmax(0,1fr) auto;gap:10px}
.next-episode-action{
  min-width:70px;
  min-height:42px;
  border:1px solid var(--line2);
  border-radius:8px;
  background:var(--surface2);
  color:var(--ink);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  padding:6px 9px;
  font:inherit;
}
.next-episode-action svg{width:16px;height:16px;fill:none;stroke:var(--lime);stroke-width:1.8;stroke-linecap:round}
.next-episode-action span{font-size:7px;line-height:1;text-transform:uppercase;letter-spacing:.06em;color:var(--lime);font-weight:900}
.next-episode-action:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.next-episode-action:active{background:color-mix(in srgb,var(--lime) 8%,var(--surface2))}

/* The next-episode card is the primary registration entry point. */
#seriesPrimaryRegister{display:none!important}
.series-detail-actions{grid-template-columns:1fr;margin-top:0;margin-bottom:12px}
.series-detail-actions #seriesSecondaryAction{min-height:42px}

/* Reuse the approved Season Grid visual language for the on-detail preview. */
.detail-seasons{margin-top:14px}
.detail-season-preview{gap:10px 9px;padding:0;overflow:visible}
.detail-season-preview .season-index-poster{border-radius:8px}
.detail-season-preview .season-index-meta{padding-top:6px}
.detail-season-preview .season-index-meta strong{font-size:9.5px}
.detail-season-preview .season-index-meta small{font-size:7.2px}
.detail-season-preview.is-single{grid-template-columns:1fr}
.detail-season-preview.is-single .season-index-card{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;align-items:center;border:1px solid var(--line);padding:8px;background:var(--surface)}
.detail-season-preview.is-single .season-index-poster{width:76px;aspect-ratio:2/3}
.detail-season-preview.is-single .season-index-meta{padding:0}
.detail-season-preview.is-single .season-index-meta strong{font-size:11px}
.detail-season-preview.is-single .season-index-meta small{font-size:8px;margin-top:5px}

/* Empty copy should not create a dead section. */
#movieOverviewSection[hidden],#seriesOverviewSection[hidden]{display:none!important}

@media(max-width:380px){
  #moviePersonalGrid .detail-dossier-item{min-height:80px}
  #seriesPersonalGrid .detail-dossier-item strong{font-size:9.5px}
  .next-episode-main{grid-template-columns:66px minmax(0,1fr) 62px;gap:8px}
  .episode-still{width:66px;height:48px}
  .next-episode-action{min-width:62px;padding-inline:6px}
}
@media(prefers-reduced-motion:reduce){
  .detail-rich .detail-topbar .topbar-copy h1{transition:none}
}
