feat: UI refactor - unified navigation, design tokens, dashboard integration

- Add centralized design tokens in static/css/core/variables.css
- Create reusable base templates (base.html, base_dashboard.html)
- Add unified navigation partial (partials/nav.html) with all modules
- Create reusable UI components (card, loading, empty_state, status_badge, stats_strip)
- Integrate navigation into ADSB, AIS, and Satellite dashboards
- Consolidate CSS by importing shared variables in dashboard stylesheets
- Add comprehensive UI_GUIDE.md documentation

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

static/css/index.css

@@ -1,3 +1,15 @@
+/**
+ * INTERCEPT Main Styles
+ * Legacy styles for index.html - will be incrementally refactored
+ *
+ * Note: Design tokens are now imported from core/variables.css
+ * New pages should import core CSS directly in templates
+ */
+
+/* Import design tokens (provides CSS variables) */
+@import url('./core/variables.css');
+
+/* Font import - kept for backward compatibility with pages not using base template */
 @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');
 
 * {
@@ -6,64 +18,6 @@
     padding: 0;
 }
 
-:root {
-    /* Tactical dark palette */
-    --bg-primary: #0a0c10;
-    --bg-secondary: #0f1218;
-    --bg-tertiary: #151a23;
-    --bg-card: #121620;
-    --bg-elevated: #1a202c;
-
-    /* Accent colors - sophisticated blue/amber */
-    --accent-cyan: #4a9eff;
-    --accent-cyan-dim: rgba(74, 158, 255, 0.15);
-    --accent-green: #22c55e;
-    --accent-green-dim: rgba(34, 197, 94, 0.15);
-    --accent-red: #ef4444;
-    --accent-red-dim: rgba(239, 68, 68, 0.15);
-    --accent-orange: #f59e0b;
-    --accent-amber: #d4a853;
-    --accent-amber-dim: rgba(212, 168, 83, 0.15);
-
-    /* Text hierarchy */
-    --text-primary: #e8eaed;
-    --text-secondary: #9ca3af;
-    --text-dim: #4b5563;
-    --text-muted: #374151;
-
-    /* Borders */
-    --border-color: #1f2937;
-    --border-light: #374151;
-    --border-glow: rgba(74, 158, 255, 0.2);
-
-    /* Status colors */
-    --status-online: #22c55e;
-    --status-warning: #f59e0b;
-    --status-error: #ef4444;
-    --status-offline: #6b7280;
-}
-
-[data-theme="light"] {
-    --bg-primary: #f8fafc;
-    --bg-secondary: #f1f5f9;
-    --bg-tertiary: #e2e8f0;
-    --bg-card: #ffffff;
-    --bg-elevated: #f8fafc;
-    --accent-cyan: #2563eb;
-    --accent-cyan-dim: rgba(37, 99, 235, 0.1);
-    --accent-green: #16a34a;
-    --accent-red: #dc2626;
-    --accent-orange: #d97706;
-    --accent-amber: #b45309;
-    --text-primary: #0f172a;
-    --text-secondary: #475569;
-    --text-dim: #94a3b8;
-    --text-muted: #cbd5e1;
-    --border-color: #e2e8f0;
-    --border-light: #cbd5e1;
-    --border-glow: rgba(37, 99, 235, 0.15);
-}
-
 [data-theme="light"] body {
     background: var(--bg-primary);
 }