/* ============================================================
   FACTORY OS — SOLVEI8 · site.css
   World: "The Motion Study" (see DESIGN.md)
   Block library seed: every top-level section of index.html is a
   reusable block (b-mast, b-title, b-plate, b-toc, b-lanes,
   b-instruments, b-apparatus, b-register, b-qa, b-intake, b-foot).
   ============================================================ */

:root{
  /* Observation-sheet paper */
  --paper:      #EFF1EC;
  --paper-deep: #E6E9E2;
  --rule:       rgba(26,29,24,0.14);
  --rule-faint: rgba(26,29,24,0.07);
  --ink:        #1A1D18;
  --ink-2:      #4A4E46;
  --ink-3:      #63685E;

  /* The photographic plate */
  --plate:      #0C0D0F;
  --plate-edge: #23252A;
  --trace:      #E8ECF2;
  --trace-dim:  rgba(232,236,242,0.62);
  --trace-faint:rgba(232,236,242,0.34);

  /* Solvei8 coral — live signal only */
  --coral:      #F4495D;   /* brand exact; large display + plate strokes */
  --coral-lit:  #F4677C;   /* small coral text inside plates */
  --press:      #B5122E;   /* the same red pressed into paper: small type, buttons */

  --serif: 'Besley', Georgia, serif;
  --sans:  'Archivo', system-ui, sans-serif;
  --mono:  'Courier Prime', ui-monospace, 'Courier New', monospace;

  --ease: cubic-bezier(0.19,1,0.22,1);
  --ruling: 32px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }

body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:16px;line-height:1.55;
  /* the sheet's ledger ruling */
  background-image:repeating-linear-gradient(
    to bottom, transparent 0 31px, var(--rule-faint) 31px 32px);
}

a{color:inherit;text-decoration:none}
p a{border-bottom:1.5px solid var(--press)}
p a:hover{color:var(--press)}
img,svg{display:block;max-width:100%}
.wrap{max-width:1240px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}

::selection{background:var(--coral);color:var(--paper)}

:focus-visible{outline:2px solid var(--press);outline-offset:2px}
.plate :focus-visible{outline-color:var(--trace)}

/* printed matter knocks out the sheet's ruling: blocks that carry their own
   line-work (figures, tables, registers, ruled lists) sit on clean paper so
   their rules never collide with the background ruling */
.fig,.toc,.readings,.lanes,.instrument,.spec,.register,
.field-readings,.qa-cols,.obs-note,.intake-aside ul,.b-foot,
.voices,.wksheet,.obs-case{background:var(--paper)}

.skip{
  position:absolute;left:-9999px;top:0;z-index:99;
  font-family:var(--sans);font-size:13px;font-weight:600;
  background:var(--ink);color:var(--paper);padding:10px 16px;
}
.skip:focus{left:0}

/* visually hidden (labels, a11y text) */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ───────────────────────── masthead: the running head ───────────────────────── */
.b-mast{
  position:sticky;top:0;z-index:50;
  border-bottom:2px solid var(--ink);
  background:var(--paper);
}
.mast-inner{
  display:flex;align-items:center;gap:26px;
  padding:14px 0 12px;
}
.wordmark{font-family:var(--serif);font-weight:700;font-size:22px;letter-spacing:-0.01em;line-height:1}
.wordmark .i8{color:var(--coral)}
.wordmark small{
  display:block;font-family:var(--mono);font-weight:400;font-size:9.5px;
  letter-spacing:0.22em;color:var(--ink-3);margin-top:3px;
}
.mast-links{display:flex;gap:20px}
.mast-links a{
  font-family:var(--sans);font-size:13px;font-weight:500;color:var(--ink-2);
  padding:2px 0;border-bottom:1.5px solid transparent;
  transition:color 160ms var(--ease),border-color 160ms var(--ease);
}
.mast-links a:hover{color:var(--ink);border-bottom-color:var(--press)}
.mast-spacer{flex:1}
.mast-no{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);letter-spacing:0.04em}
.mast-cta{
  font-family:var(--sans);font-size:13.5px;font-weight:600;color:var(--paper);
  background:var(--ink);padding:10px 18px;border:1px solid var(--ink);
  transition:background 180ms var(--ease),border-color 180ms var(--ease);
}
.mast-cta:hover{background:var(--press);border-color:var(--press)}

