diff --git a/.agents/agents/design-system-keeper.md b/.agents/agents/design-system-keeper.md
index 959beaa..a239273 100644
--- a/.agents/agents/design-system-keeper.md
+++ b/.agents/agents/design-system-keeper.md
@@ -20,11 +20,13 @@ palettes and a broken `@font-face`. **Load skills**: `design-tokens`,
    `--paper`, `--muted`, `--line`, `--gold` likewise. Most deltas are
    sub-perceptual and can be canonicalized. `--blue` (`#527f9f` vs `#215675`) is
    visibly different — screenshot both and get a human decision.
-2. **The fonts have never rendered.** The `@font-face` in `styles.css:1` points
-   `src:` at a Google Fonts _stylesheet_, so Manrope and DM Mono have always
-   fallen back to Arial and generic monospace. Self-hosting them is a redesign,
-   not a refactor. Default: delete the dead rule, declare the stacks that
-   actually render. Escalate if someone wants the real fonts.
+2. ~~**The fonts have never rendered.**~~ **Settled 2026-09-05 — do not
+   reopen.** The malformed `@font-face` was escalated and the human chose the
+   real fonts. Manrope and DM Mono are self-hosted in `public/fonts/`, wired
+   through `public/fonts/fonts.css`, which `BaseLayout.astro` links and the
+   legacy root `styles.css` `@import`s. **Do not delete these faces and do not
+   replace the stacks with `Arial`/`ui-monospace`** — that instruction is
+   obsolete. You may add `--font-sans` / `--font-mono` tokens pointing at them.
 
 ## You own
 
diff --git a/.agents/context/design-system.md b/.agents/context/design-system.md
index e7f770f..49579c8 100644
--- a/.agents/context/design-system.md
+++ b/.agents/context/design-system.md
@@ -8,18 +8,18 @@ files, not assumed.
 The same semantic names carry different values depending on which stylesheet
 loaded them:
 
-| Token | `styles.css`, `rules/styles.css` | `chapters.css`, `skills-review/styles.css` | `hands-on/*/styles.css` |
-| --- | --- | --- | --- |
-| `--paper` | `#f5f4f1` | `#f6f3ed` | `#f4f3ef` |
-| `--ink` | `#172f42` | `#122534` | `#173044` |
-| `--muted` | `#697b89` | `#65717a` | `#687d8c` |
-| `--line` | `#d8dee2` | `#d0d5d2` | `#d5dde1` |
-| `--blue` | `#527f9f` | `#215675` | `#5683a1` |
-| `--gold` | `#efc76b` | `#ebbf58` | `#efc86d` |
-| `--accent` | `#7c78a8` | — | — |
-| `--deep` | `#102536` | — | — |
-| `--red` | — | `#a7483f` (chapters only) | — |
-| `--violet` | — | `#6b668f` (review desk only) | — |
+| Token      | `styles.css`, `rules/styles.css` | `chapters.css`, `skills-review/styles.css` | `hands-on/*/styles.css` |
+| ---------- | -------------------------------- | ------------------------------------------ | ----------------------- |
+| `--paper`  | `#f5f4f1`                        | `#f6f3ed`                                  | `#f4f3ef`               |
+| `--ink`    | `#172f42`                        | `#122534`                                  | `#173044`               |
+| `--muted`  | `#697b89`                        | `#65717a`                                  | `#687d8c`               |
+| `--line`   | `#d8dee2`                        | `#d0d5d2`                                  | `#d5dde1`               |
+| `--blue`   | `#527f9f`                        | `#215675`                                  | `#5683a1`               |
+| `--gold`   | `#efc76b`                        | `#ebbf58`                                  | `#efc86d`               |
+| `--accent` | `#7c78a8`                        | —                                          | —                       |
+| `--deep`   | `#102536`                        | —                                          | —                       |
+| `--red`    | —                                | `#a7483f` (chapters only)                  | —                       |
+| `--violet` | —                                | `#6b668f` (review desk only)               | —                       |
 
 Most deltas are a few units per channel — drift, not intent. `--blue` is the
 exception: `#527f9f` vs `#215675` is a visible difference and may be deliberate.
@@ -34,35 +34,36 @@ exception: `#527f9f` vs `#215675` is a visible difference and may be deliberate.
 Do not "just pick one" silently in the middle of another task. This is its own
 reviewed change with visual diffs attached.
 
-## The typography you see is not the typography that was written
+## The typography — fixed 2026-09-05
 
-`styles.css` line 1:
+`styles.css` line 1 used to read:
 
 ```css
-@font-face{font-family:Manrope;src:url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Manrope:wght@400;600;700;800&display=swap')}
+@font-face {
+  font-family: Manrope;
+  src: url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Manrope:wght@400;600;700;800&display=swap');
+}
 ```
 
