/* Match the existing player footprint and action treatment. */
#youtubeMount{width:100%;aspect-ratio:16/9;max-height:72svh;background:#000}
#youtubeMount iframe{display:block;width:100%;height:100%;border:0}
#watchFull{background:#455148;color:white;margin-top:12px;margin-left:12px}
#youtubeStatus,#youtubeFallback{font-size:12px;color:#d6ddcd}
#youtubeFallback{text-decoration:underline;display:inline-block;margin-bottom:14px}
#youtubeFallback[hidden]{display:none}
#video{display:none}
/* Film overlays share the page's charcoal, without a green cast. */
#details::backdrop,#player::backdrop{background:rgba(26,26,26,.94);backdrop-filter:blur(9px)}
#player{background:#1a1a1a}
#details>.close,#player>.close{background:#242424}
#details{padding-top:48px}
#youtubeStatus:empty{display:none}
.detail-banner{position:relative;min-height:200px;background:#1a1a1a}
.trailer-preview{position:absolute;inset:0;opacity:0;pointer-events:none;background:#1a1a1a}
.trailer-preview.is-playing{opacity:1;pointer-events:auto}
.trailer-preview iframe{display:block;width:100%;height:100%;border:0;min-height:200px}
#detailSound{margin-top:12px;margin-left:12px}

/* Films page foundation, scoped to the Films-only stylesheet. */
:root{--films-background:#000000}
body,body::before{background:var(--films-background)}
.hero-shade{background:linear-gradient(90deg,#000000eb,#000000cc 28%,#00000018 75%),linear-gradient(0deg,#000000de,transparent 65%)}
@media(max-width:700px){.hero-shade{background:linear-gradient(90deg,#000000db,#00000070),linear-gradient(0deg,#000000de,transparent)}}

#details button:not(.close){border-radius:8px}

#detailAboutHeading {
  margin: 1.4rem 0 .35rem;
  font-size: .9rem;
  letter-spacing: .06em;
}
#detailDescription {
  white-space: pre-line;
  max-width: 70ch;
}