UI/UX: Audit dark-theme token overrides for surface, card, and border consistency

[Baskarayelu]

Description

ThemeToggle.tsx sets data-theme and docs/dark-mode.md exists, but pages mix canonical --credence-* tokens (Bond) with legacy aliases like --bg-page/--bg-card/--border-default (Home, TrustScore, Layout). If dark-theme overrides only target one set, surfaces will diverge in dark mode (e.g. cards that don't darken, borders that vanish). We need an audit of the dark-theme override block in src/index.css to ensure every surface/text/border token used by components flips correctly.

Requirements and context

• UI/UX scope only — token override audit and fixes.
• Reference src/index.css (:root and [data-theme="dark"] blocks) and docs/dark-mode.md.
• Enumerate every token consumed by components/pages and confirm a dark override exists.
• Fix gaps so legacy aliases resolve to dark values.

Suggested execution

• Branch: uiux/dark-theme-audit.
• Update the dark-theme block in src/index.css; record a coverage table.
• Deliver: token coverage matrix (token × has-dark-override) and screenshots of each page in dark mode.

Test and commit

• Visual QA at 375px and 1280px in dark mode across all pages.
• npm run build and npm run lint pass.
• a11y checks: text/border contrast holds in dark mode.

Example commit message

fix(uiux): close dark-theme token override gaps for surfaces and borders

Guidelines

• Clear documentation of the token coverage matrix.
• Design consistency between canonical and legacy aliases.
• Timeframe: 96 hours