iframe[data-youtube-src]:not([src]),
.video-frame:has(iframe[data-youtube-src]:not([src])) + .video-caption,
.video-frame iframe[src] + .film-poster {
  display: none;
}

.film-poster {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 12px;
  padding: 18px;
  background: linear-gradient(#07192355, #071923bc), url("assets/gathering.webp") center / cover;
  color: var(--cream);
  font-size: clamp(14px, 2vw, 19px);
  text-align: center;
}

.film-poster .play-outline {
  margin: 0;
  background: #071923c9;
}

.film-poster:focus-visible { outline-offset: -4px; }