@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&display=swap');
        body { font-family: 'Inter', sans-serif; -webkit-font-smoothing: antialiased; }
        .custom-scrollbar::-webkit-scrollbar { width: 6px; }
        .custom-scrollbar::-webkit-scrollbar-thumb { background-color: #cbd5e1; border-radius: 10px; }
        .animate-in { animation: fadeIn 0.6s ease-out forwards; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
        .leaflet-container { width: 100%; height: 100%; background: #f8fafc; z-index: 0; cursor: crosshair; }
        .fade-in { animation: fadeInMenu 0.5s ease-out forwards; opacity: 0; transform: translateY(10px); }
        @keyframes fadeInMenu { to { opacity: 1; transform: translateY(0); } }
        
        /* Custom Map Marker Animation */
        .custom-map-marker { background: transparent; border: none; outline: none; }
        .custom-map-marker svg { transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1); cursor: pointer; }
        .custom-map-marker:hover svg { transform: scale(1.15) translateY(-4px); }

        /* Custom Webcam Marker Styling */
        .custom-webcam-marker { background: transparent; border: none; outline: none; display: flex; justify-content: center; align-items: center; }
        .custom-webcam-marker div { transition: all 0.3s ease; }
        .custom-webcam-marker:hover div { transform: scale(1.15) translateY(-4px); box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3); }

        /* CRITICAL SAFARI FIX: Creates a safe stacking context for CSS blending */
        .leaflet-pane { isolation: isolate; }

        /* Smooth opacity transitions for weather layers */
        .weather-layer-transition {
            transition: opacity 0.5s ease-in-out !important;
            will-change: opacity;
            pointer-events: none;
        }

        /* Hardware-Accelerated Screen Blending 
           Makes the black infrared background invisible on a dark map */
        .cloud-tile {
            mix-blend-mode: screen !important;
            filter: grayscale(1) contrast(2) brightness(1.5) !important;
        }

        /* Radar specific enhancements */
        .radar-tile {
            filter: contrast(1.3) brightness(1.2);
            /* Explicitly NO translateZ to prevent iOS/Safari GPU crashing on scaled tiles */
        }