/* Portal UI kit v1: tokens.
   Every colour, size, space, radius and the grid live here. Components read these and nothing else. */
:root{
  /* Colour: brand and surfaces */
  --navy:#14293C; --navy-2:#22415C; --navy-line:#2C4761; --side-text:#C9D6E2; --side-mut:#9FB3C5;
  --accent:#D42A2A; --band:#1F5A8F; --band-text:#FFFFFF; --band-note:#D5E2EE; --band-off:#6B7078;
  --ink:#16181C; --ink-2:#3B4048; --mut:#6B7078;
  --bg:#F6F5F1; --white:#FFFFFF; --line:#E3E0D8; --line-2:#EEECE6;
  /* Colour: status (one status system) */
  --blue:#1C3D5A; --blue-bg:#EEF3F8; --blue-line:#CFDCE8;
  --green:#2C6049; --green-bg:#EEF6F1; --green-line:#CBE2D5;
  --amber:#7A4E08; --amber-bg:#FBF5E8; --amber-line:#EADCBC;
  --red:#97372B; --red-bg:#FBF1EF; --red-line:#EBCFC9;
  --link:#1F5A8F;

  /* Type: Varela Round, one scale */
  --font:"Varela Round",system-ui,sans-serif;
  --t-xs:11px; --t-sm:12px; --t-base:14px; --t-md:16px; --t-lg:19px; --t-xl:22px; --t-xxl:30px;
  --lh:1.5;

  /* Space: 4px steps */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px;

  /* Radius */
  --r-sm:6px; --r-md:10px; --r-lg:12px; --r-xl:16px; --r-pill:999px;

  /* Layout */
  --side-w:220px; --page-max:1080px; --read-max:780px; --gap:16px; --cols:12;
  --shadow:0 2px 10px rgba(20,41,60,.06); --shadow-pop:0 8px 24px rgba(20,41,60,.18);
}