/* BFS Cardiac Codex
   Brand DNA: dark mode + BFS red accent + slab-serif heads + Lora body
   Source: Hidden Compounds Manual editorial design language (BFS)
   Pipeline copied from BFMD NAD+ Protocol; tokens swapped per
   reference_bfs_vs_bfmd_longform.md
*/

@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;500;600;700;800;900&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&display=swap');

:root {
  --cc-black: #0A0A0A;
  --cc-card: #1A1A1A;
  --cc-cream: #F5EFE1;
  --cc-green: #c8102e;
  --cc-green-soft: rgba(200, 16, 46, 0.18);
  --cc-green-faint: rgba(200, 16, 46, 0.08);
  --cc-white: #FFFFFF;
  --cc-dim: #9AA0A6;
  --cc-dim-2: #5C6166;
  --cc-rule: #2A2A2A;
  --cc-red: #FF4D4D;
}

@page {
  size: 8.5in 11in;
  margin: 0;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--cc-black);
  color: var(--cc-white);
  font-family: 'Lora', Georgia, 'Times New Roman', serif;
  font-size: 10.5pt;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 0.005em;
}

h1, h2, h3, .display {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.1;
  color: var(--cc-white);
  margin: 0;
}

strong { font-weight: 700; color: var(--cc-white); }
em { font-style: italic; }

a { color: var(--cc-green); text-decoration: none; }

/* ----------------------------------------
   Page wrappers
---------------------------------------- */
.page {
  width: 8.5in;
  height: 11in;
  page-break-after: always;
  position: relative;
  overflow: hidden;
  background: var(--cc-black);
  color: var(--cc-white);
}

.page.cover-image { padding: 0; }
.page.cover-image img { width: 8.5in; height: 11in; object-fit: cover; display: block; }

/* Inline body figures: image only, no cream card; height-capped to avoid overflow */
.body-content figure.image-slot { margin: 14pt 0; text-align: center; }
.body-content figure.image-slot.has-image img { max-height: 3.3in; width: auto; max-width: 100%; border-radius: 4pt; }

.page-body {
  padding: 0.8in 0.85in 0.95in 0.85in;
  display: flex;
  flex-direction: column;
}

.page-body .body-content { flex: 1; }

.page-body .running-footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0.4in;
  background: var(--cc-black);
  border-top: 1px solid var(--cc-rule);
  color: var(--cc-dim);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0.85in;
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 500;
  font-size: 8.5pt;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.page-body .running-footer .page-num {
  font-weight: 700;
  color: var(--cc-green);
}

/* ----------------------------------------
   COVER — top-dark / bleed-photo / dark-band foot
   Matches the BFMD mockup: typography on dark top half,
   C3 macro hero bleeds to bottom + side edges, credits in
   a thin solid-black band at the very bottom.
---------------------------------------- */
.cover-full {
  background: var(--cc-black);
  width: 8.5in;
  height: 11in;
  display: flex;
  flex-direction: column;
  page-break-after: always;
  overflow: hidden;
  position: relative;
  padding: 0;
}

.cover-top {
  background: var(--cc-black);
  padding: 0.7in 0.7in 0.45in 0.7in;
  text-align: center;
}

.cover-wordmark {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 800;
  font-size: 11pt;
  letter-spacing: 0.22em;
  color: var(--cc-white);
  text-transform: uppercase;
  margin-bottom: 0.3in;
}

.cover-wordmark .green-dot {
  display: inline-block;
  width: 7pt; height: 7pt; border-radius: 50%;
  background: var(--cc-green);
  margin-right: 8pt;
  vertical-align: middle;
}

.cover-eyebrow {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 9pt;
  letter-spacing: 0.28em;
  color: var(--cc-green);
  text-transform: uppercase;
  margin-bottom: 0.22in;
}

.cover-title {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 900;
  font-size: 64pt;
  line-height: 0.93;
  letter-spacing: -0.025em;
  color: var(--cc-white);
  margin: 0 0 0.2in 0;
}

.cover-title .accent { color: var(--cc-green); }

.cover-sub {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 400;
  font-size: 13pt;
  color: var(--cc-dim);
  max-width: 5.6in;
  margin: 0 auto;
  line-height: 1.35;
}

.cover-hero {
  flex: 1;
  background: var(--cc-black);
  overflow: hidden;
  position: relative;
}

.cover-hero figure.image-slot {
  margin: 0;
  width: 100%;
  height: 100%;
}

.cover-hero figure.image-slot.has-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cover-hero figure.image-slot:not(.has-image) .placeholder {
  width: 100%; height: 100%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  background: var(--cc-card);
  color: var(--cc-dim);
  border: 1.5px dashed var(--cc-green);
}

.cover-foot {
  background: var(--cc-black);
  padding: 0.2in 0.7in;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--cc-dim);
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 8.5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.cover-foot .by { color: var(--cc-white); font-weight: 600; }
.cover-foot .by em { color: var(--cc-green); font-style: normal; font-weight: 700; }

/* ----------------------------------------
   INDEX
---------------------------------------- */
.index {
  background: var(--cc-black);
  color: var(--cc-white);
  padding: 0.95in 1in;
  display: flex;
  flex-direction: column;
}

.index .index-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5in;
  padding-bottom: 0.22in;
  border-bottom: 1px solid var(--cc-rule);
}

.index .index-eyebrow {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 9pt;
  letter-spacing: 0.28em;
  color: var(--cc-green);
  text-transform: uppercase;
}

.index h1.index-title {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 900;
  font-size: 32pt;
  letter-spacing: -0.02em;
  color: var(--cc-white);
  margin: 4pt 0 0 0;
}

