/* video-dialog.css — the morphing video preview window, shared by every page
   that plays a Vimeo file (pairs with video-dialog.js; extracted from
   filmmaker.css 2026-08-15). Adapted from motion-primitives' MorphingDialog
   video-preview (21st.dev/@ibelick), restyled as one of the site's own
   plates: hairline border, no radius, the atmosphere darkened behind it.
   Reads the tokens contract (tokens.css, loaded by the page) — never redeclares. */
.vd-backdrop{
  position:fixed;inset:0;z-index:80;
  background:color-mix(in srgb, var(--black) 82%, transparent);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.vd-frame{
  position:fixed;z-index:81;overflow:hidden;
  border:1px solid var(--line);background:var(--black);
  box-shadow:0 2rem 6rem color-mix(in srgb, var(--black) 60%, transparent);
}
.vd-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* overscan zoom: several files carry bright edge pixels that read as lines
   against the black window. A width-only oversize doesn't work (the player
   just re-letterboxes inside the wider iframe) — a uniform scale keeps the
   aspect, zooms the picture ~1.3% and the box crops every edge. */
.vd-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;transform:scale(1.013)}
.vd-close{
  position:fixed;top:1.4rem;right:1.4rem;z-index:82;
  width:2.6rem;height:2.6rem;border-radius:50%;
  border:1px solid color-mix(in srgb, var(--ink) 58%, transparent);
  background:color-mix(in srgb, var(--black) 40%, transparent);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  cursor:pointer;color:var(--ink);
  transition:border-color var(--duration-ui) var(--ease),transform var(--duration-ui) var(--ease);
}
.vd-close:hover,.vd-close:focus-visible{border-color:var(--accent);transform:scale(1.08)}
.vd-close span::before,.vd-close span::after{
  content:"";position:absolute;left:50%;top:50%;width:1rem;height:1px;background:currentColor;
}
.vd-close span::before{transform:translate(-50%,-50%) rotate(45deg)}
.vd-close span::after{transform:translate(-50%,-50%) rotate(-45deg)}
/* lock the page without the reflow: the vanishing scrollbar's width is
   handed back as padding (--vd-gutter, measured on open) so nothing shifts */
html.vd-open{overflow:hidden;padding-right:var(--vd-gutter,0px)}
