feat: Phases 4-7 — Full Feature Expansion (26 features)

Phase 4 — New Widget Types:
- Clock/Weather, System Stats, RSS/Feed, Calendar, Markdown,
  Metric/Counter, Link Group, Camera/Stream widgets
- Backend services with caching for each data source
- Full creation form with dynamic config fields per type

Phase 5 — Visual & Styling Enhancements:
- Glassmorphism card style (solid/glass/outline)
- Board-level themes with per-board hue/saturation
- Animated SVG status rings replacing static dots
- Card size options (compact/medium/large)
- Custom CSS injection (admin + per-board, sanitized)
- Wallpaper backgrounds with blur/overlay/parallax

Phase 6 — Functional Features:
- Favorites bar with drag-and-drop reordering
- Recent apps tracking with privacy toggle
- Uptime dashboard page (/status, guest-accessible)
- Notifications system (Discord/Slack/Telegram/HTTP webhooks)
- App tags with filtering in board view
- Multi-URL app cards with expandable sub-links
- Personal API tokens with scoped permissions
- Audit log with retention and admin viewer

Phase 7 — Quality of Life:
- Onboarding wizard (5-step first-launch setup)
- App URL health preview with favicon/title detection
- Board templates (4 built-in + custom import/export)
- Keyboard shortcut overlay (j/k nav, 1-9 boards, ? help)

212 files changed, 15641 insertions, 980 deletions.
Build, lint, type check, and 222 tests all pass.

src/app.css

@@ -28,6 +28,10 @@
 	--destructive: hsl(0 72.2% 50.6%);
 	--destructive-foreground: hsl(0 0% 98%);
 	--ring: hsl(var(--primary-h) var(--primary-s) var(--primary-l));
+	--status-online: #22c55e;
+	--status-offline: #ef4444;
+	--status-degraded: #eab308;
+	--status-unknown: #6b7280;
 	--radius: 0.5rem;
 	--sidebar: hsl(0 0% 98%);
 	--sidebar-foreground: hsl(240 5.3% 26.1%);
@@ -112,7 +116,9 @@
 	}
 	body {
 		@apply bg-background text-foreground;
-		transition: background-color 0.3s ease, color 0.3s ease;
+		transition:
+			background-color 0.3s ease,
+			color 0.3s ease;
 	}
 }
 
@@ -134,9 +140,40 @@
 	color: hsl(142 71% 45%);
 }
 
+/* ===== Card Style Variants ===== */
+.card-solid {
+	background: var(--card);
+	border: 1px solid var(--border);
+}
+
+.card-glass {
+	backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
+	background: color-mix(in srgb, var(--card) 60%, transparent);
+	border: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
+	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
+}
+
+.dark .card-glass {
+	background: color-mix(in srgb, var(--card) 50%, transparent);
+	border: 1px solid color-mix(in srgb, var(--border) 25%, transparent);
+	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
+}
+
+.card-outline {
+	background: transparent;
+	border: 1px solid var(--border);
+}
+
+.dark .card-outline {
+	border-color: var(--border);
+}
+
 /* ===== Card Hover Effects ===== */
 .card-hover {
-	transition: transform 0.2s ease, box-shadow 0.2s ease;
+	transition:
+		transform 0.2s ease,
+		box-shadow 0.2s ease;
 }
 
 .card-hover:hover {
@@ -163,24 +200,14 @@
 }
 
 .skeleton {
-	background: linear-gradient(
-		90deg,
-		var(--muted) 25%,
-		hsl(240 4.8% 85%) 50%,
-		var(--muted) 75%
-	);
+	background: linear-gradient(90deg, var(--muted) 25%, hsl(240 4.8% 85%) 50%, var(--muted) 75%);
 	background-size: 200% 100%;
 	animation: shimmer 1.5s ease-in-out infinite;
 	border-radius: var(--radius);
 }
 
 .dark .skeleton {
-	background: linear-gradient(
-		90deg,
-		var(--muted) 25%,
-		hsl(240 3.7% 22%) 50%,
-		var(--muted) 75%
-	);
+	background: linear-gradient(90deg, var(--muted) 25%, hsl(240 3.7% 22%) 50%, var(--muted) 75%);
 	background-size: 200% 100%;
 }
 
@@ -204,6 +231,13 @@
 	opacity: 0.8;
 }
 
+/* ===== Keyboard Navigation Selection ===== */
+[data-keyboard-selected='true'] {
+	outline: 2px solid hsl(var(--primary-h) var(--primary-s) var(--primary-l));
+	outline-offset: 2px;
+	border-radius: var(--radius, 0.5rem);
+}
+
 /* ===== Aurora Keyframes ===== */
 @keyframes aurora-shift {
 	0% {