/* Durable Intelligence console tokens: the site's brand (deploy/public/site/api.html) adapted to a dense, calm work tool. */
@font-face { font-family: Inter; src: url(../fonts/inter.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url(../fonts/serif.woff2) format("woff2"); font-weight: 200 900; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url(../fonts/serif-italic.woff2) format("woff2"); font-weight: 200 900; font-style: italic; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url(../fonts/mono.woff2) format("woff2"); font-weight: 400; font-display: swap; }

:root {
  /* brand */
  --ultra: #3A34E6; --ultra-deep: #1D1A8C; --verm: #E06245; --gold: #F4CE46; --chalk: #EEEAE3; --plum: #231F2B;
  --lilac: #B6A5CF; --cream: #FBF1CF; --apricot: #F0AE45;

  --sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;

  --ease: cubic-bezier(.2, .7, .1, 1);
  --rise: cubic-bezier(.18, .9, .28, 1.06);
  --r-s: 6px; --r-m: 9px; --r-l: 13px;

  /* light surfaces: a cool plum-tinted neutral, not the landing page's chalk */
  --canvas: #F5F4F7;
  --panel: #FFFFFF;
  --raised: #FFFFFF;
  --sunk: #EEECF1;
  --hover: rgba(35, 31, 43, .045);
  --press: rgba(35, 31, 43, .08);
  --sel: rgba(58, 52, 230, .085);
  --line: rgba(35, 31, 43, .085);
  --line-2: rgba(35, 31, 43, .15);
  --grid: rgba(35, 31, 43, .07);
  --ink: #231F2B;
  --ink-2: #565068;
  --ink-3: #6F6981;
  --ink-4: #A29DAF;
  --accent: #3A34E6;
  --accent-ink: #3530D6;
  --accent-wash: rgba(58, 52, 230, .08);
  --btn: #3A34E6;
  --btn-hover: #2F29D2;
  --on-btn: #FFFFFF;
  --focus: 0 0 0 2px var(--panel), 0 0 0 4px rgba(58, 52, 230, .55);

  /* status: reserved, always with an icon and a word */
  --good: #16865A; --good-wash: rgba(22, 134, 90, .1);
  --warn: #F4CE46; --warn-ink: #7D5600; --warn-wash: rgba(244, 206, 70, .26);
  --bad: #E06245; --bad-ink: #B23F27; --bad-wash: rgba(224, 98, 69, .1);

  /* categorical, validated (dataviz validate_palette.js, light on #FFFFFF: all pass) */
  --c1: #3A34E6; --c2: #C9801A; --c3: #B8479F;
  --c1-wash: rgba(58, 52, 230, .1);

  --shadow-pop: 0 0 0 1px rgba(35, 31, 43, .07), 0 18px 48px -12px rgba(35, 31, 43, .28), 0 3px 8px rgba(35, 31, 43, .06);
  --shadow-sheet: -1px 0 0 rgba(35, 31, 43, .08), -24px 0 60px -24px rgba(35, 31, 43, .22);
  --scrim: rgba(35, 31, 43, .18);
  color-scheme: light;
}

:root[data-theme="dark"] {
  --canvas: #15121B;
  --panel: #1C1823;
  --raised: #25202D;
  --sunk: #110E16;
  --hover: rgba(238, 234, 227, .05);
  --press: rgba(238, 234, 227, .09);
  --sel: rgba(126, 120, 250, .16);
  --line: rgba(238, 234, 227, .075);
  --line-2: rgba(238, 234, 227, .14);
  --grid: rgba(238, 234, 227, .07);
  --ink: #EEEAE3;
  --ink-2: #B9B3C4;
  --ink-3: #9790A5;
  --ink-4: #6B6479;
  --accent: #7E78FA;
  --accent-ink: #A9A5FF;
  --accent-wash: rgba(126, 120, 250, .13);
  --btn: #4B45EF;
  --btn-hover: #5A54F5;
  --on-btn: #FFFFFF;
  --focus: 0 0 0 2px var(--panel), 0 0 0 4px rgba(126, 120, 250, .7);

  --good: #3FB984; --good-wash: rgba(63, 185, 132, .13);
  --warn: #F4CE46; --warn-ink: #F4CE46; --warn-wash: rgba(244, 206, 70, .13);
  --bad: #F07A5E; --bad-ink: #F59A83; --bad-wash: rgba(240, 122, 94, .13);

  /* categorical, validated (dark on #1E1A25: all pass) */
  --c1: #7E78FA; --c2: #BF7D1C; --c3: #C35AAA;
  --c1-wash: rgba(126, 120, 250, .14);

  --shadow-pop: 0 0 0 1px rgba(238, 234, 227, .09), 0 24px 60px -12px rgba(0, 0, 0, .6);
  --shadow-sheet: -1px 0 0 rgba(238, 234, 227, .08), -24px 0 60px -20px rgba(0, 0, 0, .55);
  --scrim: rgba(8, 6, 12, .45);
  color-scheme: dark;
}