Epic: Mobile Dashboard Visual Polish & Bug Fixes

Problem Statement

Mobile screenshots of the live dashboard reveal 2 confirmed bugs and 2 polish opportunities that degrade the mobile experience. These are visual regressions and omissions from the initial dashboard implementation — all discoverable from careful screenshot analysis.

Child Issues

Implementation Order

Issues are ordered by priority. Each issue is implemented, screenshot-verified, tested, PR'd, CI-green (all checks), and merged before the next begins.

Audit Findings (from mobile screenshots)

Confirmed Bugs

1. Double arrow "View history → →" (RecentlyViewed.tsx line 62-66)

   • i18n value "View history →" includes text arrow
   • JSX also renders <ArrowRight> icon → produces double arrow
   • Same pattern inconsistency across 4 dashboard links (viewHistory, viewAll, tipLearnMore, quickWinViewSwap) — each uses a different arrow convention

2. Categories first item clipped (CategoriesBrowse.tsx)

   • scroll-fade-x CSS mask fades first 1.5rem to transparent
   • <ul> has no left padding → first chip starts inside the fade zone
   • "Baby Food" appears as "y Food" on mobile

Polish Issues

3. Distribution bar hard color transitions (HealthSummary.tsx)

   • Container has rounded-full but child segments have no border-radius
   • First and last segments show hard corners at the bar edges

4. Page-map gap (page-map.ts line 73)

   • Dashboard entry patterns don't include src/components/dashboard/
   • Component changes don't trigger PR screenshots

NOT a Bug (Verified)

• ScoreGauge score={100 - avgTryVit} — double-inversion correctly passes unhealthiness value (avgTryVit is already inverted from avgUnhealthiness; 100 - avgTryVit = avgUnhealthiness, which is what ScoreGauge expects per JSDoc)

Scope

• Components affected: RecentlyViewed, CategoriesBrowse, HealthSummary, NutritionTip
• Files changed (estimated): ~12 (4 components + 3 i18n + 3 tests + 1 page-map + 1 globals.css review)
• Tests added/updated: ~8-12 new assertions
• Screenshot verification: After each PR via RUN_PR_SCREENSHOTS.ps1