.index .index-meta {
  text-align: right;
  font-size: 9pt;
  color: var(--cc-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.index ol {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
}

.index ol li {
  display: grid;
  grid-template-columns: 0.5in 1fr 0.4in;
  gap: 0.2in;
  align-items: baseline;
  padding: 0.16in 0;
  border-bottom: 1px solid var(--cc-rule);
}

.index ol li a {
  display: contents;
  color: inherit;
}

.index .index-num {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 10pt;
  color: var(--cc-green);
  letter-spacing: 0.04em;
}

.index .index-name {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 13pt;
  color: var(--cc-white);
  letter-spacing: -0.005em;
}

.index .index-pg {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 500;
  font-size: 10pt;
  color: var(--cc-dim);
  text-align: right;
}

.index .index-foot {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 9pt;
  color: var(--cc-dim-2);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding-top: 0.4in;
  border-top: 1px solid var(--cc-rule);
}

/* ----------------------------------------
   CHAPTER DIVIDER (dark, type-driven, prompt-approval placeholder)
---------------------------------------- */
.divider {
  background: var(--cc-black);
  display: flex;
  flex-direction: column;
  position: relative;
  padding: 1.1in 1in 0.9in 1in;
}

.divider .divider-eyebrow {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 9pt;
  letter-spacing: 0.28em;
  color: var(--cc-green);
  text-transform: uppercase;
  margin-bottom: 14pt;
}

.divider .divider-num {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 900;
  font-size: 70pt;
  line-height: 0.85;
  color: var(--cc-white);
  letter-spacing: -0.04em;
  margin: 0 0 8pt 0;
  opacity: 0.98;
}

.divider .divider-title {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 800;
  font-size: 32pt;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--cc-white);
  margin-top: 0.18in;
  max-width: 5.5in;
}

.divider .divider-title::after {
  content: '';
  display: block;
  width: 1.4in;
  height: 3px;
  background: var(--cc-green);
  margin-top: 0.25in;
}

.divider .divider-overview {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 400;
  font-size: 12pt;
  color: var(--cc-dim);
  line-height: 1.45;
  margin-top: 0.35in;
  max-width: 5.5in;
}

/* Divider photo block: holds the Gemini image OR the prompt-approval placeholder */
.divider .divider-photo {
  margin-top: 0.5in;
  flex: 1;
  border-radius: 10pt;
  overflow: hidden;
  background: var(--cc-black);
}

.divider .divider-photo figure.image-slot {
  margin: 0; width: 100%; height: 100%;
}

.divider .divider-photo figure.image-slot.has-image img {
  width: 100%; height: 100%; object-fit: contain;
}

/* Prompt-approval placeholder card: shown when no image has been generated yet */
.divider .divider-photo figure.image-slot:not(.has-image) .placeholder {
  width: 100%;
  height: 100%;
  background: var(--cc-card);
  border: 1.5px dashed var(--cc-green);
  border-radius: 10pt;
  padding: 22pt 24pt;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: left;
  color: var(--cc-white);
}

.divider .divider-photo .placeholder .slot-id {
  font-family: 'SF Mono', Menlo, Monaco, Consolas, monospace;
  font-size: 9pt;
  font-weight: 700;
  color: var(--cc-green);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 6pt;
}

.divider .divider-photo .placeholder .slot-status {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 9pt;
  font-weight: 600;
  color: var(--cc-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 12pt;
}

.divider .divider-photo .placeholder .slot-spec {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 11pt;
  color: var(--cc-white);
  margin-bottom: 8pt;
  letter-spacing: -0.005em;
}

.divider .divider-photo .placeholder .slot-subject {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 10pt;
  color: var(--cc-dim);
  line-height: 1.45;
  max-width: none;
  margin: 0;
  font-style: normal;
}

.divider .divider-photo .placeholder .approve-footer {
  margin-top: 14pt;
  padding-top: 10pt;
  border-top: 1px solid var(--cc-rule);
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 8.5pt;
  color: var(--cc-dim-2);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ----------------------------------------
   BODY CHAPTER PAGES
---------------------------------------- */
.chap h1 {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 800;
  font-size: 22pt;
  letter-spacing: -0.015em;
  color: var(--cc-white);
  margin-bottom: 14pt;
  line-height: 1.1;
}

.chap h2 {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 13pt;
  letter-spacing: 0.01em;
  color: var(--cc-white);
  text-transform: uppercase;
  margin: 22pt 0 8pt 0;
}

.chap h2::before {
  content: '';
  display: inline-block;
  width: 14pt;
  height: 2px;
  background: var(--cc-green);
  vertical-align: middle;
  margin-right: 8pt;
  margin-top: -3pt;
}

.chap h3 {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 11pt;
  color: var(--cc-white);
  margin: 14pt 0 5pt 0;
}

.chap p {
  margin: 0 0 9pt 0;
  color: #D9DBDE;
}

.chap .lead {
  font-size: 12pt;
  color: var(--cc-white);
  font-weight: 400;
  margin-bottom: 14pt;
  line-height: 1.45;
}

.chap ul, .chap ol {
  margin: 0 0 12pt 0;
  padding-left: 18pt;
  color: #D9DBDE;
}

.chap li { margin-bottom: 4pt; }
.chap li::marker { color: var(--cc-green); }

.chap u, .chap .underline {
  text-decoration: underline;
  text-decoration-color: var(--cc-green);
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
}

.chap .accent { color: var(--cc-green); font-weight: 600; }

.chap blockquote, .pull-quote {
  border-left: 3px solid var(--cc-green);
  margin: 14pt 0;
  padding: 4pt 0 4pt 14pt;
  font-size: 11pt;
  color: var(--cc-white);
  line-height: 1.45;
  font-style: normal;
}

/* Compliance / not-medical-advice footer line */
.chap .compliance-line {
  margin-top: 16pt;
  padding-top: 10pt;
  border-top: 1px solid var(--cc-rule);
  font-size: 8.5pt;
  color: var(--cc-dim-2);
  letter-spacing: 0.01em;
  font-style: italic;
}

/* ----------------------------------------
   STAT BLOCK (callout with green number)
---------------------------------------- */
.stat-block {
  background: var(--cc-card);
  border-left: 3px solid var(--cc-green);
  padding: 14pt 16pt;
  margin: 14pt 0;
  border-radius: 4pt;
}

.stat-block .stat-num {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 900;
  font-size: 32pt;
  color: var(--cc-green);
  line-height: 1;
  letter-spacing: -0.02em;
}

.stat-block .stat-label {
  font-size: 9.5pt;
  color: var(--cc-dim);
  margin-top: 4pt;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

/* Card */
.card {
  background: var(--cc-card);
  border-radius: 10pt;
  padding: 16pt 18pt;
  margin: 14pt 0;
}

.card.cream {
  background: var(--cc-cream);
  color: #1A1A1A;
}

.card.cream p, .card.cream li { color: #1A1A1A; }
.card.cream h3, .card.cream h2 { color: #0A0A0A; }

/* ----------------------------------------
   PHOTO PANEL (cream card holding a product photo on dark page)
---------------------------------------- */
.photo-panel {
  background: var(--cc-cream);
  border-radius: 14pt;
  padding: 0;
  margin: 16pt 0;
  overflow: hidden;
  page-break-inside: avoid;
}

.photo-panel figure.image-slot {
  margin: 0; padding: 0;
}

.photo-panel figure.image-slot.has-image img {
  display: block;
  width: 100%;
  height: auto;
}

.photo-panel figure.image-slot:not(.has-image) .placeholder {
  background: var(--cc-cream);
  min-height: 3.2in;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  border: 2px dashed var(--cc-dim);
  color: #555;
}

/* Compact variant: caps the image height so single-product shots don't
   dominate a full page when surrounding text needs room. */
.photo-panel.compact figure.image-slot.has-image img {
  max-height: 2.6in;
  width: auto;
  margin: 0 auto;
  object-fit: contain;
}

.photo-panel.compact figure.image-slot:not(.has-image) .placeholder {
  min-height: 2.1in;
}

.photo-panel .caption {
  padding: 0 18pt 14pt 18pt;
  font-size: 9pt;
  color: #555;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-align: center;
}

/* ----------------------------------------
   BIOAVAILABILITY BAR CHART (inline HTML/CSS)
---------------------------------------- */
.bioavail {
  margin: 16pt 0 18pt 0;
  background: var(--cc-card);
  padding: 18pt 20pt 16pt 20pt;
  border-radius: 10pt;
}

.bioavail .row {
  margin-bottom: 14pt;
}

.bioavail .row:last-child { margin-bottom: 0; }

.bioavail .label-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 6pt;
}

.bioavail .label {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 11pt;
  color: var(--cc-white);
  letter-spacing: -0.005em;
}

.bioavail .value {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 800;
  font-size: 18pt;
  color: var(--cc-green);
  letter-spacing: -0.01em;
}

.bioavail .value.dim {
  color: var(--cc-dim);
}

.bioavail .bar-track {
  background: var(--cc-rule);
  height: 12pt;
  border-radius: 6pt;
  overflow: hidden;
  position: relative;
}

.bioavail .bar-fill {
  height: 100%;
  background: var(--cc-green);
  border-radius: 6pt;
}

.bioavail .bar-fill.dim {
  background: var(--cc-dim-2);
}

.bioavail .ticks {
  display: flex;
  justify-content: space-between;
  margin-top: 6pt;
  font-size: 8pt;
  color: var(--cc-dim-2);
  letter-spacing: 0.04em;
}

/* ----------------------------------------
   X-vs-CHECK COMPARISON CARDS
---------------------------------------- */
.compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14pt;
  margin: 16pt 0;
}

.compare .col {
  background: var(--cc-card);
  border-radius: 10pt;
  padding: 16pt 18pt;
}

.compare .col h3 {
  margin-top: 0;
  margin-bottom: 10pt;
  font-size: 11pt;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.compare .col.bad h3 { color: var(--cc-red); }
.compare .col.good h3 { color: var(--cc-green); }

.compare ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.compare li {
  position: relative;
  padding-left: 20pt;
  margin-bottom: 7pt;
  font-size: 10pt;
  color: #D9DBDE;
  line-height: 1.4;
}

.compare li::before {
  position: absolute;
  left: 0; top: 0;
  font-weight: 800;
  font-size: 11pt;
}

.compare .bad li::before { content: '✕'; color: var(--cc-red); }
.compare .good li::before { content: '✓'; color: var(--cc-green); }
.compare .col.baseline-col h3 { color: var(--cc-white); }
.compare .col.spike-col h3 { color: var(--cc-green); }
.compare .baseline-col li::before { content: '•'; color: var(--cc-dim); top: -2pt; }
.compare .spike-col li::before { content: '•'; color: var(--cc-green); top: -2pt; }

/* ----------------------------------------
   FLOW DIAGRAM (horizontal node chain)
---------------------------------------- */
.flow {
  display: grid;
  grid-template-columns: repeat(var(--cols, 4), 1fr);
  gap: 8pt;
  margin: 16pt 0;
  align-items: stretch;
}

.flow .step {
  background: var(--cc-card);
  border-radius: 8pt;
  padding: 12pt 10pt;
  text-align: center;
  position: relative;
}

.flow .step .step-num {
  display: block;
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 800;
  font-size: 10pt;
  color: var(--cc-green);
  letter-spacing: 0.04em;
  margin-bottom: 5pt;
}

.flow .step .step-label {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 10pt;
  color: var(--cc-white);
  line-height: 1.25;
}

.flow .step .step-sub {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 400;
  font-size: 8.5pt;
  color: var(--cc-dim);
  margin-top: 4pt;
  line-height: 1.3;
}

.flow .step + .step::before {
  content: '›';
  position: absolute;
  left: -7pt; top: 50%;
  transform: translateY(-50%);
  color: var(--cc-green);
  font-weight: 800;
  font-size: 14pt;
}

/* ----------------------------------------
   WEEK CADENCE GRID (5 on / 2 off)
---------------------------------------- */
.cadence {
  margin: 16pt 0;
  background: var(--cc-card);
  padding: 16pt 18pt;
  border-radius: 10pt;
}

.cadence .days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10pt;
  margin-bottom: 8pt;
}

.cadence .day {
  text-align: center;
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
}

.cadence .day .name {
  font-size: 9pt;
  color: var(--cc-dim);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 4pt;
}

.cadence .day .circle {
  width: 32pt; height: 32pt; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto;
  font-weight: 700;
  font-size: 10pt;
}

.cadence .day.on .circle {
  background: var(--cc-green);
  color: var(--cc-black);
}

.cadence .day.off .circle {
  background: transparent;
  border: 1.5px solid var(--cc-dim-2);
  color: var(--cc-dim);
}

.cadence .caption {
  text-align: center;
  font-size: 9pt;
  color: var(--cc-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 8pt;
}

/* ----------------------------------------
   TIMELINE
---------------------------------------- */
.timeline {
  margin: 16pt 0;
  padding: 12pt 0 18pt 0;
}

.timeline .track {
  position: relative;
  height: 2px;
  background: var(--cc-rule);
  margin: 14pt 6pt 0 6pt;
}

.timeline .track::before {
  content: '';
  position: absolute;
  left: 0; top: 0;
  height: 100%;
  width: 100%;
  background: var(--cc-green);
  opacity: 0.6;
}

.timeline .marks {
  display: flex;
  justify-content: space-between;
  position: relative;
  margin: -7pt 0 0 0;
}

.timeline .mark {
  text-align: center;
  width: 1.2in;
  position: relative;
}

.timeline .mark .dot {
  width: 12pt; height: 12pt; border-radius: 50%;
  background: var(--cc-green);
  margin: 0 auto 6pt auto;
  box-shadow: 0 0 0 4pt var(--cc-black);
}

.timeline .mark .day {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 10pt;
  color: var(--cc-white);
  letter-spacing: -0.005em;
}

.timeline .mark .phase {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 400;
  font-size: 8.5pt;
  color: var(--cc-dim);
  margin-top: 2pt;
  line-height: 1.25;
}

/* ----------------------------------------
   DOSAGE EQUATION
---------------------------------------- */
.dose-eq {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: 14pt;
  align-items: center;
  margin: 16pt 0;
  background: var(--cc-card);
  padding: 18pt 20pt;
  border-radius: 10pt;
}

.dose-eq .box {
  text-align: center;
}

.dose-eq .box .big {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 800;
  font-size: 22pt;
  color: var(--cc-green);
  letter-spacing: -0.02em;
  line-height: 1;
}

.dose-eq .box .small {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 500;
  font-size: 9pt;
  color: var(--cc-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 5pt;
}

.dose-eq .arrow {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 22pt;
  color: var(--cc-green);
}

/* ----------------------------------------
   STACK CURVE (NMN baseline + injection spikes)
---------------------------------------- */
.stack-curve {
  background: var(--cc-card);
  border-radius: 10pt;
  padding: 16pt 18pt;
  margin: 16pt 0;
}

.stack-curve .legend {
  display: flex;
  gap: 18pt;
  margin-bottom: 10pt;
  font-size: 9pt;
  color: var(--cc-dim);
  letter-spacing: 0.02em;
}

.stack-curve .legend .swatch {
  display: inline-block;
  width: 14pt; height: 3pt;
  vertical-align: middle;
  margin-right: 5pt;
}

.stack-curve .legend .baseline { background: var(--cc-dim); }
.stack-curve .legend .spike { background: var(--cc-green); }

.stack-curve svg { width: 100%; height: auto; display: block; }

/* ----------------------------------------
   STABILITY CURVE (CryoBuffer vs untreated)
---------------------------------------- */
.stability-curve {
  background: var(--cc-card);
  border-radius: 10pt;
  padding: 16pt 18pt;
  margin: 16pt 0;
}

.stability-curve .legend {
  display: flex;
  gap: 18pt;
  margin-bottom: 10pt;
  font-size: 9pt;
  color: var(--cc-dim);
  letter-spacing: 0.02em;
}

.stability-curve .legend .swatch {
  display: inline-block;
  width: 14pt; height: 3pt;
  vertical-align: middle;
  margin-right: 5pt;
}

.stability-curve .legend .protected { background: var(--cc-green); }
.stability-curve .legend .unprotected { background: var(--cc-dim); }

.stability-curve svg { width: 100%; height: auto; display: block; }

/* ----------------------------------------
   BADGE ROW
---------------------------------------- */
.badges {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14pt;
  margin: 18pt 0;
}

.badges .badge {
  background: var(--cc-card);
  border-radius: 10pt;
  padding: 16pt 14pt;
  text-align: center;
}

.badges .badge .icon {
  width: 36pt; height: 36pt; border-radius: 50%;
  border: 1.5px solid var(--cc-green);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 8pt auto;
  color: var(--cc-green);
  font-weight: 800;
  font-size: 16pt;
  line-height: 1;
}

.badges .badge .title {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 10pt;
  color: var(--cc-white);
  letter-spacing: 0.01em;
  margin-bottom: 3pt;
}

.badges .badge .sub {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 400;
  font-size: 8.5pt;
  color: var(--cc-dim);
  letter-spacing: 0.02em;
  line-height: 1.3;
}

/* ----------------------------------------
   PHYSICIAN Q&A CALLOUT
   Inline clinical-voice answer to a patient question.
---------------------------------------- */
.qa {
  background: var(--cc-card);
  border-left: 3px solid var(--cc-green);
  border-radius: 0 8pt 8pt 0;
  padding: 14pt 16pt;
  margin: 16pt 0;
  page-break-inside: avoid;
}

.qa .qa-tag {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 8.5pt;
  letter-spacing: 0.18em;
  color: var(--cc-green);
  text-transform: uppercase;
  margin-bottom: 6pt;
}

.qa .qa-q {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 11pt;
  color: var(--cc-white);
  line-height: 1.35;
  letter-spacing: -0.005em;
  margin: 0 0 8pt 0;
}

.qa .qa-a {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 400;
  font-size: 10pt;
  color: #D9DBDE;
  line-height: 1.5;
  margin: 0 0 6pt 0;
}

.qa .qa-attr {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 500;
  font-size: 8.5pt;
  color: var(--cc-dim);
  letter-spacing: 0.02em;
  margin-top: 4pt;
}

/* ----------------------------------------
   COMPARATIVE PROTOCOL TABLE
---------------------------------------- */
.comp-table {
  width: 100%;
  border-collapse: collapse;
  margin: 16pt 0;
  background: var(--cc-card);
  border-radius: 8pt;
  overflow: hidden;
  page-break-inside: avoid;
}

.comp-table thead th {
  background: #0f0f0f;
  color: var(--cc-green);
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 9pt;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
  padding: 10pt 12pt;
  border-bottom: 1.5px solid var(--cc-green);
}

.comp-table tbody td {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 9.5pt;
  color: #D9DBDE;
  padding: 9pt 12pt;
  border-bottom: 1px solid var(--cc-rule);
  vertical-align: top;
  line-height: 1.4;
}

.comp-table tbody tr:last-child td {
  border-bottom: none;
}

.comp-table tbody td:first-child {
  font-weight: 700;
  color: var(--cc-white);
  width: 1.4in;
}

.comp-table tbody td.good { color: var(--cc-green); font-weight: 600; }
.comp-table tbody td.bad { color: var(--cc-red); font-weight: 600; }

/* ----------------------------------------
   TRACKER / CHECKLIST
---------------------------------------- */
.tracker-intro {
  background: var(--cc-card);
  border-radius: 10pt;
  padding: 16pt 18pt;
  margin: 12pt 0 16pt 0;
}

.tracker-intro p {
  font-size: 10.5pt;
  color: #D9DBDE;
  margin: 0;
  line-height: 1.5;
}

/* Daily log table */
.log-table {
  width: 100%;
  border-collapse: collapse;
  margin: 12pt 0 20pt 0;
  page-break-inside: avoid;
}

.log-table thead th {
  background: var(--cc-card);
  color: var(--cc-green);
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 8.5pt;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
  padding: 8pt 10pt;
  border-bottom: 1.5px solid var(--cc-green);
}

.log-table tbody td {
  font-size: 9pt;
  color: var(--cc-dim);
  padding: 11pt 10pt;
  border-bottom: 1px solid var(--cc-rule);
}

.log-table tbody tr td:nth-child(1) { width: 0.75in; color: var(--cc-white); font-weight: 600; }
.log-table tbody tr td:nth-child(2) { width: 0.85in; }
.log-table tbody tr td:nth-child(3) { width: 0.85in; }
.log-table tbody tr td:nth-child(4) { width: 1.05in; }
.log-table tbody tr td:nth-child(5) { color: var(--cc-dim-2); }

/* Checklist */
.checklist {
  list-style: none;
  padding: 0;
  margin: 12pt 0;
}

.checklist li {
  display: flex;
  align-items: flex-start;
  gap: 10pt;
  padding: 7pt 0;
  border-bottom: 1px solid var(--cc-rule);
  font-size: 10pt;
  color: #D9DBDE;
  line-height: 1.4;
}

.checklist li::before {
  content: '';
  flex-shrink: 0;
  width: 13pt;
  height: 13pt;
  border: 1.5px solid var(--cc-green);
  border-radius: 3pt;
  margin-top: 1pt;
  background: transparent;
}

.checklist li:last-child { border-bottom: none; }

.checklist .item-label {
  flex: 1;
}

.checklist .item-sub {
  display: block;
  font-size: 8.5pt;
  color: var(--cc-dim-2);
  margin-top: 2pt;
  font-weight: 400;
}

/* Symptom journal grid */
.symptom-grid {
  display: grid;
  grid-template-columns: 1.1in repeat(7, 1fr);
  gap: 0;
  margin: 12pt 0;
  background: var(--cc-card);
  border-radius: 8pt;
  overflow: hidden;
  page-break-inside: avoid;
}

.symptom-grid .head {
  background: #0f0f0f;
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 8pt;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--cc-green);
  padding: 7pt 6pt;
  border-bottom: 1.5px solid var(--cc-green);
}

.symptom-grid .label {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 9pt;
  color: var(--cc-white);
  padding: 11pt 10pt;
  border-bottom: 1px solid var(--cc-rule);
}

.symptom-grid .cell {
  border-bottom: 1px solid var(--cc-rule);
  border-left: 1px solid var(--cc-rule);
  min-height: 24pt;
}

.symptom-grid .label:first-child {
  border-left: none;
}

.symptom-grid .row-last { border-bottom: none; }

/* Followup question prompt page */
.followup-q {
  background: var(--cc-card);
  border-radius: 8pt;
  padding: 13pt 16pt;
  margin: 10pt 0;
  page-break-inside: avoid;
}

.followup-q .q-num {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 700;
  font-size: 8.5pt;
  letter-spacing: 0.1em;
  color: var(--cc-green);
  margin-bottom: 4pt;
}

.followup-q .q-text {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 10.5pt;
  color: var(--cc-white);
  line-height: 1.4;
  margin-bottom: 6pt;
}

.followup-q .q-line {
  border-bottom: 1px solid var(--cc-rule);
  height: 14pt;
  margin-top: 4pt;
}

/* ----------------------------------------
   REFERENCES / CITATIONS
---------------------------------------- */
.refs {
  font-size: 8.5pt;
  color: var(--cc-dim);
  line-height: 1.4;
  margin: 14pt 0;
}

.refs ol { padding-left: 18pt; }
.refs li { margin-bottom: 5pt; }

/* ----------------------------------------
   IMAGE SLOTS (fallback placeholder display)
---------------------------------------- */
figure.image-slot {
  margin: 14pt 0;
  page-break-inside: avoid;
  text-align: center;
}

figure.image-slot .placeholder {
  border: 2px dashed var(--cc-green);
  background: rgba(180, 255, 60, 0.05);
  padding: 18pt;
  border-radius: 8pt;
  color: var(--cc-dim);
}

figure.image-slot .slot-id {
  font-family: 'SF Mono', Menlo, Monaco, Consolas, monospace;
  font-size: 9pt;
  font-weight: 700;
  color: var(--cc-green);
  margin-bottom: 4pt;
}

figure.image-slot .slot-spec {
  font-size: 8.5pt;
  color: var(--cc-dim);
  margin-bottom: 6pt;
}

figure.image-slot .slot-subject {
  font-size: 9pt;
  color: var(--cc-dim);
  font-style: italic;
  max-width: 5in;
  margin: 0 auto;
  line-height: 1.4;
}

figure.image-slot.has-image img {
  max-width: 100%;
  height: auto;
  border-radius: 6pt;
}

figure.image-slot figcaption {
  font-size: 9pt;
  color: var(--cc-dim);
  margin-top: 6pt;
}

body.final figure.image-slot:not(.has-image) {
  display: none;
}

/* ----------------------------------------
   CLOSING
---------------------------------------- */
.closing {
  background: var(--cc-black);
  color: var(--cc-white);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 1in;
}

.closing .eyebrow {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 600;
  font-size: 9pt;
  letter-spacing: 0.28em;
  color: var(--cc-green);
  text-transform: uppercase;
  margin-bottom: 0.3in;
}

.closing h1 {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-weight: 900;
  font-size: 48pt;
  color: var(--cc-white);
  margin-bottom: 0.4in;
  line-height: 1;
  letter-spacing: -0.025em;
  max-width: 6in;
}

.closing h1 .accent { color: var(--cc-green); }

.closing p {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 13pt;
  max-width: 5.5in;
  line-height: 1.5;
  margin-bottom: 12pt;
  color: var(--cc-dim);
}

.closing .closing-cta {
  font-family: 'Roboto Slab', 'Helvetica Neue', Arial, serif;
  font-size: 13.5pt;
  font-weight: 600;
  max-width: 5.5in;
  line-height: 1.5;
  margin-top: 20pt;
  padding-top: 18pt;
  border-top: 1px solid var(--cc-rule);
  color: var(--cc-white);
}

.closing .wordmark {
  margin-top: 0.5in;
  font-weight: 800;
  font-size: 11pt;
  letter-spacing: 0.22em;
  color: var(--cc-white);
  text-transform: uppercase;
}

.closing .wordmark .green-dot {
  display: inline-block;
  width: 7pt; height: 7pt; border-radius: 50%;
  background: var(--cc-green);
  margin-right: 8pt;
  vertical-align: middle;
}

/* ============================================
   PRINT MODE (build.py --print flag)
   Hybrid light variant for cost-saving paper print runs.
   What stays DARK: .cover-full (one ink-rich page sets the brand tone)
   and every .divider (8 wilderness photographs that carry the brand).
   What flips to LIGHT: .index, .page-body, .closing, and every inline
   chart/table/card that sits in body pages.
   Saves roughly 60–70% of the toner cost of the full dark version.
============================================ */

body.print-mode {
  --print-paper: #FFFFFF;
  --print-type: #0A0A0A;
  --print-type-soft: #1A1A1A;
  --print-type-dim: #555555;
  --print-rule: #DDDDDD;
  --print-card: #F5EFE1;
  --print-card-deep: #ECE3D1;
  --print-green: #B53030;   /* BFS red, muted for editorial white background contrast */
  --print-red: #B53030;
}

/* Index page → light */
body.print-mode .index {
  background: var(--print-paper);
  color: var(--print-type);
}
body.print-mode .index .index-header { border-bottom-color: var(--print-rule); }
body.print-mode .index .index-eyebrow { color: var(--print-green); }
body.print-mode .index h1.index-title { color: var(--print-type); }
body.print-mode .index .index-meta { color: var(--print-type-dim); }
body.print-mode .index ol li { border-bottom-color: var(--print-rule); }
body.print-mode .index .index-num { color: var(--print-green); }
body.print-mode .index .index-name { color: var(--print-type); }
body.print-mode .index .index-pg { color: var(--print-type-dim); }
body.print-mode .index .index-foot { color: var(--print-type-dim); border-top-color: var(--print-rule); }

/* Body pages → light */
body.print-mode .page-body { background: var(--print-paper); color: var(--print-type); }
body.print-mode .page-body .running-footer {
  background: var(--print-paper);
  border-top: 1px solid var(--print-rule);
  color: var(--print-type-dim);
}
body.print-mode .page-body .running-footer .page-num { color: var(--print-green); }

/* Body type */
body.print-mode .chap h1 { color: var(--print-type); }
body.print-mode .chap h2 { color: var(--print-type); }
body.print-mode .chap h2::before { background: var(--print-green); }
body.print-mode .chap h3 { color: var(--print-type); }
body.print-mode .chap p { color: var(--print-type-soft); }
body.print-mode .chap .lead { color: var(--print-type); }
body.print-mode .chap ul, body.print-mode .chap ol { color: var(--print-type-soft); }
body.print-mode .chap li::marker { color: var(--print-green); }
body.print-mode .chap strong { color: var(--print-type); }
body.print-mode .chap u, body.print-mode .chap .underline { text-decoration-color: var(--print-green); }
body.print-mode .chap .accent { color: var(--print-green); }
body.print-mode .chap blockquote, body.print-mode .pull-quote {
  border-left-color: var(--print-green);
  color: var(--print-type);
}
body.print-mode .chap .compliance-line {
  color: var(--print-type-dim);
  border-top-color: var(--print-rule);
}

/* Stat block */
body.print-mode .stat-block { background: var(--print-card); border-left-color: var(--print-green); }
body.print-mode .stat-block .stat-num { color: var(--print-green); }
body.print-mode .stat-block .stat-label { color: var(--print-type-dim); }

/* Cards */
body.print-mode .card { background: var(--print-card); }
body.print-mode .card.cream { background: var(--print-paper); border: 1px solid var(--print-rule); }
body.print-mode .card h3 { color: var(--print-type); }
body.print-mode .card p, body.print-mode .card li { color: var(--print-type-soft); }

/* Q&A callout */
body.print-mode .qa { background: var(--print-card); border-left-color: var(--print-green); }
body.print-mode .qa .qa-tag { color: var(--print-green); }
body.print-mode .qa .qa-q { color: var(--print-type); }
body.print-mode .qa .qa-a { color: var(--print-type-soft); }
body.print-mode .qa .qa-attr { color: var(--print-type-dim); }

/* Bioavailability bar */
body.print-mode .bioavail { background: var(--print-card); }
body.print-mode .bioavail .label { color: var(--print-type); }
body.print-mode .bioavail .value { color: var(--print-green); }
body.print-mode .bioavail .value.dim { color: var(--print-type-dim); }
body.print-mode .bioavail .bar-track { background: var(--print-rule); }
body.print-mode .bioavail .bar-fill { background: var(--print-green); }
body.print-mode .bioavail .bar-fill.dim { background: #999999; }
body.print-mode .bioavail .ticks { color: var(--print-type-dim); }

/* X-vs-check compare cards */
body.print-mode .compare .col { background: var(--print-card); }
body.print-mode .compare li { color: var(--print-type-soft); }
body.print-mode .compare .col.good h3 { color: var(--print-green); }
body.print-mode .compare .col.bad h3 { color: var(--print-red); }
body.print-mode .compare .bad li::before { color: var(--print-red); }
body.print-mode .compare .good li::before { color: var(--print-green); }

/* Comparative protocol table */
body.print-mode .comp-table { background: var(--print-card); }
body.print-mode .comp-table thead th {
  background: var(--print-card-deep);
  color: var(--print-green);
  border-bottom-color: var(--print-green);
}
body.print-mode .comp-table tbody td {
  color: var(--print-type-soft);
  border-bottom-color: var(--print-rule);
}
body.print-mode .comp-table tbody td:first-child { color: var(--print-type); }
body.print-mode .comp-table tbody td.good { color: var(--print-green); }
body.print-mode .comp-table tbody td.bad { color: var(--print-red); }

/* Flow diagram steps */
body.print-mode .flow .step { background: var(--print-card); }
body.print-mode .flow .step .step-num { color: var(--print-green); }
body.print-mode .flow .step .step-label { color: var(--print-type); }
body.print-mode .flow .step .step-sub { color: var(--print-type-dim); }
body.print-mode .flow .step + .step::before { color: var(--print-green); }

/* Cadence grid */
body.print-mode .cadence { background: var(--print-card); }
body.print-mode .cadence .day .name { color: var(--print-type-dim); }
body.print-mode .cadence .day.on .circle { background: var(--print-green); color: var(--print-paper); }
body.print-mode .cadence .day.off .circle {
  border-color: var(--print-type-dim);
  color: var(--print-type-dim);
}
body.print-mode .cadence .caption { color: var(--print-type-dim); }

/* Timeline */
body.print-mode .timeline .track { background: var(--print-rule); }
body.print-mode .timeline .track::before { background: var(--print-green); }
body.print-mode .timeline .mark .dot { background: var(--print-green); box-shadow: 0 0 0 4pt var(--print-paper); }
body.print-mode .timeline .mark .day { color: var(--print-type); }
body.print-mode .timeline .mark .phase { color: var(--print-type-dim); }

/* Dose equation block */
body.print-mode .dose-eq { background: var(--print-card); }
body.print-mode .dose-eq .box .big { color: var(--print-green); }
body.print-mode .dose-eq .box .small { color: var(--print-type-dim); }
body.print-mode .dose-eq .arrow { color: var(--print-green); }

/* Stack and stability curves */
body.print-mode .stack-curve, body.print-mode .stability-curve { background: var(--print-card); }
body.print-mode .stack-curve .legend, body.print-mode .stability-curve .legend { color: var(--print-type-dim); }
body.print-mode .stack-curve svg, body.print-mode .stability-curve svg { background: var(--print-card) !important; }

/* Badge row */
body.print-mode .badges .badge { background: var(--print-card); }
body.print-mode .badges .badge .icon { border-color: var(--print-green); color: var(--print-green); }
body.print-mode .badges .badge .title { color: var(--print-type); }
body.print-mode .badges .badge .sub { color: var(--print-type-dim); }

/* Tracker chapter elements */
body.print-mode .tracker-intro { background: var(--print-card); }
body.print-mode .tracker-intro p { color: var(--print-type-soft); }
body.print-mode .log-table thead th {
  background: var(--print-card);
  color: var(--print-green);
  border-bottom-color: var(--print-green);
}
body.print-mode .log-table tbody td { color: var(--print-type-dim); border-bottom-color: var(--print-rule); }
body.print-mode .log-table tbody tr td:nth-child(1) { color: var(--print-type); }
body.print-mode .checklist li { color: var(--print-type-soft); border-bottom-color: var(--print-rule); }
body.print-mode .checklist li::before { border-color: var(--print-green); }
body.print-mode .checklist .item-sub { color: var(--print-type-dim); }
body.print-mode .symptom-grid { background: var(--print-card); }
body.print-mode .symptom-grid .head { background: var(--print-card-deep); color: var(--print-green); border-bottom-color: var(--print-green); }
body.print-mode .symptom-grid .label { color: var(--print-type); border-bottom-color: var(--print-rule); }
body.print-mode .symptom-grid .cell { border-bottom-color: var(--print-rule); border-left-color: var(--print-rule); }
body.print-mode .followup-q { background: var(--print-card); }
body.print-mode .followup-q .q-num { color: var(--print-green); }
body.print-mode .followup-q .q-text { color: var(--print-type); }
body.print-mode .followup-q .q-line { border-bottom-color: var(--print-rule); }

/* References */
body.print-mode .refs { color: var(--print-type-dim); }

/* Closing page → light */
body.print-mode .closing {
  background: var(--print-paper);
  color: var(--print-type);
}
body.print-mode .closing h1 { color: var(--print-type); }
body.print-mode .closing h1 .accent { color: var(--print-green); }
body.print-mode .closing p { color: var(--print-type-dim); }
body.print-mode .closing .closing-cta { color: var(--print-type); border-top-color: var(--print-rule); }
body.print-mode .closing .wordmark { color: var(--print-type); }
body.print-mode .closing .wordmark .green-dot { background: var(--print-green); }
body.print-mode .closing .eyebrow { color: var(--print-green); }

/* NOTE: cover (.cover-full) and chapter dividers (.divider) are intentionally
   NOT overridden — they stay dark to preserve the wilderness photography. */

/* ============================================
   BLEED MODE (build.py --bleed flag)
   Page extends to 8.75 x 11.25 (trim is still 8.5 x 11).
   Backgrounds fill the full bleed area; all content padding
   shifts inward by 0.125" so text stays inside the safe area.
   Crop marks at the four trim corners.
============================================ */

body.bleed .page {
  width: 8.75in;
  height: 11.25in;
}

body.bleed .page-body {
  padding: 0.925in 0.975in 1.075in 0.975in;
}

body.bleed .page-body .running-footer {
  bottom: 0.125in;
  padding: 0 0.975in;
}

body.bleed .cover-full {
  padding: 0.875in 0.825in 0.825in 0.825in;
}

body.bleed .index {
  padding: 1.075in 1.125in;
}

body.bleed .divider {
  padding: 1.225in 1.125in 0.9in 1.125in;
}

body.bleed .closing {
  padding: 1.125in;
}

/* Crop marks: 8 marks at the 4 trim corners (0.125" inset from page edges).
   Each mark is ~8px (0.083") long, 1px wide, black. Marks point INWARD from
   the page edge to just outside the trim line, with a small gap from the
   trim corner so they're easy to read. */
body.bleed .page::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 9999;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 840 1080' preserveAspectRatio='none'><g stroke='%23000' stroke-width='1' fill='none'><line x1='12' y1='0' x2='12' y2='6'/><line x1='0' y1='12' x2='6' y2='12'/><line x1='828' y1='0' x2='828' y2='6'/><line x1='834' y1='12' x2='840' y2='12'/><line x1='12' y1='1074' x2='12' y2='1080'/><line x1='0' y1='1068' x2='6' y2='1068'/><line x1='828' y1='1074' x2='828' y2='1080'/><line x1='834' y1='1068' x2='840' y2='1068'/></g></svg>");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/* ----------------------------------------
   PRINT
---------------------------------------- */
@media print {
  h1, h2, h3 { page-break-after: avoid; }
  figure, .stat-block, .card, .bioavail, .compare, .flow, .cadence, .timeline,
  .dose-eq, .stack-curve, .stability-curve, .badges, .pull-quote, blockquote {
    page-break-inside: avoid;
  }
}