:root{
  /* ---- Base ramps ---- */
  /* Brand blue — #1561BC. The conductor's cap and the logo field. */
  --navy-900:#0A2A52; --navy-800:#10457F; --navy-700:#1561BC; --navy-600:#2C7AD4;
  --navy-500:#4C8FDC; --navy-300:#8FBAEA; --navy-200:#BDD7F4; --navy-100:#DEEAF9; --navy-050:#F0F6FD;

  /* Sky — the uniform shirt. Secondary / fills. */
  --sky-600:#5E93C6; --sky-500:#7FAEDC; --sky-400:#A6C9EA; --sky-300:#BBD8F2;
  --sky-200:#D6E8F8; --sky-100:#EAF3FC;

  /* Lime — the "o" in the wordmark and the cap badge. Single accent, used sparingly. */
  --lime-700:#5E7300; --lime-600:#86A800; --lime-500:#AED800;
  --lime-300:#CDEB5C; --lime-100:#EEF8C4;

  /* Slate — pigeon plumage. Neutral ramp with a cool cast. */
  --slate-900:#151C24; --slate-800:#1E2832; --slate-700:#33414F; --slate-600:#4C5C6B;
  --slate-500:#6C7F8C; --slate-400:#93A4B0; --slate-300:#BAC6CE; --slate-200:#D8E0E5;
  --slate-150:#E5EAEE; --slate-100:#EFF2F4; --slate-050:#F7F9FA; --white:#FFFFFF;

  /* Status ramps — punctuality is the product, so these are first-class. */
  --green-700:#146B4C; --green-600:#1F8A63; --green-100:#DEF2E9;
  --amber-700:#9A6206; --amber-600:#D98A0B; --amber-100:#FBEBCE;
  --red-700:#93301F; --red-600:#C8452F; --red-100:#FBE2DD;
  --violet-600:#6A4FA8; --violet-100:#EAE3F8;

  /* ---- Semantic: surfaces ---- */
  --surface-page:#F4F6F8;
  --surface-card:var(--white);
  --surface-sunken:var(--slate-100);
  --surface-inverse:var(--navy-900);
  --surface-brand:var(--navy-700);
  --surface-brand-soft:var(--navy-050);
  --surface-accent-soft:var(--lime-100);
  --surface-overlay:rgba(14,28,54,.55);
  --surface-glass:rgba(255,255,255,.72);

  /* ---- Semantic: text ---- */
  --text-strong:var(--slate-900);
  --text-body:var(--slate-700);
  --text-muted:var(--slate-500);
  --text-faint:var(--slate-400);
  --text-inverse:var(--white);
  --text-brand:var(--navy-700);
  --text-link:var(--navy-600);
  --text-link-hover:var(--navy-800);

  /* ---- Semantic: lines ---- */
  --border-subtle:var(--slate-150);
  --border-default:var(--slate-200);
  --border-strong:var(--slate-300);
  --border-brand:var(--navy-700);
  --border-focus:var(--navy-500);

  /* ---- Semantic: status ---- */
  --status-ontime-fg:var(--green-700); --status-ontime-bg:var(--green-100); --status-ontime-dot:var(--green-600);
  --status-delayed-fg:var(--amber-700); --status-delayed-bg:var(--amber-100); --status-delayed-dot:var(--amber-600);
  --status-cancelled-fg:var(--red-700); --status-cancelled-bg:var(--red-100); --status-cancelled-dot:var(--red-600);
  --status-info-fg:var(--navy-700); --status-info-bg:var(--navy-050); --status-info-dot:var(--navy-600);
  --status-planned-fg:var(--violet-600); --status-planned-bg:var(--violet-100); --status-planned-dot:var(--violet-600);

  /* ---- Transport mode colours (Catalan network) ---- */
  --mode-rodalies:#E1251B;   /* Rodalies de Catalunya R-lines */
  --mode-fgc:#F58220;        /* Ferrocarrils de la Generalitat */
  --mode-metro:#D6001C;      /* TMB Metro */
  --mode-bus:#0B7CC1;        /* Urban + interurban bus */
  --mode-tram:#00A19A;       /* Trambaix / Trambesòs */
  --mode-regional:#5B2D8E;   /* Mitja distància */
  --mode-walk:var(--slate-500);
}