:root{
  /* Brand ramp — navy */
  --navy-900:#050f22;
  --navy-800:#0a1f44;   /* PRIMARY */
  --navy-700:#122c5c;
  --navy-600:#1c3f8e;   /* SECONDARY */
  --navy-500:#2b53ad;
  --navy-400:#4a71c7;

  /* Signal — gold */
  --gold-600:#c78f00;
  --gold-500:#f4b400;   /* CTA / ATTENTION */
  --gold-400:#ffc933;
  --gold-100:#fff2cf;

  /* Periwinkle — accent + separators, sparing */
  --peri-400:#99acff;
  --peri-200:#c9d3ff;

  /* Neutrals */
  --white:#ffffff;
  --mist-100:#f4f5f8;
  --mist-200:#e6e8ed;   /* light background / text on navy */
  --mist-300:#ced3dd;
  --slate-500:#6b7690;
  --slate-700:#3b445c;

  /* Semantic */
  --success-500:#1f8a5f;
  --warning-500:#f4b400;
  --danger-500:#c0392b;
  --info-500:#1c3f8e;

  /* Aliases — surfaces */
  --surface-page:var(--white);
  --surface-subtle:var(--mist-200);
  --surface-card:var(--white);
  --surface-inverse:var(--navy-800);
  --surface-inverse-deep:var(--navy-900);
  --surface-accent:var(--gold-500);

  /* Aliases — text */
  --text-strong:var(--navy-800);
  --text-body:var(--slate-700);
  --text-muted:var(--slate-500);
  --text-on-inverse:var(--mist-200);
  --text-on-inverse-strong:var(--white);
  --text-link:var(--navy-600);
  --text-link-hover:var(--navy-800);

  /* Aliases — lines */
  --line-hairline:var(--mist-300);
  --line-accent:var(--peri-400);
  --line-on-inverse:rgba(153,172,255,.32);

  /* Aliases — interactive */
  --action-primary:var(--navy-800);
  --action-primary-hover:var(--navy-700);
  --action-cta:var(--gold-500);
  --action-cta-hover:var(--gold-400);
  --action-cta-text:var(--navy-800);
  --focus-ring:var(--peri-400);
}