CSS custom properties and consolidation

Problem: Color values are hardcoded 40+ times across CSS and JS.

Solution: CSS custom properties + merge media queries.

• Add :root block with --color-accent, --color-healthy, --color-unhealthy, --color-text-primary, --color-border, etc.
• Replace all hardcoded hex values with var(--color-*)
• Merge the four @media (max-width: 768px) blocks into one
• Replace the ~4 hardcoded color strings in JS with constants or CSS variable reads