/* Served as a static asset — never processed by Tailwind (which would bake colors in). */

html[data-theme='light'],
html:not([data-theme]) {
  color-scheme: light;

  --color-primary: 0 62 130;
  --color-primary-container: 0 85 173;
  --color-on-primary: 255 255 255;
  --color-on-primary-container: 181 206 255;
  --color-secondary: 188 0 10;
  --color-secondary-container: 227 35 30;
  --color-on-secondary: 255 255 255;
  --color-tertiary: 115 92 0;
  --color-tertiary-container: 206 167 0;
  --color-on-tertiary: 255 255 255;
  --color-on-tertiary-container: 78 62 0;
  --color-background: 249 249 249;
  --color-surface: 249 249 249;
  --color-surface-container-lowest: 255 255 255;
  --color-surface-container-low: 243 243 243;
  --color-surface-container: 238 238 238;
  --color-surface-container-high: 232 232 232;
  --color-surface-container-highest: 226 226 226;
  --color-on-surface: 26 28 28;
  --color-on-surface-variant: 66 71 82;
  --color-on-background: 26 28 28;
  --color-outline: 114 119 131;
  --color-outline-variant: 194 198 212;
  --color-brand: 0 62 130;
  --color-brand-container: 0 85 173;
  --color-on-brand: 255 255 255;
  --color-on-brand-container: 181 206 255;
  --shadow-chrome: 0 8px 40px rgb(26 28 28 / 0.04);
  --shadow-chrome-up: 0 -8px 40px rgb(26 28 28 / 0.06);
  --shadow-card: 0 8px 30px rgb(26 28 28 / 0.04);
  --shadow-float: 0 20px 60px rgb(26 28 28 / 0.14);
  --shadow-pop: 0 12px 40px rgb(26 28 28 / 0.16);
  --shadow-primary: 0 8px 30px rgb(0 62 130 / 0.15);
  --chrome-opacity: 0.9;
  --brick-primary: rgb(var(--color-primary));
  --brick-secondary: rgb(var(--color-secondary));
  --brick-outline: rgb(var(--color-outline));
  --brick-track: rgb(var(--color-surface-container-high));
}

html[data-theme='dark'],
html.dark {
  color-scheme: dark;

  --color-primary: 91 158 232;
  --color-primary-container: 56 130 214;
  --color-on-primary: 255 255 255;
  --color-on-primary-container: 255 255 255;
  --color-secondary: 239 83 80;
  --color-secondary-container: 198 40 40;
  --color-on-secondary: 255 255 255;
  --color-tertiary: 232 196 64;
  --color-tertiary-container: 206 167 0;
  --color-on-tertiary: 48 40 0;
  --color-on-tertiary-container: 255 236 170;
  --color-background: 18 20 22;
  --color-surface: 18 20 22;
  --color-surface-container-lowest: 28 30 32;
  --color-surface-container-low: 34 36 38;
  --color-surface-container: 40 43 46;
  --color-surface-container-high: 48 52 56;
  --color-surface-container-highest: 58 62 67;
  --color-on-surface: 230 231 232;
  --color-on-surface-variant: 184 188 198;
  --color-on-background: 230 231 232;
  --color-outline: 139 145 156;
  --color-outline-variant: 63 68 76;
  --color-brand: 0 62 130;
  --color-brand-container: 0 85 173;
  --color-on-brand: 255 255 255;
  --color-on-brand-container: 181 206 255;
  --shadow-chrome: 0 8px 40px rgb(0 0 0 / 0.4);
  --shadow-chrome-up: 0 -8px 40px rgb(0 0 0 / 0.45);
  --shadow-card: 0 8px 30px rgb(0 0 0 / 0.28);
  --shadow-float: 0 20px 60px rgb(0 0 0 / 0.55);
  --shadow-pop: 0 12px 40px rgb(0 0 0 / 0.5);
  --shadow-primary: 0 8px 30px rgb(91 158 232 / 0.25);
  --chrome-opacity: 0.88;
  --brick-primary: rgb(var(--color-primary));
  --brick-secondary: rgb(var(--color-secondary));
  --brick-outline: rgb(var(--color-outline));
  --brick-track: rgb(var(--color-surface-container-high));
}