feat(blocks): extract six full-guide block components

PhasePanel, FleetDiagram, HandoffTable, WorktreeMap, RouteTable,
SkillPackage as static shells. Each takes typed props and renders
server-side markup with the data-* hooks verified by scripts/verify.mjs
(data-phase, data-tree, data-worker, data-route, data-skill-file). No
client:* directives; interactive islands wire up in task 15.

Tokens only. No raw hex or px font sizes (check-tokens passes). The
parent-background seam colour for the gap:1px grid trick in
FleetDiagram is a documented token gap; see component header comment
and the task final report.

src/components/blocks/HandoffTable.astro

@@ -0,0 +1,90 @@
+---
+// HandoffTable — the four-row "what crosses contexts" table.
+//
+// Static shell: the row data is passed in via `rows` so this component has
+// no opinion on what each handoff package contains. The table structure is
+// the load-bearing part of the design (dark header, blue row labels,
+// muted body) and lives here so the next page that needs it gets the same
+// beat for free.
+
+interface Row {
+  /** The package name, rendered as a `<th>` (column 1). */
+  package: string;
+  /** What the package contains (column 2). */
+  contains: string;
+  /** Why this matters (column 3). */
+  why: string;
+}
+
+interface Props {
+  /** Column headers in render order. */
+  columns: [string, string, string];
+  rows: Row[];
+}
+
+const { columns, rows } = Astro.props;
+---
+
+<table class="handoff-table">
+  <thead>
+    <tr>
+      <th>{columns[0]}</th>
+      <th>{columns[1]}</th>
+      <th>{columns[2]}</th>
+    </tr>
+  </thead>
+  <tbody>
+    {
+      rows.map((row) => (
+        <tr>
+          <th scope="row">{row.package}</th>
+          <td>{row.contains}</td>
+          <td>{row.why}</td>
+        </tr>
+      ))
+    }
+  </tbody>
+</table>
+
+<style>
+  .handoff-table {
+    width: 100%;
+    margin-top: 30px;
+    border-collapse: collapse;
+    text-align: left;
+  }
+  .handoff-table th,
+  .handoff-table td {
+    padding: 17px 14px;
+    border-bottom: 1px solid var(--line);
+  }
+  .handoff-table thead {
+    color: var(--paper);
+    background: var(--ink);
+    font:
+      500 var(--step-0) 'DM Mono',
+      monospace;
+    letter-spacing: 0.08em;
+    text-transform: uppercase;
+  }
+  .handoff-table tbody th {
+    color: var(--blue);
+    font:
+      600 14px 'DM Mono',
+      monospace;
+  }
+  .handoff-table td {
+    color: var(--muted);
+    font-size: var(--step-1);
+  }
+
+  @media (max-width: 800px) {
+    .handoff-table {
+      display: block;
+      overflow-x: auto;
+    }
+    .handoff-table {
+      min-width: 650px;
+    }
+  }
+</style>