Fix logo: original pin+circle design preserved, white skateboard deck clearly visible below

- Keep original gradient circle (red→orange→lime) and white map pin exactly as-is
- White skateboard deck drawn behind the circle, protruding below it
- Deck has popsicle shape (rounded nose + tail), two truck axles, four wheels
  that extend out beyond the deck sides so they're clearly visible
- Wheels have inner hub detail for realism

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>

public/images/icon.svg

@@ -8,47 +8,47 @@
       <stop offset="50%" style="stop-color:#ff6600;stop-opacity:1" />
       <stop offset="100%" style="stop-color:#ccff00;stop-opacity:1" />
     </linearGradient>
-    <linearGradient id="deckGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-      <stop offset="0%" style="stop-color:#ff0040;stop-opacity:1" />
-      <stop offset="50%" style="stop-color:#ff6600;stop-opacity:1" />
-      <stop offset="100%" style="stop-color:#ccff00;stop-opacity:1" />
-    </linearGradient>
   </defs>
 
-  <!-- Skateboard deck — classic shape with rounded nose & tail, centered below pin -->
+  <!-- ── SKATEBOARD DECK ───────────────────────────────────────────────────
-  <!-- Deck body: tall rounded rectangle -->
+       White deck sits behind the pin circle.
-  <rect x="218" y="310" width="76" height="160" rx="28" ry="28" fill="url(#deckGradient)"/>
+       Circle: cx=256 cy=220 r=170  → bottom edge at y=390
+       Deck nose starts at y=340, sticks out left/right beyond circle
+  ──────────────────────────────────────────────────────────────────────── -->
 
-  <!-- Nose kick (top rounded tip) -->
+  <!-- Deck body (popsicle shape) -->
-  <ellipse cx="256" cy="318" rx="38" ry="18" fill="url(#deckGradient)"/>
+  <rect x="190" y="340" width="132" height="148" rx="34" ry="34" fill="#ffffff"/>
+  <!-- Nose ellipse -->
+  <ellipse cx="256" cy="348" rx="66" ry="22" fill="#ffffff"/>
+  <!-- Tail ellipse -->
+  <ellipse cx="256" cy="480" rx="66" ry="22" fill="#ffffff"/>
 
-  <!-- Tail kick (bottom rounded tip) -->
+  <!-- Top truck & wheels — axle extends wide beyond deck -->
-  <ellipse cx="256" cy="462" rx="38" ry="18" fill="url(#deckGradient)"/>
+  <rect x="182" y="364" width="148" height="16" rx="8" fill="#cccccc"/>
+  <rect x="148" y="368" width="216" height="8" rx="4" fill="#aaaaaa"/>
+  <!-- Wheels (extend out from deck sides so they're clearly visible) -->
+  <ellipse cx="150" cy="372" rx="20" ry="15" fill="#e0e0e0"/>
+  <ellipse cx="150" cy="372" rx="10" ry="8" fill="#aaaaaa"/>
+  <ellipse cx="362" cy="372" rx="20" ry="15" fill="#e0e0e0"/>
+  <ellipse cx="362" cy="372" rx="10" ry="8" fill="#aaaaaa"/>
 
-  <!-- Truck axle top -->
+  <!-- Bottom truck & wheels -->
-  <rect x="200" y="338" width="112" height="14" rx="7" fill="#000000" opacity="0.35"/>
+  <rect x="182" y="452" width="148" height="16" rx="8" fill="#cccccc"/>
-  <!-- Wheel top-left -->
+  <rect x="148" y="456" width="216" height="8" rx="4" fill="#aaaaaa"/>
-  <ellipse cx="208" cy="345" rx="12" ry="9" fill="#000000" opacity="0.45"/>
+  <ellipse cx="150" cy="460" rx="20" ry="15" fill="#e0e0e0"/>
-  <!-- Wheel top-right -->
+  <ellipse cx="150" cy="460" rx="10" ry="8" fill="#aaaaaa"/>
-  <ellipse cx="304" cy="345" rx="12" ry="9" fill="#000000" opacity="0.45"/>
+  <ellipse cx="362" cy="460" rx="20" ry="15" fill="#e0e0e0"/>
+  <ellipse cx="362" cy="460" rx="10" ry="8" fill="#aaaaaa"/>
 
-  <!-- Truck axle bottom -->
+  <!-- ── ORIGINAL GRADIENT CIRCLE + PIN (on top of deck) ─────────────────
-  <rect x="200" y="428" width="112" height="14" rx="7" fill="#000000" opacity="0.35"/>
+       Exactly the same as the original icon, just centered in upper area
-  <!-- Wheel bottom-left -->
+  ──────────────────────────────────────────────────────────────────────── -->
-  <ellipse cx="208" cy="435" rx="12" ry="9" fill="#000000" opacity="0.45"/>
+  <circle cx="256" cy="220" r="170" fill="url(#iconGradient)"/>
-  <!-- Wheel bottom-right -->
-  <ellipse cx="304" cy="435" rx="12" ry="9" fill="#000000" opacity="0.45"/>
 
-  <!-- Gradient circle background for pin -->
-  <circle cx="256" cy="200" r="160" fill="url(#iconGradient)"/>
-
-  <!-- Map pin icon — identical to original, just shifted up slightly -->
   <g fill="#ffffff">
-    <!-- Pin circle -->
+    <circle cx="256" cy="194" r="78"/>
-    <circle cx="256" cy="178" r="72"/>
+    <path d="M 217 252 L 256 330 L 295 252 Z"/>
-    <!-- Pin point -->
+    <circle cx="256" cy="194" r="39" fill="#000000"/>
-    <path d="M 220 228 L 256 300 L 292 228 Z"/>
-    <!-- Inner hole -->
-    <circle cx="256" cy="178" r="36" fill="#000000"/>
   </g>
+
 </svg>