/* App-wide dark background — single source of truth for the "gloomy navy" base colour, referenced as .bg-app-dark in index.html (, #app) and map.js (the full-screen map modal). Not a Tailwind utility: this shade sits deliberately between Tailwind's slate-900 (#0F172A, the old value) and slate-800 (#1E293B), so it's expressed once here rather than as a Tailwind arbitrary-value class (bg-[#16213A]) repeated in three files — that "same colour, hand-typed in more than one place" shape is exactly what the 2026-08-15 hard-coded/duplicated-pattern audit fixed once already (see design doc §9 archive pointer, 2026-08-15). History: background colour was originally bg-slate-900 (#0F172A) throughout. Backlog note (2026-08-15) flagged it as reading almost black, especially toward the top of a screen — closed out (2026-08-15, second pass) with a solid lift to #16213A across body/#app/map modal, first pass. See design doc §6.3 and archive.*/ .bg-app-dark { background-color: #16213A; } body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background-color: #f8fafc; color: #1e293b; } .hide { display: none !important; } .fade-in { animation: fadeIn 0.3s ease-in-out; } @keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } } /* Modal Overlay */ .modal-overlay { background: rgba(15, 23, 42, 0.7); backdrop-filter: blur(2px); } /* ========================================== */ /* NEW: LEAFLET MAP CONTAINMENT RULES */ /* ========================================== */ #leaflet-map-canvas { height: 100%; width: 100%; } /* Stops Leaflet's UI elements from breaking our mobile fonts */ .leaflet-container { font-family: inherit; } /* Explicitly enforce that the map modal stays invisible when it has the hidden class */ #map-modal.hidden { display: none !important; }