/* ============================================================================
   print.css — the deck as a PDF, one slide to a page.

   Link this with media="print". Everything below is inside @media print, so a
   stray link tag without the attribute still costs the screen deck nothing.

   The page is 297x167mm, which is 16:9 landscape and the same shape as the
   1280x720 stage the deck is authored on. 297mm is 1122.5 CSS pixels at the
   96dpi print resolution, so the stage has to come down by a factor of about
   0.877 to fit. This uses zoom rather than transform because zoom changes the
   box the printer paginates on, while a transform would leave a 1280px box
   behind and the printer would spill it onto extra pages.
   ========================================================================== */

@page {
  size: 297mm 167mm;
  margin: 0;
}

@media print {

  /* Pastel fills carry meaning in this deck, so they have to survive the
     printer's default of dropping backgrounds. */
  *,
  *::before,
  *::after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  html,
  body {
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #FFFFFF !important;
  }

  /* Every slide prints, including the ones the runtime has hidden, and each
     one starts a page. The last one does not, or the PDF ends on a blank. */
  .slide,
  body[data-mode="slide"] .slide,
  body[data-mode="slide"] .slide.is-active {
    display: grid !important;
    /* Relative rather than static, which both undoes the fixed positioning of
       slide mode and keeps the slide as the containing block for the slide
       number inside it. Static would send every number to the first page. */
    position: relative !important;
    transform: none !important;
    /* 0.873 of the 1280x720 stage is 295.7 x 166.3mm, which leaves the page a
       little under a millimetre of slack on each axis so rounding in the
       printer cannot clip an edge. */
    zoom: 0.873;
    width: 1280px !important;
    height: 720px !important;
    margin: 0 auto !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
    break-after: page;
    page-break-after: always;
    break-inside: avoid;
  }
  .slide:last-of-type {
    break-after: auto;
    page-break-after: auto;
  }

  /* A printed slide is the whole slide. Nothing waits for a keypress. */
  [data-fragment],
  body[data-mode="slide"] [data-fragment] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    pointer-events: auto !important;
  }

  /* Chrome, notes, authoring marks, and the blanking cover all stay out. */
  .progress,
  .timer,
  .title-actions,
  .title-keys,
  aside.notes,
  .overflow-warning { display: none !important; }

  .slide.has-overflow { outline: none !important; }

  body.is-blanked::after { display: none !important; }

  /* The slide number is the one piece of chrome worth keeping, since a printed
     deck is something people cite by page. site.js gives every slide one and
     hides it on screen, where the counter in the chrome bar already says where
     the deck is; here it goes back to plain type in the corner of the stage. */
  .slide-number {
    position: absolute !important;
    right: var(--stage-pad-x) !important;
    bottom: 18px !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    font-size: 18px !important;
  }

  /* The title, lead, and section slides too. site.css leaves those three
     unnumbered, which was right while the number was something the projector
     showed. On paper the number is what a reader counts by, so a page without
     one breaks the count for every page after it. */
  .slide.title .slide-number,
  .slide.lead .slide-number,
  .slide.section .slide-number {
    display: inline-flex !important;
  }

  /* Charts and most figures are deliberately left alone. The printed page is
     the same 1280x720 stage the deck is authored on, only scaled, so a chart
     that was told to be 340px tall on screen is already the right height here.
     Forcing it to fill its parent would squeeze whatever shares the column with
     it down to nothing.

     Two figures are the exception, because they carry type of their own that a
     reader has to be able to read: the cells of the confusion matrix on slide 11
     and the panel labels of the Laban and counterfactual figure on slide 16. On
     screen a reader clicks either one and lightbox.js fills the window with it.
     Paper has no lightbox, so on paper each one has to be as large as its own
     slide can make it.

     Both are bound by height rather than width, so the room comes out of the
     vertical gaps around them and out of nothing else: the gap under the
     heading, the gaps down the body, and the gap between a figure and its
     caption. No type changes size, no column changes width, and no line break
     on either slide moves, so the printed page still reads as the slide the
     audience saw. The matrix goes from 94.7 to 104.2mm across, a little over
     the 97.4mm its own 300dpi artwork was drawn for, and the Laban figure from
     130.2 to 138.9mm, where it fills its column exactly and the next millimetre
     would have to come out of the four numbers printed beside it. */
  #s-11-error-structure,
  #s-16-ensemble-edits { row-gap: 10px !important; }
  #s-11-error-structure .body,
  #s-16-ensemble-edits .body { gap: 10px !important; }
  #s-11-error-structure .fig,
  #s-16-ensemble-edits .fig { gap: 4px !important; }
  #s-11-error-structure .fig__cap,
  #s-16-ensemble-edits .fig__cap { line-height: 1.2 !important; }

  /* What the rules above do not fix, written down so the next person does not
     spend an afternoon finding out the same way. Slide 16's figure is still too
     small to read and nothing in this file can change that.

     It is not resolution. Both images print above the 300dpi they were drawn
     at, 280 for the matrix and 372 for the Laban figure, so asking for more
     pixels would change nothing on the page.

     It is width. fig06 is a two-panel double-column paper figure, and its
     smallest labels are 18 to 22 pixels tall in the source, which comes to 1.2
     to 1.5mm on paper, under 4.5pt, at 138.9mm across. Reaching a 7pt reading
     size needs about 250mm. The page is 297mm wide and the four kpi blocks have
     to sit somewhere, so no arrangement of slide 16 gets there: the figure needs
     a slide to itself, or one panel per slide. That is a change to
     build/partials/xai.html, not to this file. */

  /* A link in a printed deck cannot be clicked, so it should read as text. */
  .slide a {
    text-decoration: none !important;
    color: var(--ink) !important;
  }

  /* Browsers without zoom would otherwise print the stage cropped. Scaling by
     transform shows all of it, at the cost of a blank page after each slide on
     those browsers. */
  @supports not (zoom: 1) {
    .slide,
    body[data-mode="slide"] .slide,
    body[data-mode="slide"] .slide.is-active {
      zoom: normal;
      transform: scale(0.873) !important;
      transform-origin: top left !important;
    }
  }
}