/* ── EXPORT A VIDEO AS A DOCUMENT ──────────────────────
   Two surfaces: the format menu (.vx-menu, on screen) and the print sheet
   (#vx-print, only ever visible to the printer). */

.vx-menu { width: 250px; padding: 6px; }
.vx-menu-hd {
  font-size: var(--fs-11); font-weight: 600; color: var(--t4);
  letter-spacing: .06em; text-transform: uppercase;
  padding: 8px 10px 6px;
}
.vx-item {
  display: flex !important; flex-direction: column; align-items: flex-start; gap: 2px;
  padding: 8px 10px; text-align: left; width: 100%;
}
.vx-item-t { font-size: var(--fs-13); font-weight: 500; color: var(--tx); }
.vx-item-d { font-size: var(--fs-11); color: var(--t3); }

/* ── The print sheet ────────────────────────────────────────────────
   Built in the page rather than a popup window: window.open trips popup
   blockers, and a same-document sheet keeps the already-loaded thumbnails
   rather than re-fetching them. It is display:none until printing. */
#vx-print { display: none; }

@media print {
  /* Everything except the sheet comes off the page — including the app shell,
     which is position:fixed and would otherwise print over it. */
  body.vx-printing > *:not(#vx-print) { display: none !important; }
  body.vx-printing { overflow: visible !important; height: auto !important; }
  html { overflow: visible !important; height: auto !important; }

  body.vx-printing #vx-print {
    display: block !important;
    /* Print in black on white regardless of the app theme — a dark-theme
       export would otherwise flood the page with ink or, with backgrounds
       stripped, come out white-on-white. */
    color: #111;
    background: #fff;
    font-family: var(--ff-sans);
    font-size: 10.5pt;
    line-height: 1.55;
  }

  @page { margin: 18mm 16mm; }

  #vx-print h1 {
    font-size: 21pt; font-weight: 700; line-height: 1.2;
    letter-spacing: -.02em; margin: 0 0 6pt; color: #111;
  }
  #vx-print .vx-meta {
    font-size: 9pt; color: #666; margin: 0 0 16pt;
    padding-bottom: 10pt; border-bottom: 1px solid #ddd;
  }
  #vx-print .vx-sec { margin-bottom: 16pt; }
  /* Don't strand a heading at the foot of a page. */
  #vx-print h2 {
    font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: .1em;
    color: #888; margin: 0 0 9pt;
    break-after: avoid; page-break-after: avoid;
  }
  #vx-print h3 {
    font-size: 10.5pt; font-weight: 600; color: #111; margin: 12pt 0 4pt;
    break-after: avoid; page-break-after: avoid;
  }
  #vx-print .vx-body {
    font-family: var(--ff-sans);
    font-size: 10.5pt; line-height: 1.6; color: #222;
    white-space: pre-wrap; word-break: break-word;
    margin: 0 0 8pt;
  }
  #vx-print .vx-link { margin: 0 0 8pt; font-size: 10pt; }
  #vx-print .vx-link span { font-size: 8.5pt; color: #777; word-break: break-all; }
  #vx-print .vx-img {
    display: block; max-width: 92mm; width: 100%; height: auto;
    border: 1px solid #ddd; border-radius: 3px; margin: 4pt 0 10pt;
    break-inside: avoid; page-break-inside: avoid;
  }
}