/* Business Strategy as Code — White Paper (TASK-27)
   Dedicated print stylesheet, A4 geometry. Forked from booklet/print.css (same crimson
   design tokens, same break-control idiom: @page size + margin:0 on the page box, geometry
   baked into the flowing article itself via CSS custom properties) — see
   public/whitepaper/print-letter.css for the US-Letter twin (booklet's sed-swap pattern:
   this file's <link> is pointed at print-letter.css for that render pass; the article HTML
   is single-source).

   Pagination model: unlike the booklet (hand-authored one-`.page`-div-per-physical-page),
   the white paper is a long flowing document (~20-28 pages from ~600 lines of Markdown), so
   physical pages are whatever the browser's break algorithm produces from the rules below —
   there is no per-page markup.

   Running header/footer (title + version band; DOI/licence + live "Page X of Y" band) is
   rendered ENTIRELY by Puppeteer's native `page.pdf({ displayHeaderFooter: true, headerTemplate,
   footerTemplate, margin })` mechanism in scripts/render-whitepaper-pdf.mjs — a real per-page
   repeating header/footer with a live page counter, driven by Chromium's own PDF-generation
   pass. This stylesheet's `--wp-page-margin-*` custom properties MUST stay numerically in sync
   with that script's `margin` option (they're also read by the figure max-height calc below),
   and `@page`'s `margin` here is a fallback for a manual browser Print dialog only — Puppeteer's
   `page.pdf({ margin })` option takes precedence over this `@page` rule for the actual PDF
   output. An earlier revision additionally rendered a second, non-repeating title/version band
   (page 1 only) and DOI/licence line (last page only) in-page via `display: table-header-group`
   / `table-footer-group` (`.wp-print-thead` / `.wp-print-tfoot` in WhitepaperPage.astro) — a
   CSS 2.1 table-pagination fallback from before the Puppeteer template header/footer existed.
   That in-page shell duplicated Puppeteer's header/footer (reported defect, TASK-27 Wave-8) and
   has been removed from both the markup and this stylesheet; only `.wp-article thead` /
   `.wp-article tfoot` below remain — those repeat the header/footer ROW of the document's own
   content tables (Appendix A, the gate table) across a page break, an unrelated, still-needed
   behavior. */

:root {
  --wp-page-height: 297mm;
  --wp-page-margin-top: 24mm;
  --wp-page-margin-bottom: 20mm;
  --wp-page-margin-side: 20mm;
}

@page {
  size: A4;
  margin: var(--wp-page-margin-top) var(--wp-page-margin-side) var(--wp-page-margin-bottom);
}

