/* Generated by scripts/sync-color-tokens.mjs from docs/design/luli-color-tokens.json. */

:root {
  --luli-brand: #526776;
  --luli-bg: #F7F8F9;
  --luli-surface: #FFFFFF;
  --luli-soft: #F1F3F4;
  --luli-ink: #29333A;
  --luli-muted: #5E6871;
  --luli-primary: #E5E8EA;
  --luli-hover: #DBDFE2;
  --luli-pressed: #D0D6DA;
  --luli-on: #40505C;
  --luli-link: #526776;
  --luli-border: transparent;
  --luli-divider: #EEF0F1;
  --luli-edge: transparent;
  --luli-structure: #D0D6DA;
  --luli-row: #D0D6DA;
  --luli-tool: #D0D6DA;
  --luli-container: transparent;
  --luli-control: #526776;
  --luli-selected: #526776;
  --luli-focus: #526776;
  --luli-content: #526776;
  --luli-selected-bg: #E5E8EA;
  --luli-selected-hover: #DBDFE2;
  --luli-selected-pressed: #D0D6DA;
  --luli-success: #4D6352;
  --luli-success-bg: #EDF1EB;
  --luli-warning: #756044;
  --luli-warning-bg: #F6F1E8;
  --luli-error: #885B60;
  --luli-error-bg: #F6EDEE;
  --luli-info: #526675;
  --luli-info-bg: #EDF1F4;
  --luli-input-shadow: 0 2px 8px rgba(32,47,59,.035), 0 12px 32px rgba(32,47,59,.035);
  color-scheme: light;
}

html[data-theme="dark"] {
  --luli-brand: #526776;
  --luli-bg: #181D21;
  --luli-surface: #242B30;
  --luli-soft: #303B42;
  --luli-ink: #E1E7E3;
  --luli-muted: #B7C1BC;
  --luli-primary: #384751;
  --luli-hover: #40515C;
  --luli-pressed: #465965;
  --luli-on: #E0E4E6;
  --luli-link: #B6BFC5;
  --luli-border: transparent;
  --luli-divider: #2C353C;
  --luli-edge: transparent;
  --luli-structure: #465965;
  --luli-row: #465965;
  --luli-tool: #465965;
  --luli-container: transparent;
  --luli-control: #B6BFC5;
  --luli-selected: #B6BFC5;
  --luli-focus: #B6BFC5;
  --luli-content: #B6BFC5;
  --luli-selected-bg: #384751;
  --luli-selected-hover: #40515C;
  --luli-selected-pressed: #465965;
  --luli-success: #BBCBBB;
  --luli-success-bg: #2C382E;
  --luli-warning: #D5C3A7;
  --luli-warning-bg: #3C3429;
  --luli-error: #DBB9BE;
  --luli-error-bg: #432E33;
  --luli-info: #BCCBD6;
  --luli-info-bg: #2C3741;
  --luli-input-shadow: 0 2px 8px rgba(0,0,0,.10), 0 12px 32px rgba(0,0,0,.10);
  color-scheme: dark;
}