-`src:` points at a **CSS stylesheet**, not a font file. No browser can load a
-font from that, so:
+`src:` in an `@font-face` must point at a font binary. That URL returns a CSS
+stylesheet, so no browser could load a face from it. For the whole life of the
+site, every `font-family:Manrope,Arial,sans-serif` rendered as **Arial** and
+every `font:… 'DM Mono',monospace` rendered as the **generic monospace** face —
+`'DM Mono'` was never declared as a family at all.
 
-- every `font-family:Manrope,Arial,sans-serif` renders as **Arial**
-- every `font:… 'DM Mono',monospace` renders as the **generic monospace** face
-- there are no `@font-face` blocks anywhere else and zero font files in the repo
-- `scripts/audit-ui.mjs` only rejects external `<link>`/`<script>` tags, so this
-  slipped through the "dependency-free" audit
+**This was escalated and the human chose the real fonts.** Manrope and DM Mono
+are now self-hosted in `public/fonts/`, latin and latin-ext subsets only, under
+the SIL Open Font License. One `fonts.css` serves both trees: Astro links it
+from `BaseLayout.astro`, the legacy root `styles.css` `@import`s it. Self-hosted
+rather than linked from Google because `scripts/audit-ui.mjs` rejects any
+external `<link>`/`<script>`, and because the site is presented in workshop
+rooms with unreliable networks.
 
-**This is a trap for the refactor.** Self-hosting Manrope and DM Mono in Astro
-is the obvious "fix" — and it would change how every page looks, violating
-"maintain the same styles". Treat it as an explicit product decision:
+**This changed how every page renders**, deliberately. It is the one sanctioned
+visual change in the migration. Screenshots taken before 2026-09-05 show Arial
+and are no longer a valid baseline.
 
-- **Keep current rendering**: delete the dead `@font-face`, replace the font
-  stacks with what actually renders today (`Arial, sans-serif` /
-  `ui-monospace, monospace`). Zero visual change. Honest CSS.
-- **Adopt the intended fonts**: self-host the woff2 files in `public/fonts/`,
-  add real `@font-face` with `font-display:swap`. Better-looking, but it is a
-  redesign and needs sign-off plus fresh screenshots.
-
-Default to the first unless a human says otherwise.
+`Georgia, serif` for emphasis (`h1 em`, `.hero em`) is untouched and still real.
 
 ## Type scale
 
@@ -71,13 +72,13 @@ real — it is a system font, so it does render. Keep it.
 
 Sizes are all `clamp()`, roughly:
 
-| Role | Value |
-| --- | --- |
-| Display / `h1` | `clamp(56px,9vw,126px)` |
-| Section `h2` | `clamp(36px,5vw,65px)` |
-| Sub-head | `clamp(24px,3vw,38px)` |
-| Pull-quote | `clamp(22px,3vw,36px)` |
-| Body | `15px/1.6` … `18px` |
+| Role            | Value                                                     |
+| --------------- | --------------------------------------------------------- |
+| Display / `h1`  | `clamp(56px,9vw,126px)`                                   |
+| Section `h2`    | `clamp(36px,5vw,65px)`                                    |
+| Sub-head        | `clamp(24px,3vw,38px)`                                    |
+| Pull-quote      | `clamp(22px,3vw,36px)`                                    |
+| Body            | `15px/1.6` … `18px`                                       |
 | Eyebrow / label | `10–11px` monospace, `letter-spacing:.08–.1em`, uppercase |
 
 There are 14+ distinct clamp triples doing near-identical jobs. Collapse to a
@@ -87,11 +88,12 @@ should be unchanged within a pixel or two at common viewports.
 ## Breakpoints
 
 Sixteen distinct max-widths are in use: 420, 520, 530, 560, 600, 620, 720, 800,
-850, 880, 900, 1000, 1050, 1100 — plus `min-width:1600px` and `min-width:2200px`.
+850, 880, 900, 1000, 1050, 1100 — plus `min-width:1600px` and
+`min-width:2200px`.
 
 Collapse to a named set (suggested: 560 / 800 / 1100 / 1600 / 2200) and prove
-equivalence with screenshots at the *old* breakpoint values, since that is
-where regressions will hide.
+equivalence with screenshots at the _old_ breakpoint values, since that is where
+regressions will hide.
 
 `@media(prefers-reduced-motion:reduce)` is already respected in several
 stylesheets. Keep it — see [`../rules/animation.md`](../rules/animation.md).
@@ -100,8 +102,8 @@ stylesheets. Keep it — see [`../rules/animation.md`](../rules/animation.md).
 
 The visual identity is editorial-print: flat colour blocks, hairline `1px`
 rules, uppercase monospace eyebrows with wide tracking, very tight negative
