/* Case Desk: the report as an A4 dossier, after the interference report (frontend/site/styles/interference.css). Paper:
   white ground, black ink, one International Orange accent. Big Shoulders Stencil for headlines, Big Shoulders Display for
   section heads, IBM Plex Sans for words, Martian Mono for labels and numbers. Scoped to .ds; script: dossier.js. */
@font-face { font-family: "Big Shoulders Display"; font-style: normal; font-weight: 700 800; font-display: swap; src: url("assets/fonts/big-shoulders-display-700.woff2") format("woff2"); }
@font-face { font-family: "Big Shoulders Stencil Display"; font-style: normal; font-weight: 800; font-display: swap; src: url("assets/fonts/big-shoulders-stencil-display-800.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("assets/fonts/ibm-plex-sans-400.woff2") format("woff2"); }
@font-face { font-family: "Martian Mono"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("assets/fonts/martian-mono-400.woff2") format("woff2"); }

.ds {
  --ground: #FFFFFF; --ink: #0A0A0A; --dim: #5E5A55; --line: #D9D6D0; --orange: #FF4F00;
  --stencil: "Big Shoulders Stencil Display", "Big Shoulders Display", Impact, sans-serif;
  --display: "Big Shoulders Display", Impact, sans-serif;
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Martian Mono", ui-monospace, Consolas, monospace;
  --s: 1; --mx: 16mm;
  display: block; color: var(--ink); font: 400 10pt/1.5 var(--sans); -webkit-font-smoothing: antialiased;
}
.ds *, .ds *::before, .ds *::after { box-sizing: border-box; }
:where(.ds) :is(h1, h2, h3, p, dl, dd, dt, ul, ol, figure, table) { margin: 0; padding: 0; }
:where(.ds) a { color: inherit; text-underline-offset: 2px; text-decoration-thickness: 1px; }
:where(.ds) :is(ul, ol) { list-style: none; }
.ds-wait { padding: 48px 0; text-align: center; font: 400 12px/1.4 var(--mono, monospace); color: #5E5A55; }

/* ---------- pages ---------- */
.ds-pages { display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 6px 0 64px; zoom: var(--s); }
.ds-page { position: relative; width: 210mm; height: 296mm; flex: none; overflow: hidden; background: var(--ground); border: 1px solid var(--line);
  display: flex; flex-direction: column; box-shadow: 0 1px 2px rgba(21, 19, 15, .06), 0 12px 40px rgba(21, 19, 15, .07); }
.ds-head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 6mm; height: 15mm; padding: 0 var(--mx); border-bottom: 1px solid var(--line);
  font: 400 6.5pt/1 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--dim); }
.ds-logo { height: 6.2mm; width: auto; flex: none; color: var(--ink); --logo-knock: #FFFFFF; --logo-signal: #FF4F00; }
.ds-head .ds-ex { flex: 1 1 auto; text-align: center; white-space: nowrap; }
.ds-head .ds-priv { color: var(--orange); white-space: nowrap; }
.ds-body { flex: 1 1 auto; min-height: 0; padding: 9mm var(--mx) 0; overflow: hidden; }
.ds-foot { flex: none; display: flex; justify-content: space-between; gap: 6mm; height: 12mm; align-items: center; padding: 0 var(--mx); border-top: 1px solid var(--line);
  font: 400 6pt/1.3 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--dim); }
.ds-foot span:first-child { flex: 1 1 auto; }
.ds-foot span { white-space: nowrap; }

/* ---------- page 1: the verdict ---------- */
.ds-page--verdict .ds-body { display: flex; flex-direction: column; padding: 0; }
.v-top { padding: 11mm var(--mx) 0; }
.v-kicker { font: 400 7pt/1.4 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--dim); }
.v-head { margin-top: 4mm; font: 800 44pt/0.94 var(--stencil); letter-spacing: 0.005em; text-transform: uppercase; color: var(--ink); text-wrap: balance; }
.v-verdict { display: flex; align-items: stretch; margin: 8mm var(--mx) 0; border: 1px solid var(--orange); }
.v-word { flex: none; padding: 3mm 6mm 2mm; background: var(--orange); color: var(--ground); font: 800 40pt/0.9 var(--stencil); letter-spacing: 0.02em; text-transform: uppercase; display: flex; align-items: center; }
.v-basis { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; gap: 1.2mm; padding: 3mm 5mm; font: 400 9pt/1.4 var(--sans); color: var(--ink); }
.v-basis b { font: 400 6.5pt/1.2 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--dim); }
.v-facts { margin: 7mm var(--mx) 0; border-top: 1px solid var(--line); }
.v-facts > div { display: grid; grid-template-columns: 26mm 1fr; gap: 4mm; align-items: baseline; padding: 2.2mm 0; border-bottom: 1px solid var(--line); }
.v-facts dt { font: 400 6.5pt/1.2 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--dim); }
.v-facts dd { font: 500 10.5pt/1.3 var(--sans); }
.v-facts dd small { font: 400 7.5pt/1.3 var(--mono); color: var(--dim); margin-left: 2mm; }
.v-facts dd a { text-decoration: none; border-bottom: 1px solid var(--dim); font-size: 9pt; }
.v-facts dd a:hover { border-color: var(--orange); color: var(--orange); }
.v-map { flex: 1 1 auto; min-height: 0; margin-top: 7mm; border-top: 1px solid var(--line); display: flex; flex-direction: column; justify-content: flex-end; }
.v-cap { flex: none; padding: 2mm var(--mx) 2.4mm; font: 400 6.5pt/1.4 var(--mono); letter-spacing: 0.04em; color: var(--dim); border-top: 1px solid var(--line); }
.v-cap b { color: var(--orange); font-weight: 400; }

