fix: Add custom Loadout favicons (SVG, ICO, PNG) replacing prototype Glimpse icon

index.html

@@ -8,8 +8,11 @@
     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
     <meta name="apple-mobile-web-app-title" content="Loadout" />
     <link rel="manifest" href="/manifest.webmanifest" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="alternate icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
+    <link rel="alternate icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
+    <link rel="shortcut icon" href="/favicon.ico" />
     <link rel="apple-touch-icon" href="/icon.svg" />
-    <link rel="icon" type="image/svg+xml" href="/icon.svg" />
     <title>LOADOUT // Travel Manifest & Bag Allocation</title>
     <!-- Google Fonts for retro travel ephemera, boarding pass typography, and tactile monospace -->
     <link rel="preconnect" href="https://fonts.googleapis.com">

public/favicon.svg

@@ -0,0 +1,49 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="Loadout">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#1E2633"/>
+      <stop offset="100%" stop-color="#0F141C"/>
+    </linearGradient>
+    <linearGradient id="luggage" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#FF5A26"/>
+      <stop offset="100%" stop-color="#D93510"/>
+    </linearGradient>
+    <linearGradient id="tag" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#FFE853"/>
+      <stop offset="100%" stop-color="#FFC700"/>
+    </linearGradient>
+  </defs>
+  <rect width="64" height="64" rx="16" fill="url(#bg)"/>
+  <rect x="1" y="1" width="62" height="62" rx="15" fill="none" stroke="#FFFFFF" stroke-opacity="0.08" stroke-width="1"/>
+
+  <!-- Luggage Handle -->
+  <path d="M25 21 V15 C25 13.5 26.5 12 28 12 H36 C37.5 12 39 13.5 39 15 V21" fill="none" stroke="#CBD5E1" stroke-width="3" stroke-linecap="round"/>
+  <rect x="23" y="19" width="4" height="4" rx="1" fill="#475569"/>
+  <rect x="37" y="19" width="4" height="4" rx="1" fill="#475569"/>
+
+  <!-- Suitcase Body -->
+  <rect x="13" y="21" width="38" height="29" rx="5" fill="url(#luggage)"/>
+  
+  <!-- Suitcase Accents & Straps -->
+  <rect x="13" y="33" width="38" height="4" fill="#872205" opacity="0.6"/>
+  <rect x="22" y="21" width="3" height="29" fill="#1E2633" opacity="0.45"/>
+  <rect x="39" y="21" width="3" height="29" fill="#1E2633" opacity="0.45"/>
+
+  <!-- Wheels -->
+  <circle cx="20" cy="51" r="2.5" fill="#0F172A"/>
+  <circle cx="44" cy="51" r="2.5" fill="#0F172A"/>
+
+  <!-- Dangling Baggage Tag -->
+  <g transform="rotate(-15 36 21)">
+    <path d="M37 17 L37 23" stroke="#FFEBA8" stroke-width="1.3" stroke-linecap="round"/>
+    <polygon points="32,23 42,23 45,38 29,38" fill="url(#tag)"/>
+    <circle cx="37" cy="25.5" r="1.5" fill="#8B4513"/>
+    <line x1="32" y1="30" x2="42" y2="30" stroke="#1E2633" stroke-width="1.2" stroke-dasharray="2 1 1 1.5 2"/>
+    <line x1="33" y1="33" x2="41" y2="33" stroke="#1E2633" stroke-width="1.2" stroke-dasharray="1 1.5 2 1"/>
+    <line x1="33" y1="36" x2="41" y2="36" stroke="#1E2633" stroke-width="0.8"/>
+  </g>
+
+  <!-- Stamped Verified Badge -->
+  <circle cx="48" cy="46" r="6.5" fill="#FFD100" stroke="#1E2633" stroke-width="1"/>
+  <path d="M45.5 46.2 L47.2 47.8 L50.5 44.5" fill="none" stroke="#141518" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>