diff --git a/static/index.html b/static/index.html
index 78ecdd9..b5feac1 100644
--- a/static/index.html
+++ b/static/index.html
@@ -800,6 +800,20 @@
     .map-chip.heat-on { background: var(--amber); border-color: var(--amber); color: #000; }
     .map-chip.park-on { background: var(--accent); border-color: var(--accent); color: #fff; }
     .cat-pin-icon { background: transparent !important; border: none !important; box-shadow: none !important; }
+    .map-pin {
+      width: 22px; height: 22px;
+      border-radius: 50% 50% 50% 0;
+      transform: rotate(-45deg);
+      box-shadow: 0 2px 6px rgba(0,0,0,0.4);
+      display: flex; align-items: center; justify-content: center;
+    }
+    .map-pin-inner {
+      width: 16px; height: 16px;
+      border-radius: 50%;
+      transform: rotate(45deg);
+      display: flex; align-items: center; justify-content: center;
+      font-size: 10px; line-height: 1;
+    }
     .park-label-icon { pointer-events: none !important; background: transparent !important; border: none !important; }
     .leaflet-popup-content-wrapper {
       background: var(--card) !important;
@@ -4412,13 +4426,11 @@
             var catColor = catEntry ? catEntry.color : '#6b7280';
             var pinIcon = L.divIcon({
               className: 'cat-pin-icon',
-              html: '<div style="background:' + catColor + '22;color:' + catColor +
-                    ';border:2px solid ' + catColor + ';width:36px;height:36px;border-radius:50%;' +
-                    'display:flex;align-items:center;justify-content:center;font-size:18px;' +
-                    'box-shadow:0 2px 8px rgba(0,0,0,0.4);">' + icon + '</div>',
-              iconSize: [36, 36],
-              iconAnchor: [18, 18],
-              popupAnchor: [0, -20],
+              html: '<div class="map-pin" style="background:' + catColor + ';">' +
+                    '<div class="map-pin-inner" style="background:#fff;">' + icon + '</div></div>',
+              iconSize: [24, 32],
+              iconAnchor: [12, 32],
+              popupAnchor: [0, -34],
             });
             var marker = L.marker([a.latitude, a.longitude], { icon: pinIcon })
               .addTo(map)