:root {
  --cb-font-family-brand: var(--cb-font-family-sans);
  --cb-font-family-brand-font-feature-settings: ;
  --al-font-family-brand: var(--al-font-family-sans);
  --al-font-family-brand-font-feature-settings: ;
}
:root{--cb-color-bg-fill-brand: #556f6c;
--cb-color-bg-fill-brand-hovered: #6a817e;
--cb-color-bg-fill-brand-pressed: #778c89;
--cb-color-bg-fill-brand-selected: #708684;
--cb-color-bg-fill-brand-disabled: #92a3a1;
--cb-color-text-brand: #556f6c;
--cb-color-text-brand-hovered: #627a78;
--cb-color-text-brand-pressed: #778c89;
--cb-color-text-brand-selected: #6a817e;
--cb-color-text-brand-disabled: #92a3a1;
--cb-color-bg-surface-brand: #f2f4f3;
--cb-color-bg-surface-brand-hovered: #e4e8e7;
--cb-color-bg-surface-brand-pressed: #d6dddc;
--cb-color-bg-surface-brand-selected: #eaeded;
--cb-color-bg-surface-brand-disabled: #f8f9f9;
--cb-color-text-on-bg-fill-brand: #ffffff;
--cb-color-text-on-bg-fill-brand-hovered: #ffffff;
--cb-color-text-on-bg-fill-brand-pressed: #ffffff;
--cb-color-text-on-bg-fill-brand-selected: #ffffff;
--cb-color-text-on-bg-fill-brand-disabled: #ffffff66;
--cb-color-border-selected: #556f6c;}

:root:where([data-cb-theme="dark"])  {--cb-color-bg-fill-brand-hovered: #4b625f;
--cb-color-bg-fill-brand-pressed: #445956;
--cb-color-bg-fill-brand-selected: #475d5b;
--cb-color-bg-fill-brand-disabled: #364745;
--cb-color-text-brand-hovered: #4e6664;
--cb-color-text-brand-pressed: #445956;
--cb-color-text-brand-selected: #4b625f;
--cb-color-text-brand-disabled: #364745;
--cb-color-bg-surface-brand: #0e1211;
--cb-color-bg-surface-brand-hovered: #141b1a;
--cb-color-bg-surface-brand-pressed: #1b2423;
--cb-color-bg-surface-brand-selected: #111616;
--cb-color-bg-surface-brand-disabled: #0a0d0d;
--cb-color-text-on-bg-fill-brand: #202125;
--cb-color-text-on-bg-fill-brand-hovered: #202125;
--cb-color-text-on-bg-fill-brand-pressed: #202125;
--cb-color-text-on-bg-fill-brand-selected: #202125;
--cb-color-text-on-bg-fill-brand-disabled: #20212566;}

:root:where([data-cb-theme="dark"]) :where(.cb-elevated, .al-elevated)  {--cb-color-bg-surface-brand: #2c3030;
--cb-color-bg-surface-brand-hovered: #303635;
--cb-color-bg-surface-brand-pressed: #343c3b;
--cb-color-bg-surface-brand-selected: #2e3332;
--cb-color-bg-surface-brand-disabled: #2a2d2d;}
:root{--al-color-border-selected: #627b78;
--al-color-border-elevated-selected: #627b78;
--al-color-outline-focused: #20302f;
--al-color-bg-surface-brand: #e8ecec;
--al-color-bg-surface-brand-hovered: #d6dedd;
--al-color-bg-surface-brand-pressed: #c6d1d0;
--al-color-bg-surface-brand-selected: #c6d1d0;
--al-color-bg-surface-brand-disabled: #f2f5f4;
--al-color-bg-surface-brand-elevated: #e8ecec;
--al-color-bg-surface-brand-elevated-hovered: #d6dedd;
--al-color-bg-surface-brand-elevated-pressed: #c6d1d0;
--al-color-bg-surface-brand-elevated-selected: #c6d1d0;
--al-color-bg-surface-brand-elevated-disabled: #f2f5f4;
--al-color-bg-fill-brand: #627b78;
--al-color-bg-fill-brand-hovered: #536c69;
--al-color-bg-fill-brand-pressed: #455d5b;
--al-color-bg-fill-brand-selected: #384e4c;
--al-color-bg-fill-brand-disabled: #b6c5c3;
--al-color-text-brand: #536c69;
--al-color-text-brand-hovered: #455d5b;
--al-color-text-brand-pressed: #384e4c;
--al-color-text-brand-selected: #2c403d;
--al-color-text-brand-disabled: #a7b8b6;
--al-color-text-on-bg-fill-brand: #fbfbfb;
--al-color-text-on-bg-fill-brand-hovered: #fbfbfb;
--al-color-text-on-bg-fill-brand-pressed: #fbfbfb;
--al-color-text-on-bg-fill-brand-selected: #fbfbfb;
--al-color-text-on-bg-fill-brand-disabled: #f2f5f4;}

:root:where([data-al-theme="lightHighContrast"])  {--al-color-border-selected: #536c69;
--al-color-border-elevated-selected: #536c69;
--al-color-bg-fill-brand: #536c69;
--al-color-bg-fill-brand-hovered: #455d5b;
--al-color-bg-fill-brand-pressed: #384e4c;
--al-color-bg-fill-brand-selected: #2c403d;
--al-color-text-brand: #384e4c;
--al-color-text-brand-hovered: #2c403d;
--al-color-text-brand-pressed: #20302f;
--al-color-text-brand-selected: #121d1c;}

:root:where([data-al-theme="dark"])  {--al-color-border-selected: #6a8481;
--al-color-border-elevated-selected: #7d9491;
--al-color-outline-focused: #dae1e1;
--al-color-bg-surface-brand: #14201f;
--al-color-bg-surface-brand-hovered: #1d2c2a;
--al-color-bg-surface-brand-pressed: #253635;
--al-color-bg-surface-brand-selected: #253635;
--al-color-bg-surface-brand-disabled: #0e1918;
--al-color-bg-surface-brand-elevated: #1d2c2a;
--al-color-bg-surface-brand-elevated-hovered: #253635;
--al-color-bg-surface-brand-elevated-pressed: #2c403e;
--al-color-bg-surface-brand-elevated-selected: #2c403e;
--al-color-bg-surface-brand-elevated-disabled: #14201f;
--al-color-bg-fill-brand: #91a5a3;
--al-color-bg-fill-brand-hovered: #a7b8b6;
--al-color-bg-fill-brand-pressed: #c0cccb;
--al-color-bg-fill-brand-selected: #dae1e1;
--al-color-bg-fill-brand-disabled: #2c403e;
--al-color-text-brand: #91a5a3;
--al-color-text-brand-hovered: #a7b8b6;
--al-color-text-brand-pressed: #c0cccb;
--al-color-text-brand-selected: #dae1e1;
--al-color-text-brand-disabled: #344947;
--al-color-text-on-bg-fill-brand: #070f0e;
--al-color-text-on-bg-fill-brand-hovered: #070f0e;
--al-color-text-on-bg-fill-brand-pressed: #070f0e;
--al-color-text-on-bg-fill-brand-selected: #070f0e;
--al-color-text-on-bg-fill-brand-disabled: #0e1918;}

:root, :root:where([data-al-theme="lightHighContrast"]) {
  --al-c-toggle-switch-on-bg: var(--al-color-bg-fill-brand);
}