:root{
/* Core ramp — deep navy to off-white. Sampled from the brand illustrations. */
--navy-1000:#00162f;
--navy-900:#0a1931;
--navy-800:#12294c;
--navy-700:#1a3d63;
--navy-600:#2b5680;
--navy-500:#4a7fa7;
--navy-400:#6b93b8;
--navy-300:#8ca5cc;
--navy-200:#b3cfe5;
--navy-100:#d7e6f4;
--navy-050:#eaf2fb;
--paper:#f5f9ff;
--paper-warm:#f6fafd;
--white:#ffffff;

/* Signal — used only for status, never decoration. */
--signal-soon:#4a7fa7;
--signal-live:#1f7a5a;
--signal-warn:#a8571f;
--signal-error:#a32c2c;

/* Semantic surfaces */
--surface-page:var(--paper);
--surface-card:var(--white);
--surface-sunken:var(--navy-050);
--surface-inverse:var(--navy-1000);
--surface-inverse-raised:var(--navy-900);
--surface-accent:var(--navy-200);

/* Semantic text — every pairing below clears WCAG AA at body size. */
--text-strong:var(--navy-1000);
--text-body:var(--navy-800);
--text-muted:var(--navy-600);
--text-on-inverse:var(--navy-050);
--text-on-inverse-muted:var(--navy-300);
--text-on-accent:var(--navy-1000);
--text-link:var(--navy-700);
--text-link-hover:var(--navy-1000);

/* Borders & lines */
--line-hairline:rgba(0,22,47,.12);
--line-strong:rgba(0,22,47,.28);
--line-on-inverse:rgba(179,207,229,.22);
--line-focus:var(--navy-500);

/* Scrims for text over illustration */
--scrim-navy:linear-gradient(180deg,rgba(0,22,47,.86) 0%,rgba(0,22,47,.58) 45%,rgba(0,22,47,.82) 100%); /* @kind color */
--scrim-bottom:linear-gradient(180deg,rgba(0,22,47,0) 0%,rgba(0,22,47,.75) 100%); /* @kind color */
}