/* Shared visual identity for Insights, Atlas and its detail pages. Served via /css. */
:root {
  color-scheme: dark;
  --bg: #071321;
  --bg-page: #071321;
  --surface: #101f31;
  --surface-2: #15273b;
  --surface-3: #1b3047;
  --text-1: #edf3fa;
  --text-2: #b8c8da;
  --text-3: #9fb3ca;
  --border: #2b4057;
  --radius: 12px;
  --section-pad: 36px;
  --shadow-2: 0 8px 24px #0003;
}
body { background: var(--bg); color: var(--text-1); font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.5; }
body a { color: #7ebcff; }
body :is(.topbar, .footer-nav) { background: #0a192b; }
body :is(button, input, select) { font-family: inherit; }
body :is(a, button, input, select, summary):focus-visible { outline: 2px solid #7ebcff; outline-offset: 3px; }
body :is(.section-title, .page-title) { letter-spacing: -.025em; }
body :is(.badge-page, .topbar-badge) { font-size: 14px; }
body .topbar-subtitle { color: #bdcce0; }
body :is(.skeleton, .brand-card-skeleton, .hub-card-skeleton, .fin-skeleton) { background: linear-gradient(90deg, #15273b, #20384f, #15273b); }
body svg text[fill="#475569"], body svg text[fill="#334155"], body svg text[fill="#64748B"] { fill: #b8c8da; }
body #mapSvg text[fill="#475569"] { fill: #475569; } /* The atlas map intentionally uses a light basemap. */
body :is(.brand-card, .hub-card) { border: 1px solid var(--border); }
body .brand-card { min-height: 240px; padding: 24px; border-radius: 12px; }
body .card-pax-hero { font-size: clamp(30px, 3vw, 44px); }
body .card-name { opacity: 1; }
body .card-pax-label { opacity: .8; }
@media (min-width: 1200px) { body .brand-card-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 768px) {
  body .topbar { padding-inline: 14px; gap: 8px; }
  body .topbar-subtitle { display: none; }
  :root { --section-pad: 24px; }
}