[data-brand='liquid'] {
  --colors-raw-liquidblue-050-v-oklch: 0.977 0.018 263;
  --colors-raw-liquidblue-100-v-oklch: 0.94 0.035 263;
  --colors-raw-liquidblue-150-v-oklch: 0.902 0.055 263.5;
  --colors-raw-liquidblue-200-v-oklch: 0.862 0.078 264;
  --colors-raw-liquidblue-250-v-oklch: 0.795 0.108 264.5;
  --colors-raw-liquidblue-300-v-oklch: 0.7242 0.1374 264.83;
  --colors-raw-liquidblue-350-v-oklch: 0.64 0.184 264;
  --colors-raw-liquidblue-400-v-oklch: 0.562 0.232 263.04;
  --colors-raw-liquidblue-450-v-oklch: 0.5206 0.2128 263.04;
  --colors-raw-liquidblue-500-v-oklch: 0.4792 0.1936 263.03;
  --colors-raw-liquidblue-550-v-oklch: 0.4359 0.1733 263.03;
  --colors-raw-liquidblue-600-v-oklch: 0.3927 0.153 263.02;
  --colors-raw-liquidblue-650-v-oklch: 0.355 0.137 263.02;
  --colors-raw-liquidblue-700-v-oklch: 0.318 0.121 263.02;
  --colors-raw-liquidblue-750-v-oklch: 0.281 0.103 263.02;
  --colors-raw-liquidblue-800-v-oklch: 0.244 0.084 263.02;
  --colors-raw-liquidblue-850-v-oklch: 0.207 0.064 263.02;
  --colors-raw-liquidblue-900-v-oklch: 0.17 0.043 263.02;
  --colors-raw-liquidblue-950-v-oklch: 0.12 0.026 263.02;
  --colors-raw-liquidcyan-050-v-oklch: 0.977 0.023 230;
  --colors-raw-liquidcyan-100-v-oklch: 0.946 0.045 232;
  --colors-raw-liquidcyan-150-v-oklch: 0.914 0.066 233;
  --colors-raw-liquidcyan-200-v-oklch: 0.881 0.087 234;
  --colors-raw-liquidcyan-250-v-oklch: 0.845 0.108 234.5;
  --colors-raw-liquidcyan-300-v-oklch: 0.809 0.128 235;
  --colors-raw-liquidcyan-350-v-oklch: 0.78 0.14 235.5;
  --colors-raw-liquidcyan-400-v-oklch: 0.755 0.148 235.6;
  --colors-raw-liquidcyan-450-v-oklch: 0.742 0.152 235.7;
  --colors-raw-liquidcyan-500-v-oklch: 0.7308 0.1567 235.75;
  --colors-raw-liquidcyan-550-v-oklch: 0.669 0.143 235.75;
  --colors-raw-liquidcyan-600-v-oklch: 0.608 0.132 235.75;
  --colors-raw-liquidcyan-650-v-oklch: 0.547 0.115 235.75;
  --colors-raw-liquidcyan-700-v-oklch: 0.486 0.097 235.75;
  --colors-raw-liquidcyan-750-v-oklch: 0.425 0.078 235.75;
  --colors-raw-liquidcyan-800-v-oklch: 0.364 0.06 235.75;
  --colors-raw-liquidcyan-850-v-oklch: 0.303 0.043 235.75;
  --colors-raw-liquidcyan-900-v-oklch: 0.242 0.028 235.75;
  --colors-raw-liquidcyan-950-v-oklch: 0.18 0.016 235.75;
  --colors-raw-liquidred-050-v-oklch: 0.97 0.03 20;
  --colors-raw-liquidred-100-v-oklch: 0.928 0.054 20;
  --colors-raw-liquidred-150-v-oklch: 0.882 0.078 20.2;
  --colors-raw-liquidred-200-v-oklch: 0.831 0.101 20.4;
  --colors-raw-liquidred-250-v-oklch: 0.7512 0.1267 20.5;
  --colors-raw-liquidred-300-v-oklch: 0.704 0.166 22;
  --colors-raw-liquidred-350-v-oklch: 0.6535 0.2027 24.72;
  --colors-raw-liquidred-400-v-oklch: 0.62 0.22 25.8;
  --colors-raw-liquidred-450-v-oklch: 0.5857 0.2385 26.69;
  --colors-raw-liquidred-500-v-oklch: 0.545 0.223 28;
  --colors-raw-liquidred-550-v-oklch: 0.5033 0.2065 29.23;
  --colors-raw-liquidred-600-v-oklch: 0.458 0.185 29.23;
  --colors-raw-liquidred-650-v-oklch: 0.4019 0.1649 29.23;
  --colors-raw-liquidred-700-v-oklch: 0.356 0.142 29.23;
  --colors-raw-liquidred-750-v-oklch: 0.31 0.119 29.23;
  --colors-raw-liquidred-800-v-oklch: 0.264 0.095 29.23;
  --colors-raw-liquidred-850-v-oklch: 0.218 0.07 29.23;
  --colors-raw-liquidred-900-v-oklch: 0.172 0.047 29.23;
  --colors-raw-liquidred-950-v-oklch: 0.126 0.026 29.23;
  --colors-raw-liquidgray-050-v-oklch: 0.9791 0 89.88;
  --colors-raw-liquidgray-100-v-oklch: 0.9335 0.0017 247.84;
  --colors-raw-liquidgray-150-v-oklch: 0.899 0.0015 247.84;
  --colors-raw-liquidgray-200-v-oklch: 0.8297 0 89.88;
  --colors-raw-liquidgray-250-v-oklch: 0.775 0.003 252.89;
  --colors-raw-liquidgray-300-v-oklch: 0.72 0.005 252.89;
  --colors-raw-liquidgray-350-v-oklch: 0.665 0.007 252.89;
  --colors-raw-liquidgray-400-v-oklch: 0.61 0.009 252.89;
  --colors-raw-liquidgray-450-v-oklch: 0.56 0.01 252.89;
  --colors-raw-liquidgray-500-v-oklch: 0.508 0.0113 252.89;
  --colors-raw-liquidgray-550-v-oklch: 0.464 0.01 252.89;
  --colors-raw-liquidgray-600-v-oklch: 0.42 0.009 252.89;
  --colors-raw-liquidgray-650-v-oklch: 0.376 0.008 252.89;
  --colors-raw-liquidgray-700-v-oklch: 0.332 0.007 252.89;
  --colors-raw-liquidgray-750-v-oklch: 0.288 0.006 252.89;
  --colors-raw-liquidgray-800-v-oklch: 0.244 0.005 252.89;
  --colors-raw-liquidgray-850-v-oklch: 0.2 0.004 252.89;
  --colors-raw-liquidgray-900-v-oklch: 0.156 0.003 252.89;
  --colors-raw-liquidgray-950-v-oklch: 0.112 0.002 252.89;
  --colors-raw-liquidgray-1000-v-oklch: 0 0 0;
  --colors-raw-neutral-fg-light-v-oklch: 0 0 0;
  --colors-raw-neutral-bg-light-v-oklch: 0.9791 0 89.88;
  --colors-raw-neutral-fg-dark-v-oklch: 0.9791 0 89.88;
  --colors-raw-neutral-bg-dark-v-oklch: 0 0 0;
  --colors-raw-base-bg1-light-v-oklch: 0.9791 0 89.88;
  --colors-raw-base-bg2-light-v-oklch: 0.9335 0.0017 247.84;
  --colors-raw-base-bg3-light-v-oklch: 0.8297 0 89.88;
  --colors-raw-base-bg1-dark-v-oklch: 0.112 0.002 252.89;
  --colors-raw-base-bg2-dark-v-oklch: 0.156 0.003 252.89;
  --colors-raw-base-bg3-dark-v-oklch: 0 0 0;
  --semantic-surface-1-light: oklch(var(--colors-raw-base-bg1-light-v-oklch));
  --semantic-surface-1-dark: oklch(var(--colors-raw-base-bg1-dark-v-oklch));
  --semantic-surface-2-light: oklch(var(--colors-raw-base-bg2-light-v-oklch));
  --semantic-surface-2-dark: oklch(var(--colors-raw-base-bg2-dark-v-oklch));
  --semantic-surface-3-light: oklch(var(--colors-raw-base-bg3-light-v-oklch));
  --semantic-surface-3-dark: oklch(var(--colors-raw-base-bg3-dark-v-oklch));
  --semantic-content-primary-light: oklch(var(--colors-raw-neutral-fg-light-v-oklch));
  --semantic-content-primary-dark: oklch(var(--colors-raw-neutral-fg-dark-v-oklch));
  --semantic-content-muted-light: oklch(var(--colors-raw-liquidgray-500-v-oklch));
  --semantic-content-muted-dark: oklch(var(--colors-raw-liquidgray-250-v-oklch));
  --semantic-content-inverse-light: oklch(var(--colors-raw-neutral-bg-light-v-oklch));
  --semantic-content-inverse-dark: oklch(var(--colors-raw-neutral-bg-dark-v-oklch));
  --semantic-border-subtle-light: oklch(var(--colors-raw-liquidgray-100-v-oklch));
  --semantic-border-subtle-dark: oklch(var(--colors-raw-liquidgray-800-v-oklch));
  --semantic-border-default-light: oklch(var(--colors-raw-liquidgray-200-v-oklch));
  --semantic-border-default-dark: oklch(var(--colors-raw-liquidgray-700-v-oklch));
  --semantic-brand-primary-light: oklch(var(--colors-raw-liquidblue-500-v-oklch));
  --semantic-brand-primary-dark: oklch(var(--colors-raw-liquidblue-400-v-oklch));
  --semantic-brand-primary-content-light: oklch(var(--colors-raw-liquidgray-050-v-oklch));
  --semantic-brand-primary-content-dark: oklch(var(--colors-raw-liquidgray-050-v-oklch));
  --semantic-brand-secondary-light: oklch(var(--colors-raw-liquidblue-700-v-oklch));
  --semantic-brand-secondary-dark: oklch(var(--colors-raw-liquidblue-500-v-oklch));
  --semantic-brand-accent-light: oklch(var(--colors-raw-liquidcyan-600-v-oklch));
  --semantic-brand-accent-dark: oklch(var(--colors-raw-liquidcyan-500-v-oklch));
  --semantic-brand-accent-content-light: oklch(var(--colors-raw-liquidgray-050-v-oklch));
  --semantic-brand-accent-content-dark: oklch(var(--colors-raw-liquidgray-1000-v-oklch));
  --semantic-neutral-base-light: oklch(var(--colors-raw-neutral-bg-light-v-oklch));
  --semantic-neutral-base-dark: oklch(var(--colors-raw-neutral-bg-dark-v-oklch));
  --semantic-neutral-content-light: oklch(var(--colors-raw-neutral-fg-light-v-oklch));
  --semantic-neutral-content-dark: oklch(var(--colors-raw-neutral-fg-dark-v-oklch));
  --semantic-status-info-light: oklch(var(--colors-raw-liquidcyan-600-v-oklch));
  --semantic-status-info-dark: oklch(var(--colors-raw-liquidcyan-500-v-oklch));
  --semantic-status-info-content-light: oklch(var(--colors-raw-liquidgray-050-v-oklch));
  --semantic-status-info-content-dark: oklch(var(--colors-raw-liquidgray-1000-v-oklch));
  --semantic-status-success-light: var(--brandOS-accent-lime-600);
  --semantic-status-success-dark: var(--brandOS-accent-lime-500);
  --semantic-status-success-content-light: var(--brandOS-accent-lime-050);
  --semantic-status-success-content-dark: var(--brandOS-accent-lime-950);
  --semantic-status-warning-light: var(--brandOS-accent-amber-600);
  --semantic-status-warning-dark: var(--brandOS-accent-amber-500);
  --semantic-status-warning-content-light: var(--brandOS-accent-amber-050);
  --semantic-status-warning-content-dark: var(--brandOS-accent-amber-950);
  --semantic-status-error-light: oklch(var(--colors-raw-liquidred-550-v-oklch));
  --semantic-status-error-dark: oklch(var(--colors-raw-liquidred-350-v-oklch));
  --semantic-status-error-content-light: oklch(var(--colors-raw-liquidgray-050-v-oklch));
  --semantic-status-error-content-dark: oklch(var(--colors-raw-liquidgray-050-v-oklch));
}

