/* ---------------------------------------------------------------------------------------------
   brief-print.css -- the board-paper artefact.

   Q6 "a number for a board paper" ends in a print button, and a dark-themed screen page prints
   either as a flood of black ink or as unreadable grey on white. This sheet turns the brief into
   a document: ink on paper, the interactive chrome gone, nothing split across a page break, and
   the provenance kept, because a printed figure with no ladder badge is exactly the claim this
   project refuses to make.

   Loaded with media="print", so it costs a screen reader nothing.
   --------------------------------------------------------------------------------------------- */

@page { margin: 14mm 13mm; }

@media print {
  /* ---- ink on paper ---- */
  :root {
    --ink: #ffffff; --paper: #14161a; --muted: #454b55; --faint: #6b7280;
    --line: rgba(20,22,26,.16); --line2: rgba(20,22,26,.30);
    --blue: #0b6f9c; --gold: #8a6520; --green: #1f6b45; --hot: #b23c1a;
    --panel: none;
  }
  html, body { background: #fff !important; color: #14161a !important; font-size: 10.5pt; }
  body::before { display: none !important; }            /* the SVG noise overlay */
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact;
      box-shadow: none !important; text-shadow: none !important; animation: none !important;
      transition: none !important; }

  /* ---- chrome that does not belong on paper ---- */
  .nav, .top, .histnav, .mnav, .mnav-toggle, #scrollbar, #rail, #qstage,
  .qnav, .opts, .q, #b-ctas, #b-print, #b-restart, #b-fallback + .btn,
  .coach, .toast { display: none !important; }
  /* brief.html additions: the rail WRAPPER and its "1 / 6" counter sit outside #rail, and the
     whole intake is display:none inline once the brief is up, but say it here too so a print
     fired from any state is a document. */
  #intake, .rail, .rail-ct, .findbox, .ac, .hint { display: none !important; }

  /* ---- the document itself ---- */
  #brief { display: block !important; opacity: 1 !important; transform: none !important; }
  #brief section, #brief > div { opacity: 1 !important; transform: none !important; }
  .wrap { max-width: none; padding: 0; }

  #b-title, #b-headline { font-size: 20pt; line-height: 1.15; margin: 0 0 6pt; }
  #b-lede { font-size: 11pt; color: #454b55 !important; margin: 0 0 10pt; }
  h2 { font-size: 13pt; margin: 0 0 6pt; }
  p { max-width: none; }

  /* the path chip carries the measured-vs-comparable truth: keep it, and make it read as a stamp */
  #b-pathchip, .pathchip {
    display: inline-block !important; border: 1pt solid #14161a; color: #14161a !important;
    padding: 2pt 6pt; font-size: 8pt; letter-spacing: .08em; margin-bottom: 8pt;
  }

  /* ---- nothing splits across a page break ---- */
  #b-stats, #b-shortlist, #b-number, #b-limits, #b-evidence { break-inside: auto; }
  .roof, .stat, .evcard, .rgrid, #b-limits li, .ladder {
    break-inside: avoid; page-break-inside: avoid;
  }
  h2, #b-shortlist-h, #b-number-h, #b-ev-h { break-after: avoid; page-break-after: avoid; }
  #b-limits { break-before: auto; }

  .stats { display: grid !important; grid-template-columns: repeat(5, 1fr) !important; gap: 4mm; }
  .stat { border: .5pt solid var(--line); border-top: 1.5pt solid #0b6f9c; padding: 3mm; }
  .roof { border: .5pt solid var(--line); padding: 3mm; margin: 0 0 3mm; }
  .rgrid { display: grid !important; gap: 3mm; }

  /* ---- provenance survives printing, or the figure should not ---- */
  .chip, .chips span, .leadtag, .tag {
    border: .5pt solid var(--line2) !important; color: #14161a !important;
    background: none !important; font-size: 7.5pt;
  }
  /* The ladder is the whole provenance claim. Flattening every rung to the same grey, as a
     naive print reset does, tells the reader nothing about WHICH rung this figure sits on.
     Inactive rungs go faint, the active rung stays filled and bold and keeps its colour. */
  .ladder { border: .5pt solid var(--line2) !important; font-size: 7.5pt; }
  .ladder span { color: #9aa1ab !important; background: none !important;
                 border-right: .5pt solid var(--line) !important; }
  .ladder span.on { font-weight: 700 !important; }
  .ladder span.t-epc.on   { background: #e6f5ec !important; color: #12523a !important; }
  .ladder span.t-bench.on { background: #f7efdd !important; color: #6b4d14 !important; }
  .ladder span.t-phys.on  { background: #e4f1f9 !important; color: #0a4f70 !important; }
  /* and say it in words too, because a photocopy loses the tint */
  .ladder span.on::after { content: " \2713"; }
  /* "What we cannot tell you yet" is the section this project most needs a reader to read.
     Its list items paint their own near-black background on screen (.limlist li { #100f0d }),
     which on paper prints as a dark block with dark text inside it: the honesty section
     rendered unreadable. Reset the grid, the items and their body text explicitly. */
  #b-limits, .limits {
    border: 1pt solid #8a6520 !important; padding: 4mm; background: none !important;
    break-inside: auto;
  }
  .limits h2, .limits .lsub { color: #14161a !important; }
  .limlist { background: none !important; gap: 0 !important; }
  .limlist li {
    background: none !important; color: #14161a !important;
    border-bottom: .5pt solid rgba(138,101,32,.35) !important; padding: 2.5mm 0;
  }
  .limlist li:last-child { border-bottom: none !important; }
  .limlist .lt  { color: #6b4d14 !important; }
  .limlist .lb2 { color: #14161a !important; max-width: none; }
  #b-fallback { border: 1pt solid #8a6520 !important; padding: 3mm; background: none !important; }
  /* brief.html addition: #b-fallback and #b-narration are empty containers most of the time.
     Bordering an empty div prints a blank box that reads as a missing section. */
  #b-fallback:empty, #b-narration:empty { display: none !important; border: 0 !important; padding: 0 !important; }

  /* brief.html addition: the raw deep link carries the focus key, which is the one thing a
     reader cannot reconstruct from the printed page, so it stays, set small and grey. */
  /* brief.html addition: the narration is a language-model paragraph. On paper it must keep its
     label attached to it, so the block never breaks away from the sentence that qualifies it. */
  #b-narration { break-inside: avoid; page-break-inside: avoid; border: .5pt solid var(--line) !important;
                 background: none !important; padding: 3mm; }
  #b-narration .narr-label { color: #6b4d14 !important; }

  /* the CTA cannot be clicked on paper, so print where it goes */
  #b-handoff::after {
    content: "Open this shortlist on the map at emissiv.pages.dev/explore";
    display: block; margin-top: 3mm; font-family: 'IBM Plex Mono', monospace;
    font-size: 8pt; color: #454b55;
  }

  /* a printed page leaves the site behind, so it has to carry its own provenance */
  #brief::after {
    content: "Emissiv cooling brief. Every figure is measured, modelled or benchmarked as labelled above. "
             "Peak temperatures are ASTM E1980 standard conditions, not forecasts. "
             "Savings are annual estimates, not a quotation.";
    display: block; margin-top: 8mm; padding-top: 3mm; border-top: .5pt solid var(--line);
    font-size: 8pt; line-height: 1.45; color: #454b55;
  }

  a { color: #14161a !important; text-decoration: none; }
}
