/* The manual on paper. A siege manual that cannot be printed and pinned next to the screen is only
   pretending to be one, so the sliders go away and the numbers they were showing stay. */

@page {
  margin: 18mm 16mm;
}

:root,
:root[data-theme="lamp"] {
  --paper: #fff;
  --paper-edge: #fff;
  --ink: #000;
  --ink-soft: #000;
  --ink-faint: #000;
  --plate: #fff;
  --rule: #999;
  --rule-hair: #ccc;
  --red: #000;
  --red-wash: transparent;
  --blue: #000;
  --blue-wash: transparent;
  --on-red: #fff;
  --fibre: transparent;
}

body {
  background: #fff;
  color: #000;
  font-size: 10.5pt;
  line-height: 1.45;
}
body::before, body::after { display: none; }

/* The running head is sticky furniture and @page already numbers the sheet. */
.head, .skip, #theme, .annexes, .toc { display: none; }

/* Controls do nothing on paper, but the readout they were driving is the answer for the values the
   page happened to be showing, so it stays. */
.field, input[type="range"], select, canvas { display: none; }

.spread, .cover, .colophon {
  display: block;
  padding: 0;
  border: 0;
  page-break-inside: auto;
}
.spread { page-break-before: always; padding-top: 4mm; }
.cover { page-break-after: always; }
.spread__head, h2, h3 { page-break-after: avoid; }
.spread__note {
  border: 0;
  border-top: .5pt solid #999;
  border-bottom: .5pt solid #999;
  padding: 2mm 0;
  margin: 4mm 0;
  page-break-inside: avoid;
}

.plate, .cover__shot, figure { page-break-inside: avoid; margin: 4mm 0; }
img { max-width: 100%; height: auto; filter: grayscale(1) contrast(1.1); }
svg { max-width: 60%; height: auto; }

.sheet { page-break-inside: avoid; font-size: 9pt; }
.sheet th, .sheet td { border-color: #999; }

.specials { border-top: .5pt solid #000; }
.special { page-break-inside: avoid; }
/* Everything prints, locked or not: the reader is holding the page before the phase arrives. */
.special.is-locked { opacity: 1; }
.special.is-locked .special__head b::after { content: ' (verrouillé)'; font-weight: 400; font-size: 8pt; }

/* A printed link that does not say where it goes is a dead end. */
.grab a[href^="http"]::after,
.colophon__links a[href^="http"]::after {
  content: ' (' attr(href) ')';
  font-size: 8pt;
  color: #000;
}

.reveal, .reveal[data-reveal] {
  opacity: 1;
  transform: none;
}