[data-brand='liquid'] {
  --colors-raw-liquidblue-050-hex: #f1f8ff;
  --colors-raw-liquidblue-100-hex: #dfecff;
  --colors-raw-liquidblue-150-hex: #ccdfff;
  --colors-raw-liquidblue-200-hex: #b8d2ff;
  --colors-raw-liquidblue-250-hex: #99bbff;
  --colors-raw-liquidblue-300-hex: #7ba3fc;
  --colors-raw-liquidblue-350-hex: #5185fa;
  --colors-raw-liquidblue-400-hex: #2365fa;
  --colors-raw-liquidblue-450-hex: #1f5be1;
  --colors-raw-liquidblue-500-hex: #1c51c8;
  --colors-raw-liquidblue-550-hex: #1847af;
  --colors-raw-liquidblue-600-hex: #153d96;
  --colors-raw-liquidblue-650-hex: #113482;
  --colors-raw-liquidblue-700-hex: #0e2c6f;
  --colors-raw-liquidblue-750-hex: #0b245b;
  --colors-raw-liquidblue-800-hex: #091d47;
  --colors-raw-liquidblue-850-hex: #071634;
  --colors-raw-liquidblue-900-hex: #060f22;
  --colors-raw-liquidblue-950-hex: #02050f;
  --colors-raw-liquidcyan-050-hex: #e9fbff;
  --colors-raw-liquidcyan-100-hex: #d0f3ff;
  --colors-raw-liquidcyan-150-hex: #b7ebff;
  --colors-raw-liquidcyan-200-hex: #9ee2ff;
  --colors-raw-liquidcyan-250-hex: #81d8ff;
  --colors-raw-liquidcyan-300-hex: #62cdff;
  --colors-raw-liquidcyan-350-hex: #4ac4ff;
  --colors-raw-liquidcyan-400-hex: #32bdff;
  --colors-raw-liquidcyan-450-hex: #22b8fd;
  --colors-raw-liquidcyan-500-hex: #00b5fc;
  --colors-raw-liquidcyan-550-hex: #03a1e0;
  --colors-raw-liquidcyan-600-hex: #008dc6;
  --colors-raw-liquidcyan-650-hex: #097aaa;
  --colors-raw-liquidcyan-700-hex: #14678e;
  --colors-raw-liquidcyan-750-hex: #195473;
  --colors-raw-liquidcyan-800-hex: #1a4359;
  --colors-raw-liquidcyan-850-hex: #173241;
  --colors-raw-liquidcyan-900-hex: #12222b;
  --colors-raw-liquidcyan-950-hex: #0b1318;
  --colors-raw-liquidred-050-hex: #ffeeed;
  --colors-raw-liquidred-100-hex: #ffdad8;
  --colors-raw-liquidred-150-hex: #ffc4c3;
  --colors-raw-liquidred-200-hex: #ffadac;
  --colors-raw-liquidred-250-hex: #f48c8c;
  --colors-raw-liquidred-300-hex: #f66f70;
  --colors-raw-liquidred-350-hex: #f34d4d;
  --colors-raw-liquidred-400-hex: #ee3438;
  --colors-raw-liquidred-450-hex: #e8001c;
  --colors-raw-liquidred-500-hex: #d3000e;
  --colors-raw-liquidred-550-hex: #be0000;
  --colors-raw-liquidred-600-hex: #a60603;
  --colors-raw-liquidred-650-hex: #8c0000;
  --colors-raw-liquidred-700-hex: #750503;
  --colors-raw-liquidred-750-hex: #5f0804;
  --colors-raw-liquidred-800-hex: #490905;
  --colors-raw-liquidred-850-hex: #340905;
  --colors-raw-liquidred-900-hex: #210604;
  --colors-raw-liquidred-950-hex: #0f0403;
  --colors-raw-liquidgray-050-hex: #f8f8f8;
  --colors-raw-liquidgray-100-hex: #e8e9ea;
  --colors-raw-liquidgray-150-hex: #dddede;
  --colors-raw-liquidgray-200-hex: #c7c7c7;
  --colors-raw-liquidgray-250-hex: #b4b6b8;
  --colors-raw-liquidgray-300-hex: #a2a5a8;
  --colors-raw-liquidgray-350-hex: #919498;
  --colors-raw-liquidgray-400-hex: #7f8489;
  --colors-raw-liquidgray-450-hex: #70757a;
  --colors-raw-liquidgray-500-hex: #61666c;
  --colors-raw-liquidgray-550-hex: #555a5f;
  --colors-raw-liquidgray-600-hex: #4a4d52;
  --colors-raw-liquidgray-650-hex: #3e4246;
  --colors-raw-liquidgray-700-hex: #333639;
  --colors-raw-liquidgray-750-hex: #292b2e;
  --colors-raw-liquidgray-800-hex: #1f2023;
  --colors-raw-liquidgray-850-hex: #151618;
  --colors-raw-liquidgray-900-hex: #0b0c0e;
  --colors-raw-liquidgray-950-hex: #040505;
  --colors-raw-liquidgray-1000-hex: #000000;
}

