[design] Dark-mode palette usage guide + WCAG AA contrast audit

[ozpool]

Context

Formal contrast audit + usage rules. Prevents spectrum accents landing on low-contrast surfaces.

Ref: PRISM_PRD_v1.0.html §intro (dark palette).

Scope

In scope:

• Contrast matrix for every text-on-bg combination
• Usage guide for accents (primary action, success, warning, error)
• Figma auto-layout examples of compliant combos

Out of scope:

• Light-mode palette (v1 is dark-only)

Acceptance Criteria

• All primary body-text combos ≥ 4.5:1
• All large-text combos ≥ 3:1
• Figma file shared with edit access
• All defined states covered (empty, loading, success, error, pending, disconnected)
• Mobile + desktop frames (320 / 768 / 1280)
• Dark mode only; WCAG AA contrast
• Handoff doc: tokens, spacing, type scale

Dependencies

• Blocks: [design] Component library (shadcn-aligned): buttons, inputs, cards, modals, toasts #4, [design] Marketing landing page: hero + refraction narrative + features + CTA + footer #5, [design] Vault list page layout + card states (empty/loading/error/active) #6, [design] Vault detail + PrismVisual: tick-range distribution visualization #7, [design] Deposit + withdraw flow: all tx states (idle/pending/success/error/wrong-network) #8
• Blocked by: [design] Brand tokens: PRISM spectrum palette + type scale + spacing + radii + shadows #1

References

• WCAG 2.2 AA guidelines

Estimate

S