/* ═══════════════════════════════════════════════════════════════════════
   videocast.css — the ۲۴ عیار watch surfaces. Built on zarnoush.css.
   ═══════════════════════════════════════════════════════════════════════ */

.video-shell {
  position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--r-media);
  background: var(--ink-950); box-shadow: var(--lift-media);
  animation: player-settle .8s var(--ease) both;
}
.video-shell iframe, .video-shell img {
  position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover;
}
@keyframes player-settle {
  from { clip-path: inset(2% 0 8% 0 round 20px); filter: saturate(.8) brightness(.92); }
  to { clip-path: inset(0 0 0 0 round 20px); filter: none; }
}

/* poster that links to the watch page */
.poster-link { position: relative; display: block; overflow: hidden; border-radius: var(--r-media);
  aspect-ratio: 16 / 9; background: var(--ink-950); box-shadow: var(--lift-media); isolation: isolate; }
.poster-link img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.1s var(--ease), filter .35s; }
.poster-link:hover img { transform: scale(1.03); filter: saturate(1.06); }
.poster-link::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(200deg, rgba(8,13,21,.02) 40%, rgba(8,13,21,.5) 78%, rgba(8,13,21,.86));
}
.poster-link .plate { position: absolute; z-index: 2; inset-inline: clamp(1rem,3vw,1.75rem); bottom: clamp(1rem,3vw,1.5rem); color: #fff; }
.play-disc {
  display: grid; place-items: center; width: 64px; height: 64px; border-radius: 999px;
  background: var(--gold-hi); color: var(--ink-900); box-shadow: var(--lift-play);
  transition: transform .3s var(--ease);
}
.poster-link:hover .play-disc { transform: scale(1.06); }
.play-disc svg { width: 24px; height: 24px; margin-inline-start: 2px; }

/* episode row on the hub */
.episode-row {
  display: grid; gap: 1.25rem; gap: clamp(1rem, .5rem + 2vw, 1.75rem); align-items: center;
  grid-template-columns: minmax(220px, 360px) 1fr auto;
  padding: 1.1rem; padding: clamp(.85rem, .5rem + 1.5vw, 1.35rem);
  border: 1px solid var(--line); border-radius: var(--r-card); background: var(--surface);
  transition: transform .26s var(--ease), border-color .22s, box-shadow .26s var(--ease);
}
.episode-row:hover { transform: translateY(-2px); border-color: rgba(201,151,63,.5); box-shadow: var(--lift-card); }
.episode-row .thumb { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--r-control); background: var(--ink-950); }
.episode-row .thumb img { width: 100%; height: 100%; object-fit: cover; }
.episode-row .go {
  display: grid; place-items: center; width: 46px; height: 46px; border-radius: var(--r-control);
  background: var(--ink-900); color: var(--gold-hi); flex: 0 0 auto;
}
.dark .episode-row .go { background: var(--gold); color: var(--ink-900); }

/* chapter ledger */
.chapter { position: relative; padding-inline-start: 1.7rem; padding-block: 1.1rem; border-top: 1px solid var(--line); }
.chapter:first-child { border-top: 0; padding-top: 0; }
.chapter::before {
  content: ""; position: absolute; inset-inline-start: .1rem; top: 1.35rem;
  width: .55rem; height: .55rem; border-radius: 999px; background: var(--gold);
  box-shadow: 0 0 0 4px var(--paper);
}
.chapter:first-child::before { top: .25rem; }
.chapter:not(:last-child)::after {
  content: ""; position: absolute; inset-inline-start: .35rem; top: 2rem; bottom: -1.1rem; width: 1px; background: var(--line);
}

.meta-chip {
  display: inline-flex; align-items: center; gap: .38rem; padding: .4rem .72rem;
  border-radius: 999px; border: 1px solid var(--line); color: var(--ink-500); font-size: 12px; font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.dark .meta-chip { color: rgba(255,255,255,.58); }
.meta-chip svg { width: 13px; height: 13px; }

.topic-strip { display: grid; grid-template-columns: repeat(3, 1fr); }
.topic-strip > * { padding: 1.1rem 1.25rem; padding: 1.1rem clamp(1rem, 3vw, 1.5rem); display: flex; align-items: center; gap: .75rem; }
.topic-strip > * + * { border-inline-start: 1px solid rgba(255,255,255,.1); }
.topic-strip svg { width: 18px; height: 18px; color: var(--gold-hi); flex: 0 0 auto; }

.transcript summary { list-style: none; cursor: pointer; padding: 1.2rem 1.35rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.transcript summary::-webkit-details-marker { display: none; }
.transcript > div { padding: 1.25rem 1.35rem 1.4rem; border-top: 1px solid var(--line); }
.transcript .chev { transition: transform .26s var(--ease); }
.transcript[open] .chev { transform: rotate(180deg); }

@media (max-width: 767px) {
  .episode-row { grid-template-columns: 1fr; }
  .episode-row .go { display: none; }
  .topic-strip { grid-template-columns: 1fr; }
  .topic-strip > * + * { border-inline-start: 0; border-top: 1px solid rgba(255,255,255,.1); }
}
@media (prefers-reduced-motion: reduce) { .video-shell { animation: none; } }