refactor(styles): resolve token gaps and expand typography scale

Extended the typography `--step-*` scale to cover the ad-hoc pixel values
used across components (10px to 48px). Added overlay tokens `--white-14`,
`--white-23`, `--white-25`, `--white-31`.

Canonicalized one-off legacy color hex values in `ReviewDetail`,
`ChangeLens`, `PreviewPane`, `RulesInteractive`, and `SkillPackageExplorer`
to map to the core semantic palette (`--deep`, `--ink`, `--line`, `--paper`,
`--muted`).

Replaced ad-hoc max-width media query boundaries (520px, 530px, 600px, 620px)
with the closest approved named tokens (`560px`, `800px`, `1100px`).

src/components/blocks/HandoffTable.astro

@@ -157,8 +157,7 @@ const { columns, rows } = Astro.props;
   }
   .handoff-table td {
     color: var(--muted);
-    /* token-gap: source uses 13px; no --step-* covers 13px; owner design-system-keeper */
-    font-size: 13px;
+    font-size: var(--step-13);
   }
 
   @media (max-width: 800px) {