docs: 15e attempt 4 ported the rules where they cannot win

The 880px and 1050px media queries are in the built sheet and inert:
Astro's scoped `.tree-node[data-astro-cid-...]` outranks a rule ported
verbatim as `.tree-node`. Attempt 4 got everything else right and passed
the acceptance test in this brief, which was mine to get wrong.

Replaces that test with computed-style-diff.mjs, and records the finding
it produced: main is already at 52 differences, because importing a global
responsive.css into an Astro page never fully worked either.

Tagged rejected/15e-attempt-4.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

plans/astro-refactor/task-15e-responsive-css.md

@@ -196,3 +196,66 @@ diff <(grep -oh '(max\|min)-width:[0-9]*px' responsive.css | sort -u) \
 
 Anything only the legacy page needs may be missing from the built sheet — say
 which, and why, in the final report.
+
+## Attempt 4 rejected: the ported rules are in the sheet and do nothing
+
+Tagged `rejected/15e-attempt-4` (`b6b6200`). This attempt fixed everything
+attempt 3 got wrong — the 880px and 1050px media queries are ported, the tokens
+are named for their roles rather than their hex values, `--white-31` is
+untouched, `responsive.css` is unchanged and still linked by
+`full-guide/index.html`, no `.astro` file imports it, the route-meter is
+`transform: scaleY()`, the four off-scale breakpoints carry honest token-gap
+markers, no screenshots were committed, and the gate passes with 84 assertions.
+The acceptance test in this brief passes on it.
+
+**It is still wrong, and the acceptance test was the problem.**
+
+Astro scopes a component's styles. `WorktreeMap.astro`'s rules compile to
+`.tree-node[data-astro-cid-lsutp3lb] { width: 180px }`, specificity 0,2,0. A
+rule ported verbatim out of `responsive.css` arrives as
+`@media (max-width: 1050px) { .tree-node { width: 145px } }`, specificity 0,1,0.
+The breakpoint is in the built sheet, the media query matches, the selector
+matches — and the declaration loses. At 1050px the node stays 180px wide.
+Measured:
+
+```
+node .agents/scripts/computed-style-diff.mjs full-guide --widths 880,1050
+```
+
+56 differences on attempt 4. Diffing breakpoints between `responsive.css` and
+`dist/_astro/*.css` cannot see any of it, which is my error, not the agent's: I
+wrote that test.
+
+**Port rules into the component that owns the selector**, so they compile with
+the same scope as the base rule they are overriding. A rule that has no owning
+component belongs in a global sheet, but then the base rule it overrides has to
+be global too.
+
+### The baseline is not zero, and that is the real finding
+
+The same command reports **52 differences on `main`**, before this task changes
+anything. `full-guide.astro` currently imports `responsive.css`, and that import
+has never fully worked, for the identical reason: a global stylesheet cannot
+override scoped component styles. The responsive layer has been partly inert in
+the Astro build for as long as it has been imported, on `.tree-node`, `.branch`,
+`.worker-card`, `.tree-stage`, `.tree-lab`, `.hero`, `.fleet`, `.chapter-links`
+and more.
+
+So this task is not "keep parity". Parity is already broken, and porting the
+rules properly is what fixes it.
+
+### Acceptance, restated again
+
+```
+node .agents/scripts/computed-style-diff.mjs full-guide
+```
+
+- Must report **fewer than 52** differences at 880px and 1050px — that is the
+  `main` baseline, and anything above it is a regression.
+- Drive it to **zero** where you can. Every difference you leave must be listed
+  in your final report with the reason it is not fixable inside this task's
+  scope.
+- Keep everything attempt 4 got right; the list above is not a set of problems,
+  it is the standard to match.
+- The breakpoint diff against the built CSS stays as a _necessary_ check. It is
+  no longer a _sufficient_ one.