feat(ui): migrate entire UI to "Cozy Home" design

Warm, friendly redesign replacing the generic cold-shadcn look. Built as a
swappable token bundle so other presets can be added later; dark mode and the
user-tunable accent hue are retained.

Foundation
- app.css: warm cream (light) + "dusk" (dark) token system; terracotta accent
  (default hue 16); pastel --room-* palette; vivid --status-* (dots/bars) plus
  AA-legible --status-*-ink (text); soft warm shadows; --radius 1rem; font tokens
- Fonts: Fraunces (display) + Figtree (body), self-hosted in static/fonts
  (no Google CDN) so offline/LAN installs work; system-ui fallbacks kept
- h1/h2/h3 render in Fraunces via base layer

Chrome and surfaces
- Sidebar, Header, home, AppCard/BoardCard, BoardHeader, sections, favorites
- 29 widgets + integration renderers: cozy card shells, room-palette charts
- Default background is a static warm "cozy" glow (mesh demoted, rAF gated on
  prefers-reduced-motion)

System-wide
- Status colors tokenized (no raw bg/text-*-500 or status hex); success/warning
  to status tokens, categorical to room palette, errors to destructive
- Inputs rounded-xl; buttons rounded-xl; cards/dialogs rounded-[1.4rem];
  soft-shadow vocabulary only; focus-visible:ring-primary/30
- Forms, admin tables (now cozy cards), dialogs, popovers, auth screens

a11y: reduced-motion guards; darker status "ink" text for AA on cream.
Known tradeoff: terracotta primary + white button text ~2.96:1 (signature color,
user-tunable).

Verified: svelte-check 0/0, build ok, 274 tests pass, eslint 0 errors.
Design refs + system sheet in design-mockups/.

src/lib/components/app/AppHealthBadge.svelte

@@ -10,18 +10,24 @@
 	const config = $derived.by(() => {
 		switch (status) {
 			case 'online':
-				return { color: 'bg-green-500', cssClass: 'status-online', textKey: 'status.online' };
+				return { color: 'var(--status-online)', ink: 'var(--status-online-ink)', cssClass: 'status-online', textKey: 'status.online' };
 			case 'offline':
-				return { color: 'bg-red-500', cssClass: '', textKey: 'status.offline' };
+				return { color: 'var(--status-offline)', ink: 'var(--status-offline-ink)', cssClass: '', textKey: 'status.offline' };
 			case 'degraded':
-				return { color: 'bg-yellow-500', cssClass: '', textKey: 'status.degraded' };
+				return { color: 'var(--status-degraded)', ink: 'var(--status-degraded-ink)', cssClass: '', textKey: 'status.degraded' };
 			default:
-				return { color: 'bg-gray-500', cssClass: '', textKey: 'status.unknown' };
+				return { color: 'var(--status-unknown)', ink: 'var(--status-unknown-ink)', cssClass: '', textKey: 'status.unknown' };
 		}
 	});
 </script>
 
-<span class="inline-flex items-center gap-1.5 text-xs">
-	<span class="inline-block h-2 w-2 rounded-full {config.color} {config.cssClass}"></span>
-	<span class="text-muted-foreground">{$t(config.textKey)}</span>
+<span
+	class="inline-flex items-center gap-1.5 rounded-full px-2.5 py-1 text-xs font-semibold"
+	style="color: {config.ink}; background: color-mix(in srgb, {config.color} 14%, transparent);"
+>
+	<span
+		class="inline-block h-2 w-2 rounded-full {config.cssClass}"
+		style="background: {config.color};"
+	></span>
+	<span>{$t(config.textKey)}</span>
 </span>