@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Saira+Condensed:wght@500;600;700&display=swap');

:root {
  --paper: #f6f1e7;
  --paper-2: #efe7d7;
  --asphalt: #0e1113;
  --panel: #171b1e;
  --panel-2: #20262a;
  --signal: #ffb300;
  --signal-strong: #ff8f00;
  --route-green: #22c55e;
  --ink: #16130c;
  --ink-soft: #4b5563;
  --cream-line: rgba(22, 19, 12, 0.12);
}
html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; }
body { font-family: 'Inter', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
.font-display { font-family: 'Saira Condensed', 'Inter', sans-serif; }
::selection { background: var(--signal); color: var(--ink); }
:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }

.bg-paper { background: var(--paper); }
.bg-paper-2 { background: var(--paper-2); }
.bg-asphalt { background: var(--asphalt); }
.bg-signal { background: var(--signal); }
.text-signal { color: var(--signal); }
.text-paper { color: var(--paper); }

/* Leaflet dark popups (port de layout.css) */
.leaflet-popup .leaflet-popup-content-wrapper {
  background: rgba(23, 27, 30, 0.94); color: #f3f4f6;
  border: 1px solid rgba(255,179,0,.16); border-radius: .75rem;
}
.leaflet-popup .leaflet-popup-content { color: #f3f4f6; }
.leaflet-popup .leaflet-popup-tip { background: rgba(23,27,30,.94); border: 1px solid rgba(255,179,0,.16); }
.leaflet-popup .leaflet-popup-close-button { color: #9aa0a6 !important; }
.leaflet-container { background: #0e1113; font-family: inherit; }