/* ------------------------------------------------------------------
   Video lightbox sizing

   Two things made the music/video lightboxes open small. The embeds went
   through an embedly wrapper widget, which misrendered the player and
   pushed it to the top-left of the screen; those are now direct YouTube
   iframes in the item JSON in index.html. And Webflow sizes a video
   lightbox to the fixed dimensions stored in that JSON (940x528), so
   even once correct it stayed small on a large monitor.

   This file fixes the second half: scale the player with the window,
   keeping 16:9 and leaving room for the close button and thumbnails.

   Webflow already stretches the player to its frame — .w-lightbox-embed
   is the iframe itself, not a wrapper — so only the frame needs sizing.
   Image lightboxes are untouched: the :has() guard matches only frames
   containing a video. Browsers without :has() keep Webflow's 940x528,
   which is still correct, just smaller.

   Own file so a fresh Webflow export never overwrites it.
   ------------------------------------------------------------------ */

:root {
  --lightbox-video-max-width: 92vw;
  --lightbox-video-max-height: 86vh;
}

/* Fit a 16:9 box inside the limits above. */
.w-lightbox-frame:has(.w-lightbox-embed),
.w-lightbox-figure:has(.w-lightbox-embed) {
  width: min(var(--lightbox-video-max-width), var(--lightbox-video-max-height) * 16 / 9) !important;
  height: min(var(--lightbox-video-max-width) * 9 / 16, var(--lightbox-video-max-height)) !important;
}

/* Black behind the player so there is no pale flash while it loads. */
.w-lightbox-figure:has(.w-lightbox-embed) {
  overflow: hidden;
  background-color: #000;
}