/* ============================================================================
   Roadmap Design System, shared design tokens
   SOURCE OF TRUTH: investment-roadmap/design-system/tokens.css
   Synced into retirement-roadmap/design-system/tokens.css via
   scripts/sync-design-system.sh. Edit here, then run the sync script.

   LIGHT is the default (:root). Dark is opt-in via html[data-theme="dark"].
   Both products link this file BEFORE their own stylesheet so these
   variables are shared and overridable per-product.
   ============================================================================ */
:root{
  /* surfaces */
  --bg1:#fbfcfd; --bg2:#f2f4f7; --panel:#ffffff; --panel2:#f7f9fb;
  /* text */
  --ink:#16202c; --muted:#566375;            /* muted darkened for small-text contrast (was #5d6b7c) */
  /* lines + brand */
  --line:#e4e8ee; --accent:#1f6fd6; --accent-ink:#ffffff;
  /* status */
  --good:#1f8a54; --warn:#9a5a00; --bad:#b4452f;
  /* data-viz */
  --p10:#dfe4ea; --p50:#1f6fd6; --p90:#a9c6e2; --grid:#f1f3f6; --chip:#eef2f7;
  /* info (teaching callouts, was overloaded green) */
  --info:#eef4fc; --info-line:#bcd6f3; --info-ink:#1a63c4;
  /* effects + shape */
  --shadow:0 14px 38px rgba(16,32,64,.12);
  --radius:14px;
}
html[data-theme="dark"]{
  --bg1:#0c1626; --bg2:#11233a; --panel:#15263d; --panel2:#1d324f;
  --ink:#eaf1fb; --muted:#9fb3cc;
  --line:#24405f; --accent:#4ea1ff; --accent-ink:#05213f;
  --good:#3ecf8e; --warn:#ffb84d; --bad:#ff6b6b;
  --p10:#27405d; --p50:#4ea1ff; --p90:#2f6f8f; --grid:#1c3350; --chip:#2a4a6e;
  --info:#16314e; --info-line:#2a4a6e; --info-ink:#9cc7ff;
  --shadow:0 14px 38px rgba(0,0,0,.45);
}