/* DaisyUI overlay for Liquid.
 * Maps DaisyUI's --color-* vars onto --semantic-* tokens.
 */

[data-brand='liquid'] {
  /* Brand */
  --color-primary: var(--semantic-brand-primary);
  --color-primary-content: var(--semantic-brand-primary-content);
  --color-secondary: var(--semantic-brand-secondary);
  --color-secondary-content: var(--semantic-brand-primary-content);
  --color-accent: var(--semantic-brand-accent);
  --color-accent-content: var(--semantic-brand-accent-content);

  /* Base surfaces / content */
  --root-bg: var(--semantic-surface-1);
  --color-base-100: var(--semantic-surface-1);
  --color-base-200: var(--semantic-surface-2);
  --color-base-300: var(--semantic-surface-3);
  --color-base-content: var(--semantic-content-primary);

  /* Neutral */
  --color-neutral: var(--semantic-neutral-base);
  --color-neutral-content: var(--semantic-neutral-content);

  /* Status */
  --color-info: var(--semantic-status-info);
  --color-info-content: var(--semantic-status-info-content);
  --color-success: var(--semantic-status-success);
  --color-success-content: var(--semantic-status-success-content);
  --color-warning: var(--semantic-status-warning);
  --color-warning-content: var(--semantic-status-warning-content);
  --color-error: var(--semantic-status-error);
  --color-error-content: var(--semantic-status-error-content);
}

