feat(tactical-driving): add Geiger proximity chirps, 1-tap HUD audio mute, live compass heading, and VIP supporter gold aura (v18)

css/styles.css

@@ -373,9 +373,51 @@ body {
 }
 
 .hud-capsule-actions {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+#btn-toggle-tools {
   display: none;
 }
 
+@media (max-width: 900px) {
+  #btn-toggle-tools {
+    display: flex;
+  }
+}
+
+.btn-sound-trigger {
+  padding: 6px 9px;
+  position: relative;
+  transition: all 0.2s ease;
+}
+
+.btn-sound-trigger:not(.is-muted) {
+  color: #38bdf8;
+  border-color: rgba(56, 189, 248, 0.4);
+  background: rgba(56, 189, 248, 0.12);
+}
+
+.btn-sound-trigger.is-muted {
+  color: #ef4444;
+  border-color: rgba(239, 68, 68, 0.45);
+  background: rgba(239, 68, 68, 0.14);
+}
+
+.capsule-sound-label {
+  font-size: 0.72rem;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+}
+
+@media (max-width: 480px) {
+  .capsule-sound-label {
+    display: none;
+  }
+}
+
 .hud-collapsible-content {
   display: flex;
   flex-direction: column;
@@ -486,10 +528,21 @@ body {
   color: var(--text-dim);
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  display: block;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 2px;
   margin-top: 4px;
 }
 
+.hud-compass-icon {
+  display: inline-block;
+  color: var(--accent-cyan);
+  font-size: 0.65rem;
+  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease;
+  line-height: 1;
+}
+
 .hud-location-bar {
   display: flex;
   align-items: center;
@@ -844,6 +897,48 @@ body {
   transition: transform 0.2s linear;
 }
 
+/* VIP Supporter Gold Radar Aura */
+.user-vehicle-marker.vip-supporter .supporter-gold-aura {
+  position: absolute;
+  top: -12px;
+  left: -12px;
+  right: -12px;
+  bottom: -12px;
+  border-radius: 50%;
+  border: 1.5px solid #f59e0b;
+  background: radial-gradient(circle, rgba(245, 158, 11, 0.25) 0%, rgba(245, 158, 11, 0.05) 60%, transparent 80%);
+  animation: vipSupporterPulse 2.2s cubic-bezier(0.16, 1, 0.3, 1) infinite;
+  pointer-events: none;
+  z-index: -1;
+}
+
+.user-vehicle-marker.vip-supporter .car-body-dot {
+  background: linear-gradient(135deg, #f59e0b, #d97706) !important;
+  box-shadow: 0 0 16px rgba(245, 158, 11, 0.9), 0 0 28px rgba(245, 158, 11, 0.4) !important;
+  border-color: #fef08a !important;
+}
+
+.user-vehicle-marker.vip-supporter .radar-scan-cone {
+  background: radial-gradient(circle at 50% 100%, rgba(245, 158, 11, 0.45), transparent 70%);
+}
+
+@keyframes vipSupporterPulse {
+  0% {
+    transform: scale(0.85);
+    opacity: 0.95;
+    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.7);
+  }
+  70% {
+    transform: scale(1.6);
+    opacity: 0.25;
+    box-shadow: 0 0 0 14px rgba(245, 158, 11, 0);
+  }
+  100% {
+    transform: scale(1.8);
+    opacity: 0;
+  }
+}
+
 .radar-scan-cone {
   position: absolute;
   top: -15px;