/* ───────────────────────── title block ───────────────────────── */
.b-title{
  padding:clamp(48px,7vh,84px) 0 clamp(36px,5vh,56px);
  display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(32px,5vw,88px);
  align-items:end;
}
.study-line{
  font-family:var(--mono);font-size:12.5px;color:var(--ink-2);
  letter-spacing:0.03em;margin-bottom:26px;
}
.study-line b{color:var(--press);font-weight:700}
h1{
  font-weight:500;
  font-size:clamp(40px,4.6vw,66px);
  line-height:1.04;letter-spacing:-0.02em;
  text-wrap:balance;
}
h1 em{font-style:italic;font-weight:600;color:var(--coral)}
.lede{
  margin-top:26px;max-width:56ch;
  font-family:var(--sans);font-size:16.5px;line-height:1.6;color:var(--ink-2);
}
.acts{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.btn{
  display:inline-block;
  font-family:var(--sans);font-size:14.5px;font-weight:600;
  padding:13px 26px;letter-spacing:0.005em;cursor:pointer;
  transition:background 180ms var(--ease),color 180ms var(--ease),border-color 180ms var(--ease);
}
.btn-primary{background:var(--press);color:var(--paper);border:1px solid var(--press)}
.btn-primary:hover{background:var(--ink);border-color:var(--ink)}
.btn-secondary{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn-secondary:hover{background:var(--ink);color:var(--paper)}

/* readings: ruled observation table, the world's answer to stat cards */
.readings{width:100%;border-collapse:separate;border-spacing:0;border-top:2px solid var(--ink);align-self:end}
.readings caption{
  text-align:left;font-family:var(--mono);font-size:11.5px;line-height:15px;color:var(--ink-3);
  padding:8px 0 7px;letter-spacing:0.06em;
}
.readings td{border-bottom:1px solid var(--rule);padding:14px 2px;vertical-align:baseline}
.readings .v{
  font-family:var(--serif);font-weight:600;font-size:26px;line-height:1.15;letter-spacing:-0.01em;
  white-space:nowrap;padding-right:18px;
}
.readings .v sup{font-size:15px;color:var(--press);font-weight:700}
.readings .l{font-family:var(--sans);font-size:13px;color:var(--ink-2)}

/* ───────────────────────── the plate ───────────────────────── */
.b-plate{padding:8px 0 10px}
.plate-head{
  display:flex;align-items:baseline;justify-content:space-between;
  padding-bottom:10px;flex-wrap:wrap;gap:8px;
}
.plate-no{font-family:var(--mono);font-size:12.5px;font-weight:700;letter-spacing:0.08em}
.plate-no::before{
  content:"";display:inline-block;width:9px;height:9px;background:var(--coral);
  margin-right:10px;transform:translateY(0.5px);
}
.plate-meta{font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.02em}
.plate{
  background:var(--plate);
  border:1px solid var(--plate-edge);
  padding:clamp(18px,2.6vw,34px) clamp(16px,2.4vw,30px) clamp(12px,1.8vw,20px);
}
.plate-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.plate-scroll svg{min-width:760px}
.plate svg{width:100%;height:auto}
.plate text{font-family:var(--mono)}

/* plate lettering */
.ax{fill:var(--trace-dim);font-size:10px;letter-spacing:0.06em}
.ms{fill:var(--trace);font-size:10.5px;letter-spacing:0.03em}
.band-l{fill:var(--trace-dim);font-size:10px;letter-spacing:0.18em}
.band-rule{stroke:rgba(232,236,242,0.09);stroke-width:1}
.baseline{stroke:rgba(232,236,242,0.16);stroke-width:1}
.anno{fill:var(--coral-lit);font-size:10.5px;letter-spacing:0.02em}
.anno-box{fill:rgba(244,73,93,0.10);stroke:rgba(244,103,124,0.45);stroke-width:1}
.held{fill:var(--trace);font-size:10.5px;letter-spacing:0.05em}
.held-box{fill:rgba(232,236,242,0.06);stroke:rgba(232,236,242,0.3);stroke-width:1}

/* trace strokes — fully drawn by default (no-JS, crawlers, reduced motion).
   js adds .is-armed and drives dashoffset from scroll. */
.tr-plan{stroke:var(--trace-faint);stroke-width:1.4;stroke-dasharray:5 6;fill:none}
.tr-actual{stroke:var(--trace);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tr-glow{stroke:var(--trace);stroke-width:7;fill:none;opacity:0.14;filter:blur(4px);stroke-linecap:round}
.tr-dev{stroke:var(--coral);stroke-width:2.6;fill:none;stroke-linecap:round}
.tr-dev-glow{stroke:var(--coral);stroke-width:9;fill:none;opacity:0.2;filter:blur(5px)}
/* pulsed-light time ticks: plate-colored interruptions over the trace */
.tr-pulse{stroke:var(--plate);stroke-width:3.2;fill:none;stroke-dasharray:2.5 11;stroke-linecap:butt}
.node{fill:var(--plate);stroke:var(--trace);stroke-width:1.6}
.node.dev{stroke:var(--coral);fill:var(--coral)}

.is-armed .tr-actual,.is-armed .tr-glow{stroke-dasharray:1;stroke-dashoffset:1}
.is-armed .tr-dev,.is-armed .tr-dev-glow{stroke-dasharray:1;stroke-dashoffset:1}
.is-armed .cue{opacity:0;transition:opacity 500ms var(--ease)}
.is-armed .cue.on{opacity:1}

.plate-caption{
  padding-top:14px;
  font-style:italic;font-size:14.5px;color:var(--ink-2);max-width:78ch;line-height:1.55;
}
.plate-caption b{font-style:normal;font-weight:600;color:var(--ink)}

/* ───────────────────────── section furniture ───────────────────────── */
.section{padding:clamp(56px,9vh,112px) 0 0;scroll-margin-top:84px}
.sec-rule{border:0;border-top:2px solid var(--ink);margin:0 0 18px}
.sec-head{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.sec-no{font-family:var(--mono);font-size:14px;font-weight:700;color:var(--press);letter-spacing:0.08em}
h2{
  font-weight:600;font-size:clamp(28px,2.6vw,40px);
  line-height:1.12;letter-spacing:-0.015em;text-wrap:balance;
}
.sec-standfirst{
  margin-top:18px;max-width:62ch;
  font-family:var(--sans);font-size:16.5px;line-height:1.6;color:var(--ink-2);
}
.sec-standfirst b{color:var(--ink);font-weight:600}

/* figures: ink line-drawings on the paper itself */
.fig{margin-top:40px}
.fig-head{font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.06em;padding-bottom:10px}
.fig svg{width:100%;height:auto}
.fig-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.fig-scroll svg{min-width:720px}
.fg-line{stroke:var(--ink);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.fg-thin{stroke:var(--ink-3);stroke-width:1.2;fill:none}
.fg-dash{stroke:var(--ink-3);stroke-width:1.2;stroke-dasharray:4 5;fill:none}
.fg-coral{stroke:var(--press);stroke-width:2;fill:none;stroke-linecap:round}
.fig text{font-family:var(--mono)}
.fg-l{fill:var(--ink-2);font-size:11px;letter-spacing:0.12em}
.fg-s{fill:var(--ink-3);font-size:10px;letter-spacing:0.05em}
.fg-r{fill:var(--press);font-size:10.5px;letter-spacing:0.08em;font-weight:700}
.fg-box{fill:var(--paper);stroke:var(--ink);stroke-width:1.4}
.fg-box-deep{fill:var(--paper-deep);stroke:var(--ink);stroke-width:1.4}
.fg-box-ink{fill:var(--ink)}
.fg-on-ink{fill:var(--paper);font-size:12px;letter-spacing:0.14em;font-weight:700}
.fg-on-ink-s{fill:rgba(239,241,236,0.75);font-size:9.5px;letter-spacing:0.08em}

/* draw-on-enter for figures (armed by js only) */
.is-armed .fg-draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1400ms var(--ease)}
.is-armed.is-in .fg-draw{stroke-dashoffset:0}

/* ───────────────────────── the lane figures (FIG. 01 / FIG. 07) ─────────────
   Fixed-pixel geometry so the lane rules sit exactly on the sheet's 32px
   ruling: rows are 64px (two rulings) tall, curves live in a fixed-height SVG
   whose endpoints meet the row rules to the pixel. js/site.js phase-snaps the
   whole figure onto the document grid. */
.lanefig{position:relative;display:flex;height:320px;margin-top:6px}
.lanefig-entry,.lanefig-exit{position:relative;flex:none}
.lanefig-entry{width:clamp(88px,14vw,190px)}
.lanefig-exit{width:clamp(104px,14vw,190px)}
.fig svg.lanefig-split{flex:none;width:clamp(104px,18vw,220px);height:320px;display:block}
.lanefig-rows{flex:1;min-width:0;list-style:none}
.lanefig-rows li{
  position:relative;height:64px;display:flex;align-items:flex-end;
  padding:0 2px 9px;
  font-family:var(--mono);font-size:11px;letter-spacing:0.12em;color:var(--ink-2);
}
.lanefig-rows li::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ink)}
.fig-lanes .lanefig-rows li{justify-content:flex-end;text-align:right}
.lanefig-conv .lanefig-rows li{justify-content:flex-start}
.lanefig-entryline{position:absolute;left:0;right:0;top:190px;height:2px;background:var(--ink)}
.lanefig-node{position:absolute;right:-4px;top:191px;width:9px;height:9px;transform:translateY(-50%);background:var(--press)}
.lanefig-order{position:absolute;left:2px;top:186px;transform:translateY(-100%);font-family:var(--mono);font-size:10px;letter-spacing:0.05em;color:var(--ink-3);padding-bottom:6px}
.lanefig-plan{
  position:absolute;right:-2px;top:186px;transform:translateY(-100%);white-space:nowrap;padding-bottom:8px;
  font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.08em;color:var(--press);
}
.lanefig-exitline{position:absolute;left:0;right:22px;top:190px;height:2px;background:var(--press)}
.lanefig-node-end{right:12px;background:var(--press)}
.lanefig-deliv{
  position:absolute;right:12px;top:186px;transform:translateY(-100%);text-align:right;padding-bottom:8px;
  font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.08em;color:var(--press);line-height:1.6;
}

/* ───────────────────────── FIG. 06 — the apparatus, set on the grid ─────────
   Bands are 64/96px tall with 32px gaps: every band edge lands on the ruling. */
.appar{display:grid;grid-template-columns:minmax(150px,210px) minmax(320px,1fr) minmax(200px,250px);gap:clamp(28px,3.5vw,56px);margin-top:6px}
.appar-stack{position:relative}
.ap-band{
  height:64px;border:1px solid var(--ink);
  display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
  gap:5px;padding:0 12px;
}
.ap-band + .ap-band{margin-top:32px}
.ap-band b{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:0.14em;color:var(--ink)}
.ap-band span{font-family:var(--mono);font-size:9.5px;letter-spacing:0.08em;color:var(--ink-3)}
.ap-fos{height:96px;background:var(--ink)}
.ap-fos b{color:var(--paper);font-size:13px;letter-spacing:0.16em}
.ap-fos span{color:rgba(239,241,236,0.72)}
.fig svg.appar-sig,.fig svg.appar-dec{position:absolute;top:0;width:26px;height:480px;display:block;overflow:visible}
.appar-sig{left:-27px}
.appar-dec{right:-27px}
.appar-left{padding-top:192px}
.appar-note-h{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.12em;color:var(--ink)}
.appar-note{margin-top:10px;font-family:var(--mono);font-size:10.5px;line-height:2;letter-spacing:0.06em;color:var(--ink-3)}
.appar-right{position:relative;display:flex;flex-direction:column}
.appar-out-h{padding-top:56px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.12em;color:var(--press)}
.appar-out-s{margin-top:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:0.06em;color:var(--ink-3)}
.appar-reg{margin-top:auto;list-style:none;border-top:1px solid var(--ink)}
.appar-reg li{
  position:relative;display:flex;align-items:center;min-height:32px;padding:6px 0;
  font-family:var(--mono);font-size:10.5px;letter-spacing:0.08em;color:var(--ink-2);
}
.appar-reg li::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--rule)}
.appar-reg li.h{font-size:11px;font-weight:700;letter-spacing:0.12em;color:var(--ink)}
.appar-reg li.h::after{background:var(--ink)}