[data-brand='liquid'][data-theme='light'] {
  color-scheme: light;
}
[data-brand='liquid'][data-theme='dark'] {
  color-scheme: dark;
}

/*
 * Liquid Brand - MUI Color Mappings
 *
 * Maps MUI palette CSS variables to Liquid brand tokens.
 */

/* Light Mode */
[data-brand='liquid'][data-theme='light'] {
  /* Primary */
  --mui-palette-primary-main: var(--brandOS-primary-500);
  --mui-palette-primary-light: var(--brandOS-primary-300);
  --mui-palette-primary-dark: var(--brandOS-primary-700);
  --mui-palette-primary-contrastText: var(--brandOS-gray-050);

  /* Secondary */
  --mui-palette-secondary-main: oklch(var(--colors-raw-liquidcyan-600-v-oklch));
  --mui-palette-secondary-light: oklch(var(--colors-raw-liquidcyan-300-v-oklch));
  --mui-palette-secondary-dark: oklch(var(--colors-raw-liquidcyan-800-v-oklch));
  --mui-palette-secondary-contrastText: var(--brandOS-gray-050);

  /* Error */
  --mui-palette-error-main: oklch(var(--colors-raw-liquidred-550-v-oklch));
  --mui-palette-error-light: oklch(var(--colors-raw-liquidred-350-v-oklch));
  --mui-palette-error-dark: oklch(var(--colors-raw-liquidred-700-v-oklch));
  --mui-palette-error-contrastText: var(--brandOS-gray-050);

  /* Warning */
  --mui-palette-warning-main: var(--brandOS-accent-amber-600);
  --mui-palette-warning-light: var(--brandOS-accent-amber-400);
  --mui-palette-warning-dark: var(--brandOS-accent-amber-800);
  --mui-palette-warning-contrastText: var(--brandOS-accent-amber-050);

  /* Info */
  --mui-palette-info-main: oklch(var(--colors-raw-liquidcyan-600-v-oklch));
  --mui-palette-info-light: oklch(var(--colors-raw-liquidcyan-300-v-oklch));
  --mui-palette-info-dark: oklch(var(--colors-raw-liquidcyan-800-v-oklch));
  --mui-palette-info-contrastText: var(--brandOS-gray-050);

  /* Success */
  --mui-palette-success-main: var(--brandOS-accent-lime-600);
  --mui-palette-success-light: var(--brandOS-accent-lime-400);
  --mui-palette-success-dark: var(--brandOS-accent-lime-800);
  --mui-palette-success-contrastText: var(--brandOS-accent-lime-050);

  /* Background */
  --mui-palette-background-default: var(--brandOS-background-primary);
  --mui-palette-background-paper: var(--brandOS-background-elevated);

  /* Text */
  --mui-palette-text-primary: var(--brandOS-text-primary);
  --mui-palette-text-secondary: var(--brandOS-text-secondary);
  --mui-palette-text-disabled: var(--brandOS-text-tertiary);

  /* Divider */
  --mui-palette-divider: var(--brandOS-border-default);

  /* Action */
  --mui-palette-action-active: var(--brandOS-text-secondary);
  --mui-palette-action-hover: var(--brandOS-interactive-secondary);
  --mui-palette-action-selected: var(--brandOS-interactive-secondary-hover);
  --mui-palette-action-focus: var(--brandOS-border-focus);
}

