/* Design tokens: the one place for color, type, space, radius, depth and motion. Every other sheet reads these. */
:root {
  /* PACE 2026 brand */
  --navy: #002652;
  --blue: #0582BE;
  --orange: #FF9E18;
  --gray-light: #97A3AE;   /* decorative only */

  /* ink on light surfaces */
  --ink: #0B1F3A;
  --ink-2: #415364;        /* the brand dark gray */
  --ink-3: #5B6B7B;
  --link: #04699A;         /* the brand blue, one step darker for 5:1 on white */

  /* ink on the navy background */
  --on-bg: #FFFFFF;
  --on-bg-2: rgba(255, 255, 255, 0.82);
  --on-bg-shadow: 0 1px 5px rgba(0, 0, 0, 0.5), 0 3px 13px rgba(0, 0, 0, 0.32);

  /* surfaces */
  --glass: rgba(255, 255, 255, 0.9);
  --glass-edge: rgba(255, 255, 255, 0.6);
  --glass-blur: blur(20px) saturate(165%);
  --bar-glass: rgba(0, 20, 46, 0.58);
  --well: #F2F5F9;         /* solid inset inside a card: never glass on glass */
  --well-2: #E8EDF3;
  --line: rgba(0, 38, 82, 0.1);
  --line-strong: rgba(0, 38, 82, 0.18);

  /* state (always shipped with an icon and a word) */
  --good: #1B7F47;  --good-bg: #E3F4EA;
  --warn: #8A5300;  --warn-bg: #FFF1DC;
  --bad: #B3261E;   --bad-bg: #FCE8E6;
  --info: #04699A;  --info-bg: #E2F1F9;
  --idle: #4E5D6B;  --idle-bg: #ECEFF3;

  /* chart series A to D, validated as a set for color vision (adjacent CVD dE 22, normal 28); series-2 sits at 2.8:1 on
     the card, so every mark of it carries its letter */
  --series-1: #0582BE;
  --series-2: #C97700;
  --series-3: #6250D6;
  --series-4: #13906B;
  --track: #E3EAF1;

  /* type: the platform UI face loads instantly and carries optical sizes */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, Consolas, monospace;
  --fs-display: clamp(1.625rem, 1.2rem + 1.6vw, 2.125rem);
  --fs-title: 1.1875rem;
  --fs-body: 0.9375rem;
  --fs-small: 0.8125rem;
  --fs-micro: 0.6875rem;

  /* space (rem so it grows with the reader's text size) */
  --s1: 0.25rem; --s2: 0.5rem; --s3: 0.75rem; --s4: 1rem; --s5: 1.25rem; --s6: 1.5rem; --s8: 2rem; --s10: 2.5rem;

  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-pill: 999px;
  --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.5) inset, 0 12px 40px rgba(0, 12, 32, 0.32), 0 2px 8px rgba(0, 12, 32, 0.16);

  /* motion: critically damped feel, no overshoot */
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --t-press: 100ms;
  --t-ui: 180ms;
  --t-enter: 320ms;
}