/* ───────────────────────── I. process lanes ───────────────────────── */
.lanes{margin-top:44px;border-top:2px solid var(--ink)}
.lane{
  display:grid;grid-template-columns:150px 1.35fr 1fr;gap:clamp(18px,3vw,44px);
  position:relative;
  padding:26px 2px 28px;
}
.lane::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--rule);
}
.lane-no{font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.08em;padding-top:6px}
.lane-no b{display:block;color:var(--press);font-size:13px;margin-bottom:4px}
.lane h3{font-weight:600;font-size:21px;letter-spacing:-0.01em;line-height:1.25}
.lane .lane-copy{margin-top:8px;font-family:var(--sans);font-size:15px;line-height:1.6;color:var(--ink-2);max-width:52ch}
.lane-reads{
  font-family:var(--mono);font-size:12.5px;line-height:2;color:var(--ink-2);
  border-left:1px solid var(--rule);padding-left:clamp(14px,2vw,28px);
  align-self:center;
}
.lane-reads .k{color:var(--ink-3);letter-spacing:0.08em}
.lane-reads .instr{color:var(--press);font-weight:700}

/* ───────────────────────── II. instruments ───────────────────────── */
.instrument{
  display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(28px,4vw,64px);
  border-top:1px solid var(--rule);
  padding:clamp(36px,5vh,56px) 0;
  align-items:center;
  scroll-margin-top:84px;
}
.instrument:first-of-type{border-top:2px solid var(--ink);margin-top:44px}
.instrument.flip .inst-body{order:2}
.instrument.flip .inst-fig{order:1}
.instrument.flip .inst-ext{order:3}
.inst-no{font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.08em}
.inst-no b{color:var(--press)}
.instrument h3{font-weight:600;font-size:clamp(24px,2.2vw,32px);letter-spacing:-0.015em;margin-top:10px}
.instrument h3 .i8{color:var(--coral)}
.inst-role{font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:0.05em;color:var(--ink-3);text-transform:uppercase;margin-top:6px}
.inst-claim{margin-top:16px;font-size:18.5px;line-height:1.5;font-style:italic;color:var(--ink)}
.inst-copy{margin-top:12px;font-family:var(--sans);font-size:15px;line-height:1.62;color:var(--ink-2);max-width:56ch}
.inst-reads{margin-top:18px;font-family:var(--mono);font-size:12.5px;line-height:2;color:var(--ink-2)}
.inst-reads .k{color:var(--ink-3)}
.inst-fig .plate{padding:clamp(14px,1.8vw,22px)}
.inst-fig .fig-head{padding-top:8px;padding-bottom:0}