/* Dark Mode */
[data-brand='liquid'][data-theme='dark'] {
  /* Primary */
  --mui-palette-primary-main: var(--brandOS-primary-400);
  --mui-palette-primary-light: var(--brandOS-primary-300);
  --mui-palette-primary-dark: var(--brandOS-primary-600);
  --mui-palette-primary-contrastText: var(--brandOS-gray-050);

  /* Secondary */
  --mui-palette-secondary-main: oklch(var(--colors-raw-liquidcyan-500-v-oklch));
  --mui-palette-secondary-light: oklch(var(--colors-raw-liquidcyan-300-v-oklch));
  --mui-palette-secondary-dark: oklch(var(--colors-raw-liquidcyan-700-v-oklch));
  --mui-palette-secondary-contrastText: var(--brandOS-gray-1000);

  /* Error */
  --mui-palette-error-main: oklch(var(--colors-raw-liquidred-350-v-oklch));
  --mui-palette-error-light: oklch(var(--colors-raw-liquidred-250-v-oklch));
  --mui-palette-error-dark: oklch(var(--colors-raw-liquidred-550-v-oklch));
  --mui-palette-error-contrastText: var(--brandOS-gray-050);

  /* Warning */
  --mui-palette-warning-main: var(--brandOS-accent-amber-500);
  --mui-palette-warning-light: var(--brandOS-accent-amber-300);
  --mui-palette-warning-dark: var(--brandOS-accent-amber-700);
  --mui-palette-warning-contrastText: var(--brandOS-accent-amber-950);

  /* Info */
  --mui-palette-info-main: oklch(var(--colors-raw-liquidcyan-500-v-oklch));
  --mui-palette-info-light: oklch(var(--colors-raw-liquidcyan-300-v-oklch));
  --mui-palette-info-dark: oklch(var(--colors-raw-liquidcyan-700-v-oklch));
  --mui-palette-info-contrastText: var(--brandOS-gray-1000);

  /* Success */
  --mui-palette-success-main: var(--brandOS-accent-lime-500);
  --mui-palette-success-light: var(--brandOS-accent-lime-300);
  --mui-palette-success-dark: var(--brandOS-accent-lime-700);
  --mui-palette-success-contrastText: var(--brandOS-accent-lime-950);

  /* Background */
  --mui-palette-background-default: var(--brandOS-background-primary);
  --mui-palette-background-paper: var(--brandOS-background-elevated);

  /* Text */
  --mui-palette-text-primary: var(--brandOS-text-primary);
  --mui-palette-text-secondary: var(--brandOS-text-secondary);
  --mui-palette-text-disabled: var(--brandOS-text-tertiary);

  /* Divider */
  --mui-palette-divider: var(--brandOS-border-default);

  /* Action */
  --mui-palette-action-active: var(--brandOS-text-secondary);
  --mui-palette-action-hover: var(--brandOS-interactive-secondary);
  --mui-palette-action-selected: var(--brandOS-interactive-secondary-hover);
  --mui-palette-action-focus: var(--brandOS-border-focus);
}

