Gives the UI a more technical, purpose-built feel by rendering data
values in DM Mono instead of the body font. Applied to health ring
center numbers, resource count badges, metrics chart values/axes,
and cluster health card breakdowns.

Introduces a cohesive design token system and centralized component
classes across the entire UI.

Design tokens (packages/k8s-ui/src/theme/variables.css):
- Brand color tokens (--color-brand, --color-brand-light)
- Selection tokens (--selection-bg, --selection-border, --selection-text)
- Shadow tokens (--shadow-drawer, --shadow-card, --shadow-lg)
- Background hierarchy: base (chrome) / surface (panels) / elevated (inputs, badges)
- Blue-tinted cool neutrals in light mode for subtle palette cohesion

Centralized component CSS (packages/k8s-ui/src/theme/components.css):
- New shared file with all component classes in @layer components
- .badge / .badge-sm with 0.5px hairline borders (retina-friendly)
- .btn-brand / .btn-brand-muted / .btn-brand-toggle
- .card-inner / .card-inner-lg with 0.5px borders
- .selection / .selection-strong / .selection-text / .selection-ring
- .dialog, .status-*, .border-*-subtle (all 0.5px), .table-divide-subtle
- Exported from k8s-ui package so koala-frontend can import without Radar's index.css

Badge.tsx — single source of truth for badge color strings (static
strings required for Tailwind class scanning). badge-colors.ts now
re-exports from Badge.tsx, removing ~200 lines of ad-hoc definitions.

Other changes:
- HealthRing rewritten as 270° arc gauge with SVG glow filter
- Uppercase tracking on section labels, editorial typography hierarchy
- Brand accent replaces cold blue-500 across sidebar, table, topology,
  workload tabs, and drawer resize handle
- Header uses bg-theme-base chrome layer with backdrop-blur
- Toolbar and table column headers use bg-theme-base for clear zone separation
- Topology node borders reduced to 0.5px hairlines
- vite.config.ts: RADAR_PORT env override for backend proxy target