/* ───────────────────────── III. apparatus ───────────────────────── */
.spec{width:100%;border-collapse:separate;border-spacing:0;border-top:2px solid var(--ink);margin-top:44px}
.spec caption{text-align:left;font-family:var(--mono);font-size:11.5px;line-height:15px;color:var(--ink-3);letter-spacing:0.06em;padding:8px 0 7px}
.spec th{
  text-align:left;font-family:var(--mono);font-size:12px;font-weight:700;color:var(--press);
  letter-spacing:0.08em;padding:16px 24px 16px 2px;vertical-align:top;white-space:nowrap;
  border-bottom:1px solid var(--rule);width:220px;
}
.spec td{
  font-family:var(--sans);font-size:14.5px;line-height:1.6;color:var(--ink-2);
  padding:15px 2px;border-bottom:1px solid var(--rule);
}
.spec td b{color:var(--ink);font-weight:600}

/* ───────────────────────── IV. field sites ───────────────────────── */
.register{width:100%;border-collapse:separate;border-spacing:0;border-top:2px solid var(--ink);margin-top:44px}
.register caption{text-align:left;font-family:var(--mono);font-size:11.5px;line-height:15px;color:var(--ink-3);letter-spacing:0.06em;padding:8px 0 7px}
.register th[scope="col"]{
  text-align:left;font-family:var(--mono);font-size:11px;font-weight:400;color:var(--ink-3);
  letter-spacing:0.14em;border-bottom:1px solid var(--ink);padding:6px 2px 8px;
}
.register td{border-bottom:1px solid var(--rule);padding:13px 2px;vertical-align:baseline}
.register .site{font-family:var(--serif);font-weight:600;font-size:19px;letter-spacing:-0.01em}
.register .ctry{font-family:var(--mono);font-size:12.5px;color:var(--ink-2);letter-spacing:0.04em}
.register .obs{font-family:var(--sans);font-size:13.5px;color:var(--ink-2)}
.register tfoot td{font-family:var(--mono);font-size:12px;color:var(--ink-3);padding:12px 2px;border-bottom:0}

.field-readings{
  display:grid;grid-template-columns:repeat(3,auto);gap:clamp(24px,5vw,72px);
  justify-content:start;margin-top:44px;border-top:2px solid var(--ink);padding-top:18px;
}
.fr .v{font-family:var(--serif);font-weight:600;font-size:clamp(30px,3vw,44px);letter-spacing:-0.015em}
.fr .v .arrow{color:var(--coral);font-weight:500}
.fr .l{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);letter-spacing:0.08em;margin-top:6px}

.pullquote{
  margin:clamp(48px,7vh,80px) auto 0;max-width:880px;
  text-align:center;
}
.pullquote p{
  font-size:clamp(24px,2.4vw,34px);line-height:1.3;font-weight:500;letter-spacing:-0.015em;
  text-wrap:balance;
}
.pullquote p em{font-style:italic;color:var(--press)}
.pullquote footer{margin-top:14px;font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.06em}

.obs-note{
  margin-top:clamp(40px,6vh,64px);
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  padding:24px 2px;display:grid;grid-template-columns:190px 1fr;gap:clamp(18px,3vw,44px);
}
.obs-note .k{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);letter-spacing:0.14em;padding-top:4px}
.obs-note blockquote p{font-size:17.5px;line-height:1.55;font-style:italic;color:var(--ink-2);max-width:70ch}
.obs-note blockquote footer{margin-top:10px;font-family:var(--mono);font-size:12px;color:var(--ink-3);font-style:normal}

/* ───────────────────────── table of contents ───────────────────────── */
.b-toc{padding:clamp(44px,6vh,72px) 0 clamp(20px,3vh,32px);scroll-margin-top:84px}
.toc-title{
  font-weight:600;font-size:14px;letter-spacing:0.14em;
  font-family:var(--sans);text-transform:uppercase;color:var(--ink-3);
  padding-bottom:18px; /* padding, not margin: the toc's grid-snap margin must not collapse */
}
.toc{border-top:2px solid var(--ink);list-style:none}
.toc li{position:relative}
.toc li::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--rule);
}
.toc a{
  display:flex;align-items:baseline;gap:14px;
  padding:14px 2px;
  transition:background 160ms var(--ease);
}
.toc a:hover{background:var(--paper-deep)}
.toc .n{font-family:var(--mono);font-size:13px;color:var(--press);font-weight:700;min-width:48px}
.toc .t{font-size:19px;font-weight:500;letter-spacing:-0.01em;white-space:nowrap}
.toc .dots{flex:1;min-width:40px;border-bottom:1.5px dotted var(--rule);transform:translateY(-4px)}
.toc .d{font-family:var(--sans);font-size:13px;color:var(--ink-3);white-space:nowrap}