/* Liquid semantic color aliases.
 * Collapses the -light / -dark pairs emitted by semantic.json into a single
 * --semantic-* variable per slot using CSS light-dark().
 */

[data-brand='liquid'] {
  /* Surface */
  --semantic-surface-1: light-dark(var(--semantic-surface-1-light), var(--semantic-surface-1-dark));
  --semantic-surface-2: light-dark(var(--semantic-surface-2-light), var(--semantic-surface-2-dark));
  --semantic-surface-3: light-dark(var(--semantic-surface-3-light), var(--semantic-surface-3-dark));

  /* Content */
  --semantic-content-primary: light-dark(var(--semantic-content-primary-light), var(--semantic-content-primary-dark));
  --semantic-content-muted: light-dark(var(--semantic-content-muted-light), var(--semantic-content-muted-dark));
  --semantic-content-inverse: light-dark(var(--semantic-content-inverse-light), var(--semantic-content-inverse-dark));

  /* Border */
  --semantic-border-subtle: light-dark(var(--semantic-border-subtle-light), var(--semantic-border-subtle-dark));
  --semantic-border-default: light-dark(var(--semantic-border-default-light), var(--semantic-border-default-dark));

  /* Brand */
  --semantic-brand-primary: light-dark(var(--semantic-brand-primary-light), var(--semantic-brand-primary-dark));
  --semantic-brand-primary-content: light-dark(var(--semantic-brand-primary-content-light), var(--semantic-brand-primary-content-dark));
  --semantic-brand-secondary: light-dark(var(--semantic-brand-secondary-light), var(--semantic-brand-secondary-dark));
  --semantic-brand-accent: light-dark(var(--semantic-brand-accent-light), var(--semantic-brand-accent-dark));
  --semantic-brand-accent-content: light-dark(var(--semantic-brand-accent-content-light), var(--semantic-brand-accent-content-dark));

  /* Neutral */
  --semantic-neutral-base: light-dark(var(--semantic-neutral-base-light), var(--semantic-neutral-base-dark));
  --semantic-neutral-content: light-dark(var(--semantic-neutral-content-light), var(--semantic-neutral-content-dark));

  /* Status */
  --semantic-status-info: light-dark(var(--semantic-status-info-light), var(--semantic-status-info-dark));
  --semantic-status-info-content: light-dark(var(--semantic-status-info-content-light), var(--semantic-status-info-content-dark));
  --semantic-status-success: light-dark(var(--semantic-status-success-light), var(--semantic-status-success-dark));
  --semantic-status-success-content: light-dark(var(--semantic-status-success-content-light), var(--semantic-status-success-content-dark));
  --semantic-status-warning: light-dark(var(--semantic-status-warning-light), var(--semantic-status-warning-dark));
  --semantic-status-warning-content: light-dark(var(--semantic-status-warning-content-light), var(--semantic-status-warning-content-dark));
  --semantic-status-error: light-dark(var(--semantic-status-error-light), var(--semantic-status-error-dark));
  --semantic-status-error-content: light-dark(var(--semantic-status-error-content-light), var(--semantic-status-error-content-dark));

  /* On-accent surfaces */
  --semantic-on-accent: oklch(1 0 0);
  --semantic-on-accent-muted: oklch(1 0 0 / 0.85);
  --semantic-on-accent-subtle: oklch(1 0 0 / 0.7);
  --semantic-on-accent-shine: oklch(1 0 0 / 0.18);

  /* Tile hover darken */
  --semantic-tile-dim: oklch(0 0 0 / 0.08);
}

