/* Perfect World · visual edition (default layer). White paper, black ink, one signal red, mono labels, corner-bracket panels,
   following the exhibition posters. Print-safe: no full-bleed ink. */
.book-root .book-content {
  --bg: #fff; --panel: #f3f3f1; --fg: #0a0a0a; --muted: #5d5d59; --line: rgba(0,0,0,.25);
  --accent: #e10600; --bracket: 4.5mm; --bracket-w: .35mm;
  --mono: "Courier New", ui-monospace, monospace; --display: "Book Barlow Italic", "Book Barlow", Arial, sans-serif;
  color: var(--fg); background: var(--bg);
}
.book-root .book-content a { text-decoration-color: var(--accent); }
.book-root .book-content h1, .book-root .book-content h2, .book-root .book-content h3, .book-root .book-content h4 { color: var(--fg); font-family: var(--display); font-style: italic; text-transform: uppercase; letter-spacing: -.01em; }
.book-root .book-content .book-label { font-family: var(--mono); font-size: 7.5pt; letter-spacing: .16em; color: var(--accent); }
.book-root .book-content .book-subtitle { font-family: var(--mono); font-size: 9pt; line-height: 14pt; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
/* Corner-bracket frame, reusable: add to any panel. */
.book-root .book-cover-art, .book-root .book-figure-drawing, .book-root .book-figure-images, .book-root .book-evidence-note, .book-root .book-content blockquote, .book-root .book-statement {
  position: relative;
}
.book-root .book-figure-drawing::before, .book-root .book-figure-images::before, .book-root .book-evidence-note::before, .book-root .book-content blockquote::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(var(--accent), var(--accent)) top left / var(--bracket) var(--bracket-w) no-repeat,
    linear-gradient(var(--accent), var(--accent)) top left / var(--bracket-w) var(--bracket) no-repeat,
    linear-gradient(var(--accent), var(--accent)) top right / var(--bracket) var(--bracket-w) no-repeat,
    linear-gradient(var(--accent), var(--accent)) top right / var(--bracket-w) var(--bracket) no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom left / var(--bracket) var(--bracket-w) no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom left / var(--bracket-w) var(--bracket) no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom right / var(--bracket) var(--bracket-w) no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom right / var(--bracket-w) var(--bracket) no-repeat;
}
/* Cover */
.book-root .book-cover { height: 246mm; }
.book-root .book-cover > .book-label { margin-bottom: 8mm; border-bottom: .25mm solid var(--line); padding-bottom: 4mm; }
.book-root .book-cover h1 { font-size: 104pt; line-height: .8; letter-spacing: -.03em; margin: 4mm 0 9mm; }
.book-root .book-cover h1 span:first-child { color: var(--fg); }
.book-root .book-cover h1 span:last-child { color: var(--accent); margin-left: 12mm; }
.book-root .book-cover-subtitle { font-family: var(--mono); font-size: 10pt !important; line-height: 15pt !important; letter-spacing: .1em; text-transform: uppercase; max-width: 125mm; }
.book-root .book-content .book-cover-art { height: 82mm; filter: grayscale(.2) contrast(1.05); border: .25mm solid var(--line); }
.book-root .book-cover-credit { font: 7pt/10pt var(--mono) !important; color: var(--muted); }
.book-root .book-cover-footer { border-top: .25mm solid var(--line); font-family: var(--mono); font-size: 8pt; letter-spacing: .08em; text-transform: uppercase; }
/* Contents */
.book-root .book-contents h2 { font-size: 40pt; margin: 0 0 8mm; }
.book-root .book-contents a { border-bottom: .2mm solid var(--line); padding: .5mm 0; }
.book-root .book-contents ol { font-size: 9.5pt; line-height: 12pt; }
.book-root .book-contents li { margin-bottom: .6mm; }
.book-root .book-toc-part { color: var(--accent); font-family: var(--mono); font-size: 8.5pt; letter-spacing: .12em; text-transform: uppercase; }
.book-root .book-toc-number { font-family: var(--mono); color: var(--muted); }
/* Part openers: huge outlined numeral, left rail. */
.book-root .book-part { padding-top: 14mm; position: relative; }
.book-root .book-part::before { content: attr(data-number); display: block; font: italic 600 230pt/.8 "Book Barlow Italic", Arial, sans-serif; color: transparent; -webkit-text-stroke: .5mm var(--accent); margin: 0 0 14mm -2mm; }
.book-root .book-part .book-section-heading { border-top: .25mm solid var(--line); padding-top: 8mm; }
.book-root .book-part h2 { font-size: 56pt; line-height: .95; }
.book-root .book-part .book-prose { font-size: 12pt; line-height: 18pt; max-width: 120mm; color: var(--muted); }
/* Chapter openers: outlined numeral in the left rail, title beside it. */
.book-root .book-chapter { position: relative; }
.book-root .book-chapter::before { content: attr(data-number); position: absolute; top: 3mm; left: 0; font: italic 600 64pt/.85 "Book Barlow Italic", Arial, sans-serif; color: transparent; -webkit-text-stroke: .35mm var(--accent); }
.book-root .book-chapter .book-section-heading { padding: 0 0 6mm 30mm; border-bottom: .25mm solid var(--line); margin-bottom: 9mm; min-height: 24mm; }
.book-root .book-chapter .book-section-heading h2 { font-size: 30pt; line-height: 1; margin-bottom: 3mm; }
/* Statement page */
.book-root .book-statement h2 { font-size: 64pt; color: var(--accent); }
.book-root .book-statement p:last-child { font-family: var(--mono); font-size: 10pt; line-height: 16pt; letter-spacing: .06em; text-transform: uppercase; color: var(--fg); }
/* Body */
.book-root .book-prose p { color: #1a1a1a; }
.book-root .book-content strong { color: var(--fg); }
.book-root .book-prose h3 { font-size: 12pt; line-height: 16pt; margin: 8mm 0 3mm; padding-top: 4mm; border-top: .2mm solid var(--line); }
.book-root .book-content blockquote { border-left: 0; margin: 8mm 0; padding: 6mm 7mm; background: var(--panel); font-family: var(--display); font-style: italic; font-size: 16pt; line-height: 21pt; text-transform: uppercase; }
.book-root .book-evidence-note { border-left: 0; padding: 5mm 7mm; background: var(--panel); font-family: var(--mono); font-size: 8pt; line-height: 12.5pt; color: var(--muted); }
/* Figures sit in light panels; the stored SVGs are already black-on-white. */
.book-figure-heading { font-family: var(--mono); font-size: 7.5pt; letter-spacing: .12em; text-transform: uppercase; }
.book-root .book-figure-heading strong { color: var(--accent); font-weight: 400; }
.book-root .book-figure-drawing { border: 0; padding: 7mm 6mm; background: var(--panel); }
.book-root .book-figure-images { border: 0; padding: 6mm; background: var(--panel); }
.book-root .book-figure figcaption { font-family: var(--mono); font-size: 7.5pt; line-height: 11.5pt; color: var(--muted); }
.book-root .book-panel-label { font-family: var(--mono) !important; font-size: 7pt !important; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.book-root .book-content table { font-family: var(--mono); font-size: 8.5pt; }
.book-root .book-content th { color: var(--accent); text-transform: uppercase; letter-spacing: .1em; font-weight: 400; }
.book-root .book-content th, .book-root .book-content td { border-bottom-color: var(--line); }
.book-root .book-reference-list { font-size: 10pt; line-height: 16pt; color: #1a1a1a; }
/* The reader chrome paints every page white; the visual edition owns the whole sheet, margins included. */
.book-root .pagedjs_page, .book-root .pagedjs_pagebox, .book-root .pagedjs_area { background: #fff !important; }

/* Keep each figure whole: heading, drawing and note travel together. */
.book-root .book-figure-heading { break-after: auto; }
.book-root .book-figure { break-inside: avoid; }

/* HTML/CSS diagrams (FlowDiagram.tsx): real layout, text wraps and cards size to content. */
.book-root .book-html-drawing { padding: 6mm 6mm 5mm; display: grid; gap: 4mm; }
.book-root .hd-label { margin: 0; font: 400 7.5pt/10pt "Courier New", monospace; letter-spacing: .14em; text-transform: uppercase; color: #e10600; text-indent: 0; }
.book-root .hd-label-end { text-align: right; }
.book-root .hd-foot { margin: 0; font: 400 7.5pt/11pt "Courier New", monospace; letter-spacing: .04em; color: #5d5d59; text-indent: 0; }
.book-root .hd-rule { margin: 1mm 0; border: 0; border-top: .25mm solid rgba(0,0,0,.35); }
.book-root .hd-card { position: relative; box-sizing: border-box; min-width: 0; background: #fff; border: .3mm solid #0a0a0a; padding: 3mm 3.4mm 3.2mm; break-inside: avoid; }
.book-root .hd-card.hd-red { border: .5mm solid #e10600; }
.book-root .hd-card.hd-soft { background: #f3f3f1; }
.book-root .hd-card.hd-dashed { border-style: dashed; }
.book-root .hd-card p { margin: 0; text-indent: 0; }
.book-root .hd-tag { font: 400 7pt/9pt "Courier New", monospace; letter-spacing: .12em; text-transform: uppercase; color: #e10600; margin-bottom: 1.2mm !important; }
.book-root .hd-title { font: italic 600 12.5pt/14pt "Book Barlow Italic", "Book Barlow", Arial, sans-serif; text-transform: uppercase; letter-spacing: .01em; color: #0a0a0a; text-wrap: balance; }
.book-root .hd-sub { margin-top: 1.4mm !important; font: 400 10pt/12.5pt "Book Barlow", Arial, sans-serif; color: #1a1a1a; }
.book-root .hd-small { margin-top: 1.5mm !important; font: 400 7pt/9pt "Courier New", monospace; color: #5d5d59; }
.book-root .hd-numeral { display: block; font: italic 600 30pt/.9 "Book Barlow Italic", Arial, sans-serif; color: transparent; -webkit-text-stroke: .3mm #e10600; margin-bottom: 2mm; }
.book-root .hd-chips { display: flex; flex-wrap: wrap; gap: 1.5mm; margin: 2.2mm 0 0; padding: 0; list-style: none; }
.book-root .hd-chips li { background: #0a0a0a; color: #fff; font: 400 7.5pt/10pt "Courier New", monospace; letter-spacing: .1em; text-transform: uppercase; padding: 1.2mm 2.4mm; }

/* Strips: cards in a row joined by red arrows that sit in the gap. */
.book-root .hd-strip { display: grid; gap: 7mm; align-items: stretch; }
.book-root .hd-strip.hd-pair { gap: 14mm; }
.book-root .hd-strip.hd-wide-middle { grid-template-columns: 1fr 1.9fr 1fr !important; }
.book-root .hd-strip.hd-tall .hd-card { min-height: 46mm; }
.book-root .hd-arrows > .hd-card:not(:last-child)::after { content: ""; position: absolute; top: 50%; left: 100%; width: 7mm; height: .45mm; margin-top: -.22mm; background: #e10600; }
.book-root .hd-arrows > .hd-card:not(:last-child)::before { content: ""; position: absolute; top: 50%; left: 100%; width: 1.9mm; height: 1.9mm; margin: -.95mm 0 0 5.1mm; border-top: .45mm solid #e10600; border-right: .45mm solid #e10600; transform: rotate(45deg); z-index: 1; }
.book-root .hd-strip.hd-pair.hd-arrows > .hd-card:not(:last-child)::after { width: 14mm; }
.book-root .hd-strip.hd-pair.hd-arrows > .hd-card:not(:last-child)::before { margin-left: 12.1mm; }
.book-root .hd-strip.hd-tall .hd-numeral { font-size: 26pt; }

/* Branch card under a strip (decline path). */
.book-root .hd-branch { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7mm; }
.book-root .hd-branch .hd-card { grid-column: 2 / 4; margin-top: 3mm; }
.book-root .hd-branch .hd-card::before, .book-root .hd-branch .hd-card::after { content: ""; position: absolute; top: -3.4mm; width: 0; height: 3.4mm; border-left: .4mm dashed #0a0a0a; }
.book-root .hd-branch .hd-card::before { left: 25%; }
.book-root .hd-branch .hd-card::after { left: 75%; }

/* Rows: numbered questions with an optional end element. */
.book-root .hd-rows { display: grid; }
.book-root .hd-row { display: grid; grid-template-columns: 17mm minmax(0, 1fr) auto; gap: 4mm; align-items: center; padding: 3mm 0; border-top: .25mm solid rgba(0,0,0,.35); }
.book-root .hd-row:last-child { border-bottom: .25mm solid rgba(0,0,0,.35); }
.book-root .hd-row .hd-numeral { margin: 0; font-size: 26pt; }
.book-root .hd-row-body .hd-sub { margin-top: .6mm !important; }
.book-root .hd-track { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2mm; width: 58mm; font: 400 7pt/9pt "Courier New", monospace; color: #5d5d59; letter-spacing: .06em; }
.book-root .hd-track i { display: block; height: .4mm; background: #0a0a0a; position: relative; }
.book-root .hd-track i::before, .book-root .hd-track i::after { content: ""; position: absolute; top: -1.2mm; width: 2.4mm; height: 2.4mm; border: .35mm solid #0a0a0a; border-radius: 50%; background: #fff; }
.book-root .hd-track i::before { left: -1mm; }
.book-root .hd-track i::after { right: -1mm; }
.book-root .hd-check { display: grid; place-items: center; width: 7mm; height: 7mm; border: .35mm solid #0a0a0a; font: 400 8pt/1 "Courier New", monospace; color: #e10600; }

/* Stairs: columns of increasing height, solid where documented and dashed where intended. */
.book-root .hd-legend { margin: 0; display: flex; align-items: center; gap: 2mm; font: 400 7.5pt/10pt "Courier New", monospace; color: #5d5d59; text-indent: 0; }
.book-root .hd-key { display: inline-block; width: 8mm; border-top: .4mm solid #0a0a0a; margin-left: 4mm; }
.book-root .hd-key:first-child { margin-left: 0; }
.book-root .hd-key-dashed { border-top-style: dashed; }
.book-root .hd-stairs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3mm; align-items: end; border-bottom: .5mm solid #0a0a0a; }
.book-root .hd-stairs .hd-card { border-bottom: 0; }
.book-root .hd-step-1 { min-height: 38mm; } .book-root .hd-step-2 { min-height: 50mm; } .book-root .hd-step-3 { min-height: 62mm; } .book-root .hd-step-4 { min-height: 74mm; }

/* Trio of small cards. */
.book-root .hd-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4mm; }

.book-root .book-html-drawing p { margin: 0; text-indent: 0 !important; }
.book-root .book-html-drawing .hd-tag { margin-bottom: 1.2mm; }
.book-root .book-html-drawing .hd-sub, .book-root .book-html-drawing .hd-small { margin-top: 1.4mm; }

/* Arrows in their own grid cell. */
.book-root .hd-arr { display: grid; place-items: center; align-self: center; justify-self: center; }
.book-root .hd-arr i { display: block; position: relative; background: #e10600; }
.book-root .hd-arr i::after { content: ""; position: absolute; width: 1.9mm; height: 1.9mm; border-top: .45mm solid #e10600; border-right: .45mm solid #e10600; }
.book-root .hd-arr-r i, .book-root .hd-arr-l i { width: 9mm; height: .45mm; }
.book-root .hd-arr-r i::after { right: 0; top: 50%; transform: translateY(-50%) rotate(45deg); transform-origin: 70% 30%; margin-top: .3mm; }
.book-root .hd-arr-l i::after { left: 0; top: 50%; transform: translateY(-50%) rotate(-135deg); transform-origin: 30% 70%; margin-top: -.3mm; }
.book-root .hd-arr-d i, .book-root .hd-arr-u i { width: .45mm; height: 9mm; }
.book-root .hd-arr-d i::after { bottom: 0; left: 50%; transform: translateX(-50%) rotate(135deg); transform-origin: 30% 30%; }
.book-root .hd-arr-u i::after { top: 0; left: 50%; transform: translateX(-50%) rotate(-45deg); transform-origin: 70% 70%; }

/* Join: a row of cards, a red bracket, and one card above or below. */
.book-root .hd-join { display: grid; }
.book-root .hd-join > .hd-strip { gap: 4mm; }
.book-root .hd-bracket { --n: 2; position: relative; height: 7mm; margin: 0 calc(50% / var(--n)); border: .45mm solid #e10600; border-top: 0; }
.book-root .hd-bracket::after { content: ""; position: absolute; left: 50%; top: 100%; height: 6mm; border-left: .45mm solid #e10600; }
.book-root .hd-bracket-flip { border: .45mm solid #e10600; border-bottom: 0; }
.book-root .hd-bracket-flip::after { top: auto; bottom: 100%; }
.book-root .hd-join > .hd-result { margin-top: 6mm; justify-self: center; width: min(100%, 110mm); text-align: center; }
.book-root .hd-join > .hd-result:first-child { margin: 0 0 6mm; }
.book-root .hd-join > .hd-label { justify-self: end; margin-top: 3.2mm; position: relative; z-index: 1; }

/* Quad and banners. */
.book-root .hd-quad { display: grid; grid-template-columns: 1fr 1fr; gap: 4mm; }
.book-root .hd-banner { text-align: center; }

/* Split comparison with a dashed divider. */
.book-root .hd-split { display: grid; grid-template-columns: 1fr 10mm 1fr; gap: 0; align-items: start; }
.book-root .hd-split > div:not(.hd-split-line) { display: grid; gap: 2.5mm; align-content: start; }
.book-root .hd-split-line { align-self: stretch; border-left: .3mm dashed rgba(0,0,0,.45); margin: 0 4.7mm; position: relative; }
.book-root .hd-split-line span { position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 0); background: #f3f3f1; padding: 1mm 1.5mm; font: 400 6.5pt/8pt "Courier New", monospace; letter-spacing: .1em; text-transform: uppercase; color: #5d5d59; white-space: nowrap; }
.book-root .hd-bar { margin: 0; padding: 1.6mm 3mm; font: 400 7.5pt/10pt "Courier New", monospace; letter-spacing: .1em; text-transform: uppercase; text-indent: 0; }
.book-root .hd-bar-solid { background: #0a0a0a; color: #fff; }
.book-root .hd-bar-hatch { border: .3mm solid #0a0a0a; background: #fff; color: #0a0a0a; }

/* Cycle: a 3 x 3 grid with arrows between four cards. */
.book-root .hd-cycle { display: grid; grid-template-columns: minmax(0, 1fr) 11mm minmax(0, 1fr); gap: 2mm 2mm; align-items: center; }
.book-root .hd-cycle-mid { text-align: center; }
.book-root .hd-cycle-mid .hd-sub { margin-top: .5mm; }

/* Timeline: cards alternate above and below a line of dots. */
.book-root .hd-timeline { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-template-rows: auto auto; gap: 0 2mm; position: relative; padding: 0; }
.book-root .hd-milestone { position: relative; display: grid; justify-items: center; text-align: center; padding: 0 1mm; }
.book-root .hd-above { grid-row: 1; padding-bottom: 8mm; align-content: end; }
.book-root .hd-below { grid-row: 2; padding-top: 8mm; }
.book-root .hd-timeline::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: .5mm solid #0a0a0a; }
.book-root .hd-ms-dot { position: absolute; left: 50%; width: 4.4mm; height: 4.4mm; margin-left: -2.2mm; border-radius: 50%; background: #e10600; border: .8mm solid #fff; box-shadow: 0 0 0 .35mm #0a0a0a; }
.book-root .hd-above .hd-ms-dot { bottom: -2.2mm; }
.book-root .hd-below .hd-ms-dot { top: -2.2mm; }
.book-root .hd-milestone::before { content: ""; position: absolute; left: 50%; width: 0; border-left: .45mm solid #e10600; }
.book-root .hd-above::before { bottom: 0; height: 6mm; }
.book-root .hd-below::before { top: 0; height: 6mm; }

/* Film strip drawn to time: widths follow the running time (90s, 80s, 70s). */
.book-root .hd-film { display: flex; gap: 0; }
.book-root .hd-film .hd-card { margin-left: -.3mm; }
.book-root .hd-f1 { flex: 90 1 0; } .book-root .hd-f2 { flex: 80 1 0; } .book-root .hd-f3 { flex: 70 1 0; }
.book-root .hd-ruler { display: flex; justify-content: space-between; border-top: .5mm solid #0a0a0a; padding-top: 1.5mm; font: 400 7pt/9pt "Courier New", monospace; color: #5d5d59; }

/* Mornings: card, arrow, stack, arrow, card. */
.book-root .hd-mornings { display: grid; grid-template-columns: minmax(0, 1fr) 10mm minmax(0, 1.15fr) 10mm minmax(0, 1fr); align-items: center; }
.book-root .hd-stack { display: grid; gap: 2.5mm; }

/* Signals: a stack of chips, a gap with a question mark, and cards. */
.book-root .hd-signals { display: grid; grid-template-columns: minmax(0, 1fr) 12mm minmax(0, 1.5fr); gap: 0; align-items: start; }
.book-root .hd-signals > div:not(.hd-gap) { display: grid; gap: 2.5mm; align-content: start; }
.book-root .hd-chips-stack { display: grid; margin: 0; gap: 2.5mm; }
.book-root .hd-chips-stack li { padding: 3mm 3.4mm; }
.book-root .hd-gap { align-self: stretch; display: grid; place-items: center; border-left: .35mm dashed #e10600; margin: 6mm 5.4mm 0; }
.book-root .hd-gap span { display: grid; place-items: center; width: 7mm; height: 7mm; margin-left: -.4mm; border-radius: 50%; border: .4mm solid #0a0a0a; background: #fff; font: italic 600 11pt/1 "Book Barlow Italic", sans-serif; transform: translateX(-3.4mm); }
.book-root .hd-pairrow { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5mm; }

/* Fork: one card feeding a bus of cards on the right. */
.book-root .hd-fork { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: 12mm; align-items: center; }
.book-root .hd-bus { position: relative; display: grid; gap: 3mm; padding-left: 0; }
.book-root .hd-bus::before { content: ""; position: absolute; left: -6mm; top: 12mm; bottom: 12mm; border-left: .45mm solid #e10600; }
.book-root .hd-bus .hd-card { min-height: 22mm; }
.book-root .hd-bus .hd-card::before { content: ""; position: absolute; left: -6mm; top: 50%; width: 6mm; border-top: .45mm solid #e10600; }
.book-root .hd-fork > .hd-card { position: relative; }
.book-root .hd-fork > .hd-card::after { content: ""; position: absolute; left: 100%; top: 50%; width: 6mm; border-top: .45mm solid #e10600; }

/* Fixes: vertical divider label, solid bar text, wider cycle centre. */
.book-root .hd-split-line span { writing-mode: vertical-rl; transform: translate(-50%, 0) rotate(180deg); top: 50%; bottom: auto; margin-top: -12mm; }
.book-root .book-html-drawing .hd-bar-solid { color: #fff; }
.book-root .hd-cycle { grid-template-columns: minmax(0, 1fr) 34mm minmax(0, 1fr); }
.book-root .hd-cycle .hd-arr-r i, .book-root .hd-cycle .hd-arr-l i { width: 24mm; }
.book-root .hd-cycle-mid .hd-title { white-space: nowrap; }

/* Mountain, Venn, return line and pair cards (all-HTML diagrams). */
.book-root .hd-pair-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 4mm; }
.book-root .hd-mountain { position: relative; height: 38mm; margin-top: 1mm; }
.book-root .hd-peak { position: absolute; bottom: 0; display: block; }
.book-root .hd-peak-a { left: 18%; width: 46%; height: 100%; background: #0a0a0a; clip-path: polygon(0 100%, 55% 0, 100% 100%); }
.book-root .hd-peak-b { left: 52%; width: 40%; height: 62%; background: #8a8a86; clip-path: polygon(0 100%, 45% 0, 100% 100%); }
.book-root .hd-peak-a::after { content: ""; position: absolute; left: 33%; top: 0; width: 14%; height: 36%; background: #f3f3f1; clip-path: polygon(50% 0, 0 100%, 100% 100%); }
.book-root .hd-summit { position: absolute; left: calc(18% + 46% * .55 - 1.6mm); top: -1mm; width: 3.2mm; height: 3.2mm; border-radius: 50%; background: #e10600; }
.book-root .hd-venn { position: relative; height: 84mm; }
.book-root .hd-venn-c { position: absolute; display: block; width: 56mm; height: 56mm; border-radius: 50%; border: .35mm solid #0a0a0a; background: rgba(10,10,10,.05); box-sizing: border-box; }
.book-root .hd-venn-a { left: calc(50% - 44mm); top: 0; }
.book-root .hd-venn-b { left: calc(50% - 12mm); top: 0; }
.book-root .hd-venn-r { left: calc(50% - 28mm); top: 28mm; border-color: #e10600; border-width: .5mm; background: rgba(225,6,0,.07); }
.book-root .hd-venn-t { position: absolute; width: 30mm; text-align: center; }
.book-root .hd-venn-t .hd-sub { font-size: 9pt; line-height: 11pt; margin-top: .8mm; }
.book-root .hd-venn-ta { left: calc(50% - 40mm); top: 14mm; }
.book-root .hd-venn-tb { left: calc(50% + 10mm); top: 14mm; }
.book-root .hd-venn-tr { left: calc(50% - 15mm); top: 48mm; }
.book-root .hd-return { position: relative; height: 9mm; margin: -2mm calc(100% / 6) 0; border: .45mm solid #e10600; border-top: 0; }
.book-root .hd-return::before { content: ""; position: absolute; left: -1.25mm; top: -1.5mm; width: 2mm; height: 2mm; border-top: .45mm solid #e10600; border-left: .45mm solid #e10600; transform: rotate(45deg); }
.book-root .hd-return::after { content: ""; position: absolute; right: -.25mm; top: -2mm; height: 2mm; border-right: .45mm solid #e10600; }
.book-root .hd-return span { position: absolute; left: 50%; bottom: -2.6mm; transform: translateX(-50%); background: #f3f3f1; padding: 0 2mm; font: 400 7pt/9pt "Courier New", monospace; letter-spacing: .08em; text-transform: uppercase; color: #5d5d59; white-space: nowrap; }
.book-root .hd-timeline-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.book-root .hd-timeline-6 .hd-title { font-size: 10.5pt; line-height: 12pt; }
.book-root .hd-timeline-6 .hd-sub { font-size: 9pt; line-height: 11pt; }

/* Narrow compositions (100 mm figure column beside prose): stack cards and drop connectors that need width. */
.book-root .book-composition .book-html-drawing { padding: 4mm; }
.book-root .book-composition .hd-strip, .book-root .book-composition .hd-join > .hd-strip { grid-template-columns: 1fr !important; gap: 3mm; }
.book-root .book-composition .hd-strip.hd-tall .hd-card { min-height: 0; }
.book-root .book-composition .hd-arrows > .hd-card:not(:last-child)::after, .book-root .book-composition .hd-arrows > .hd-card:not(:last-child)::before { display: none; }
.book-root .book-composition .hd-bracket { display: none; }
.book-root .book-composition .hd-join > .hd-result { margin-top: 3mm; width: 100%; }
.book-root .book-composition .hd-return { display: none; }
.book-root .book-composition .hd-row { grid-template-columns: 11mm minmax(0, 1fr); }
.book-root .book-composition .hd-row .hd-numeral { font-size: 20pt; }
.book-root .book-composition .hd-track { grid-column: 2; width: 100%; }
.book-root .book-composition .hd-title { font-size: 11pt; line-height: 12.5pt; }
.book-root .book-composition .hd-sub { font-size: 9.5pt; line-height: 11.5pt; }
.book-root .book-composition .hd-numeral { font-size: 20pt; }
/* Venn labels need room. */
.book-root .hd-venn { height: 92mm; }
.book-root .hd-venn-t { width: 32mm; }
.book-root .hd-venn-ta { left: calc(50% - 42mm); top: 16mm; }
.book-root .hd-venn-tb { left: calc(50% + 10mm); top: 16mm; }
.book-root .hd-venn-tr { top: 52mm; }
.book-root .hd-venn-r { top: 32mm; }

/* Diagrams sit directly on the page: no grey panel, no corner brackets. */
.book-root .book-html-drawing { background: transparent; padding: 2mm 0 1mm; }
.book-root .book-html-drawing::before { display: none; }
.book-root .book-composition .book-html-drawing { padding: 1mm 0; }
.book-root .hd-return span, .book-root .hd-split-line span { background: #fff; }
.book-root .hd-card.hd-soft { background: #f3f3f1; }

/* ===== Editorial layout v2 (ARTC-style): rail + reading column, serif statements, red key figures ===== */
/* Live width is about 174 mm: a 50 mm rail, 8 mm gap and a 116 mm reading column (about 75 characters a line). */
.book-root .book-content { --rail: 58mm; --serif: "Book Literata", Georgia, serif; --serif-i: "Book Literata Italic", Georgia, serif; }
/* Running labels read up the outer edge, as in the reference spreads. */
.book-root .pagedjs_margin-left-bottom .pagedjs_margin-content, .book-root .pagedjs_margin-right-bottom .pagedjs_margin-content { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; }
.book-root .pagedjs_margin-left-bottom, .book-root .pagedjs_margin-right-bottom { align-items: flex-end; justify-content: center; }

/* Body: Barlow in a narrower column offset right. */
.book-root .book-prose { margin-left: var(--rail); font-size: 10.5pt; line-height: 15.5pt; }
.book-root .book-prose p { color: #141414; }
/* Elements that span the full width break out of the reading column. */
.book-root .book-prose > h3, .book-root .book-prose > figure, .book-root .book-prose > .book-composition,
.book-root .book-prose > .book-stats, .book-root .book-prose > .book-pull, .book-root .book-prose > .book-photo-slot,
.book-root .book-prose > blockquote, .book-root .book-prose > table { margin-left: calc(-1 * var(--rail)); }

/* Sub-heads: bold sans with a short red dash, in the rail beside the paragraph that follows. */
.book-root .book-prose > h3 { display: grid; grid-template-columns: calc(var(--rail) - 8mm) 1fr; column-gap: 8mm; margin-top: 9mm; margin-bottom: 0; padding-top: 0; border-top: 0; font: 600 11pt/14pt "Book Barlow", Arial, sans-serif; font-style: normal; text-transform: none; letter-spacing: 0; break-after: avoid; }
.book-root .book-prose > h3::after { content: ""; grid-column: 1; width: 6mm; height: .6mm; margin-top: 2.2mm; background: #e10600; }
.book-root .book-prose > h3 + p { margin-top: -7.5mm; }
.book-root .book-prose > h3 + p::first-line { }

/* Chapter openers: number, serif title and a larger lead-in. */
.book-root .book-chapter::before { content: attr(data-number); position: static; display: block; font: 600 44pt/1 "Book Barlow", Arial, sans-serif; color: #e10600; -webkit-text-stroke: 0; letter-spacing: -.02em; margin: 6mm 0 0; }
.book-root .book-chapter:not([data-number])::before { content: "—"; }
.book-root .book-chapter .book-section-heading { padding: 0 0 0 var(--rail); margin: -14mm 0 14mm; min-height: 0; border-bottom: 0; }
.book-root .book-chapter .book-section-heading .book-label { color: #0a0a0a; margin-bottom: 4mm; }
.book-root .book-chapter .book-section-heading h2 { font: 400 30pt/34pt var(--serif); font-style: normal; text-transform: none; letter-spacing: -.01em; color: #0a0a0a; margin: 0 0 4mm; }
.book-root .book-chapter .book-section-heading .book-subtitle { font: 400 13pt/18pt var(--serif); color: #e10600; text-transform: none; letter-spacing: 0; max-width: 110mm; }
.book-root .book-chapter .book-prose > p:first-child { font: 400 13pt/19pt var(--serif); color: #0a0a0a; margin-bottom: 6mm; text-indent: 0; }
.book-root .book-front .book-section-heading { padding-left: var(--rail); border: 0; }
.book-root .book-front .book-section-heading h2 { font: 400 30pt/34pt var(--serif); font-style: normal; text-transform: none; }

/* Part openers: full-width image, then a big sans title with a red bar. */
.book-root .book-part { padding-top: 0; }
.book-root .book-part::before { display: none; }
.book-root .book-section-image { margin: 0 0 9mm; }
.book-root .book-content .book-section-image img { display: block; width: 100%; height: 112mm; object-fit: cover; margin: 0; filter: grayscale(.15); }
.book-root .book-section-image figcaption { font: 400 6.5pt/9pt "Courier New", monospace; color: #5d5d59; margin-top: 1.5mm; }
.book-root .book-part .book-section-heading { border-top: 0; padding-top: 0; margin-bottom: 8mm; }
.book-root .book-part .book-section-heading .book-label { font-size: 9pt; color: #e10600; }
.book-root .book-part h2 { font: 600 50pt/.95 "Book Barlow", Arial, sans-serif; font-style: normal; letter-spacing: -.02em; max-width: 150mm; margin: 3mm 0 6mm; }
.book-root .book-part h2::after { content: ""; display: inline-block; width: 26mm; height: 2.2mm; margin-left: 5mm; vertical-align: middle; background: #e10600; }
.book-root .book-part .book-section-heading .book-subtitle { font: 400 15pt/21pt var(--serif); color: #e10600; text-transform: none; letter-spacing: 0; max-width: 125mm; }
.book-root .book-part .book-prose { margin-top: 0; color: #141414; font-size: 11pt; line-height: 16.5pt; max-width: none; }

/* The turn: one black page with the marionette image. */
.book-root .book-statement { page: turn; min-height: 0; justify-content: flex-start; color: #fff; }
.book-root .pagedjs_turn_page, .book-root .pagedjs_turn_page .pagedjs_pagebox, .book-root .pagedjs_turn_page .pagedjs_area { background: #0a0a0a !important; }
.book-root .book-statement .book-section-image img { height: 150mm; filter: none; }
.book-root .book-statement .book-section-image figcaption { color: #9a9a96; }
.book-root .book-statement .book-label { color: #e10600; }
.book-root .book-statement h2 { font: 400 40pt/44pt var(--serif); font-style: normal; text-transform: none; color: #fff; padding-top: 0; margin: 4mm 0 6mm; }
.book-root .book-statement p:last-child { font: 400 15pt/21pt var(--serif); text-transform: none; letter-spacing: 0; color: #e10600; max-width: 130mm; }

/* Pull statements: large serif, red, full width. */
.book-root .book-pull { margin: 10mm 0 10mm; padding: 0 0 0 var(--rail); font: 400 21pt/27pt var(--serif); color: #e10600; text-indent: 0 !important; break-inside: avoid; }
.book-root .book-pull + p { text-indent: 0; }
.book-root .book-content blockquote { background: none; padding: 0 0 0 var(--rail); margin: 9mm 0; font: 400 17pt/23pt var(--serif); text-transform: none; color: #0a0a0a; }
.book-root .book-content blockquote::before { display: none; }

/* Key figures: big red numbers with small labels on the right. */
.book-root .book-stats { margin: 8mm 0 10mm; padding-left: var(--rail); break-inside: avoid; }
.book-root .book-stats-heading { font: 400 12pt/16pt var(--serif); color: #0a0a0a; margin: 0 0 3mm !important; text-indent: 0 !important; }
.book-root .book-stats dl { margin: 0; }
.book-root .book-stats dl > div { display: grid; grid-template-columns: minmax(0, 1fr) 50mm; align-items: center; column-gap: 6mm; border-bottom: .25mm solid rgba(0,0,0,.2); padding: 1mm 0; }
.book-root .book-stats dt { font: 600 40pt/1 "Book Barlow", Arial, sans-serif; letter-spacing: -.02em; color: #e10600; }
.book-root .book-stats dd { margin: 0; font: 400 9.5pt/12.5pt var(--serif); color: #e10600; text-align: right; }

/* Photo placeholders: clearly marked, never mistaken for evidence. */
.book-root .book-photo-slot { margin: 8mm 0; break-inside: avoid; }
.book-root .book-photo-frame { position: relative; height: 92mm; background:
  linear-gradient(to top right, transparent calc(50% - .2mm), rgba(0,0,0,.18) 50%, transparent calc(50% + .2mm)),
  linear-gradient(to top left, transparent calc(50% - .2mm), rgba(0,0,0,.18) 50%, transparent calc(50% + .2mm)), #ececea; }
.book-root .book-photo-frame span { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #ececea; padding: 1.5mm 3mm; font: 400 8pt/10pt "Courier New", monospace; letter-spacing: .16em; text-transform: uppercase; color: #e10600; }
.book-root .book-photo-slot figcaption { margin-top: 2mm; padding-left: var(--rail); font: 400 8pt/11.5pt "Courier New", monospace; color: #3a3a38; }
.book-root .book-photo-tall .book-photo-frame { height: 140mm; }

/* Figures: heading in the rail, drawing full width, note under the reading column. */
.book-root .book-prose > figure.book-figure { margin-top: 9mm; margin-bottom: 9mm; }
.book-root .book-figure figcaption { padding-left: var(--rail); }
.book-root .book-composition .book-figure figcaption { padding-left: 0; }

/* v2 fixes: later shorthand margins were cancelling the break-outs. */
.book-root .book-content .book-prose > blockquote { margin: 9mm 0 9mm calc(-1 * var(--rail)); padding: 0 0 0 var(--rail); max-width: none; font: 400 16pt/22pt var(--serif); color: #e10600; }
.book-root .book-content .book-prose > blockquote p { font: inherit; color: inherit; max-width: 130mm; }
.book-root .book-content .book-prose > .book-pull { margin: 10mm 0 10mm calc(-1 * var(--rail)); }
.book-root .book-content .book-prose > .book-stats { margin: 8mm 0 10mm calc(-1 * var(--rail)); }
.book-root .book-content .book-prose > .book-photo-slot { margin: 8mm 0 8mm calc(-1 * var(--rail)); }
.book-root .book-prose > h3 + p { margin-top: 0; }
.book-statement { page: turn; }
.book-root .pagedjs_page.pagedjs_turn_page { background: #0a0a0a !important; }

/* ===== Black and white rhythm: cover, contents, part openers and the turn are black; reading pages stay white ===== */
.book-cover, .book-contents, .book-part { page: dark; }
.book-root .pagedjs_page.pagedjs_dark_page, .book-root .pagedjs_dark_page .pagedjs_pagebox, .book-root .pagedjs_dark_page .pagedjs_area { background: #0a0a0a !important; }
.book-root .pagedjs_dark_page .pagedjs_margin-content { color: #8a8a86 !important; }
.book-root .book-cover, .book-root .book-contents, .book-root .book-part { color: #e8e8e4; }

/* Cover */
.book-root .book-cover > .book-label { color: #8a8a86; border-color: rgba(255,255,255,.18); }
.book-root .book-cover h1 { font: 600 104pt/.82 "Book Barlow", Arial, sans-serif; font-style: normal; letter-spacing: -.035em; color: #fff; }
.book-root .book-cover h1 span:last-child { color: #e10600; margin-left: 0; }
.book-root .book-cover h1 span:last-child::before { content: ""; display: inline-block; width: 22mm; height: 3mm; margin-right: 5mm; vertical-align: middle; background: #e10600; }
.book-root .book-cover-subtitle { font: 400 17pt/23pt var(--serif) !important; letter-spacing: 0 !important; text-transform: none !important; color: #e8e8e4; }
.book-root .book-content .book-cover-art { border: 0; filter: grayscale(.2); }
.book-root .book-cover-credit { color: #6f6f6b !important; }
.book-root .book-cover-footer { border-color: rgba(255,255,255,.18); color: #e8e8e4; }
.book-root .book-content .book-university-logo { filter: invert(1); }

/* Contents: a huge vertical word in the rail; parts in serif with red page numbers. */
.book-root .book-contents { position: relative; padding-left: 62mm; min-height: 250mm; }
.book-root .book-contents > .book-label { display: none; }
.book-root .book-contents > h2 { position: absolute; left: 0; bottom: 0; margin: 0; writing-mode: vertical-rl; transform: rotate(180deg); font: 400 92pt/1 var(--serif); font-style: normal; text-transform: none; letter-spacing: -.01em; color: #2e2e2c; string-set: none; }
.book-root .book-contents ol { font: 400 9.5pt/13pt "Book Barlow", Arial, sans-serif; }
.book-root .book-contents li { margin: 0; }
.book-root .book-contents a { border: 0; padding: .7mm 0; color: #b8b8b4; text-decoration: none; }
.book-root .book-toc-part { margin-top: 7mm !important; }
.book-root .book-toc-part a { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 4mm; font: 400 14pt/18pt var(--serif); color: #fff; text-transform: none; letter-spacing: 0; padding-bottom: 2mm; }
.book-root .book-toc-part a::after { content: ""; order: 2; border-top: .25mm solid #3c3c3a; align-self: center; }
.book-root .book-toc-part a > span:first-child { order: 1; }
.book-root .book-toc-part a > .book-toc-number { order: 3; color: #e10600; font: 600 10pt "Book Barlow", Arial, sans-serif; }
.book-root .book-toc-chapter { padding-left: 0; }
.book-root .book-toc-act { margin: 9mm 0 1mm !important; padding-bottom: 1.6mm; border-bottom: .3mm solid #e10600; font: 500 7pt/1 "Journal Mono", monospace; letter-spacing: .14em; text-transform: uppercase; color: #e10600; }
.book-root .book-toc-act:first-child { margin-top: 0 !important; }
.book-root .book-toc-number { color: #8a8a86; font-family: "Book Barlow", Arial, sans-serif; }

/* Part openers on black: image, serif question as the statement, title with a red bar. */
.book-root .book-part .book-section-heading .book-label { color: #e10600; }
.book-root .book-part h2 { color: #fff; font-size: 44pt; }
.book-root .book-part .book-section-heading .book-subtitle { font: 400 24pt/31pt var(--serif); color: #fff; max-width: 150mm; margin-top: 8mm; }
.book-root .book-part .book-prose { margin-left: var(--rail); }
.book-root .book-part .book-prose p { color: #b8b8b4; }
.book-root .book-part .book-section-image figcaption { color: #6f6f6b; }

/* Faint vertical chapter title in the rail on each chapter's opening page. */
.book-root .book-chapter:not([data-split-from])::after { content: attr(data-title); position: absolute; left: 0; top: 70mm; height: 180mm; writing-mode: vertical-rl; transform: rotate(180deg); font: 400 30pt/1 var(--serif); color: #d6d6d2; white-space: nowrap; overflow: hidden; pointer-events: none; }
.book-root .book-chapter { position: relative; }
.book-root .pagedjs_dark_page .book-content, .book-root .pagedjs_turn_page .book-content { background: transparent !important; }
.book-root .pagedjs_turn_page .book-statement { color: #fff; }
.book-root .book-content .book-cover h1 span:first-child { color: #fff; }
/* Four or more cards in a narrow composition: two columns, so the figure stays on one page. */
.book-root .book-composition .hd-strip:has(> :nth-child(4)) { grid-template-columns: 1fr 1fr !important; }
.book-root .book-composition { break-inside: avoid; }
.book-root .book-composition-convergence { break-before: page; }
.book-composition-convergence { break-before: page; }

/* ===== Visual devices v3 (FlowDiagram.tsx): no boxes; type, rules, bars, rings ===== */
.book-root .book-html-drawing { display: grid; gap: 5mm; }
.book-root .book-html-drawing p { margin: 0; text-indent: 0 !important; }
.book-root .vd-kicker, .book-root .vd-kick { display: block; font: 400 7pt/9pt "Courier New", monospace; letter-spacing: .14em; text-transform: uppercase; color: #e10600; margin-bottom: 1.5mm !important; }
.book-root .vd-foot { font: 400 7pt/10pt "Courier New", monospace; letter-spacing: .03em; color: #6a6a66; }
.book-root .vd-serif { font: 400 15pt/20pt var(--serif); color: #0a0a0a; }
.book-root .vd-big { display: block; font: 600 16pt/18pt "Book Barlow", Arial, sans-serif; letter-spacing: -.01em; color: #0a0a0a; text-wrap: balance; }
.book-root .vd-word { display: block; font: 600 12.5pt/14.5pt "Book Barlow", Arial, sans-serif; color: #0a0a0a; }
.book-root .vd-text { display: block; margin-top: 1mm !important; font: 400 9.5pt/12.5pt "Book Barlow", Arial, sans-serif; color: #3a3a38; }
.book-root .vd-red { color: #e10600 !important; }
.book-root .vd-center { text-align: center; }
.book-root .vd-statement { font: 400 17pt/23pt var(--serif); color: #e10600; padding-top: 4mm; border-top: .25mm solid rgba(0,0,0,.25); text-wrap: balance; }
.book-root .vd-strike { text-decoration: line-through; text-decoration-color: #e10600; text-decoration-thickness: .9mm; }

/* Sequence */
.book-root .vd-seq { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 4mm; }
.book-root .vd-seq li { border-top: .7mm solid #0a0a0a; padding-top: 2.5mm; }
.book-root .vd-seq li.vd-hot { border-top-color: #e10600; }
.book-root .vd-seq .vd-n { display: block; font: 400 7pt/9pt "Courier New", monospace; letter-spacing: .12em; text-transform: uppercase; color: #e10600; }
.book-root .vd-seq .vd-word { font-size: 21pt; line-height: 24pt; margin-top: 2mm; letter-spacing: -.015em; }
.book-root .vd-seq .vd-hot .vd-word { color: #e10600; }

/* Bars */
.book-root .vd-bars { display: grid; gap: 4mm; }
.book-root .vd-bar-row { display: grid; grid-template-columns: 52mm minmax(0, 1fr); column-gap: 6mm; align-items: center; }
.book-root .vd-bar-title { font: 600 11pt/13pt "Book Barlow", Arial, sans-serif; }
.book-root .vd-bar-sub { font: 400 8.5pt/11pt "Book Barlow", Arial, sans-serif; color: #4a4a48; margin-top: .6mm !important; }
.book-root .vd-bar { display: flex; height: 12mm; gap: .8mm; }
.book-root .vd-seg { flex-basis: 0; display: flex; align-items: center; padding: 0 2.5mm; overflow: hidden; white-space: nowrap; font: 400 7.5pt/1 "Courier New", monospace; letter-spacing: .08em; text-transform: uppercase; color: #fff; }
.book-root .vd-ink { background: #0a0a0a; } .book-root .vd-red.vd-seg { background: #e10600; color: #fff !important; } .book-root .vd-grey { background: #8a8a86; }
.book-root .vd-hatch { background: repeating-linear-gradient(135deg, #0a0a0a 0 .35mm, transparent .35mm 2.2mm); color: #0a0a0a; border: .35mm solid #0a0a0a; justify-content: center; font-size: 11pt; }

/* Contrast */
.book-root .vd-contrast { display: grid; grid-template-columns: minmax(0, 1fr) 14mm minmax(0, 1fr); align-items: stretch; }
.book-root .vd-contrast > div:not(.vd-contrast-rule) { display: grid; gap: 1.5mm; align-content: start; }
.book-root .vd-contrast-rule { position: relative; }
.book-root .vd-contrast-rule::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; border-left: .3mm solid rgba(0,0,0,.3); }
.book-root .vd-contrast-rule span { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #fff; padding: 1mm 0; font: 400 7pt/9pt "Courier New", monospace; letter-spacing: .1em; text-transform: uppercase; color: #e10600; white-space: nowrap; }
.book-root .vd-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6mm; }
.book-root .vd-trio > div { border-top: .5mm solid #0a0a0a; padding-top: 2mm; }

/* Equation */
.book-root .vd-equation { display: flex; align-items: flex-start; gap: 4mm; }
.book-root .vd-equation > div { flex: 1 1 0; min-width: 0; border-top: .7mm solid #0a0a0a; padding-top: 2.5mm; }
.book-root .vd-op { font: 300 30pt/1 "Book Barlow", Arial, sans-serif; color: #e10600; padding-top: 4mm; }
.book-root .vd-result { display: flex; align-items: center; gap: 5mm; }
.book-root .vd-result .vd-op { padding-top: 0; }
.book-root .vd-result .vd-serif { font-size: 20pt; line-height: 25pt; }

/* Loop */
.book-root .vd-loop { --D: 58mm; position: relative; height: calc(var(--D) + 40mm); }
.book-root .book-composition .vd-loop { --D: 46mm; }
.book-root .vd-ring { position: absolute; left: 50%; top: 15mm; width: var(--D); height: var(--D); margin-left: calc(var(--D) / -2); border: .6mm solid #e10600; border-radius: 50%; }
.book-root .vd-chev { position: absolute; left: 50%; top: calc(15mm + var(--D) / 2); width: 2.6mm; height: 2.6mm; border-top: .6mm solid #e10600; border-right: .6mm solid #e10600; transform: translate(-50%, -50%) rotate(var(--a)) translateY(calc(var(--D) / -2)) rotate(45deg); }
.book-root .vd-loop-centre { position: absolute; left: 50%; top: calc(15mm + var(--D) / 2); width: calc(var(--D) * .72); transform: translate(-50%, -50%); text-align: center; }
.book-root .vd-loop-centre .vd-word { font: 400 13pt/16pt var(--serif); }
.book-root .vd-loop-item { position: absolute; width: 36%; background: #fff; }
.book-root .vd-at-top { left: 50%; top: 0; transform: translateX(-50%); text-align: center; padding: 0 2mm 1mm; width: auto; white-space: nowrap; }
.book-root .vd-at-top .vd-text { white-space: normal; }
.book-root .vd-at-right { right: 0; top: calc(15mm + var(--D) * .78); text-align: right; }
.book-root .vd-at-left { left: 0; top: calc(15mm + var(--D) * .78); }
.book-root .vd-loop-item .vd-word { font-size: 14pt; line-height: 16pt; }
.book-root .vd-loop-item.vd-hot .vd-word { color: #e10600; }
.book-root .vd-loop-note { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; font: 400 7pt/9pt "Courier New", monospace; color: #6a6a66; }

/* Cross (convergence) */
.book-root .vd-cross { position: relative; display: grid; grid-template-columns: 1fr 1fr; }
.book-root .vd-cross > div { padding: 5mm 6mm; }
.book-root .vd-cross .vd-word { font-size: 17pt; line-height: 19pt; }
.book-root .vd-c-tr, .book-root .vd-c-br { text-align: right; }
.book-root .vd-cross::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; border-left: .3mm dashed rgba(0,0,0,.45); }
.book-root .vd-cross::after { content: ""; position: absolute; top: 50%; left: 0; right: 0; border-top: .3mm dashed rgba(0,0,0,.45); }
.book-root .vd-c-q { position: absolute; left: 50%; top: 50%; z-index: 1; width: 16mm; height: 16mm; transform: translate(-50%, -50%); display: grid; place-items: center; border-radius: 50%; border: .6mm dashed #e10600; background: #fff; font: 400 22pt/1 var(--serif); color: #e10600; }

/* Gates (institutions) */
.book-root .vd-gate { display: block; height: 10mm; width: 44mm; margin-bottom: 3mm; background: repeating-linear-gradient(90deg, #0a0a0a 0 .6mm, transparent .6mm 3.6mm); border-bottom: .6mm solid #0a0a0a; }
.book-root .vd-open { display: block; height: 10mm; width: 44mm; margin-bottom: 3mm; border-bottom: .9mm solid #e10600; }

/* Mornings */
.book-root .vd-mornings { display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 0; }
.book-root .vd-mornings > div { padding: 0 5mm; border-left: .3mm solid rgba(0,0,0,.25); display: grid; gap: 1.5mm; align-content: start; }
.book-root .vd-mornings > div:first-child { padding-left: 0; border-left: 0; }
.book-root .vd-mornings .vd-serif { font-size: 17pt; line-height: 22pt; }

/* Mountain */
.book-root .vd-mountain { position: relative; height: 44mm; }
.book-root .vd-peak { position: absolute; bottom: 0; left: 16%; width: 50%; height: 100%; background: #0a0a0a; clip-path: polygon(0 100%, 55% 0, 100% 100%); }
.book-root .vd-peak2 { position: absolute; bottom: 0; left: 50%; width: 42%; height: 62%; background: #8a8a86; clip-path: polygon(0 100%, 45% 0, 100% 100%); }
.book-root .vd-summit { position: absolute; left: calc(16% + 50% * .55 - 1.8mm); top: -1.8mm; width: 3.6mm; height: 3.6mm; border-radius: 50%; background: #e10600; }

/* Script (ticker) */
.book-root .vd-script { list-style: none; margin: 0; padding: 0; }
.book-root .vd-script li { display: grid; grid-template-columns: 14mm 1fr; align-items: baseline; padding: 2.5mm 0; border-top: .25mm solid rgba(0,0,0,.25); font: 400 18pt/23pt var(--serif); color: #0a0a0a; }
.book-root .vd-script li.vd-hot { color: #e10600; border-bottom: .25mm solid rgba(0,0,0,.25); }
.book-root .vd-script .vd-n, .book-root .vd-questions .vd-n { font: 400 7.5pt/1 "Courier New", monospace; letter-spacing: .12em; color: #e10600; }

/* Questions */
.book-root .vd-questions { list-style: none; margin: 0; padding: 0; }
.book-root .vd-questions li { display: grid; grid-template-columns: 12mm minmax(0, 1fr) auto; column-gap: 3mm; align-items: center; padding: 3mm 0; border-top: .25mm solid rgba(0,0,0,.25); }
.book-root .vd-questions li:last-child { border-bottom: .25mm solid rgba(0,0,0,.25); }
.book-root .vd-q-title { font: 600 11pt/13pt "Book Barlow", Arial, sans-serif; }
.book-root .vd-q { font: 400 13pt/17pt var(--serif); color: #0a0a0a; margin-top: .6mm !important; }
.book-root .vd-track { display: grid; grid-template-columns: auto 30mm auto; align-items: center; gap: 1.5mm; font: 400 6.5pt "Courier New", monospace; color: #6a6a66; }
.book-root .vd-track b { font-weight: 400; }
.book-root .vd-track i { height: .35mm; background: #0a0a0a; position: relative; }
.book-root .vd-track i::before, .book-root .vd-track i::after { content: ""; position: absolute; top: -1.1mm; width: 2.2mm; height: 2.2mm; border-radius: 50%; border: .35mm solid #0a0a0a; background: #fff; }
.book-root .vd-track i::before { left: -1mm; } .book-root .vd-track i::after { right: -1mm; }
.book-root .book-composition .vd-questions li { grid-template-columns: 9mm minmax(0, 1fr); }
.book-root .book-composition .vd-track { grid-column: 2; margin-top: 2mm; }
.book-root .vd-check { width: 6mm; height: 6mm; border: .35mm solid #0a0a0a; }

/* Branch (purpose) */
.book-root .vd-branch { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: 10mm; align-items: center; }
.book-root .vd-quote { font: 400 28pt/32pt var(--serif); color: #e10600; }
.book-root .vd-branch ul { list-style: none; margin: 0; padding: 0 0 0 6mm; border-left: .6mm solid #e10600; display: grid; gap: 4mm; }
.book-root .vd-branch li { position: relative; }
.book-root .vd-branch li::before { content: ""; position: absolute; left: -6mm; top: 2.2mm; width: 4mm; border-top: .6mm solid #e10600; }

/* Film drawn to time */
.book-root .vd-film { display: flex; gap: 1mm; align-items: stretch; }
.book-root .vd-film > div { flex-basis: 0; min-width: 0; display: flex; flex-direction: column; padding-right: 3mm; }
.book-root .vd-film .vd-big { font-size: 20pt; line-height: 22pt; }
.book-root .vd-film i { display: block; height: 5mm; margin-top: auto; position: relative; top: 3mm; }
.book-root .vd-film .vd-text { margin-bottom: 4mm !important; }
.book-root .vd-film i.vd-red { background: #e10600; }
.book-root .vd-ruler { display: flex; justify-content: space-between; border-top: .4mm solid #0a0a0a; margin-top: 1mm; padding-top: 1.2mm; font: 400 6.5pt/8pt "Courier New", monospace; color: #6a6a66; }

/* Rise (impact) */
.book-root .vd-rise { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4mm; align-items: end; border-bottom: .6mm solid #0a0a0a; }
.book-root .vd-col { display: flex; flex-direction: column; }
.book-root .vd-col i { display: block; height: var(--h); margin-top: 3mm; }
.book-root .vd-col-solid i { background: #0a0a0a; }
.book-root .vd-col-open i { border: .4mm dashed #0a0a0a; border-bottom: 0; }
.book-root .vd-col-red i { border: .6mm dashed #e10600; border-bottom: 0; }
.book-root .vd-col-red .vd-word { color: #e10600; }

/* Single-panel opener images */
.book-root .book-part .book-section-image-square { width: 128mm; margin-left: auto; }
.book-root .book-content .book-part .book-section-image-square img { height: 128mm; }
.book-root .book-content .book-section-image-wide img { height: 104mm; object-position: center; }
.book-root .book-content .book-cover-art { width: 108mm; height: 108mm; margin-left: auto; }
.book-root .book-cover-credit { text-align: right; }
.book-root .vd-loop { height: calc(var(--D) + 30mm); }
.book-root .vd-loop-note { bottom: -2mm; }
.book-root .vd-contrast { grid-template-columns: minmax(0, 1fr) 20mm minmax(0, 1fr); }

/* Process studies: keep the artefact and short reflections together. */
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) {
  display: block;
  break-inside: avoid;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-figure {
  max-width: none;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-figure-heading {
  min-height: 0;
  margin-bottom: 5mm;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-figure-images {
  padding: 0;
  background: transparent;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-figure-images::before {
  content: none;
}
.book-root .book-content .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard) .book-image-panel img {
  max-height: 92mm;
}
.book-root .book-content .book-composition-lab-previous-reading .book-image-panel img {
  max-height: 105mm;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) figcaption {
  padding-left: 0;
  font-size: 8.5pt;
  line-height: 12pt;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-composition-copy {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6mm;
  padding-top: 6mm;
  font: 400 10.5pt/14.5pt "Book Barlow", Arial, sans-serif;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-composition-copy p {
  margin: 0;
  text-indent: 0;
}
.book-root .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-composition-copy strong {
  display: block;
  margin-bottom: 2mm;
  color: #e10600;
}
@media screen and (max-width: 760px) {
  .book-reading-layout .book-composition:is(.book-composition-guidance-iterations, .book-composition-visitor-storyboard, .book-composition-lab-previous-reading) .book-composition-copy {
    grid-template-columns: 1fr;
  }
}