v5 polish wave · Wave 4 verification report

Date: 2026-05-21 Closes: AUD-21-N07 (mobile parity) + AUD-21-N08 (focus rings + contrast) from atlas/website/briefings/v5/design_handoff_audit_AUD-2026-05-21/

Verdict: 🟢 GREEN — site closes the v5 polish audit clean

• AUD-21-N07 Mobile parity verified at the 10 surfaces the audit nominates · 9 of 10 land per spec · 1 documented intentional divergence
• AUD-21-N08 Focus-ring sweep: 25 of 25 per-component box-shadow: var(--focus-ring) overrides updated to the v5 spec (outline: 2px solid var(--panta-blue-700) + outline-offset: 2px). Contrast spot-checks pass at expected ratios

AUD-21-N07 · Mobile parity (10-surface check at 390–500 viewport)

Verified live via Chrome DevTools against production. Surface results:

Documented divergence — World readout single-column on mobile

The audit’s mock specifies a 2×2 grid for the world-readout cards at mobile. The current CSS gives 2-col at tablet ($bp-collapse) → 1-col at mobile ($bp-stack). At a 390px iPhone-class viewport, each card would be ~173px wide if 2×2, which is too narrow for the E0/E1/E2/E3 italic glyph + mono stratum label + 50-character description to read comfortably without crowding.

The single-column collapse is intentional and reads better at that width. The audit acknowledged this risk in its own copy:

Most likely candidate: the marquee 0 sorry cell may dominate a 2×2 grid in a way that doesn’t read on the small viewport. Tweak if needed.

The same rationale applies to the world readout. No code change. The 2×2 grid resumes at tablet width (≥ 760px). If a future audit wants 2×2 at 390px specifically, we’d need to bump the card padding down + shrink the description line — both would compromise legibility.

AUD-21-N08 · Focus rings + contrast

Focus rings — sweep + verification

Pre-W4 state: the v5 AUD-29 work (PR #241) globalised the new focus-visible spec on _sass/_base.scss:

a:focus-visible, button:focus-visible, … {
  outline: 2px solid var(--panta-blue-700);
  outline-offset: 2px;
  border-radius: 4px;
  box-shadow: none;
}

But 25 per-component :focus-visible blocks across 7 SCSS partials still applied the legacy v4 pattern:

&:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);   /* soft 3px halo */
}

These per-component rules overrode the global, so keyboard users saw the v4 soft halo on the nav, faq, page-tools, search, sitemap, and prior-art components — never the sharp v5 outline the audit asked for.

W4 fix: swept every per-component override across _sass/_components.scss, _sass/_content.scss, _sass/_faq.scss, _sass/_header.scss, _sass/_page-tools.scss, _sass/_prior-art.scss, _sass/_search.scss, and _sass/_sitemap.scss — 25 total replacements:

&:focus-visible {
  outline: 2px solid var(--panta-blue-700);
  outline-offset: 2px;
}

After the sweep:

• Every focusable element across the entire site renders the v5 spec on keyboard focus
• The legacy --focus-ring token stays declared in _sass/_variables.scss for any third-party shadow root that still references it (defensive — no consumer left in our own SCSS)

Contrast

Spot-checked the contrast risk surfaces the audit specifically names:

All four spot-checks pass AA comfortably. No 12px bump needed.

Summary

Final v5-polish-wave status: 12 of 12 audit items closed across 4 waves.