/* ───────────────────────── Q&A ───────────────────────── */
.qa-cols{margin-top:44px;border-top:2px solid var(--ink)}
.qa{border-bottom:1px solid var(--rule)}
.qa summary{
  display:flex;align-items:baseline;gap:16px;cursor:pointer;list-style:none;
  padding:18px 2px;
}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{background:var(--paper-deep)}
.qa .qn{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--press);min-width:34px}
.qa .qt{font-family:var(--serif);font-weight:600;font-size:18.5px;letter-spacing:-0.01em;flex:1}
.qa .qm{font-family:var(--mono);font-size:16px;color:var(--ink-3);transition:transform 200ms var(--ease)}
.qa[open] .qm{transform:rotate(45deg)}
.qa .qa-a{
  padding:0 2px 22px 50px;max-width:75ch;
  font-family:var(--sans);font-size:15px;line-height:1.65;color:var(--ink-2);
}

/* ───────────────────────── V. intake sheet ───────────────────────── */
.b-intake .converge{margin-top:40px}
.intake-grid{
  display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(32px,5vw,88px);
  margin-top:44px;align-items:start;
}
.intake-aside .why{margin-top:22px;font-family:var(--sans);font-size:15px;line-height:1.65;color:var(--ink-2);max-width:44ch}
.intake-aside ul{margin-top:18px;list-style:none}
.intake-aside li{
  font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--ink-2);
  padding:10px 0;border-bottom:1px solid var(--rule);
}
.intake-aside li b{color:var(--press)}

.sheet{
  scroll-margin-top:96px;
  border:1px solid var(--ink);
  background:var(--paper);
  /* the sheet's own tighter ruling */
  background-image:repeating-linear-gradient(to bottom, transparent 0 31px, var(--rule-faint) 31px 32px);
}
.sheet-head{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;
  border-bottom:2px solid var(--ink);
  padding:16px 22px 12px;
}
.sheet-head .t{font-family:var(--mono);font-size:12.5px;font-weight:700;letter-spacing:0.1em}
.sheet-head .no{font-family:var(--mono);font-size:11.5px;color:var(--ink-3)}
.sheet-rail{
  display:flex;gap:0;border-bottom:1px solid var(--rule);
}
.sheet-rail .st{
  flex:1;text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:0.08em;
  color:var(--ink-3);padding:10px 22px;border-right:1px solid var(--rule);
  background:transparent;border-top:none;border-bottom:none;border-left:none;
}
.sheet-rail .st:last-child{border-right:0}
.sheet-rail .st.done{color:var(--ink-2)}
.sheet-rail .st.now{color:var(--press);font-weight:700}
.sheet-body{padding:22px 22px 26px}
.step-title{font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.1em;margin-bottom:18px}
.step-title b{color:var(--ink)}

.field{margin-bottom:20px}
.field label{
  display:block;font-family:var(--sans);font-size:13px;font-weight:600;
  letter-spacing:0.03em;margin-bottom:7px;
}
.field label .opt{font-weight:400;color:var(--ink-3)}
.field input[type="text"],.field input[type="email"],.field select,.field textarea{
  width:100%;
  font-family:var(--mono);font-size:14.5px;color:var(--ink);
  background:var(--paper-deep);
  border:1px solid rgba(26,29,24,0.35);
  padding:12px 14px;border-radius:0;appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%231A1D18' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
  padding-right:36px;
}
.field textarea{min-height:96px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:2px solid var(--press);outline-offset:1px;border-color:var(--ink);
}
.sheet .err{
  margin-top:7px;
  font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--press);
}
.field .err{display:none}
.sheet .err[data-consent-err],.sheet .err[data-send-err]{margin:0 0 16px}
.field.is-invalid input,.field.is-invalid select{border-color:var(--press)}
.field.is-invalid .err{display:block}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}

.consent{display:flex;gap:12px;align-items:flex-start;margin:6px 0 20px}
.consent input{
  width:18px;height:18px;margin-top:2px;accent-color:var(--press);flex:none;
}
.consent label{font-family:var(--sans);font-size:13px;line-height:1.55;color:var(--ink-2)}

.sheet-acts{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-top:4px}
.btn-back{
  font-family:var(--mono);font-size:12.5px;color:var(--ink-2);background:none;border:none;
  cursor:pointer;letter-spacing:0.05em;padding:10px 0;border-bottom:1.5px solid transparent;
}
.btn-back:hover{color:var(--ink);border-bottom-color:var(--press)}
.sheet .btn{border-radius:0}

/* honeypot — hidden from humans, present for bots */
.hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}

/* success state */
.sheet-done{padding:36px 22px 40px;text-align:left}
.sheet-done .stamp{
  display:inline-block;font-family:var(--mono);font-weight:700;font-size:14px;letter-spacing:0.14em;
  color:var(--press);border:2px solid var(--press);padding:8px 14px;
  transform:rotate(-2deg);margin-bottom:20px;
}
.sheet-done h3{font-weight:600;font-size:24px;letter-spacing:-0.015em}
.sheet-done p{margin-top:12px;font-family:var(--sans);font-size:15px;line-height:1.6;color:var(--ink-2);max-width:52ch}

/* progressive steps: without JS every step is visible and the sheet submits
   as one page; with JS (.js-on) the rail appears and steps page through */
fieldset.step{border:0;min-width:0}
.step + .step{margin-top:28px;border-top:1px solid var(--rule);padding-top:24px}
.sheet .sheet-rail,.sheet .btn-next,.sheet .btn-back{display:none}
.sheet.js-on .sheet-rail{display:flex}
.sheet.js-on .btn-next,.sheet.js-on .btn-back{display:inline-block}
.sheet.js-on .step{display:none;margin-top:0;border-top:0;padding-top:0}
.sheet.js-on .step.now{display:block}

