feat(pwa): make dashboard installable as a progressive web app

Add web manifest, service worker with cache-first static assets and
network-first navigation, and register from the App component head.

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

assets/main.css

@@ -7,12 +7,7 @@ body {
     padding: 0;
 }
 
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
+h1, h2, h3, h4, h5, h6 {
     font-family: 'Space Grotesk', sans-serif;
 }
 
@@ -514,9 +509,11 @@ h6 {
     margin: 0 auto 80px;
     padding: 64px 48px;
     text-align: center;
-    background: linear-gradient(135deg,
-            rgba(145, 164, 210, 0.08),
-            rgba(109, 133, 198, 0.04));
+    background: linear-gradient(
+        135deg,
+        rgba(145, 164, 210, 0.08),
+        rgba(109, 133, 198, 0.04)
+    );
     border: 1px solid rgba(145, 164, 210, 0.15);
     border-radius: 20px;
 }
@@ -1049,30 +1046,13 @@ h6 {
     color: #91a4d2;
 }
 
-.news-badge--llm {
-    background-color: rgba(99, 102, 241, 0.15);
-    color: #818cf8;
-}
-
-.news-badge--agents {
-    background-color: rgba(168, 85, 247, 0.15);
-    color: #c084fc;
-}
-
-.news-badge--privacy {
-    background-color: rgba(34, 197, 94, 0.15);
-    color: #4ade80;
-}
-
-.news-badge--infrastructure {
-    background-color: rgba(234, 179, 8, 0.15);
-    color: #facc15;
-}
-
-.news-badge--open-source {
-    background-color: rgba(236, 72, 153, 0.15);
-    color: #f472b6;
-}
+/* Topic-specific badge colors */
+.news-badge--ai { background-color: rgba(99, 102, 241, 0.15); color: #818cf8; }
+.news-badge--technology { background-color: rgba(168, 85, 247, 0.15); color: #c084fc; }
+.news-badge--science { background-color: rgba(34, 197, 94, 0.15); color: #4ade80; }
+.news-badge--finance { background-color: rgba(234, 179, 8, 0.15); color: #facc15; }
+.news-badge--writing { background-color: rgba(236, 72, 153, 0.15); color: #f472b6; }
+.news-badge--research { background-color: rgba(6, 182, 212, 0.15); color: #22d3ee; }
 
 .news-card-source {
     font-size: 12px;
@@ -1478,18 +1458,8 @@ h6 {
 }
 
 @keyframes dotPulse {
-
-    0%,
-    80%,
-    100% {
-        opacity: 0.3;
-        transform: scale(0.8);
-    }
-
-    40% {
-        opacity: 1;
-        transform: scale(1);
-    }
+    0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); }
+    40% { opacity: 1; transform: scale(1); }
 }
 
 /* ---- Follow-up Chat ---- */
@@ -1887,17 +1857,9 @@ h6 {
     border-radius: 50%;
 }
 
-.tool-status--active {
-    background-color: #4ade80;
-}
-
-.tool-status--inactive {
-    background-color: #5a6478;
-}
-
-.tool-status--error {
-    background-color: #f87171;
-}
+.tool-status--active { background-color: #4ade80; }
+.tool-status--inactive { background-color: #5a6478; }
+.tool-status--error { background-color: #f87171; }
 
 .tool-card-name {
     font-size: 16px;
@@ -2099,13 +2061,8 @@ h6 {
     font-weight: 500;
 }
 
-.analytics-stat-change--up {
-    color: #4ade80;
-}
-
-.analytics-stat-change--down {
-    color: #f87171;
-}
+.analytics-stat-change--up { color: #4ade80; }
+.analytics-stat-change--down { color: #f87171; }
 
 /* ===== Pricing Page ===== */
 .pricing-page {
@@ -2423,7 +2380,6 @@ h6 {
 
 /* ===== Responsive: Dashboard Pages ===== */
 @media (max-width: 1024px) {
-
     .news-grid,
     .tools-grid,
     .pricing-grid {
@@ -2472,7 +2428,6 @@ h6 {
 }
 
 @media (max-width: 768px) {
-
     .news-grid,
     .tools-grid,
     .pricing-grid {
@@ -2513,4 +2468,4 @@ h6 {
         min-width: unset;
         margin: 16px;
     }
-}
+}