New notebook logo: spiral-bound page icon for favicon/PWA/desktop

SVG source in frontend/public/icon.svg, rendered to 192/512/maskable PNGs
and desktop/build/appicon.png; SVG favicon with PNG fallback; icons added
to the service-worker precache.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

frontend/index.html

@@ -6,7 +6,8 @@
     <meta name="theme-color" content="#1a1a1a" media="(prefers-color-scheme: dark)" />
     <meta name="theme-color" content="#fafafa" media="(prefers-color-scheme: light)" />
     <link rel="manifest" href="/manifest.webmanifest" />
-    <link rel="icon" href="/icon-192.png" />
+    <link rel="icon" type="image/svg+xml" href="/icon.svg" />
+    <link rel="icon" type="image/png" href="/icon-192.png" />
     <link rel="apple-touch-icon" href="/icon-192.png" />
     <title>Tefter</title>
   </head>

frontend/public/icon.svg

@@ -1,8 +1,19 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
-  <rect width="512" height="512" rx="96" fill="#2f6fde"/>
-  <rect x="96" y="120" width="320" height="52" rx="26" fill="#ffffff" opacity="0.95"/>
-  <rect x="96" y="216" width="320" height="14" rx="7" fill="#ffffff" opacity="0.7"/>
-  <rect x="96" y="258" width="250" height="14" rx="7" fill="#ffffff" opacity="0.55"/>
-  <rect x="96" y="300" width="290" height="14" rx="7" fill="#ffffff" opacity="0.4"/>
-  <rect x="96" y="342" width="200" height="14" rx="7" fill="#ffffff" opacity="0.3"/>
+  <!-- Tefter logo: spiral-bound notebook -->
+  <rect width="512" height="512" rx="100" fill="#2f6fde"/>
+  <!-- page with a subtle back sheet peeking out -->
+  <rect x="152" y="104" width="238" height="328" rx="26" fill="#1d4fa8"/>
+  <rect x="138" y="90" width="238" height="328" rx="26" fill="#ffffff"/>
+  <!-- spiral holes -->
+  <circle cx="176" cy="150" r="14" fill="#2f6fde"/>
+  <circle cx="176" cy="222" r="14" fill="#2f6fde"/>
+  <circle cx="176" cy="294" r="14" fill="#2f6fde"/>
+  <circle cx="176" cy="366" r="14" fill="#2f6fde"/>
+  <!-- red margin rule -->
+  <rect x="206" y="110" width="7" height="288" rx="3.5" fill="#e5484d"/>
+  <!-- text lines: title + body -->
+  <rect x="234" y="141" width="118" height="18" rx="9" fill="#3d5c94"/>
+  <rect x="234" y="213" width="96" height="17" rx="8.5" fill="#8fa9d6"/>
+  <rect x="234" y="285" width="110" height="17" rx="8.5" fill="#8fa9d6"/>
+  <rect x="234" y="357" width="74" height="17" rx="8.5" fill="#8fa9d6"/>
 </svg>

frontend/vite.config.ts

@@ -14,7 +14,7 @@ function serviceWorker(): Plugin {
       const assets = Object.keys(bundle)
         .filter((f) => !f.endsWith('.map'))
         .map((f) => '/' + f);
-      assets.push('/', '/manifest.webmanifest', '/icon-192.png', '/icon-512.png');
+      assets.push('/', '/manifest.webmanifest', '/icon.svg', '/icon-192.png', '/icon-512.png', '/icon-512-maskable.png');
       const hash = createHash('sha256').update(assets.join(',') + version).digest('hex').slice(0, 12);
       const sw = `// generated by vite.config.ts — do not edit
 const CACHE = 'tefter-${'${'}HASH}';