/* GENERATED by scripts/gen-brand.ts — edit src/styles/palette.ts instead. */
:root {
  color-scheme: light;
  --color-bg: #FCFBF9;
  --color-surface: #F6F6F7;
  --color-surfaceRaised: #E9EAEC;
  --color-border: #63696D;
  --color-text: #1F2224;
  --color-textMuted: #484D51;
  --color-accent: #005C99;
  --color-accentHover: #024979;
  --color-accentFg: #FCFBF9;
  --color-focusRing: #005C99;
  --color-brand-anchor: #0070BB;
  --color-contact-fill: #005C99;
  --color-contact-fault: #FFD2C7;
  --color-fault: #B3261E;
  --color-hairline: color-mix(in oklab, var(--color-text) 10%, transparent);
  --color-hairline-strong: color-mix(in oklab, var(--color-text) 18%, transparent);
  --color-accentSurface: color-mix(in oklab, var(--color-accent) 14%, var(--color-surface));
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-bg: #0C0F14;
    --color-surface: #1F2224;
    --color-surfaceRaised: #313538;
    --color-border: #7E868B;
    --color-text: #FCFBF9;
    --color-textMuted: #CCD0D2;
    --color-accent: #77C7FD;
    --color-accentHover: #ADDDFD;
    --color-accentFg: #0C0F14;
    --color-focusRing: #77C7FD;
    --color-fault: #FFB4A9;
  }
}

:root[data-theme="light"] {
  color-scheme: light;
  --color-bg: #FCFBF9;
  --color-surface: #F6F6F7;
  --color-surfaceRaised: #E9EAEC;
  --color-border: #63696D;
  --color-text: #1F2224;
  --color-textMuted: #484D51;
  --color-accent: #005C99;
  --color-accentHover: #024979;
  --color-accentFg: #FCFBF9;
  --color-focusRing: #005C99;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #0C0F14;
  --color-surface: #1F2224;
  --color-surfaceRaised: #313538;
  --color-border: #7E868B;
  --color-text: #FCFBF9;
  --color-textMuted: #CCD0D2;
  --color-accent: #77C7FD;
  --color-accentHover: #ADDDFD;
  --color-accentFg: #0C0F14;
  --color-focusRing: #77C7FD;
  --color-fault: #FFB4A9;
}