/* ---------- the map ---------- */
.ds-fig { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.ds-fig .ds-shot, .ds-fig .ds-map { display: block; width: 100%; height: 100%; object-fit: cover; }
.ds-map .sea { fill: #FFFFFF; }
.ds-map .gr { stroke: #ECEAE6; stroke-width: 0.8; }
.ds-map .lbl { font: 400 7px "Martian Mono", monospace; fill: #7A766F; letter-spacing: 0.04em; }
.ds-map .lbl.ink { fill: #0A0A0A; }
.ds-map .ring { fill: none; stroke: #0A0A0A; stroke-width: 1.1; stroke-dasharray: 4 4; }
.ds-map .trk { fill: none; stroke: #5E5A55; stroke-width: 0.5; opacity: 0.45; }
.ds-map .pt { fill: #0A0A0A; stroke: #FFFFFF; stroke-width: 1; }
.ds-map .pt.hot { fill: #FF4F00; opacity: 0.85; stroke: none; }
.ds-map .scale { stroke: #0A0A0A; stroke-width: 1.4; }
.ds-fig .ds-attr { position: absolute; left: 2mm; bottom: 1.2mm; font: 400 5pt/1 var(--mono); color: #7A766F; letter-spacing: 0.05em; }
.ds-fig .ds-scale { position: absolute; right: 3mm; bottom: 2mm; display: block; font: 400 5.5pt/1.2 var(--mono); color: var(--ink); text-align: center; padding-bottom: 1.2mm; border-bottom: 1.4px solid var(--ink); }

/* ---------- words: numbered paragraphs, cited as "para. 4" ---------- */
.w-sec + .w-sec { margin-top: 8mm; }
.w-title { font: 800 15pt/1 var(--display); letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink); padding-bottom: 2.2mm; border-bottom: 2px solid var(--ink); }
.w-title i { font: 400 6.5pt/1 var(--mono); letter-spacing: 0.1em; color: var(--dim); font-style: normal; margin-left: 2mm; vertical-align: middle; }
.w-list li { display: grid; grid-template-columns: 11mm 1fr; padding: 2.6mm 0; border-bottom: 1px solid var(--line); font: 400 11pt/1.42 var(--sans); }
.w-list li > span { font: 600 7pt/2.2 var(--mono); color: var(--ink); letter-spacing: 0.04em; }
.w-list li > span::before { content: "\00B6\2009"; color: var(--dim); font-weight: 400; }
.w-list b { font-weight: 600; color: var(--orange); }
.w-list em { font-style: normal; font-weight: 600; }
.w-list code { font: 400 9pt/1.4 var(--mono); }
.w-list .hash { font: 400 7.4pt/1.5 var(--mono); overflow-wrap: anywhere; }
.w-sec--mono .w-list li { font: 400 8.5pt/1.55 var(--mono); color: var(--dim); }
.w-sec--mono .w-list li > span { color: var(--dim); line-height: 2; }

/* ---------- numbers: tables with a label and a unit ---------- */
.n-title { font: 800 30pt/0.95 var(--stencil); letter-spacing: 0.01em; text-transform: uppercase; color: var(--ink); margin-bottom: 6mm; }
.n-note { font: 400 9pt/1.45 var(--sans); color: var(--dim); margin: -2mm 0 5mm; }
.n-cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 9mm; margin-bottom: 0; }
.n-blk { margin-bottom: 7mm; }
.n-label { display: flex; justify-content: space-between; align-items: baseline; gap: 4mm; font: 600 6.5pt/1 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink); padding-top: 2.2mm; border-top: 2px solid var(--ink); margin-bottom: 1.4mm; }
.n-label i { font-style: normal; font-weight: 400; color: var(--dim); }
.ds table { width: 100%; border-collapse: collapse; font: 400 7pt/1.35 var(--mono); font-variant-numeric: tabular-nums; }
.ds th { text-align: left; font: 400 5.6pt/1.2 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--dim); padding: 1.1mm 2mm 1.1mm 0; border-bottom: 1px solid var(--dim); }
.ds td { padding: 1.35mm 2mm 1.35mm 0; border-bottom: 1px solid var(--line); vertical-align: top; overflow-wrap: anywhere; }
.ds th.r, .ds td.r { text-align: right; padding-right: 0; }
.ds td.r + td, .ds th.r + th { padding-left: 2.6mm; }
.ds table.fixed { table-layout: fixed; }
.ds td.nw { white-space: nowrap; overflow-wrap: normal; }
.ds td.sans { font: 400 7.6pt/1.4 var(--sans); }
.ds td.u, .ds .dim { color: var(--dim); }
.ds td.u { white-space: nowrap; overflow-wrap: normal; }
.ds .hot, .ds tr.is-hot td { color: var(--orange); }
.ds td.n-hash { font-size: 5.6pt; color: var(--dim); }
.ds table.dense td { padding-top: 0.75mm; padding-bottom: 0.75mm; font-size: 6.4pt; }
.ds table.dense th { padding-top: 0.8mm; padding-bottom: 0.8mm; }

/* ---------- the bundle ---------- */
.b-text { font: 400 10pt/1.5 var(--sans); margin-bottom: 4mm; max-width: 150mm; }
.b-cmd { display: block; margin: 0 0 7mm; padding: 4mm 5mm; border: 1px solid var(--ink); font: 400 9pt/1.5 var(--mono); }
.b-cmd b { color: var(--orange); font-weight: 600; }
.b-cmd span { display: block; margin-top: 1.5mm; font-size: 7pt; color: var(--dim); }
.b-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; margin-top: 12mm; font: 400 7pt/1.5 var(--mono); letter-spacing: 0.04em; color: var(--dim); text-transform: uppercase; }
.b-sign div { border-top: 1px solid var(--ink); padding-top: 2mm; min-height: 18mm; }
.b-sign b { display: block; color: var(--ink); font-weight: 400; }

@media print {
  @page { size: A4; margin: 0; }
  .ds * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .ds-pages { zoom: 1 !important; display: block; padding: 0; gap: 0; }
  .ds-page { border: 0; box-shadow: none; break-after: page; page-break-after: always; break-inside: avoid; }
  .ds-page:last-child { break-after: auto; page-break-after: auto; }
}