-letter-spacing on display type (`-.06em` … `-.08em`), grid layouts with `gap:1px`
-over a background colour to fake borders, and near-zero border-radius.
+letter-spacing on display type (`-.06em` … `-.08em`), grid layouts with
+`gap:1px` over a background colour to fake borders, and near-zero border-radius.
 
 That last trick (`gap:1px` + parent background) is used everywhere. It is
 intentional. Do not replace it with `border`.
diff --git a/.stylelintignore b/.stylelintignore
new file mode 100644
index 0000000..d111dd6
--- /dev/null
+++ b/.stylelintignore
@@ -0,0 +1,29 @@
+dist
+node_modules
+hands-on
+public/hands-on
+submitted-skills
+public/submitted-skills
+skill-reviews
+vote-service
+
+# Legacy site sources, slated for deletion at cutover (task 20). Same list and
+# same reasoning as .prettierignore: these are minified, single-line
+# stylesheets. stylelint's `declaration-block-single-line-max-declarations`
+# fires once per rule in them — ~180 errors for `styles.css` alone — so staging
+# one to change a single declaration blocks the commit outright. The rule is
+# about hand-written source readability and says nothing useful about minified
+# output that is about to be deleted.
+#
+# `public/fonts/fonts.css` is deliberately NOT here: it is new, hand-written,
+# and must stay linted.
+#
+# Root-anchored on purpose: a bare `rules` would also swallow .agents/rules/.
+/styles.css
+/landing.css
+/chapters.css
+/responsive.css
+/skills-review/
+/rules/
+/skills/
+/full-guide/
diff --git a/plans/astro-refactor/task-02-tokens.md b/plans/astro-refactor/task-02-tokens.md
index d2781b8..988a2d3 100644
--- a/plans/astro-refactor/task-02-tokens.md
+++ b/plans/astro-refactor/task-02-tokens.md
@@ -50,7 +50,7 @@ walk into.
 
 ## Do not
 
-- Do not add a webfont.
+- Do not add a webfont. **(Reversed 2026-09-05 — see Decisions.)**
 - Do not rename tokens to numeric scales (`--color-neutral-900`).
 - Do not convert the `gap:1px` over a coloured parent trick into `border` — it
   is deliberate house style and appears everywhere.
@@ -60,7 +60,9 @@ walk into.
 - **Palette Consolidation:** The three drifted palettes were canonicalized into
   one. For `--blue`, `#527f9f` (from styles.css) was chosen over `#215675` (from
   chapters.css) to unify the look.
