:root {
  /* fonts */
  --font-sans: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  /* route palette — exploration / navigation set */
  --blue:#2563eb; --red:#dc2626; --amber:#b45309; --purple:#6d28d9; --green:#15803d;

  /* surfaces */
  --paper:#f5f7fb; --card:#ffffff; --line:#e1e6ef;
  --ink:#0b1220; --ink-soft:#33415c;
  --text:#0f1729; --muted:#5b6478;
  --accent:#2563eb; --brass:#3b82f6;
  --page-bg: var(--paper);
  --surface-2:#eef1f6;

  /* spacing / radius / shadow */
  --radius-sm:10px; --radius-md:16px; --radius-lg:22px;
  --shadow-sm: 0 1px 2px rgba(15,23,42,.05);
  --shadow-md: 0 6px 20px rgba(15,23,42,.08);
  --shadow-lg: 0 16px 40px rgba(15,23,42,.14);
}
:root[data-theme="dark"] {
  /* route palette — brightened for dark basemap + dark cards */
  --blue:#60a5fa; --red:#f87171; --amber:#fbbf24; --purple:#c084fc; --green:#4ade80;

  --page-bg:#0a0e1a; --card:#121a2e; --line:#28324c;
  --ink-soft:#aebbe0;
  --text:#eef1f8; --muted:#94a1c4;
  --accent:#60a5fa;
  --surface-2:#19233a;

  --shadow-sm: 0 1px 2px rgba(0,0,0,.35);
  --shadow-md: 0 8px 28px rgba(0,0,0,.5);
  --shadow-lg: 0 24px 60px rgba(0,0,0,.6);
}
/* --ink / --brass stay constant (dark chrome for header/topnav/footer in both themes) — retarget text that sits on light cards */
:root[data-theme="dark"] section h2,
:root[data-theme="dark"] .day-card .route,
:root[data-theme="dark"] .wcard h3,
:root[data-theme="dark"] .paso-alert h3,
:root[data-theme="dark"] .poi-item .name { color: var(--text); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; font-family:var(--font-sans); font-size:16px;
  background: var(--page-bg); color: var(--text);
  transition: background-color .35s ease, color .35s ease;
  -webkit-font-smoothing: antialiased;
}
:focus-visible { outline:2px solid var(--blue); outline-offset:2px; border-radius:4px; }

@keyframes fadeInUp { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.45; transform:scale(1.35); } }