[data-brand='liquid'][data-theme='light'] {
  color-scheme: light;
}
[data-brand='liquid'][data-theme='dark'] {
  color-scheme: dark;
}

:root[data-brand='liquid'] {
  /* Brand */
  --brandOS-brand: light-dark(var(--brandOS-primary-500), var(--brandOS-primary-400));

  /* Text */
  --brandOS-text-primary: light-dark(var(--brandOS-gray-1000), var(--brandOS-gray-050));
  --brandOS-text-secondary: light-dark(var(--brandOS-gray-500), var(--brandOS-gray-250));
  --brandOS-text-tertiary: light-dark(var(--brandOS-gray-400), var(--brandOS-gray-300));
  --brandOS-text-inverted: light-dark(var(--brandOS-gray-050), var(--brandOS-gray-1000));
  --brandOS-text-on-primary: light-dark(var(--brandOS-gray-050), var(--brandOS-gray-050));
  --brandOS-text-link: light-dark(var(--brandOS-primary-500), var(--brandOS-primary-300));
  --brandOS-text-link-hover: light-dark(var(--brandOS-primary-600), var(--brandOS-primary-250));

  /* Background */
  --brandOS-background-primary: light-dark(var(--brandOS-gray-050), var(--brandOS-gray-950));
  --brandOS-background-secondary: light-dark(var(--brandOS-gray-100), var(--brandOS-gray-900));
  --brandOS-background-tertiary: light-dark(var(--brandOS-gray-200), var(--brandOS-gray-850));
  --brandOS-background-elevated: light-dark(var(--brandOS-gray-050), var(--brandOS-gray-900));
  --brandOS-background-overlay: light-dark(oklch(from var(--brandOS-gray-1000) l c h / 0.5), oklch(from var(--brandOS-gray-1000) l c h / 0.76));
  --brandOS-root-bg: light-dark(oklch(var(--colors-raw-base-bg1-light-v-oklch)), oklch(var(--colors-raw-base-bg1-dark-v-oklch)));
  --brandOS-base-100: light-dark(oklch(var(--colors-raw-base-bg1-light-v-oklch)), oklch(var(--colors-raw-base-bg1-dark-v-oklch)));
  --brandOS-base-200: light-dark(oklch(var(--colors-raw-base-bg2-light-v-oklch)), oklch(var(--colors-raw-base-bg2-dark-v-oklch)));
  --brandOS-base-300: light-dark(oklch(var(--colors-raw-base-bg3-light-v-oklch)), oklch(var(--colors-raw-base-bg3-dark-v-oklch)));
  --brandOS-base-content: light-dark(oklch(var(--colors-raw-neutral-fg-dark-v-oklch)), oklch(var(--colors-raw-neutral-fg-light-v-oklch)));

  /* Border */
  --brandOS-border-subtle: light-dark(var(--brandOS-gray-100), var(--brandOS-gray-800));
  --brandOS-border-default: light-dark(var(--brandOS-gray-200), var(--brandOS-gray-700));
  --brandOS-border-strong: light-dark(var(--brandOS-gray-300), var(--brandOS-gray-600));
  --brandOS-border-focus: light-dark(var(--brandOS-primary-400), var(--brandOS-primary-300));

  /* Interactive */
  --brandOS-interactive-primary: light-dark(var(--brandOS-primary-500), var(--brandOS-primary-400));
  --brandOS-interactive-primary-hover: light-dark(var(--brandOS-primary-600), var(--brandOS-primary-300));
  --brandOS-interactive-secondary: light-dark(var(--brandOS-gray-100), var(--brandOS-gray-800));
  --brandOS-interactive-secondary-hover: light-dark(var(--brandOS-gray-200), var(--brandOS-gray-700));

  /* Status */
  --brandOS-status-success: light-dark(var(--brandOS-accent-lime-600), var(--brandOS-accent-lime-500));
  --brandOS-status-warning: light-dark(var(--brandOS-accent-amber-600), var(--brandOS-accent-amber-500));
  --brandOS-status-error: light-dark(oklch(var(--colors-raw-liquidred-550-v-oklch)), oklch(var(--colors-raw-liquidred-350-v-oklch)));
  --brandOS-status-info: light-dark(oklch(var(--colors-raw-liquidcyan-600-v-oklch)), oklch(var(--colors-raw-liquidcyan-500-v-oklch)));
}