/* ───────────────────────── footer: the colophon ───────────────────────── */
.b-foot{margin-top:clamp(72px,10vh,128px);border-top:2px solid var(--ink)}
.foot-grid{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(24px,4vw,56px);
  padding:40px 0 32px;
}
.foot-brand p{
  margin-top:14px;font-family:var(--sans);font-size:13.5px;line-height:1.6;color:var(--ink-2);max-width:34ch;
}
.foot-h{font-family:var(--mono);font-size:11px;color:var(--ink-3);letter-spacing:0.16em;margin-bottom:14px}
.foot-col ul{list-style:none}
.foot-col li{padding:5px 0}
.foot-col a{
  font-family:var(--sans);font-size:14px;color:var(--ink-2);
  border-bottom:1.5px solid transparent;transition:color 160ms var(--ease),border-color 160ms var(--ease);
}
.foot-col a:hover{color:var(--ink);border-bottom-color:var(--press)}
.foot-col .mono{font-family:var(--mono);font-size:13px}
.colophon{
  border-top:1px solid var(--rule);
  padding:16px 0 40px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-family:var(--mono);font-size:11.5px;color:var(--ink-3);letter-spacing:0.03em;
}

/* ───────────────────────── I. the condition (findings) ───────────────────────── */
.finding{margin-top:44px}
.finding-no{font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.08em}
.finding-no b{color:var(--press)}
.finding h3{font-weight:600;font-size:21px;letter-spacing:-0.01em;margin-top:8px}
.finding-copy{margin-top:8px;font-family:var(--sans);font-size:15px;line-height:1.6;color:var(--ink-2);max-width:62ch}

/* condition figures: grid, breach node, gantt bars */
.fg-grid{stroke:var(--rule);stroke-width:1}
.fg-node{fill:var(--press)}
.fg-bar{stroke:var(--ink);stroke-width:14;fill:none}
.fg-lost{stroke:var(--press);stroke-width:14;stroke-dasharray:3 6;fill:none}

/* paired field logs: the same breach, two clocks */
.log-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px)}
.log-grid .register{margin-top:24px}
.log .lt{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--press);white-space:nowrap;width:96px;padding-right:18px}
.log .le{font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--ink-2)}
.log .le i{font-style:italic;color:var(--ink-3)}
.log .lt.final{color:var(--ink-3);font-weight:400}
.log .le.final{font-family:var(--mono);font-size:12px;color:var(--press);letter-spacing:0.04em}

/* ───────────────────────── instrument extensions ───────────────────────── */
.inst-ext{
  grid-column:1/-1;align-self:stretch;
  display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(28px,4vw,64px);
  border-top:1px solid var(--rule);margin-top:8px;padding-top:24px;
  align-items:start;
}
.ext-head{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);letter-spacing:0.08em;padding-bottom:12px}
.proc-list{list-style:none;columns:2;column-gap:clamp(24px,3vw,48px)}
.proc-list li{
  position:relative;padding:9px 0 9px 40px;break-inside:avoid;
  font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--ink-2);
  border-bottom:1px solid var(--rule);
}
.proc-list li b{position:absolute;left:0;top:10px;font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--press)}
.proc-list.grades{columns:1}
.inst-stats{border-top:2px solid var(--ink);padding-top:6px}
.inst-stats .st{padding:10px 0 12px;border-bottom:1px solid var(--rule)}
.inst-stats .v{font-family:var(--serif);font-weight:600;font-size:24px;letter-spacing:-0.01em}
.inst-stats .l{font-family:var(--mono);font-size:11px;color:var(--ink-3);letter-spacing:0.08em;margin-top:4px}
.turnaround{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.turnaround .v{font-family:var(--serif);font-weight:600;font-size:clamp(28px,2.6vw,38px);letter-spacing:-0.015em}
.turnaround .v.faded{color:var(--ink-3)}
.turnaround .l{font-family:var(--mono);font-size:11px;color:var(--ink-3);letter-spacing:0.08em;margin-top:6px}
.anatomy{
  margin-top:18px;border-top:1px solid var(--rule);padding-top:12px;
  font-family:var(--mono);font-size:12px;line-height:1.9;color:var(--ink-2);letter-spacing:0.04em;
}
.anatomy b{color:var(--press)}

/* WIP reconciliation register (Tracki8 specimen) — dense filed sheet: one ruling per row */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl-scroll .register{min-width:560px}
.inst-ext .register{margin-top:0}
.register.wip td{padding:5px 2px;line-height:1.4}
.register.wip th.n,.register.wip td.n{text-align:right;font-family:var(--mono);font-size:13px;color:var(--ink-2);letter-spacing:0.02em}
.register.wip .stage{font-family:var(--sans);font-size:14px;color:var(--ink)}
.register.wip tr.done .stage{font-weight:600}
.register.wip tr.done td.n{color:var(--ink);font-weight:700}

/* ───────────────────────── IV. corrections observed ───────────────────────── */
.obs-case{
  display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,4vw,64px);
  border-top:1px solid var(--rule);
  padding:clamp(32px,5vh,48px) 0;
  align-items:center;
}
.obs-case:first-of-type{border-top:2px solid var(--ink);margin-top:44px}
.case-no{font-family:var(--mono);font-size:12px;color:var(--ink-3);letter-spacing:0.08em}
.case-no b{color:var(--press)}
.obs-case h3{font-weight:600;font-size:clamp(22px,2vw,28px);letter-spacing:-0.015em;margin-top:10px}
.case-copy{margin-top:12px;font-family:var(--sans);font-size:15px;line-height:1.62;color:var(--ink-2);max-width:52ch}
.case-result{margin-top:16px;font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--press);letter-spacing:0.06em}
.obs-case .register{margin-top:0}

