New PWA icons: slate/blue weather icon, distinct dashboard icon, safe-zone maskable

- Redrawn sun-and-cloud icon in the current palette; artwork sits inside the maskable safe zone
  (the old one was clipped by round/squircle masks and used the old warm colours)
- Separate 'any' and 'maskable' manifest entries; opaque iOS touch icons
- Station Dashboard gets its own chart icon so both installed apps are distinguishable
- Vector favicon + PNG fallback; icons verified served by both manifests

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

app/public/dashboard-account.html

@@ -5,6 +5,9 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
 <meta name="theme-color" content="#070c14">
 <link rel="manifest" href="/dashboard.webmanifest">
+<link rel="icon" type="image/png" sizes="192x192" href="/icons/dashboard-icon-192.png">
+<link rel="apple-touch-icon" href="/icons/dashboard-apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="192x192" href="/icons/dashboard-icon-192.png">
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
 <link rel="stylesheet" href="/pwa-safe.css">

app/public/dashboard-login.html

@@ -8,7 +8,8 @@
 <meta name="apple-mobile-web-app-title" content="Station">
 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
 <link rel="manifest" href="/dashboard.webmanifest">
-<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="192x192" href="/icons/dashboard-icon-192.png">
+<link rel="apple-touch-icon" href="/icons/dashboard-apple-touch-icon.png">
 <link rel="stylesheet" href="/pwa-safe.css">
 <title>Station Dashboard — Sign In</title>
 <style>

app/public/dashboard.html

@@ -10,7 +10,8 @@
 <meta name="apple-mobile-web-app-title" content="Station">
 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
 <link rel="manifest" href="/dashboard.webmanifest">
-<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="192x192" href="/icons/dashboard-icon-192.png">
+<link rel="apple-touch-icon" href="/icons/dashboard-apple-touch-icon.png">
 <link rel="stylesheet" href="/pwa-safe.css">
 <title>Station Dashboard</title>
 <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>

app/public/dashboard.webmanifest

@@ -8,9 +8,28 @@
   "background_color": "#070c14",
   "theme_color": "#070c14",
   "orientation": "any",
-  "categories": ["weather", "utilities"],
+  "categories": [
+    "weather",
+    "utilities"
+  ],
   "icons": [
-    { "src": "/icons/icon-192.png", "sizes": "192x192", "type": "image/png", "purpose": "any" },
+    {
-    { "src": "/icons/icon-512.png", "sizes": "512x512", "type": "image/png", "purpose": "any maskable" }
+      "src": "/icons/dashboard-icon-192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "any"
+    },
+    {
+      "src": "/icons/dashboard-icon-512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "any"
+    },
+    {
+      "src": "/icons/dashboard-icon-maskable-512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
   ]
 }

app/public/icons/icon.svg

@@ -1,12 +1,22 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
-  <!-- Solid background (fills corners for maskable safe zone) -->
+  <defs>
-  <rect width="512" height="512" fill="#1a1a1a"/>
+    <linearGradient id="bg" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#3b82f6"/><stop offset="1" stop-color="#0a1a40"/></linearGradient>
-  <!-- Sun -->
+    <radialGradient id="glow" cx="0.18" cy="0.1" r="0.7"><stop offset="0" stop-color="#fff" stop-opacity="0.28"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></radialGradient>
-  <circle cx="205" cy="205" r="70" fill="#e07848"/>
+    <radialGradient id="sun" cx="0.4" cy="0.4" r="0.7"><stop offset="0" stop-color="#ffe9a8"/><stop offset="1" stop-color="#f97316"/></radialGradient>
-  <!-- Cloud bumps (front, overlapping sun) -->
+    <radialGradient id="sunglow"><stop offset="0" stop-color="#fbbf24" stop-opacity="0.5"/><stop offset="1" stop-color="#fbbf24" stop-opacity="0"/></radialGradient>
-  <circle cx="215" cy="325" r="72" fill="#ece7dc"/>
+    <linearGradient id="cloud" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#ffffff"/><stop offset="1" stop-color="#c9dcf5"/></linearGradient>
-  <circle cx="305" cy="297" r="88" fill="#ece7dc"/>
+    <filter id="soft" x="-20%" y="-20%" width="140%" height="160%"><feGaussianBlur stdDeviation="22"/></filter>
-  <circle cx="390" cy="328" r="62" fill="#ece7dc"/>
+  </defs>
-  <!-- Cloud base (flat bottom) -->
+  <rect width="1024" height="1024" fill="url(#bg)"/>
-  <rect x="147" y="335" width="305" height="68" fill="#ece7dc"/>
+  <rect width="1024" height="1024" fill="url(#glow)"/>
+  <circle cx="400" cy="430" r="230" fill="url(#sunglow)"/>
+  <circle cx="400" cy="430" r="132" fill="url(#sun)"/>
+  <g filter="url(#soft)" opacity="0.35" transform="translate(0 26)" fill="#06122e">
+    <circle cx="392" cy="572" r="96"/><circle cx="522" cy="522" r="126"/><circle cx="648" cy="582" r="86"/>
+    <rect x="300" y="560" width="432" height="132" rx="66"/>
+  </g>
+  <g fill="url(#cloud)">
+    <circle cx="392" cy="572" r="96"/><circle cx="522" cy="522" r="126"/><circle cx="648" cy="582" r="86"/>
+    <rect x="300" y="560" width="432" height="132" rx="66"/>
+  </g>
 </svg>