[data-brand='liquid'] {
  /* Color Palette - Primary */
  --brandOS-primary-050: oklch(var(--colors-raw-liquidblue-050-v-oklch));
  --brandOS-primary-100: oklch(var(--colors-raw-liquidblue-100-v-oklch));
  --brandOS-primary-150: oklch(var(--colors-raw-liquidblue-150-v-oklch));
  --brandOS-primary-200: oklch(var(--colors-raw-liquidblue-200-v-oklch));
  --brandOS-primary-250: oklch(var(--colors-raw-liquidblue-250-v-oklch));
  --brandOS-primary-300: oklch(var(--colors-raw-liquidblue-300-v-oklch));
  --brandOS-primary-350: oklch(var(--colors-raw-liquidblue-350-v-oklch));
  --brandOS-primary-400: oklch(var(--colors-raw-liquidblue-400-v-oklch));
  --brandOS-primary-450: oklch(var(--colors-raw-liquidblue-450-v-oklch));
  --brandOS-primary-500: oklch(var(--colors-raw-liquidblue-500-v-oklch));
  --brandOS-primary-550: oklch(var(--colors-raw-liquidblue-550-v-oklch));
  --brandOS-primary-600: oklch(var(--colors-raw-liquidblue-600-v-oklch));
  --brandOS-primary-650: oklch(var(--colors-raw-liquidblue-650-v-oklch));
  --brandOS-primary-700: oklch(var(--colors-raw-liquidblue-700-v-oklch));
  --brandOS-primary-750: oklch(var(--colors-raw-liquidblue-750-v-oklch));
  --brandOS-primary-800: oklch(var(--colors-raw-liquidblue-800-v-oklch));
  --brandOS-primary-850: oklch(var(--colors-raw-liquidblue-850-v-oklch));
  --brandOS-primary-900: oklch(var(--colors-raw-liquidblue-900-v-oklch));
  --brandOS-primary-950: oklch(var(--colors-raw-liquidblue-950-v-oklch));

  /* Color Palette - Gray */
  --brandOS-gray-050: oklch(var(--colors-raw-liquidgray-050-v-oklch));
  --brandOS-gray-100: oklch(var(--colors-raw-liquidgray-100-v-oklch));
  --brandOS-gray-150: oklch(var(--colors-raw-liquidgray-150-v-oklch));
  --brandOS-gray-200: oklch(var(--colors-raw-liquidgray-200-v-oklch));
  --brandOS-gray-250: oklch(var(--colors-raw-liquidgray-250-v-oklch));
  --brandOS-gray-300: oklch(var(--colors-raw-liquidgray-300-v-oklch));
  --brandOS-gray-350: oklch(var(--colors-raw-liquidgray-350-v-oklch));
  --brandOS-gray-400: oklch(var(--colors-raw-liquidgray-400-v-oklch));
  --brandOS-gray-450: oklch(var(--colors-raw-liquidgray-450-v-oklch));
  --brandOS-gray-500: oklch(var(--colors-raw-liquidgray-500-v-oklch));
  --brandOS-gray-550: oklch(var(--colors-raw-liquidgray-550-v-oklch));
  --brandOS-gray-600: oklch(var(--colors-raw-liquidgray-600-v-oklch));
  --brandOS-gray-650: oklch(var(--colors-raw-liquidgray-650-v-oklch));
  --brandOS-gray-700: oklch(var(--colors-raw-liquidgray-700-v-oklch));
  --brandOS-gray-750: oklch(var(--colors-raw-liquidgray-750-v-oklch));
  --brandOS-gray-800: oklch(var(--colors-raw-liquidgray-800-v-oklch));
  --brandOS-gray-850: oklch(var(--colors-raw-liquidgray-850-v-oklch));
  --brandOS-gray-900: oklch(var(--colors-raw-liquidgray-900-v-oklch));
  --brandOS-gray-950: oklch(var(--colors-raw-liquidgray-950-v-oklch));
  --brandOS-gray-1000: oklch(var(--colors-raw-liquidgray-1000-v-oklch));

  /* Typography */
  --brandOS-font-heading-display: var(--brandOS-font-red-hat);
  --brandOS-font-body-display: var(--brandOS-font-inter);
}