/* ───────────────────────── V. the intelligence ───────────────────────── */
.sec-plate{margin-top:44px}
.transcript{padding:clamp(24px,3vw,40px) clamp(20px,3vw,36px)}
.transcript p{font-family:var(--mono)}
.tq{color:var(--trace);font-size:14px;font-weight:700;letter-spacing:0.05em}
.tq:not(:first-child){margin-top:28px}
.ta-line{margin-top:12px;color:var(--trace-dim);font-size:13.5px;line-height:1.7;max-width:72ch}
.ta-line b{color:var(--trace);font-weight:700}
.tc{margin-top:12px;color:var(--trace-dim);font-size:11px;letter-spacing:0.08em}
.tr-row{margin-top:10px;color:var(--trace-dim);font-size:12px;letter-spacing:0.03em}
.tr-row em{font-style:normal;color:var(--coral-lit);font-weight:700}
.pro-reg .obs{font-family:var(--sans);font-size:13.5px;line-height:1.55;color:var(--ink-2);max-width:52ch;padding-right:18px}
.pro-reg .site{white-space:nowrap;padding-right:18px}
.pro-reg .ctry{white-space:nowrap;padding-right:18px}
.register .status{font-family:var(--mono);font-size:11.5px;font-weight:700;color:var(--press);letter-spacing:0.06em;white-space:nowrap}

/* ───────────────────────── VII. voices from the floor ───────────────────────── */
.voices{margin-top:clamp(40px,6vh,64px);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,48px)}
.voice{border-top:2px solid var(--ink);padding-top:16px}
.voice-head{font-family:var(--serif);font-weight:600;font-size:17px;letter-spacing:-0.01em}
.voice p + p{margin-top:10px;font-size:15.5px;line-height:1.6;font-style:italic;color:var(--ink-2)}
.voice footer{margin-top:14px;font-family:var(--mono);font-size:11px;color:var(--ink-3);letter-spacing:0.08em}

/* ───────────────────────── VIII. the worksheet ───────────────────────── */
.wksheet{
  margin-top:44px;
  display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,5vw,88px);
  align-items:start;
}
.wksheet .field input{
  width:100%;
  font-family:var(--mono);font-size:14.5px;color:var(--ink);
  background:var(--paper-deep);
  border:1px solid rgba(26,29,24,0.35);
  padding:12px 14px;border-radius:0;appearance:textfield;
}
.wksheet .field input::-webkit-outer-spin-button,
.wksheet .field input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.wksheet .field input:focus{outline:2px solid var(--press);outline-offset:1px;border-color:var(--ink)}
.wks-note{margin-top:8px;font-family:var(--mono);font-size:11px;line-height:1.8;color:var(--ink-3);letter-spacing:0.04em;max-width:52ch}
.wks-out .wks-total .v{font-size:clamp(34px,3vw,44px);color:var(--press)}
.wks-out .v.sm{font-size:19px;color:var(--ink-2)}
.wks-acts{margin-top:24px}

.foot-h-2{margin-top:24px}

/* ───────────────────────── motion: ink draws, plates develop ─────────────
   Doctrine (DESIGN.md): printed text never fades or travels. On paper, only
   ink moves — rules draw, the pen point appears. Inside plates, light may
   develop. Everything below is armed by js only; without js (crawlers,
   reduced motion) every state is fully printed. */

/* the section opener: the clerk rules the sheet */
.sec-rule.is-armed{transform:scaleX(0);transform-origin:0 50%;transition:transform 800ms var(--ease)}
.sec-rule.is-armed.is-in{transform:scaleX(1)}

/* row rules draw across (toc, lanes) */
.toc.is-armed li::after,.lanes.is-armed .lane::after{
  transform:scaleX(0);transform-origin:0 50%;transition:transform 700ms var(--ease);
}
.toc.is-armed.is-in li::after,.lanes.is-armed.is-in .lane::after{transform:scaleX(1)}
.toc.is-armed li:nth-child(2)::after,.lanes.is-armed .lane:nth-child(2)::after{transition-delay:70ms}
.toc.is-armed li:nth-child(3)::after,.lanes.is-armed .lane:nth-child(3)::after{transition-delay:140ms}
.toc.is-armed li:nth-child(4)::after,.lanes.is-armed .lane:nth-child(4)::after{transition-delay:210ms}
.toc.is-armed li:nth-child(5)::after,.lanes.is-armed .lane:nth-child(5)::after{transition-delay:280ms}
.toc.is-armed li:nth-child(6)::after,.lanes.is-armed .lane:nth-child(6)::after{transition-delay:350ms}

/* FIG. 01: entry line → split curves → lane rules sweep */
.fig.is-armed .lanefig-entryline{transform:scaleX(0);transform-origin:0 50%;transition:transform 360ms var(--ease)}
.fig.is-armed.is-in .lanefig-entryline{transform:scaleX(1)}
.fig.is-armed .lanefig-node{opacity:0;transition:opacity 300ms var(--ease) 300ms}
.fig.is-armed.is-in .lanefig-node{opacity:1}
.fig-lanes.is-armed .lanefig-rows li::after{transform:scaleX(0);transform-origin:0 50%;transition:transform 900ms var(--ease)}
.fig-lanes.is-armed.is-in .lanefig-rows li::after{transform:scaleX(1)}
.fig-lanes .lanefig-rows li:nth-child(1)::after{transition-delay:900ms}
.fig-lanes .lanefig-rows li:nth-child(2)::after{transition-delay:970ms}
.fig-lanes .lanefig-rows li:nth-child(3)::after{transition-delay:1040ms}
.fig-lanes .lanefig-rows li:nth-child(4)::after{transition-delay:1110ms}
.fig-lanes .lanefig-rows li:nth-child(5)::after{transition-delay:1180ms}