app/public/index.html

@@ -6,6 +6,8 @@
 <link rel="stylesheet" href="/pwa-safe.css">
 <title>NeCloud Weather</title>
 <link rel="manifest" href="/manifest.json">
+<link rel="icon" type="image/svg+xml" href="/icons/icon.svg">
+<link rel="icon" type="image/png" sizes="192x192" href="/icons/icon-192.png">
 <link rel="apple-touch-icon" href="/icons/apple-touch-icon.png">
 <meta name="theme-color" content="#edf2f7" media="(prefers-color-scheme: light)">
 <meta name="theme-color" content="#070c14" media="(prefers-color-scheme: dark)">

app/public/manifest.json

@@ -5,11 +5,17 @@
   "start_url": "/",
   "scope": "/",
   "display": "standalone",
-  "display_override": ["window-controls-overlay", "standalone"],
+  "display_override": [
+    "window-controls-overlay",
+    "standalone"
+  ],
   "background_color": "#070c14",
   "theme_color": "#070c14",
   "orientation": "portrait-primary",
-  "categories": ["weather", "utilities"],
+  "categories": [
+    "weather",
+    "utilities"
+  ],
   "icons": [
     {
       "src": "/icons/icon-192.png",
@@ -21,7 +27,13 @@
       "src": "/icons/icon-512.png",
       "sizes": "512x512",
       "type": "image/png",
-      "purpose": "any maskable"
+      "purpose": "any"
+    },
+    {
+      "src": "/icons/icon-maskable-512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
     },
     {
       "src": "/icons/icon.svg",
@@ -33,7 +45,11 @@
   "share_target": {
     "action": "/?share",
     "method": "GET",
-    "params": { "title": "title", "text": "text", "url": "url" }
+    "params": {
+      "title": "title",
+      "text": "text",
+      "url": "url"
+    }
   },
   "shortcuts": [
     {
@@ -41,28 +57,48 @@
       "short_name": "Now",
       "description": "View current weather and forecast",
       "url": "/?tab=conditions",
-      "icons": [{ "src": "/icons/icon-192.png", "sizes": "192x192" }]
+      "icons": [
+        {
+          "src": "/icons/icon-192.png",
+          "sizes": "192x192"
+        }
+      ]
     },
     {
       "name": "My Station",
       "short_name": "Station",
       "description": "Live readings from your weather station",
       "url": "/?tab=station",
-      "icons": [{ "src": "/icons/icon-192.png", "sizes": "192x192" }]
+      "icons": [
+        {
+          "src": "/icons/icon-192.png",
+          "sizes": "192x192"
+        }
+      ]
     },
     {
       "name": "Radar Map",
       "short_name": "Map",
       "description": "Live radar and weather map",
       "url": "/?tab=unified-map",
-      "icons": [{ "src": "/icons/icon-192.png", "sizes": "192x192" }]
+      "icons": [
+        {
+          "src": "/icons/icon-192.png",
+          "sizes": "192x192"
+        }
+      ]
     },
     {
       "name": "Active Alerts",
       "short_name": "Alerts",
       "description": "Weather warnings and alerts",
       "url": "/?tab=alerts",
-      "icons": [{ "src": "/icons/icon-192.png", "sizes": "192x192" }]
+      "icons": [
+        {
+          "src": "/icons/icon-192.png",
+          "sizes": "192x192"
+        }
+      ]
     }
   ]
 }

app/public/sw.js

@@ -4,7 +4,7 @@ self.addEventListener('message', event => {
   if (event.data === 'skipWaiting') self.skipWaiting();
 });
 
-const CACHE = 'weather-v12';
+const CACHE = 'weather-v13';
 
 // App shell cached on install for offline resilience.
 const PRECACHE = [