-- **Fonts:** The broken `@font-face` rule pointing to a Google Fonts stylesheet
-  was noted to be deleted in future component tasks. The font stacks will be
-  replaced with `Arial, sans-serif` and `ui-monospace, monospace` to match what
-  has actually been rendering all along. Zero visual change.
+- **Fonts (superseded 2026-09-05):** task 02 recorded "delete the dead rule,
+  fall back to `Arial, sans-serif` / `ui-monospace, monospace`, zero visual
+  change", and deferred even that deletion to "future component tasks", which
+  never picked it up. The human has since chosen the opposite: Manrope and DM
+  Mono are now self-hosted in `public/fonts/` and really render. The "Do not add
+  a webfont" line above no longer applies.
diff --git a/public/fonts/OFL.md b/public/fonts/OFL.md
new file mode 100644
index 0000000..3e9d1e2
--- /dev/null
+++ b/public/fonts/OFL.md
@@ -0,0 +1,14 @@
+# Font licences
+
+Both families here are licensed under the SIL Open Font License, Version 1.1,
+which permits redistribution and self-hosting.
+
+| Family  | Designer                     | Source                                 |
+| ------- | ---------------------------- | -------------------------------------- |
+| Manrope | Mikhail Sharanda             | https://github.com/sharanda/manrope    |
+| DM Mono | Colophon Foundry for Deja Vu | https://github.com/googlefonts/dm-mono |
+
+Full licence text: https://openfontlicense.org/open-font-license-official-text/
+
+The `.woff2` files are the latin and latin-ext subsets as served by Google
+Fonts. They are unmodified.
diff --git a/public/fonts/dm-mono-400-latin-ext.woff2 b/public/fonts/dm-mono-400-latin-ext.woff2
new file mode 100644
index 0000000..9785e91
Binary files /dev/null and b/public/fonts/dm-mono-400-latin-ext.woff2 differ
diff --git a/public/fonts/dm-mono-400-latin.woff2 b/public/fonts/dm-mono-400-latin.woff2
new file mode 100644
index 0000000..03e4859
Binary files /dev/null and b/public/fonts/dm-mono-400-latin.woff2 differ
diff --git a/public/fonts/dm-mono-500-latin-ext.woff2 b/public/fonts/dm-mono-500-latin-ext.woff2
new file mode 100644
index 0000000..b872009
Binary files /dev/null and b/public/fonts/dm-mono-500-latin-ext.woff2 differ
diff --git a/public/fonts/dm-mono-500-latin.woff2 b/public/fonts/dm-mono-500-latin.woff2
new file mode 100644
index 0000000..67698d8
Binary files /dev/null and b/public/fonts/dm-mono-500-latin.woff2 differ
diff --git a/public/fonts/fonts.css b/public/fonts/fonts.css
new file mode 100644
index 0000000..06fcdd0
--- /dev/null
+++ b/public/fonts/fonts.css
@@ -0,0 +1,100 @@
+/* Manrope and DM Mono, self-hosted.
+ *
+ * `styles.css` line 1 used to carry this:
+ *
+ *   @font-face{font-family:Manrope;src:url('https://fonts.googleapis.com/css2?...')}
+ *
+ * `src:` in an @font-face must point at a font binary. That URL returns a CSS
+ * stylesheet, so no browser could ever load a face from it: every
+ * `font-family:Manrope,Arial,sans-serif` fell through to Arial, and 'DM Mono'
+ * was never declared at all, so it fell through to the generic monospace face.
+ * The intended typography has never rendered. This file is the fix.
+ *
+ * Self-hosted rather than linked from fonts.googleapis.com because
+ * `scripts/audit-ui.mjs` rejects any external <link>/<script>, and because the
+ * site is shown in workshop rooms with unreliable networks.
+ *
+ * Both families are SIL Open Font License 1.1 — see OFL.md in this directory.
+ * Subsets are latin and latin-ext only: the site is EN and PT-BR, so the
+ * cyrillic, greek and vietnamese subsets Google also serves are dropped.
+ *
+ * The url()s are relative on purpose. Both consumers resolve them against this
+ * file's own location:
+ *   - Astro pages: <link> in BaseLayout.astro, served from `${base}fonts/`
+ *   - legacy pages: @import at the top of the root `styles.css`
+ */
+
+/* DM Mono 400 — latin */
+@font-face {
+  font-family: 'DM Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('dm-mono-400-latin.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* DM Mono 400 — latin-ext */
+@font-face {
+  font-family: 'DM Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('dm-mono-400-latin-ext.woff2') format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
+
+/* DM Mono 500 — latin */
+@font-face {
+  font-family: 'DM Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('dm-mono-500-latin.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* DM Mono 500 — latin-ext */
+@font-face {
+  font-family: 'DM Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('dm-mono-500-latin-ext.woff2') format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
+
+/* Manrope 400 800 — latin */
+@font-face {
+  font-family: Manrope;
+  font-style: normal;
+  font-weight: 400 800;
+  font-display: swap;
+  src: url('manrope-var-latin.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* Manrope 400 800 — latin-ext */
+@font-face {
+  font-family: Manrope;
+  font-style: normal;
+  font-weight: 400 800;
+  font-display: swap;
+  src: url('manrope-var-latin-ext.woff2') format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
diff --git a/public/fonts/manrope-var-latin-ext.woff2 b/public/fonts/manrope-var-latin-ext.woff2
new file mode 100644
index 0000000..bd24140
Binary files /dev/null and b/public/fonts/manrope-var-latin-ext.woff2 differ
diff --git a/public/fonts/manrope-var-latin.woff2 b/public/fonts/manrope-var-latin.woff2
new file mode 100644
index 0000000..71eb731
Binary files /dev/null and b/public/fonts/manrope-var-latin.woff2 differ
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 7ebe952..54d18e3 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -6,6 +6,11 @@ interface Props {
 }
 
 const { title, description, lang = 'en' } = Astro.props;
+
+// Self-hosted Manrope and DM Mono. Lives in `public/fonts/` rather than the
+// bundled CSS because the legacy stylesheets @import the same file, so there
+// is exactly one copy of the faces. See public/fonts/fonts.css.
+const fonts = `${import.meta.env.BASE_URL}fonts/fonts.css`.replace('//', '/');
 ---
 
 <!doctype html>
@@ -15,6 +20,7 @@ const { title, description, lang = 'en' } = Astro.props;
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>{title}</title>
     <meta name="description" content={description} />
+    <link rel="stylesheet" href={fonts} />
     <slot name="styles" />
   </head>
   <body>
diff --git a/styles.css b/styles.css
index 4009841..557ed32 100644
--- a/styles.css
+++ b/styles.css
@@ -1,2 +1,2 @@
-@font-face{font-family:Manrope;src:url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Manrope:wght@400;600;700;800&display=swap')} :root{--paper:#f5f4f1;--ink:#172f42;--muted:#697b89;--accent:#7c78a8;--blue:#527f9f;--gold:#efc76b;--line:#d8dee2;--deep:#102536}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif}main{padding:28px clamp(24px,6vw,96px) 80px}.topbar,.section-label{display:flex;justify-content:space-between;align-items:center}.brand{color:var(--ink);font-size:12px;font-weight:800;text-decoration:none;text-transform:uppercase}.mark{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:9px;border-radius:50%;color:var(--paper);background:var(--accent)}.edition,.eyebrow,.section-label,.thesis span,.captain span,.workers span,.route-table b,.skill-package>span,.rule span,.callout span,.sources{font:500 10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase}.edition i{display:inline-block;width:6px;height:6px;margin:0 8px;border-radius:50%;background:var(--accent)}.hero{max-width:780px;padding:clamp(75px,12vh,145px) 0 85px}.eyebrow,.section-label,.thesis span{color:var(--accent)}h1{margin:16px 0 24px;font-size:clamp(56px,9vw,126px);line-height:.86;letter-spacing:-.08em}h1 em,h2 em{color:var(--blue);font-family:Georgia,serif;font-weight:400}.lede,.copy>p:last-child,.skills>div:first-child>p:last-child,.worktrees>div:first-child>p,.caption{max-width:570px;color:var(--muted);line-height:1.65}.thesis{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;margin-bottom:110px;padding:28px;background:var(--gold)}.thesis div:first-child{display:grid;gap:16px}.thesis strong{font-size:clamp(24px,4vw,46px);line-height:1.05;letter-spacing:-.04em}.signal{display:flex;align-items:center;gap:10px}.signal i{width:28px;height:28px;border:1px solid var(--ink);background:var(--paper)}.signal i:nth-of-type(3){background:var(--blue)}.signal b{font:500 10px 'DM Mono',monospace}.fleet{margin-bottom:120px}.section-label{padding-bottom:14px;border-bottom:1px solid var(--line)}.section-label span:last-child{color:var(--muted)}.fleet-grid{display:grid;grid-template-columns:.8fr 50px 1.5fr;gap:24px;margin-top:30px;color:var(--paper);background:var(--deep)}.captain{display:grid;align-content:center;gap:16px;padding:32px}.captain span{color:var(--gold)}h2{margin:14px 0 20px;font-size:clamp(36px,5vw,65px);line-height:.98;letter-spacing:-.06em}.captain h2{font-size:clamp(24px,3vw,38px)}.captain code,.workers code{color:var(--gold);font:11px 'DM Mono',monospace}.arrow{display:grid;place-items:center;color:var(--gold);font-size:30px}.workers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#41596b}.workers article{display:grid;align-content:space-between;gap:20px;min-height:180px;padding:22px;background:var(--ink)}.workers span{color:#9eabb4}.workers strong{font-size:16px;line-height:1.2}.caption{margin:22px 0 0 auto}.workflow,.routing,.skills{display:grid;grid-template-columns:.7fr 1fr 1.3fr;gap:40px;align-items:start;margin-bottom:130px;padding-top:80px;border-top:1px solid var(--line)}.phase-tabs{display:grid;gap:8px}.phase-tabs button{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:15px;border:1px solid var(--line);color:var(--ink);background:transparent;font:500 10px 'DM Mono',monospace;letter-spacing:.07em;text-align:left;cursor:pointer}.phase-tabs button b{color:var(--accent)}.phase-tabs button.active{color:var(--paper);border-color:var(--ink);background:var(--ink)}.phase-panel{min-height:260px;padding:30px;color:var(--paper);background:var(--accent)}.phase-meta{display:flex;justify-content:space-between;gap:15px;color:var(--gold);font:500 10px 'DM Mono',monospace}.phase-meta small{color:var(--paper);opacity:.7}.phase-panel h3{margin:44px 0 12px;font-size:clamp(24px,3vw,38px);line-height:1.05}.phase-panel p{line-height:1.6;opacity:.82}.phase-panel code{display:block;margin-top:26px;color:var(--gold);font:11px 'DM Mono',monospace}.handoff{margin-bottom:130px}.handoff table{width:100%;margin-top:30px;border-collapse:collapse;text-align:left}.handoff th,.handoff td{padding:17px 14px;border-bottom:1px solid var(--line)}.handoff thead{color:var(--paper);background:var(--ink);font:500 10px 'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase}.handoff tbody th{color:var(--blue);font:600 14px 'DM Mono',monospace}.handoff td{color:var(--muted);font-size:13px}.worktrees{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center;margin-bottom:130px;padding:45px;color:var(--paper);background:var(--deep)}.worktrees .eyebrow{color:var(--gold)}.worktrees h2{color:var(--paper)}.worktrees h2 em{color:var(--gold)}.worktrees>div:first-child>p{color:#b0bac1}.worktrees pre{margin:32px 0 0;padding:20px;overflow:auto;color:var(--gold);background:var(--ink)}pre code{font:12px/1.75 'DM Mono',monospace}.map{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px;padding-top:90px}.repo{position:absolute;top:0;left:50%;width:180px;padding:17px;transform:translateX(-50%);color:var(--ink);background:var(--gold)}.map>div:not(.repo){min-height:135px;padding:20px;border:1px solid #41596b;background:var(--ink)}.repo span,.map>div:not(.repo) span{display:block;margin-bottom:12px;color:var(--accent);font:500 9px 'DM Mono',monospace}.repo strong,.map>div:not(.repo) strong{display:block;font:14px 'DM Mono',monospace}.repo small,.map>div:not(.repo) small{display:block;margin-top:12px;color:#9eabb4;font-size:11px}.routing{grid-template-columns:.8fr 1.2fr}.route-table{border-top:1px solid var(--line);border-left:1px solid var(--line)}.route-table>div{display:grid;grid-template-columns:.8fr .9fr 1.4fr}.route-table .head{color:var(--paper);background:var(--ink);font:500 10px 'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase}.route-table>div>*{padding:15px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.route-table strong{font-size:14px}.route-table b{color:var(--blue);letter-spacing:0;text-transform:none}.route-table small{color:var(--muted);font-size:12px}.skills{grid-template-columns:.8fr 1fr;margin-bottom:90px}.skill-package{display:grid;align-content:start;color:var(--paper);background:var(--blue)}.skill-package>span{padding:20px;color:var(--gold);border-bottom:1px solid #ffffff40}.skill-package>div{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:17px 20px;border-bottom:1px solid #ffffff40}.skill-package code{font:12px 'DM Mono',monospace}.skill-package small{opacity:.7}.skills>pre{grid-column:2;margin:0;padding:28px;overflow:auto;color:#d8dee2;background:var(--ink)}.rule{display:grid;grid-template-columns:150px 1fr;gap:30px;margin-top:55px;padding-top:22px;border-top:4px solid var(--gold)}.rule strong{max-width:850px;font-size:clamp(24px,3.3vw,42px);line-height:1.12}.callout{display:grid;grid-template-columns:150px 1fr;gap:30px;margin-top:70px;padding:27px;background:var(--gold)}.callout strong{max-width:850px;font-size:clamp(22px,3vw,36px);line-height:1.1}.sources{margin-top:90px;color:var(--muted)}.sources p{color:var(--muted);font:13px/1.6 Manrope,Arial,sans-serif;letter-spacing:0;text-transform:none}.sources a{color:var(--blue);font-weight:700}@media(max-width:800px){.thesis,.fleet-grid,.workflow,.worktrees,.routing,.skills{grid-template-columns:1fr}.arrow{transform:rotate(90deg);min-height:35px}.workers{grid-template-columns:1fr}.skills>pre{grid-column:auto}.route-table,.handoff{overflow-x:auto}.route-table>div{min-width:620px}.handoff table{min-width:650px}.rule,.callout{grid-template-columns:1fr}}@media(max-width:600px){.edition{display:none}.worktrees{padding:24px}.map{grid-template-columns:1fr;padding-top:90px}}
+@import url('public/fonts/fonts.css'); :root{--paper:#f5f4f1;--ink:#172f42;--muted:#697b89;--accent:#7c78a8;--blue:#527f9f;--gold:#efc76b;--line:#d8dee2;--deep:#102536}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif}main{padding:28px clamp(24px,6vw,96px) 80px}.topbar,.section-label{display:flex;justify-content:space-between;align-items:center}.brand{color:var(--ink);font-size:12px;font-weight:800;text-decoration:none;text-transform:uppercase}.mark{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:9px;border-radius:50%;color:var(--paper);background:var(--accent)}.edition,.eyebrow,.section-label,.thesis span,.captain span,.workers span,.route-table b,.skill-package>span,.rule span,.callout span,.sources{font:500 10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase}.edition i{display:inline-block;width:6px;height:6px;margin:0 8px;border-radius:50%;background:var(--accent)}.hero{max-width:780px;padding:clamp(75px,12vh,145px) 0 85px}.eyebrow,.section-label,.thesis span{color:var(--accent)}h1{margin:16px 0 24px;font-size:clamp(56px,9vw,126px);line-height:.86;letter-spacing:-.08em}h1 em,h2 em{color:var(--blue);font-family:Georgia,serif;font-weight:400}.lede,.copy>p:last-child,.skills>div:first-child>p:last-child,.worktrees>div:first-child>p,.caption{max-width:570px;color:var(--muted);line-height:1.65}.thesis{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;margin-bottom:110px;padding:28px;background:var(--gold)}.thesis div:first-child{display:grid;gap:16px}.thesis strong{font-size:clamp(24px,4vw,46px);line-height:1.05;letter-spacing:-.04em}.signal{display:flex;align-items:center;gap:10px}.signal i{width:28px;height:28px;border:1px solid var(--ink);background:var(--paper)}.signal i:nth-of-type(3){background:var(--blue)}.signal b{font:500 10px 'DM Mono',monospace}.fleet{margin-bottom:120px}.section-label{padding-bottom:14px;border-bottom:1px solid var(--line)}.section-label span:last-child{color:var(--muted)}.fleet-grid{display:grid;grid-template-columns:.8fr 50px 1.5fr;gap:24px;margin-top:30px;color:var(--paper);background:var(--deep)}.captain{display:grid;align-content:center;gap:16px;padding:32px}.captain span{color:var(--gold)}h2{margin:14px 0 20px;font-size:clamp(36px,5vw,65px);line-height:.98;letter-spacing:-.06em}.captain h2{font-size:clamp(24px,3vw,38px)}.captain code,.workers code{color:var(--gold);font:11px 'DM Mono',monospace}.arrow{display:grid;place-items:center;color:var(--gold);font-size:30px}.workers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#41596b}.workers article{display:grid;align-content:space-between;gap:20px;min-height:180px;padding:22px;background:var(--ink)}.workers span{color:#9eabb4}.workers strong{font-size:16px;line-height:1.2}.caption{margin:22px 0 0 auto}.workflow,.routing,.skills{display:grid;grid-template-columns:.7fr 1fr 1.3fr;gap:40px;align-items:start;margin-bottom:130px;padding-top:80px;border-top:1px solid var(--line)}.phase-tabs{display:grid;gap:8px}.phase-tabs button{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:15px;border:1px solid var(--line);color:var(--ink);background:transparent;font:500 10px 'DM Mono',monospace;letter-spacing:.07em;text-align:left;cursor:pointer}.phase-tabs button b{color:var(--accent)}.phase-tabs button.active{color:var(--paper);border-color:var(--ink);background:var(--ink)}.phase-panel{min-height:260px;padding:30px;color:var(--paper);background:var(--accent)}.phase-meta{display:flex;justify-content:space-between;gap:15px;color:var(--gold);font:500 10px 'DM Mono',monospace}.phase-meta small{color:var(--paper);opacity:.7}.phase-panel h3{margin:44px 0 12px;font-size:clamp(24px,3vw,38px);line-height:1.05}.phase-panel p{line-height:1.6;opacity:.82}.phase-panel code{display:block;margin-top:26px;color:var(--gold);font:11px 'DM Mono',monospace}.handoff{margin-bottom:130px}.handoff table{width:100%;margin-top:30px;border-collapse:collapse;text-align:left}.handoff th,.handoff td{padding:17px 14px;border-bottom:1px solid var(--line)}.handoff thead{color:var(--paper);background:var(--ink);font:500 10px 'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase}.handoff tbody th{color:var(--blue);font:600 14px 'DM Mono',monospace}.handoff td{color:var(--muted);font-size:13px}.worktrees{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center;margin-bottom:130px;padding:45px;color:var(--paper);background:var(--deep)}.worktrees .eyebrow{color:var(--gold)}.worktrees h2{color:var(--paper)}.worktrees h2 em{color:var(--gold)}.worktrees>div:first-child>p{color:#b0bac1}.worktrees pre{margin:32px 0 0;padding:20px;overflow:auto;color:var(--gold);background:var(--ink)}pre code{font:12px/1.75 'DM Mono',monospace}.map{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px;padding-top:90px}.repo{position:absolute;top:0;left:50%;width:180px;padding:17px;transform:translateX(-50%);color:var(--ink);background:var(--gold)}.map>div:not(.repo){min-height:135px;padding:20px;border:1px solid #41596b;background:var(--ink)}.repo span,.map>div:not(.repo) span{display:block;margin-bottom:12px;color:var(--accent);font:500 9px 'DM Mono',monospace}.repo strong,.map>div:not(.repo) strong{display:block;font:14px 'DM Mono',monospace}.repo small,.map>div:not(.repo) small{display:block;margin-top:12px;color:#9eabb4;font-size:11px}.routing{grid-template-columns:.8fr 1.2fr}.route-table{border-top:1px solid var(--line);border-left:1px solid var(--line)}.route-table>div{display:grid;grid-template-columns:.8fr .9fr 1.4fr}.route-table .head{color:var(--paper);background:var(--ink);font:500 10px 'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase}.route-table>div>*{padding:15px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.route-table strong{font-size:14px}.route-table b{color:var(--blue);letter-spacing:0;text-transform:none}.route-table small{color:var(--muted);font-size:12px}.skills{grid-template-columns:.8fr 1fr;margin-bottom:90px}.skill-package{display:grid;align-content:start;color:var(--paper);background:var(--blue)}.skill-package>span{padding:20px;color:var(--gold);border-bottom:1px solid #ffffff40}.skill-package>div{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:17px 20px;border-bottom:1px solid #ffffff40}.skill-package code{font:12px 'DM Mono',monospace}.skill-package small{opacity:.7}.skills>pre{grid-column:2;margin:0;padding:28px;overflow:auto;color:#d8dee2;background:var(--ink)}.rule{display:grid;grid-template-columns:150px 1fr;gap:30px;margin-top:55px;padding-top:22px;border-top:4px solid var(--gold)}.rule strong{max-width:850px;font-size:clamp(24px,3.3vw,42px);line-height:1.12}.callout{display:grid;grid-template-columns:150px 1fr;gap:30px;margin-top:70px;padding:27px;background:var(--gold)}.callout strong{max-width:850px;font-size:clamp(22px,3vw,36px);line-height:1.1}.sources{margin-top:90px;color:var(--muted)}.sources p{color:var(--muted);font:13px/1.6 Manrope,Arial,sans-serif;letter-spacing:0;text-transform:none}.sources a{color:var(--blue);font-weight:700}@media(max-width:800px){.thesis,.fleet-grid,.workflow,.worktrees,.routing,.skills{grid-template-columns:1fr}.arrow{transform:rotate(90deg);min-height:35px}.workers{grid-template-columns:1fr}.skills>pre{grid-column:auto}.route-table,.handoff{overflow-x:auto}.route-table>div{min-width:620px}.handoff table{min-width:650px}.rule,.callout{grid-template-columns:1fr}}@media(max-width:600px){.edition{display:none}.worktrees{padding:24px}.map{grid-template-columns:1fr;padding-top:90px}}
 main{max-width:1840px;margin-inline:auto}.reading-progress{position:fixed;inset:0 0 auto;z-index:20;height:3px;background:transparent}.reading-progress span{display:block;width:0;height:100%;background:var(--gold);transition:width .15s ease}.chapter-links{display:flex;gap:22px;margin-left:auto;margin-right:32px}.chapter-links a{color:var(--muted);font:500 10px 'DM Mono',monospace;letter-spacing:.08em;text-decoration:none;text-transform:uppercase}.chapter-links a:hover{color:var(--ink)}.hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:80px;align-items:end}.hero-index{display:grid;gap:14px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.hero-index span,.hero-index small{color:var(--muted);font:500 10px 'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase}.hero-index strong{font-size:clamp(27px,3vw,48px);line-height:.95;letter-spacing:-.06em}.hero-index em{color:var(--accent);font-family:Georgia,serif;font-weight:400}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr) 1.6fr;gap:1px;margin:0 0 110px;background:var(--line);border-top:1px solid var(--line);border-left:1px solid var(--line)}.hero-stats div,.hero-stats p{min-height:110px;margin:0;padding:20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}.hero-stats div{display:flex;align-items:center;gap:16px}.hero-stats strong{font:500 34px 'DM Mono',monospace;color:var(--blue)}.hero-stats span{color:var(--muted);font:500 10px/1.4 'DM Mono',monospace;letter-spacing:.06em;text-transform:uppercase}.hero-stats p{display:grid;place-items:center;color:var(--muted);font-size:13px;line-height:1.5;text-align:center}.failure-map{margin-bottom:130px;padding-top:80px;border-top:1px solid var(--line)}.failure-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:30px;background:var(--line);border-left:1px solid var(--line)}.failure-grid article{min-height:220px;padding:24px;background:var(--paper);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.failure-grid span{color:var(--accent);font:500 11px 'DM Mono',monospace}.failure-grid strong{display:block;margin:52px 0 12px;font-size:22px}.failure-grid p{max-width:300px;margin:0;color:var(--muted);font-size:13px;line-height:1.6}.skill-principles{display:grid;gap:10px;margin-top:30px;color:var(--blue);font:500 10px 'DM Mono',monospace;letter-spacing:.06em;text-transform:uppercase}.skill-principles span{color:var(--blue)}@media(min-width:2200px){main{max-width:1960px}.hero{grid-template-columns:minmax(0,1fr) 380px}.hero h1{font-size:clamp(100px,7vw,160px)}body{font-size:18px}}@media(max-width:800px){.chapter-links{display:none}.hero{display:block}.hero-index{max-width:300px;margin-top:50px}.hero-stats{grid-template-columns:1fr 1fr;margin-bottom:80px}.hero-stats p{grid-column:1/-1}.failure-grid{grid-template-columns:1fr}.failure-grid article{min-height:0}.failure-grid strong{margin-top:30px}}