@media print {
  html,
  body {
    background: #fff;
  }

  /* Screen-only chrome never prints. `.cc-banner` (not `#cookie-consent`/`.cookie-consent`,
     which don't match anything CookieConsent.tsx actually renders — those two rules were
     already dead code) is `position: fixed`, so Chromium's print pass repeats it, uncovered,
     on every physical page and was overlapping/obscuring real body text (Wave 7 fix,
     TASK-27: found while visually verifying the new running header/footer — a content-
     correctness regression this print stylesheet already intended to prevent via the two
     dead selectors below, just with the wrong class name).

     `.site-footer-wp` (TASK-43, Footer.astro's `variant="wp"` two-line citation/copyright
     footer, added after this rule was last written) was never added here, so a
     SITE_TARGET=whitepaper build's PDF render let it flow into the article body instead of
     being replaced by Puppeteer's own running footer template — on Chapter 3 this pushed the
     trailing copyright line onto its own near-blank page. The PDF's citation/copyright
     already live in the in-article colophon (see the chapter markdown's own "How to cite"
     section) and in the Puppeteer footer template, so this site-wide footer has no print
     role at all, exactly like `.site-footer` above. */
  .site-header,
  .site-footer,
  .site-footer-wp,
  .skip-link,
  .wp-downloads,
  .wp-toc,
  .wp-back-to-top,
  .wp-eyebrow,
  .wp-hub-link,
  [data-open-lead-modal],
  #cookie-consent,
  .cookie-consent,
  .cc-banner {
    display: none !important;
  }

  .wp-article {
    max-width: none;
    margin: 0;
    padding: 0;
    font-size: 9pt;
    line-height: 1.3;
    color: #000;
  }

  /* RU-only tighter leading/spacing (scoped via `html[lang="ru"]`, NOT applied to EN): the
     Russian edition runs ~1 page longer than the English edition at identical type sizes
     (Cyrillic word/sentence length), which pushed RU-A4 to 24 pages against the RU <= EN*1.15
     budget (23). This trims just enough to bring it back in budget without touching EN's
     pagination — an earlier attempt tightened `.wp-article` globally, which reflowed EN too
     and orphaned Fig. 1's caption from its diagram on a page boundary that only existed
     because of that global change. RU is otherwise the same `.wp-article` rules above. */
  html[lang='ru'] .wp-article {
    line-height: 1.27;
  }

  html[lang='ru'] .wp-article :is(p, ul, ol) {
    margin: 0 0 5pt;
  }

  html[lang='ru'] .wp-article li {
    margin-bottom: 1.5pt;
  }

  /* Compact print typography — the screen CSS's heading/paragraph/table spacing (tuned for a
     comfortable ~900px reading column) is far too generous once carried into A4/Letter print:
     unscaled, the doc ran to 46 print pages against a 20-28 page target. These overrides don't
     touch the screen styles (WhitepaperPage.astro's `is:global` <style>), only the print pass. */
  .wp-article :is(h1, h2, h3, h4, h5, h6) {
    break-after: avoid;
    page-break-after: avoid;
    color: #000;
    font-family: var(--font-display);
  }

  .wp-article h1 {
    font-size: 19pt;
    line-height: 1.2;
    margin: 0 0 8pt;
  }

  .wp-article h2 {
    font-size: 14pt;
    margin: 14pt 0 6pt;
    padding-top: 6pt;
    border-top: 0.5pt solid var(--line, #e3e6ea);
  }

  .wp-article h3 {
    font-size: 11.5pt;
    margin: 10pt 0 4pt;
  }

  .wp-article h4 {
    font-size: 10.3pt;
    margin: 8pt 0 3pt;
  }

  .wp-article :is(p, ul, ol) {
    margin: 0 0 6pt;
  }

  .wp-article li {
    margin-bottom: 2pt;
  }

  /* Restore numbering/bullets for content lists (e.g. §7.2's 15-item failure-mode list):
     only `.wp-toc`'s own list-style:none applies, and `.wp-toc` is already hidden in print
     (above) — so this is belt-and-braces, not a fix to a conflicting reset found in this
     stylesheet, but the QA-reported PDF pass showed no markers on a `.wp-article ol`, so the
     type is pinned explicitly rather than left to inheritance. */
  .wp-article ol {
    list-style: decimal outside;
  }

  .wp-article ul {
    list-style: disc outside;
  }

  /* Root cause of the still-missing markers (TASK-27 Wave C4): base.css's global
     `*, *::before, *::after { margin: 0; padding: 0; }` reset zeroes `ul`/`ol`'s UA-default
     40px `padding-left`, the box `list-style: outside` markers render into. With that padding
     gone the markers have nowhere to draw and are clipped — `list-style: … outside` above was
     never the problem. Restore an explicit indent so both `ol` and `ul` markers have room. */
  .wp-article :is(ul, ol) {
    padding-left: 14pt;
  }

  .wp-article :is(p, li, dd) {
    orphans: 3;
    widows: 3;
  }

  /* Keep a figure's own intro paragraph on the same page as the figure it introduces (e.g.
     "Figure 3 reads two traces…" before Fig. 3): without this, the paragraph can be stranded
     alone at the bottom of a page while the figure itself (break-inside: avoid, too tall to
     fit the remaining space) moves whole to the next, leaving a near-empty page behind it. */
  .wp-article p:has(+ .wp-figure) {
    break-after: avoid;
    page-break-after: avoid;
  }

  /* Keep lead-in label paragraphs (e.g. "Correct use.", "Use it when", "It does not cover:")
     on the same page as the list they precede, preventing orphaned solo labels at page ends
     (e.g. §10 ERRC grid, stop 10). Chromium's break-after: avoid is unreliable in isolation,
     so we also apply break-before: avoid to the list's first item as a fallback. */
  .wp-article p:has(+ ul),
  .wp-article p:has(+ ol) {
    break-after: avoid;
    page-break-after: avoid;
  }

  /* Also keep a label paragraph with the next paragraph when that paragraph precedes a list
     (e.g. "Preconditions" label followed by "Before running the full chain..." lead-in, then
     a numbered list in §8). This keeps the label, lead-in sentence, and first list item
     together across page boundaries. */
  .wp-article p:has(+ p + :is(ul, ol)) {
    break-after: avoid;
    page-break-after: avoid;
  }

  /* Catch remaining orphaned labels at page end: apply break-inside: avoid to short paragraphs
     followed by lists, to ensure Chromium honors the separation rule across page breaks. */
  .wp-article p:is(:has(+ ul), :has(+ ol), :has(+ p + ul), :has(+ p + ol)) {
    break-after: avoid;
    page-break-after: avoid;
  }

  .wp-article :is(ul, ol) > li:first-child {
    break-before: avoid;
    page-break-before: avoid;
  }

  /* Atomic units — never split mid-element across a page boundary. */
  .wp-article :is(blockquote, figure, tr, .wp-figure) {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .wp-article blockquote {
    margin: 8pt 0;
    padding: 6pt 10pt;
  }

  .wp-article pre {
    margin: 0 0 6pt;
    padding: 6pt 8pt;
  }

  /* The 56-row Appendix A table and the gate table (Appendix, §5.1) are allowed to break
     across pages, but repeat the header row on every page it continues onto. */
  .wp-article table {
    break-inside: auto;
    border-collapse: collapse;
    width: 100%;
    font-size: 8.3pt;
    margin: 8pt 0;
  }

  .wp-article :is(th, td) {
    padding: 3pt 5pt;
  }

  .wp-article thead {
    display: table-header-group;
  }

  .wp-article tfoot {
    display: table-footer-group;
  }

  .wp-figure {
    margin: 8pt 0;
    /* figureAttacher() inserts the <figure> as the immediate previous sibling of its caption
       blockquote (whitepaper-render.ts), not wrapped in a shared container — each is
       individually `break-inside: avoid` above, but nothing stopped a break falling *between*
       them (observed: figure at the bottom of one page, caption starting the next, TASK-27 PDF
       read fixes D2). `break-after: avoid` here + `break-before: avoid` on the caption below
       keeps the pair together; the figure MAY still move to the next page as a whole. */
    break-after: avoid;
    page-break-after: avoid;
  }

  .wp-figure + blockquote {
    break-before: avoid;
    page-break-before: avoid;
  }

  /* Fig. 1 (tall flowchart, viewBox ~880x1534) renders taller than one A4/Letter content
     page at full content-column width — capped to fit one page height so it can never force
     an unavoidable mid-figure page break (break-inside: avoid above can only be honored if
     the figure actually fits within one page). width:auto + max-width:100% keeps the other
     three (wider-than-tall) figures unaffected — they're bounded by width, not height. The
     reserved allowance (26mm, was 14mm) is deliberately generous: it has to leave room for
     BOTH the "Figure N —" heading above the image AND the "Fig. N —" caption below it (a
     separate sibling element, not part of this figure — see whitepaper-render.ts's
     figureAttacher()), since neither can be split off onto another page (break-after: avoid
     on headings; break-inside: avoid on the caption blockquote). A too-small allowance here
     is exactly what let the image grow to fill the page and orphan the caption onto the next
     one (observed regression when the page margins below were tightened, TASK-27 Wave-8). */
  .wp-figure-svg svg {
    max-height: calc(var(--wp-page-height) - var(--wp-page-margin-top) - var(--wp-page-margin-bottom) - 26mm);
    width: auto;
    max-width: 100%;
    margin: 0 auto;
  }

  /* Code chips (citation codes, filenames) — monospace, with `slashed-zero` requested via
     font-variant-numeric so a reader's installed system mono face (SF Mono/Menlo/Consolas —
     see the PR description for the "no embedded Inter/mono, system-stack fallback" note) can
     render it if that face implements the OpenType `zero` feature; where it doesn't, 0 and O
     remain visually close — a known, disclosed risk, not silently fixed by this rule alone. */
  .wp-article code {
    font-family: var(--font-mono);
    font-variant-numeric: slashed-zero;
    background: none;
    padding: 0;
  }

  /* D33: the "PESTEL" framework-name prefix, muted and smaller — see WhitepaperPage.astro's
     matching screen rule for the full rationale. An absolute `pt` size, not the screen rule's
     `em`, because the context this sits in ranges from 7.5pt (card chips) to 9pt (body text);
     0.8em of the smallest of those (7.5pt) would print at 6pt, under the >=7pt print floor
     (TASK-27 D28 constraint 3c). A flat 7pt clears the floor in every context it appears in. */
  .wp-code-ns {
    color: var(--muted, #5b6470);
    font-size: 7pt;
    font-weight: 400;
    font-family: inherit;
  }

  /* PR #70 follow-up — see the matching screen rule in WhitepaperPage.astro for the full
     rationale: keeps a §6.2-style body-prose `PESTEL T·i` pair on one line in print too. */
  .wp-code-pestel {
    white-space: nowrap;
  }

  /* Appendix A's "Prefix and code range" cells (TASK-27 Wave C4) — see the matching screen
     rule in WhitepaperPage.astro for the full rationale: keep each `PESTEL X·1 … PESTEL X·n`
     range intact, breaking multi-range cells only at the plain ", " text between spans. */
  .wp-article table code {
    white-space: nowrap;
  }

  /* Stop contract cards (TASK-27 Wave C1b) — full visual re-statement for print, not just
     typography. WhitepaperPage.astro's screen `<style>` block is wrapped in `@media screen`
     (deliberately — see that file's doc comment), so NONE of its rules carry into this print
     pass: a first print render only got the font-size/margin tweaks below and came out as
     plain unstyled text (no card border, no chip tint, no crimson badge/labels, no
     contract-check band) — border-color alone does nothing without border-style/width;
     background/color are not inherited from a same-named screen rule that never ran here.
     Every property the screen card uses is restated below, not just the ones that changed size.
     Every selector is prefixed `.wp-article ` (two classes) so it outranks the generic h1-h6/
     p/ul/li rules above on specificity ((0,1,1), one class + `:is()`'s highest-specificity
     argument) — those would otherwise recolour the card's column headings/badge name/check
     paragraph as display-serif black text and reset their margins. Smallest text here (7.5pt,
     the chips and stop-refs) meets the >=7.5pt print floor (TASK-27 D28 constraint 3c); the
     card and its heading never split across a page (break-inside: avoid; the h1-h6
     break-after: avoid rule above keeps a stop's heading with the card that follows it).
     Layout mirrors the desktop grid (card-print.png, the D28(1)-approved prototype's own print
     capture, uses the same horizontal grid, not the <=480px stacked layout — print never hits
     that screen-only breakpoint's width in practice). */
  .wp-article .wp-card {
    break-inside: avoid;
    page-break-inside: avoid;
    margin: 5pt 0 7pt;
    padding: 4pt 7pt;
    border: 0.75pt solid #ccc;
    border-radius: 5pt;
    background: #fff;
  }

  .wp-article .wp-card__grid {
    display: grid;
    grid-template-columns: minmax(0, max-content) auto minmax(28mm, max-content) auto minmax(0, max-content);
    justify-content: center;
    align-items: start;
    column-gap: 5pt;
  }

  .wp-article .wp-card__col {
    display: flex;
    flex-direction: column;
    gap: 2.5pt;
    max-width: 46mm;
  }

  .wp-article .wp-card__col-heading {
    font-family: var(--font-body);
    font-size: 7.6pt;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0;
    color: var(--muted, #5b6470);
    break-after: avoid;
    page-break-after: avoid;
  }

  .wp-article .wp-card__items {
    display: flex;
    flex-direction: column;
    gap: 2.5pt;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .wp-article .wp-card__item {
    display: flex;
    flex-direction: column;
    gap: 0.5pt;
    margin-bottom: 0;
  }

  .wp-article .wp-card__family {
    font-size: 8pt;
    font-weight: 600;
    color: var(--ink, #15191e);
  }

  /* TASK-27 Wave C4b — the chip previously had no explicit width, so its parent chain's
     default flex `align-items: stretch` (`.wp-card__col` > `.wp-card__items` >
     `.wp-card__item`, all `flex-direction: column`) stretched it to exactly the column's
     `max-width`, regardless of its own content. The widest single unbreakable range
     (`PESTEL EV·1 … PESTEL EV·n,`, stops 1, 2, 3, 9) needed a few px more than that stretched
     box, so it poked past the right border. `width: fit-content` (mirrors the screen chip
     rule) makes the chip size to its own content instead of being stretched full-width; the
     `max-width: 46mm` column above gives it enough room to fit that widest line either way. */
  .wp-article .wp-card__chip {
    display: inline-flex;
    flex-wrap: wrap;
    column-gap: 0.3em;
    font-family: var(--font-mono);
    font-size: 7.5pt;
    background: var(--panel, #f6f7f9);
    border: 0.5pt solid var(--line, #e3e6ea);
    border-radius: 2pt;
    padding: 0 3pt;
    color: var(--crimson-dark, #741222);
    width: fit-content;
    max-width: 100%;
  }

  .wp-article .wp-card__range {
    white-space: nowrap;
  }

  .wp-article .wp-card__stop-ref {
    font-size: 7.5pt;
    color: var(--muted, #5b6470);
  }

  .wp-article .wp-card__arrow {
    align-self: center;
    color: var(--crimson, #9e1b32);
    font-size: 10pt;
    text-align: center;
  }

  .wp-article .wp-card__badge {
    align-self: center;
    text-align: center;
    padding: 1pt 5pt;
    border-left: 0.5pt solid var(--line, #e3e6ea);
    border-right: 0.5pt solid var(--line, #e3e6ea);
  }

  .wp-article .wp-card__badge-eyebrow {
    font-family: var(--font-mono);
    font-size: 7.5pt;
    color: var(--muted, #5b6470);
  }

  .wp-article .wp-card__badge-name {
    font-family: var(--font-display);
    font-size: 9.5pt;
    font-weight: 700;
    margin: 1pt 0 0;
    color: var(--crimson-dark, #741222);
  }

  .wp-article .wp-card__badge-act {
    font-size: 7.5pt;
    margin-top: 1pt;
    color: var(--muted, #5b6470);
  }

  .wp-article .wp-card__check {
    font-size: 8pt;
    line-height: 1.3;
    margin: 4pt 0 0;
    padding: 3pt 6pt;
    background: var(--crimson-soft, #fbe9ec);
    border-left: 2pt solid var(--crimson, #9e1b32);
    border-radius: 0 4pt 4pt 0;
    color: var(--ink, #15191e);
  }

  .wp-article .wp-card__check-level {
    font-weight: 700;
    text-transform: uppercase;
    color: var(--crimson-dark, #741222);
  }

  .wp-article .wp-card__check-gate {
    font-size: 7.5pt;
    color: var(--muted, #5b6470);
  }

}