[NewWorldVenture]

A11Y-001: these are the last two findings from the light-theme axe sweep of a seeded local household. The sweep ran on main 322c632 with #1005, #1006 and #1007 applied, at 1280 px. Each finding is a count badge that sits on a tint stacked on top of its tab's own tint.

Where	Defect	Fix
To-dos tabs	The active tab is bg-brand/15. Its count added bg-brand/25 on top, so brand-text sat on about 36% brand: 3.89:1 (axe).	The count is solid bg-brand with text-brand-fg (white on brand). The inactive count, bg-elevated text-muted, is unchanged.
Photos tabs	The favourites count was bg-fg/10 inside the tab. Inactive, its --muted text read 4.20:1 on the light page (axe: 4.39 on the sweep's ground). With Favourites active (bg-brand/20, brand-text), it read 4.05 light and 3.82 dark.	The count has no tint of its own, so it reads exactly like the tab's label.

I first tried halving the photos tint to bg-fg/5. That fixed the inactive tab but left the active one at 4.47 (light, over --bg) and 4.42 (dark, over --elevated), so I dropped the tint instead.

Tests

tests/a-tab-count-is-readable.test.ts:

• It reads the tab states (.tab-item-active and .tab-item-inactive, including its hover:) from globals.css and the tokens of both themes.
• It composes each state over --bg, --surface and --elevated, the way the browser does: 8-bit steps, tint over ground.
• Non-vacuity: it finds the active tab's tint (brand at 20%) and the inactive text (muted).
• Control: the old bg-fg/10 count on the active tab, over its worst ground, is under 4.5 in both themes.

Check	main 14b1deb	This branch a4c17c1
The new test	2/2 fail	2/2 pass
The 19 suites naming the two modules, plus the new test	—	378/378
tsc / eslint on the changed files	—	0 / the same 4 warnings as main (photos lines 403 and 463, untouched)

The axe figures are from local production builds, measured by me and not committed. The before-and-after contrast figures are the test's arithmetic.

For you to decide (not changed here)

At 390 px the same sweep reports white text on bg-brand/90 on the renewals, referrals and wallet "babysitters" pages. That is a primary button, hovered under the pointer when axe sampled it. The hover state is hover:bg-brand/90 in components/ui/button.tsx, plus a few raw copies. Over the light page it reads below 4.5:1. Fixing it means changing the shared button, which I have left alone, so it is your call. One option is a darker hover (--brand-text) instead of a lighter one.

No migration, configuration or dependency change.

🤖 Generated with Claude Code

https://claude.ai/code/session_01TRY21ZKsFrfB3qtoP972A4

---

Generated by Claude Code

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated
bubaly	Ignored		Oct 11, 2026 7:05am UTC