/* FIG. 07: lane rules → converge curves → the coral close */
.fig-conv.is-armed .lanefig-rows li::after{transform:scaleX(0);transform-origin:0 50%;transition:transform 700ms var(--ease)}
.fig-conv.is-armed.is-in .lanefig-rows li::after{transform:scaleX(1)}
.fig-conv .lanefig-rows li:nth-child(1)::after{transition-delay:0ms}
.fig-conv .lanefig-rows li:nth-child(2)::after{transition-delay:70ms}
.fig-conv .lanefig-rows li:nth-child(3)::after{transition-delay:140ms}
.fig-conv .lanefig-rows li:nth-child(4)::after{transition-delay:210ms}
.fig-conv .lanefig-rows li:nth-child(5)::after{transition-delay:280ms}
.fig-conv.is-armed .lanefig-exitline{transform:scaleX(0);transform-origin:0 50%;transition:transform 500ms var(--ease) 1500ms}
.fig-conv.is-armed.is-in .lanefig-exitline{transform:scaleX(1)}
.fig-conv.is-armed .lanefig-node-end{opacity:0;transition:opacity 300ms var(--ease) 1900ms}
.fig-conv.is-armed.is-in .lanefig-node-end{opacity:1}

/* the plates develop: staged exposure inside instrument plates (02–05) */
.plate-dev.is-armed .dv{opacity:0}
.plate-dev.is-armed.is-in .dv{opacity:1;transition:opacity 460ms var(--ease);transition-delay:calc(var(--dv,0)*200ms)}
.plate-dev.is-armed .dv-draw{stroke-dasharray:1;stroke-dashoffset:1}
.plate-dev.is-armed.is-in .dv-draw{
  stroke-dashoffset:0;
  transition:stroke-dashoffset 800ms var(--ease),opacity 460ms var(--ease);
  transition-delay:calc(var(--dv,0)*200ms);
}

/* the readings settle: counters tick to their observed value (js) */
.tick{font-variant-numeric:tabular-nums lining-nums}

/* the recording lamp: the study is being conducted live right now */
.live-dot{display:inline-block;width:8px;height:8px;background:var(--coral);margin-right:9px}
@keyframes rec{0%,55%{opacity:1}65%,90%{opacity:0.25}100%{opacity:1}}
.live-dot{animation:rec 2.4s var(--ease) infinite}

/* running head names the chapter with an ink fade */
.mast-no{transition:opacity 180ms var(--ease)}
.mast-no.swap{opacity:0}

/* intake: steps acknowledge, the stamp lands */
@keyframes stepIn{from{opacity:0}to{opacity:1}}
.sheet.js-on .step.now{animation:stepIn 260ms var(--ease)}
.sheet-rail .st{transition:color 200ms var(--ease)}
@keyframes stampIn{0%{opacity:0;transform:rotate(-7deg) scale(1.55)}100%{opacity:1;transform:rotate(-2deg) scale(1)}}
.sheet-done .stamp{animation:stampIn 460ms var(--ease) both}

/* ───────────────────────── responsive ───────────────────────── */
@media (max-width:1080px){
  .lane{grid-template-columns:120px 1.3fr 1fr}
}
@media (max-width:960px){
  .b-title{grid-template-columns:1fr;align-items:start}
  .mast-links,.mast-no{display:none}
  .appar{grid-template-columns:1fr;gap:24px}
  .fig svg.appar-sig,.fig svg.appar-dec{display:none}
  .appar-left{padding-top:0}
  .appar-out-h{padding-top:0}
  .appar-reg{margin-top:24px}
  .toc .d{display:none}
  .toc .t{white-space:normal}
  .toc .dots{min-width:0}
  .lane{grid-template-columns:1fr;gap:12px;padding:22px 2px 24px}
  .lane-no{padding-top:0}
  .lane-reads{border-left:0;padding-left:0;border-top:1px dotted var(--rule);padding-top:12px;align-self:start}
  .instrument{grid-template-columns:1fr;gap:22px}
  .instrument.flip .inst-body{order:1}
  .instrument.flip .inst-fig{order:2}
  .instrument.flip .inst-ext{order:3}
  .inst-ext{grid-template-columns:1fr;gap:24px}
  .log-grid{grid-template-columns:1fr}
  .obs-case{grid-template-columns:1fr;gap:22px}
  .voices{grid-template-columns:1fr}
  .wksheet{grid-template-columns:1fr;gap:32px}
  .proc-list{columns:1}
  .intake-grid{grid-template-columns:1fr}
  .field-readings{grid-template-columns:1fr;gap:20px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .spec th{width:150px;padding-right:14px}
  .obs-note{grid-template-columns:1fr;gap:10px}
  .qa .qa-a{padding-left:2px}
}
@media (max-width:560px){
  .field-row{grid-template-columns:1fr}
  .turnaround{grid-template-columns:1fr;gap:16px}
  .log .lt{width:76px;padding-right:12px}
  .foot-grid{grid-template-columns:1fr}
  .sheet-rail .st{padding:10px 12px}
  .sheet-head,.sheet-body{padding-left:16px;padding-right:16px}
  .acts .btn{width:100%;text-align:center}
  .lanefig-rows li{font-size:9.5px;letter-spacing:0.08em}
  .lanefig-plan,.lanefig-deliv{font-size:9.5px}
}

/* ───────────────────────── reduced motion ───────────────────────── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition-duration:0.01ms !important;animation-duration:0.01ms !important}
  .is-armed .tr-actual,.is-armed .tr-glow,.is-armed .tr-dev,.is-armed .tr-dev-glow{
    stroke-dasharray:none;stroke-dashoffset:0;
  }
  .is-armed .cue{opacity:1}
  .is-armed .fg-draw{stroke-dasharray:none;stroke-dashoffset:0}
  .sec-rule.is-armed,
  .toc.is-armed li::after,.lanes.is-armed .lane::after,
  .fig.is-armed .lanefig-entryline,.fig-conv.is-armed .lanefig-exitline,
  .fig-lanes.is-armed .lanefig-rows li::after,.fig-conv.is-armed .lanefig-rows li::after{transform:none}
  .fig.is-armed .lanefig-node,.fig-conv.is-armed .lanefig-node-end,
  .plate-dev.is-armed .dv{opacity:1}
  .plate-dev.is-armed .dv-draw{stroke-dasharray:none;stroke-dashoffset:0}
  .live-dot{animation:none}
}