# Task 09 — Chapter blocks

**Agent**: `component-builder` · **Model**: MiniMax-M3 **Depends on**: 07 ·
**Parallel with**: 08, 10, 11 · **Blocks**: 13, 14 **Worktree**:
`.agents/scripts/worktree.sh start 09 chapter-blocks`

## Goal

The shared furniture of `/models/`, `/agents/`, `/skills/`, `/summary/`,
`/rules/` — five pages that today duplicate the same markup five times.

## Scope

`src/components/blocks/` — `ChapterHero.astro`, `SectionGrid.astro`,
`ComparisonTable.astro`, `TopBar.astro`, `SiteFooter.astro`.
`src/layouts/ChapterLayout.astro`.

## Source

`chapters.css` is already the shared layer; the duplication is in the five HTML
files. Diff them against each other first — what differs is props, what matches
is the component.

## Watch for

- `TopBar` carries `aria-current="page"`. Preserve it; it is the only indication
  of location for assistive tech.
- The tables in `/models/` and `/rules/` scroll horizontally on narrow screens
  (`overflow-x:auto`, `min-width` on the inner element). Keep that — dropping it
  makes the tables unreadable on a phone, and `audit-ui.mjs` asserts related
  responsive tokens.

## Done when

- [ ] All five pages' markup expressible with these components
- [ ] Rendered text identical to current pages
- [ ] Zero JS
- [ ] Checklist complete; `pnpm run gate` green