/* Hallmark · macrostructure: bespoke magazine · theme: custom paper/ink/yellow
 * nav: N9-inspired · footer: Ft1 · enrichment: editorial illustration · motion: none
 * pre-emit critique: P5 H5 E4 S4 R4 V4 · contrast: pass · mobile: pass at sampled widths
 * Article-first exception: reading and source link continue below the opening image. */
@import url("../tokens.css");
* { box-sizing: border-box; }
html { scroll-behavior: auto; overflow-x: clip; }
body { margin: 0; background: var(--color-paper); color: var(--color-ink); font-family: var(--font-ui); overflow-x: clip; }
a { color: inherit; text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:active, summary:active { text-decoration: underline; }
summary:hover { text-decoration: underline; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 5px; }
::selection { background: var(--color-accent); color: var(--color-ink); }
h1,h2,h3,p,figure { margin: 0; }
h1,h2,h3 { font-family: var(--font-display); font-weight: 800; overflow-wrap: anywhere; min-width: 0; }
img { display: block; width: 100%; height: auto; }
[id] { scroll-margin-top: var(--space-lg); }
.page-shell { max-width: calc(var(--page-width) + 2 * var(--page-gutter)); margin-inline: auto; padding-inline: var(--page-gutter); }
.skip-link { position: fixed; left: var(--space-md); top: -10rem; background: var(--color-accent); padding: var(--space-md); z-index: var(--z-top); }
.skip-link:focus { top: var(--space-md); }
.masthead { display: flex; align-items: center; gap: var(--space-xl); min-height: 112px; border-bottom: 4px solid var(--color-ink); }
.wordmark { display: flex; gap: var(--space-xs); align-items: flex-start; font-size: clamp(1.65rem, 2.6vw, 2.375rem); font-weight: 800; line-height: .83; letter-spacing: -.045em; text-decoration: none; }
.wordmark-the { font-size: var(--text-label); line-height: 1; letter-spacing: -.02em; padding-top: .2rem; }
.wordmark-stop { display: inline-block; background: var(--color-accent); padding-inline: .12em; margin-left: .03em; }
.publication-line { font-family: var(--font-body); font-size: var(--text-body); line-height: 1.3; margin-left: var(--space-lg); }
nav { margin-left: auto; }
nav a { display: flex; align-items: center; gap: var(--space-lg); min-height: var(--control-height); font-weight: 800; text-decoration: none; white-space: nowrap; }
nav a span { font-size: 1.75rem; }
.edition-line { display: flex; justify-content: space-between; gap: var(--space-md); font-size: var(--text-label); font-weight: 700; padding-block: var(--space-sm); border-bottom: 1px solid var(--color-rule); }
.cover-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: var(--space-xl); padding-block: var(--space-xl) var(--space-2xl); }
.eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm); font-family: var(--font-ui); font-size: var(--text-label); font-weight: 700; line-height: 1.4; }
.section-tag { display: inline-block; background: var(--color-accent); padding: var(--space-2xs) var(--space-xs); font-weight: 800; }
h1 { font-size: var(--text-lead); line-height: .97; letter-spacing: -.042em; margin-block: var(--space-lg); }
.standfirst { font-family: var(--font-body); font-size: clamp(1.375rem, 1.9vw, 1.75rem); line-height: 1.23; max-width: 65ch; margin-bottom: var(--space-lg); }
.lead-image img { aspect-ratio: 1.75; object-fit: cover; }
figcaption { color: var(--color-muted); font-size: var(--text-caption); line-height: 1.4; padding-block: var(--space-xs); border-bottom: 1px solid var(--color-rule); }
.reading { font-family: var(--font-body); font-size: var(--text-reading); line-height: 1.5; }
.reading p + p { margin-top: var(--space-md); }
.lead-body { max-width: 65ch; margin-top: var(--space-lg); }
.source-credit { font-family: var(--font-ui); font-size: var(--text-label); font-weight: 800; line-height: 1.5; margin-bottom: var(--space-lg); }
.source-credit span { display: block; font-weight: 500; color: var(--color-muted); }
.read-link { display: inline-flex; gap: var(--space-md); align-items: center; min-height: var(--control-height); margin-top: var(--space-lg); font-family: var(--font-ui); font-size: var(--text-body); font-weight: 800; }
.context-rail { border-left: 1px solid var(--color-rule); padding-left: var(--space-xl); }
.rail-heading { display: flex; justify-content: space-between; align-items: center; padding-block: var(--space-2xs) var(--space-md); border-bottom: 3px solid var(--color-ink); }
.rail-heading h2 { font-size: 1.5rem; letter-spacing: -.02em; }
.rail-heading > span { font-size: 1.75rem; }
.context-section { padding-block: var(--space-lg); border-bottom: 1px solid var(--color-rule); }
.context-section h3 { font-size: clamp(1.5rem, 2vw, 1.875rem); line-height: 1.05; letter-spacing: -.025em; margin-block: var(--space-sm); }
.context-section > p:not(.eyebrow) { font-family: var(--font-body); font-size: 1.125rem; line-height: 1.4; }
.small-link { display: inline-flex; gap: var(--space-xs); align-items: center; font-size: var(--text-small); font-weight: 700; min-height: var(--control-height); margin-top: var(--space-xs); }
.open-question { border-bottom: none; }
.rail-note { margin-top: var(--space-xl); border-top: 3px solid var(--color-ink); padding-top: var(--space-lg); }
.rail-note p { font-size: 1.125rem; font-weight: 700; line-height: 1.4; margin-top: var(--space-md); }
.section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-lg); border-top: 5px solid var(--color-ink); padding-block: var(--space-lg) var(--space-xl); }
.section-heading h2 { font-size: var(--text-section); letter-spacing: -.045em; line-height: 1; margin-top: var(--space-xs); }
.section-heading h2 span { background: var(--color-accent); padding-right: .08em; }
.section-heading > p { font-family: var(--font-body); font-size: 1.25rem; line-height: 1.3; padding-bottom: var(--space-xs); }
.dispatch { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); column-gap: var(--space-2xl); border-top: 1px solid var(--color-ink); padding-block: var(--space-xl) var(--space-2xl); }
.dispatch-heading h3 { font-size: var(--text-story); line-height: 1.03; letter-spacing: -.035em; margin-block: var(--space-md); max-width: 18ch; }
.dispatch-deck { font-family: var(--font-body); font-size: 1.375rem; line-height: 1.35; max-width: 32ch; }
.case-note { display: block; font-size: var(--text-small); color: var(--color-muted); line-height: 1.5; margin-top: var(--space-lg); }
.dispatch-body { max-width: 64ch; }
details { margin-top: var(--space-lg); border-block: 1px solid var(--color-rule); font-family: var(--font-ui); font-size: var(--text-small); line-height: 1.5; }
summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); min-height: 52px; padding-block: var(--space-sm); cursor: pointer; font-weight: 800; list-style: none; }
summary::-webkit-details-marker { display: none; }
summary span { font-size: 1.5rem; }
details[open] summary span { font-size: 0; }
details[open] summary span::after { content: "−"; font-size: 1.5rem; }
.evidence { background: var(--color-evidence); padding: var(--space-lg); }
.evidence dl { margin: var(--space-md) 0 0; }
.evidence dl div { display: grid; grid-template-columns: 7rem minmax(0,1fr); gap: var(--space-sm); padding-block: var(--space-xs); border-top: 1px solid var(--color-rule); }
.evidence dt { font-weight: 800; }
.evidence dd { margin: 0; }
.method { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.35fr); gap: var(--space-2xl); border-top: 5px solid var(--color-ink); padding-block: var(--space-xl) var(--space-2xl); }
.method h2 { font-size: var(--text-story); line-height: 1.05; letter-spacing: -.035em; }
.method .reading { font-size: 1.125rem; }
.footer { border-top: 1px solid var(--color-ink); padding-block: var(--space-xl); }
.footer-name { font-weight: 800; font-size: clamp(2rem, 5.2vw, 4.75rem); letter-spacing: -.045em; line-height: 1; text-decoration: none; }
.footer-name > span { background: var(--color-accent); }
.footer > div { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-lg); font-size: var(--text-small); margin-top: var(--space-lg); }
.footer a:not(.footer-name) { min-height: var(--control-height); display: inline-flex; align-items: center; }
.footer > div > span { margin-left: auto; color: var(--color-muted); }
@media (min-width: 1440px) { .lead-image img { aspect-ratio: 1.9; } }
@media (max-width: 1000px) {
  .cover-grid { grid-template-columns: minmax(0, 2.25fr) minmax(0, 1fr); gap: var(--space-lg); }
  .context-rail { padding-left: var(--space-lg); }
  .dispatch,.method { gap: var(--space-xl); }
  .publication-line { margin-left: 0; }
}
.section-tag,.wordmark-stop,.section-heading h2 span,.footer-name > span,.skip-link { color: var(--color-accent-ink); }
.read-link,.small-link { white-space: nowrap; }
@media (max-width: 900px) {
  .masthead { min-height: 104px; gap: var(--space-md); }
  .publication-line { display: none; }
  nav a { gap: var(--space-xs); font-size: var(--text-small); }
  .edition-line { font-size: var(--text-label); flex-wrap: wrap; gap: var(--space-2xs); }
  .edition-line > span:first-child { display: none; }
  .cover-grid { grid-template-columns: minmax(0, 1fr); padding-top: var(--space-lg); gap: var(--space-xl); }
  h1 { font-size: clamp(3rem, 10.8vw, 4.75rem); margin-block: var(--space-md); }
  .desktop-break { display: none; }
  .standfirst { font-size: 1.375rem; }
  .lead-image img { aspect-ratio: 1.5; }
  .context-rail { padding-left: 0; border-left: 0; }
  .rail-note { display: none; }
  .context-section { padding-block: var(--space-lg); }
  .context-section h3 { font-size: 1.75rem; }
  .section-heading { display: block; }
  .section-heading > p { margin-top: var(--space-lg); }
  .dispatch,.method { grid-template-columns: minmax(0,1fr); gap: var(--space-lg); }
  .dispatch-heading h3 { max-width: 25ch; font-size: 2.5rem; }
  .dispatch-deck { max-width: 40ch; }
  .reading { font-size: 1.1875rem; }
  .evidence { padding: var(--space-md); }
  .evidence dl div { grid-template-columns: minmax(0,1fr); gap: 0; }
  .footer > div { column-gap: var(--space-lg); row-gap: var(--space-xs); }
  .footer > div > span { margin-left: 0; flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Expanded Board: approved reference, 9 September 2026. */
.board { --danger: #b32424; }
.board-overview { display:grid; grid-template-columns:repeat(3,1fr) 1.5fr; border-block:1px solid var(--color-rule); padding:1.5rem 0; gap:1.5rem; margin-bottom:2rem; }
.board-overview strong { display:block; font-size:2.5rem; font-weight:800; letter-spacing:-.04em; }
.board-overview span,.board-overview p { font-size:.95rem; line-height:1.5; }
.dispatch { grid-template-columns:minmax(0,1fr) 280px; gap:2rem 3rem; padding-block:3rem; border-top:3px solid var(--color-ink); }
.incident-intro h3 { font-size:clamp(2rem,3.8vw,3.7rem); line-height:1.08; letter-spacing:-.035em; color:var(--danger); font-weight:800; margin:1.3rem 0; max-width:31ch; }
.incident-intro .dispatch-deck { font-family:var(--font-ui); font-size:1.3rem; line-height:1.5; max-width:65ch; }
.incident-overview { align-self:start; border:1px solid var(--color-rule); border-radius:12px; padding:1.3rem; background:#f2f4f3; }
.severity { display:flex; gap:1rem; align-items:center; color:var(--danger); }
.severity strong { display:block; text-transform:uppercase; font-size:1.2rem; letter-spacing:.04em; }
.severity span:not(.severity-bars) { display:block; font-size:.8rem; margin-top:.3rem; color:var(--color-muted); }
.severity-bars { display:flex; gap:4px; height:36px; align-items:end; }
.severity-bars i { width:8px; height:25%; background:#bfc5c7; }
.severity-bars i:nth-child(2) { height:50%; }.severity-bars i:nth-child(3) { height:75%; }.severity-bars i:nth-child(4) { height:100%; }.severity-bars i.lit { background:var(--danger); }
.severity-reason { font-size:.85rem; line-height:1.45; margin-top:1rem; }
.incident-overview dl { border-top:1px solid var(--color-rule); padding-top:1rem; margin-top:1rem; font-size:.9rem; }
.incident-overview dl div { display:flex; justify-content:space-between; gap:1rem; padding:.4rem 0; }.incident-overview dd { margin:0; text-align:right; font-weight:700; }.incident-overview dt { color:var(--color-muted); }.incident-overview>a { font-size:.8rem; }
.incident-record { grid-column:1 / -1; min-width:0; }
.impact-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; background:#f0eae2; padding:1.5rem 2rem; border-left:4px solid var(--danger); }
.impact-strip strong { display:block; font-size:1.65rem; line-height:1.2; font-weight:800; }.impact-strip span { display:block; font-size:.9rem; line-height:1.4; margin-top:.5rem; }
.record-section { padding:1.8rem 0; border-bottom:1px solid var(--color-rule); }.record-section h4 { font-size:.8rem; text-transform:uppercase; letter-spacing:.12em; margin:0 0 1.2rem; }.record-section .reading { max-width:80ch; }.record-caption { font-size:.85rem; color:var(--color-muted); line-height:1.5; margin-top:1rem; }
.mechanism-flow { display:grid; grid-template-columns:repeat(3,1fr); list-style:none; margin:0; padding:0; gap:2rem; }.mechanism-flow li { position:relative; border-top:3px solid var(--danger); padding-top:.8rem; font-size:1.1rem; font-weight:700; }.mechanism-flow li:not(:last-child)::after { content:'→'; position:absolute; right:-1.6rem; top:.7rem; color:var(--danger); }.mechanism-flow span { display:block; color:var(--danger); font-size:.8rem; margin-bottom:.5rem; }
.incident-timeline { display:grid; grid-template-columns:repeat(4,1fr); list-style:none; margin:0; padding:0; }.incident-timeline li { border-top:1px solid var(--color-rule); position:relative; padding:1rem 1.5rem 0 0; }.incident-timeline li::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--danger); position:absolute; top:-5px; }.incident-timeline time { font-size:1rem; font-weight:800; }.incident-timeline p { font-size:.95rem; line-height:1.5; margin-top:.6rem; }
.response-note { border-left:3px solid var(--danger); padding-left:1rem; margin-bottom:1.5rem; }.response-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }.response-grid h5,.questions-grid h5 { font-size:.95rem; margin:.6rem 0; }.response-grid p,.questions-grid p { font-size:1rem; line-height:1.5; }.response-dot { display:block; width:10px; height:10px; border:2px solid #737a79; border-radius:50%; }.response-dot.recorded { background:var(--color-ink); border-color:var(--color-ink); }
.source-register { margin:0; padding-left:1.2rem; display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }.source-register a { font-size:1rem; font-weight:700; }.source-register span { display:block; margin-top:.5rem; font-size:.85rem; line-height:1.5; color:var(--color-muted); }.questions-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }.questions-grid>div:nth-child(2) { border-left:3px solid var(--danger); padding-left:1rem; }
.severity-method { border-block:1px solid var(--color-rule); padding:2rem 0; font-size:.95rem; line-height:1.6; margin-bottom:3rem; }.severity-method h3 { font-size:1.5rem; margin-bottom:1rem; }.severity-method ol { padding-left:1.2rem; }.severity-method p { max-width:90ch; }
@media(max-width:900px) { .dispatch { grid-template-columns:minmax(0,1fr); gap:1.5rem; }.incident-overview { width:100%; }.incident-overview dl { display:grid; grid-template-columns:1fr 1fr; gap:0 2rem; }.board-overview { grid-template-columns:1fr 1fr; }.incident-timeline,.response-grid { grid-template-columns:1fr 1fr; row-gap:2rem; }.source-register,.questions-grid { grid-template-columns:1fr; gap:1.3rem; }.incident-intro h3 { max-width:none; }.rail-note { display:block; } }
@media(max-width:540px) { .impact-strip { grid-template-columns:1fr; padding:1.2rem; gap:1rem; }.impact-strip>div { border-bottom:1px solid var(--color-rule); padding-bottom:1rem; }.impact-strip>div:last-child { border:0; padding-bottom:0; }.mechanism-flow { grid-template-columns:1fr; gap:1.5rem; }.mechanism-flow li:not(:last-child)::after { content:'↓'; right:.3rem; top:2rem; }.incident-timeline { grid-template-columns:1fr; gap:0; }.incident-timeline li { border-top:0; border-left:1px solid var(--color-rule); padding:0 0 1.5rem 1.2rem; }.incident-timeline li::before { left:-4.5px; top:.3rem; }.incident-overview dl { grid-template-columns:1fr; }.board-overview { gap:1rem; }.board-overview strong { font-size:2rem; }.incident-intro .dispatch-deck { font-size:1.15rem; } }
