@charset "UTF-8";
/*
 * Brønnøysund designsystem-tema (kombinert)
 * Kjelde: @brreg/designsystemet-theme@0.3.3
 * Generert: 2026-07-29 17:35 UTC
 */
/*
build: v1.17.0
design-tokens: v1.17.0
*/

@layer ds.theme.size-mode {
:root /* small */ {
  --ds-size-mode-font-size--sm: 1;
}
}

@layer ds.theme.size-mode {
:root /* medium */ {
  --ds-size-mode-font-size--md: 1.125;
}
}

@layer ds.theme.size-mode {
:root /* large */ {
  --ds-size-mode-font-size--lg: 1.3125;
}
}

@layer ds.theme.size-mode {
:root, [data-size] {
  --ds-size: var(--ds-size--md);
  --ds-size--sm: var(--ds-size,);
  --ds-size--md: var(--ds-size,);
  --ds-size--lg: var(--ds-size,);
  --ds-size-mode-font-size:
    var(--ds-size--sm, var(--ds-size-mode-font-size--sm))
    var(--ds-size--md, var(--ds-size-mode-font-size--md))
    var(--ds-size--lg, var(--ds-size-mode-font-size--lg));
}

[data-size='sm'] { --ds-size: var(--ds-size--sm); }
[data-size='md'] { --ds-size: var(--ds-size--md); }
[data-size='lg'] { --ds-size: var(--ds-size--lg); }
}

@layer ds.theme.type-scale {
:root, [data-size] {
  --_ds-font-size-factor: calc(var(--ds-size-mode-font-size) / (var(--ds-size-base) / 16));
  --ds-font-size-1: calc(0.75rem * var(--_ds-font-size-factor));
  --ds-font-size-2: calc(0.875rem * var(--_ds-font-size-factor));
  --ds-font-size-3: calc(1rem * var(--_ds-font-size-factor));
  --ds-font-size-4: calc(1.125rem * var(--_ds-font-size-factor));
  --ds-font-size-5: calc(1.3125rem * var(--_ds-font-size-factor));
  --ds-font-size-6: calc(1.5rem * var(--_ds-font-size-factor));
  --ds-font-size-7: calc(1.875rem * var(--_ds-font-size-factor));
  --ds-font-size-8: calc(2.25rem * var(--_ds-font-size-factor));
  --ds-font-size-9: calc(3rem * var(--_ds-font-size-factor));
  --ds-font-size-10: calc(3.75rem * var(--_ds-font-size-factor));
  --ds-heading-2xl-font-size: var(--ds-font-size-10);
  --ds-heading-xl-font-size: var(--ds-font-size-9);
  --ds-heading-lg-font-size: var(--ds-font-size-8);
  --ds-heading-md-font-size: var(--ds-font-size-7);
  --ds-heading-sm-font-size: var(--ds-font-size-6);
  --ds-heading-xs-font-size: var(--ds-font-size-5);
  --ds-heading-2xs-font-size: var(--ds-font-size-4);
  --ds-body-xl-font-size: var(--ds-font-size-6);
  --ds-body-lg-font-size: var(--ds-font-size-5);
  --ds-body-md-font-size: var(--ds-font-size-4);
  --ds-body-sm-font-size: var(--ds-font-size-3);
  --ds-body-xs-font-size: var(--ds-font-size-2);
  --ds-body-short-xl-font-size: var(--ds-font-size-6);
  --ds-body-short-lg-font-size: var(--ds-font-size-5);
  --ds-body-short-md-font-size: var(--ds-font-size-4);
  --ds-body-short-sm-font-size: var(--ds-font-size-3);
  --ds-body-short-xs-font-size: var(--ds-font-size-2);
  --ds-body-long-xl-font-size: var(--ds-font-size-6);
  --ds-body-long-lg-font-size: var(--ds-font-size-5);
  --ds-body-long-md-font-size: var(--ds-font-size-4);
  --ds-body-long-sm-font-size: var(--ds-font-size-3);
  --ds-body-long-xs-font-size: var(--ds-font-size-2);

  @supports (width: round(down, .1em, 1px)) {
    --ds-font-size-1: round(calc(0.75rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-2: round(calc(0.875rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-3: round(calc(1rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-4: round(calc(1.125rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-5: round(calc(1.3125rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-6: round(calc(1.5rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-7: round(calc(1.875rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-8: round(calc(2.25rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-9: round(calc(3rem * var(--_ds-font-size-factor)), 1px);
    --ds-font-size-10: round(calc(3.75rem * var(--_ds-font-size-factor)), 1px);
  }
}
}
@layer ds.theme.color-scheme.light {
:root, [data-color-scheme="light"] {
  --ds-color-main1-background-default: #F5FAFF;
  --ds-color-main1-background-tinted: #E0EFFF;
  --ds-color-main1-surface-default: #EBF5FF;
  --ds-color-main1-surface-tinted: #D6EAFF;
  --ds-color-main1-surface-hover: #ADD3FF;
  --ds-color-main1-surface-active: #9ECAFF;
  --ds-color-main1-border-subtle: #094F9F;
  --ds-color-main1-border-default: #003A80;
  --ds-color-main1-border-strong: #001C3A;
  --ds-color-main1-text-subtle: #003A80;
  --ds-color-main1-text-default: #001C3A;
  --ds-color-main1-base-default: #001C3A;
  --ds-color-main1-base-hover: #002C5A;
  --ds-color-main1-base-active: #003A80;
  --ds-color-main1-base-contrast-subtle: #D6EAFF;
  --ds-color-main1-base-contrast-default: #F5FAFF;
  --ds-color-main2-background-default: #FFFAF5;
  --ds-color-main2-background-tinted: #FFECD6;
  --ds-color-main2-surface-default: #FFF3E5;
  --ds-color-main2-surface-tinted: #FFE7CC;
  --ds-color-main2-surface-hover: #FFDBB2;
  --ds-color-main2-surface-active: #FFCF99;
  --ds-color-main2-border-subtle: #5C3100;
  --ds-color-main2-border-default: #472600;
  --ds-color-main2-border-strong: #291600;
  --ds-color-main2-text-subtle: #472600;
  --ds-color-main2-text-default: #291600;
  --ds-color-main2-base-default: #FF8700;
  --ds-color-main2-base-hover: #FF9933;
  --ds-color-main2-base-active: #FFAB57;
  --ds-color-main2-base-contrast-subtle: #291600;
  --ds-color-main2-base-contrast-default: #0A0500;
  --ds-color-main3-background-default: #F6FBFE;
  --ds-color-main3-background-tinted: #E3F3FC;
  --ds-color-main3-surface-default: #EDF7FD;
  --ds-color-main3-surface-tinted: #DAEFFB;
  --ds-color-main3-surface-hover: #BCDDF1;
  --ds-color-main3-surface-active: #ADD7F0;
  --ds-color-main3-border-subtle: #19658F;
  --ds-color-main3-border-default: #0D4E72;
  --ds-color-main3-border-strong: #062232;
  --ds-color-main3-text-subtle: #0D4E72;
  --ds-color-main3-text-default: #062232;
  --ds-color-main3-base-default: #062232;
  --ds-color-main3-base-hover: #093853;
  --ds-color-main3-base-active: #0D4E72;
  --ds-color-main3-base-contrast-subtle: #DAEFFB;
  --ds-color-main3-base-contrast-default: #F6FBFE;
  --ds-color-maintest-background-default: #FFEBFE;
  --ds-color-maintest-background-tinted: #FFD6FC;
  --ds-color-maintest-surface-default: #FFE0FD;
  --ds-color-maintest-surface-tinted: #FFCCFB;
  --ds-color-maintest-surface-hover: #FFADF9;
  --ds-color-maintest-surface-active: #FF9EF8;
  --ds-color-maintest-border-subtle: #99008E;
  --ds-color-maintest-border-default: #800076;
  --ds-color-maintest-border-strong: #380034;
  --ds-color-maintest-text-subtle: #800076;
  --ds-color-maintest-text-default: #380034;
  --ds-color-maintest-base-default: #380034;
  --ds-color-maintest-base-hover: #800076;
  --ds-color-maintest-base-active: #99008E;
  --ds-color-maintest-base-contrast-subtle: #FFCCFB;
  --ds-color-maintest-base-contrast-default: #FFEBFE;
  --ds-color-support1-background-default: #F5FAFF;
  --ds-color-support1-background-tinted: #E0EFFF;
  --ds-color-support1-surface-default: #EBF5FF;
  --ds-color-support1-surface-tinted: #D6EAFF;
  --ds-color-support1-surface-hover: #ADD3FF;
  --ds-color-support1-surface-active: #9ECAFF;
  --ds-color-support1-border-subtle: #094F9F;
  --ds-color-support1-border-default: #003A80;
  --ds-color-support1-border-strong: #001C3A;
  --ds-color-support1-text-subtle: #003A80;
  --ds-color-support1-text-default: #001C3A;
  --ds-color-support1-base-default: #001C3A;
  --ds-color-support1-base-hover: #002C5A;
  --ds-color-support1-base-active: #003A80;
  --ds-color-support1-base-contrast-subtle: #D6EAFF;
  --ds-color-support1-base-contrast-default: #F5FAFF;
  --ds-color-support2-background-default: #FFFAF5;
  --ds-color-support2-background-tinted: #FFECD6;
  --ds-color-support2-surface-default: #FFF3E5;
  --ds-color-support2-surface-tinted: #FFE7CC;
  --ds-color-support2-surface-hover: #FFDBB2;
  --ds-color-support2-surface-active: #FFCF99;
  --ds-color-support2-border-subtle: #5C3100;
  --ds-color-support2-border-default: #472600;
  --ds-color-support2-border-strong: #291600;
  --ds-color-support2-text-subtle: #472600;
  --ds-color-support2-text-default: #291600;
  --ds-color-support2-base-default: #FF8700;
  --ds-color-support2-base-hover: #FF9933;
  --ds-color-support2-base-active: #FFAB57;
  --ds-color-support2-base-contrast-subtle: #291600;
  --ds-color-support2-base-contrast-default: #0A0500;
  --ds-color-supporttest-background-default: #FFEBFE;
  --ds-color-supporttest-background-tinted: #FFD6FC;
  --ds-color-supporttest-surface-default: #FFE0FD;
  --ds-color-supporttest-surface-tinted: #FFCCFB;
  --ds-color-supporttest-surface-hover: #FFADF9;
  --ds-color-supporttest-surface-active: #FF9EF8;
  --ds-color-supporttest-border-subtle: #99008E;
  --ds-color-supporttest-border-default: #800076;
  --ds-color-supporttest-border-strong: #380034;
  --ds-color-supporttest-text-subtle: #800076;
  --ds-color-supporttest-text-default: #380034;
  --ds-color-supporttest-base-default: #380034;
  --ds-color-supporttest-base-hover: #800076;
  --ds-color-supporttest-base-active: #99008E;
  --ds-color-supporttest-base-contrast-subtle: #FFCCFB;
  --ds-color-supporttest-base-contrast-default: #FFEBFE;
  --ds-color-neutral-background-default: #F9F9F9;
  --ds-color-neutral-background-tinted: #EBEBEB;
  --ds-color-neutral-surface-default: #F9F9F9;
  --ds-color-neutral-surface-tinted: #E0E0E0;
  --ds-color-neutral-surface-hover: #D6D6D6;
  --ds-color-neutral-surface-active: #CFCFCF;
  --ds-color-neutral-border-subtle: #545454;
  --ds-color-neutral-border-default: #404040;
  --ds-color-neutral-border-strong: #1C1C1C;
  --ds-color-neutral-text-subtle: #404040;
  --ds-color-neutral-text-default: #1C1C1C;
  --ds-color-neutral-base-default: #1C1C1C;
  --ds-color-neutral-base-hover: #2F2F2F;
  --ds-color-neutral-base-active: #404040;
  --ds-color-neutral-base-contrast-subtle: #EBEBEB;
  --ds-color-neutral-base-contrast-default: #F9F9F9;
  --ds-color-info-background-default: #F5FAFF;
  --ds-color-info-background-tinted: #E0EFFF;
  --ds-color-info-surface-default: #EBF5FF;
  --ds-color-info-surface-tinted: #D6EAFF;
  --ds-color-info-surface-hover: #ADD3FF;
  --ds-color-info-surface-active: #9ECAFF;
  --ds-color-info-border-subtle: #094F9F;
  --ds-color-info-border-default: #003A80;
  --ds-color-info-border-strong: #001C3A;
  --ds-color-info-text-subtle: #003A80;
  --ds-color-info-text-default: #001C3A;
  --ds-color-info-base-default: #001C3A;
  --ds-color-info-base-hover: #002C5A;
  --ds-color-info-base-active: #003A80;
  --ds-color-info-base-contrast-subtle: #D6EAFF;
  --ds-color-info-base-contrast-default: #F5FAFF;
  --ds-color-success-background-default: #F5FFF6;
  --ds-color-success-background-tinted: #E5FBE8;
  --ds-color-success-surface-default: #EDFCF0;
  --ds-color-success-surface-tinted: #DCF9E0;
  --ds-color-success-surface-hover: #B8F4C1;
  --ds-color-success-surface-active: #ACECB6;
  --ds-color-success-border-subtle: #008013;
  --ds-color-success-border-default: #005C0E;
  --ds-color-success-border-strong: #003808;
  --ds-color-success-text-subtle: #005C0E;
  --ds-color-success-text-default: #003808;
  --ds-color-success-base-default: #003808;
  --ds-color-success-base-hover: #005C0E;
  --ds-color-success-base-active: #008013;
  --ds-color-success-base-contrast-subtle: #DCF9E0;
  --ds-color-success-base-contrast-default: #F5FFF6;
  --ds-color-warning-background-default: #FFFAF5;
  --ds-color-warning-background-tinted: #FFECD6;
  --ds-color-warning-surface-default: #FFF3E5;
  --ds-color-warning-surface-tinted: #FFE7CC;
  --ds-color-warning-surface-hover: #FFDBB2;
  --ds-color-warning-surface-active: #FFCF99;
  --ds-color-warning-border-subtle: #5C3100;
  --ds-color-warning-border-default: #472600;
  --ds-color-warning-border-strong: #291600;
  --ds-color-warning-text-subtle: #472600;
  --ds-color-warning-text-default: #291600;
  --ds-color-warning-base-default: #FF8700;
  --ds-color-warning-base-hover: #FF9933;
  --ds-color-warning-base-active: #FFAB57;
  --ds-color-warning-base-contrast-subtle: #291600;
  --ds-color-warning-base-contrast-default: #0A0500;
  --ds-color-danger-background-default: #FFF5F5;
  --ds-color-danger-background-tinted: #FDE2E2;
  --ds-color-danger-surface-default: #FFEBEB;
  --ds-color-danger-surface-tinted: #FDD8D8;
  --ds-color-danger-surface-hover: #F9B4B4;
  --ds-color-danger-surface-active: #F8A5A5;
  --ds-color-danger-border-subtle: #9C1616;
  --ds-color-danger-border-default: #861313;
  --ds-color-danger-border-strong: #570505;
  --ds-color-danger-text-subtle: #861313;
  --ds-color-danger-text-default: #570505;
  --ds-color-danger-base-default: #570505;
  --ds-color-danger-base-hover: #861313;
  --ds-color-danger-base-active: #9C1616;
  --ds-color-danger-base-contrast-subtle: #FDE2E2;
  --ds-color-danger-base-contrast-default: #FFF5F5;
  --ds-color-focus-inner: #ECC238;
  --ds-color-focus-outer: #15181E;
  --ds-link-color-visited: #4D1386;

  color-scheme: light;
}
 
@media (prefers-color-scheme: light) {
  [data-color-scheme="auto"] {
  --ds-color-main1-background-default: #F5FAFF;
  --ds-color-main1-background-tinted: #E0EFFF;
  --ds-color-main1-surface-default: #EBF5FF;
  --ds-color-main1-surface-tinted: #D6EAFF;
  --ds-color-main1-surface-hover: #ADD3FF;
  --ds-color-main1-surface-active: #9ECAFF;
  --ds-color-main1-border-subtle: #094F9F;
  --ds-color-main1-border-default: #003A80;
  --ds-color-main1-border-strong: #001C3A;
  --ds-color-main1-text-subtle: #003A80;
  --ds-color-main1-text-default: #001C3A;
  --ds-color-main1-base-default: #001C3A;
  --ds-color-main1-base-hover: #002C5A;
  --ds-color-main1-base-active: #003A80;
  --ds-color-main1-base-contrast-subtle: #D6EAFF;
  --ds-color-main1-base-contrast-default: #F5FAFF;
  --ds-color-main2-background-default: #FFFAF5;
  --ds-color-main2-background-tinted: #FFECD6;
  --ds-color-main2-surface-default: #FFF3E5;
  --ds-color-main2-surface-tinted: #FFE7CC;
  --ds-color-main2-surface-hover: #FFDBB2;
  --ds-color-main2-surface-active: #FFCF99;
  --ds-color-main2-border-subtle: #5C3100;
  --ds-color-main2-border-default: #472600;
  --ds-color-main2-border-strong: #291600;
  --ds-color-main2-text-subtle: #472600;
  --ds-color-main2-text-default: #291600;
  --ds-color-main2-base-default: #FF8700;
  --ds-color-main2-base-hover: #FF9933;
  --ds-color-main2-base-active: #FFAB57;
  --ds-color-main2-base-contrast-subtle: #291600;
  --ds-color-main2-base-contrast-default: #0A0500;
  --ds-color-main3-background-default: #F6FBFE;
  --ds-color-main3-background-tinted: #E3F3FC;
  --ds-color-main3-surface-default: #EDF7FD;
  --ds-color-main3-surface-tinted: #DAEFFB;
  --ds-color-main3-surface-hover: #BCDDF1;
  --ds-color-main3-surface-active: #ADD7F0;
  --ds-color-main3-border-subtle: #19658F;
  --ds-color-main3-border-default: #0D4E72;
  --ds-color-main3-border-strong: #062232;
  --ds-color-main3-text-subtle: #0D4E72;
  --ds-color-main3-text-default: #062232;
  --ds-color-main3-base-default: #062232;
  --ds-color-main3-base-hover: #093853;
  --ds-color-main3-base-active: #0D4E72;
  --ds-color-main3-base-contrast-subtle: #DAEFFB;
  --ds-color-main3-base-contrast-default: #F6FBFE;
  --ds-color-maintest-background-default: #FFEBFE;
  --ds-color-maintest-background-tinted: #FFD6FC;
  --ds-color-maintest-surface-default: #FFE0FD;
  --ds-color-maintest-surface-tinted: #FFCCFB;
  --ds-color-maintest-surface-hover: #FFADF9;
  --ds-color-maintest-surface-active: #FF9EF8;
  --ds-color-maintest-border-subtle: #99008E;
  --ds-color-maintest-border-default: #800076;
  --ds-color-maintest-border-strong: #380034;
  --ds-color-maintest-text-subtle: #800076;
  --ds-color-maintest-text-default: #380034;
  --ds-color-maintest-base-default: #380034;
  --ds-color-maintest-base-hover: #800076;
  --ds-color-maintest-base-active: #99008E;
  --ds-color-maintest-base-contrast-subtle: #FFCCFB;
  --ds-color-maintest-base-contrast-default: #FFEBFE;
  --ds-color-support1-background-default: #F5FAFF;
  --ds-color-support1-background-tinted: #E0EFFF;
  --ds-color-support1-surface-default: #EBF5FF;
  --ds-color-support1-surface-tinted: #D6EAFF;
  --ds-color-support1-surface-hover: #ADD3FF;
  --ds-color-support1-surface-active: #9ECAFF;
  --ds-color-support1-border-subtle: #094F9F;
  --ds-color-support1-border-default: #003A80;
  --ds-color-support1-border-strong: #001C3A;
  --ds-color-support1-text-subtle: #003A80;
  --ds-color-support1-text-default: #001C3A;
  --ds-color-support1-base-default: #001C3A;
  --ds-color-support1-base-hover: #002C5A;
  --ds-color-support1-base-active: #003A80;
  --ds-color-support1-base-contrast-subtle: #D6EAFF;
  --ds-color-support1-base-contrast-default: #F5FAFF;
  --ds-color-support2-background-default: #FFFAF5;
  --ds-color-support2-background-tinted: #FFECD6;
  --ds-color-support2-surface-default: #FFF3E5;
  --ds-color-support2-surface-tinted: #FFE7CC;
  --ds-color-support2-surface-hover: #FFDBB2;
  --ds-color-support2-surface-active: #FFCF99;
  --ds-color-support2-border-subtle: #5C3100;
  --ds-color-support2-border-default: #472600;
  --ds-color-support2-border-strong: #291600;
  --ds-color-support2-text-subtle: #472600;
  --ds-color-support2-text-default: #291600;
  --ds-color-support2-base-default: #FF8700;
  --ds-color-support2-base-hover: #FF9933;
  --ds-color-support2-base-active: #FFAB57;
  --ds-color-support2-base-contrast-subtle: #291600;
  --ds-color-support2-base-contrast-default: #0A0500;
  --ds-color-supporttest-background-default: #FFEBFE;
  --ds-color-supporttest-background-tinted: #FFD6FC;
  --ds-color-supporttest-surface-default: #FFE0FD;
  --ds-color-supporttest-surface-tinted: #FFCCFB;
  --ds-color-supporttest-surface-hover: #FFADF9;
  --ds-color-supporttest-surface-active: #FF9EF8;
  --ds-color-supporttest-border-subtle: #99008E;
  --ds-color-supporttest-border-default: #800076;
  --ds-color-supporttest-border-strong: #380034;
  --ds-color-supporttest-text-subtle: #800076;
  --ds-color-supporttest-text-default: #380034;
  --ds-color-supporttest-base-default: #380034;
  --ds-color-supporttest-base-hover: #800076;
  --ds-color-supporttest-base-active: #99008E;
  --ds-color-supporttest-base-contrast-subtle: #FFCCFB;
  --ds-color-supporttest-base-contrast-default: #FFEBFE;
  --ds-color-neutral-background-default: #F9F9F9;
  --ds-color-neutral-background-tinted: #EBEBEB;
  --ds-color-neutral-surface-default: #F9F9F9;
  --ds-color-neutral-surface-tinted: #E0E0E0;
  --ds-color-neutral-surface-hover: #D6D6D6;
  --ds-color-neutral-surface-active: #CFCFCF;
  --ds-color-neutral-border-subtle: #545454;
  --ds-color-neutral-border-default: #404040;
  --ds-color-neutral-border-strong: #1C1C1C;
  --ds-color-neutral-text-subtle: #404040;
  --ds-color-neutral-text-default: #1C1C1C;
  --ds-color-neutral-base-default: #1C1C1C;
  --ds-color-neutral-base-hover: #2F2F2F;
  --ds-color-neutral-base-active: #404040;
  --ds-color-neutral-base-contrast-subtle: #EBEBEB;
  --ds-color-neutral-base-contrast-default: #F9F9F9;
  --ds-color-info-background-default: #F5FAFF;
  --ds-color-info-background-tinted: #E0EFFF;
  --ds-color-info-surface-default: #EBF5FF;
  --ds-color-info-surface-tinted: #D6EAFF;
  --ds-color-info-surface-hover: #ADD3FF;
  --ds-color-info-surface-active: #9ECAFF;
  --ds-color-info-border-subtle: #094F9F;
  --ds-color-info-border-default: #003A80;
  --ds-color-info-border-strong: #001C3A;
  --ds-color-info-text-subtle: #003A80;
  --ds-color-info-text-default: #001C3A;
  --ds-color-info-base-default: #001C3A;
  --ds-color-info-base-hover: #002C5A;
  --ds-color-info-base-active: #003A80;
  --ds-color-info-base-contrast-subtle: #D6EAFF;
  --ds-color-info-base-contrast-default: #F5FAFF;
  --ds-color-success-background-default: #F5FFF6;
  --ds-color-success-background-tinted: #E5FBE8;
  --ds-color-success-surface-default: #EDFCF0;
  --ds-color-success-surface-tinted: #DCF9E0;
  --ds-color-success-surface-hover: #B8F4C1;
  --ds-color-success-surface-active: #ACECB6;
  --ds-color-success-border-subtle: #008013;
  --ds-color-success-border-default: #005C0E;
  --ds-color-success-border-strong: #003808;
  --ds-color-success-text-subtle: #005C0E;
  --ds-color-success-text-default: #003808;
  --ds-color-success-base-default: #003808;
  --ds-color-success-base-hover: #005C0E;
  --ds-color-success-base-active: #008013;
  --ds-color-success-base-contrast-subtle: #DCF9E0;
  --ds-color-success-base-contrast-default: #F5FFF6;
  --ds-color-warning-background-default: #FFFAF5;
  --ds-color-warning-background-tinted: #FFECD6;
  --ds-color-warning-surface-default: #FFF3E5;
  --ds-color-warning-surface-tinted: #FFE7CC;
  --ds-color-warning-surface-hover: #FFDBB2;
  --ds-color-warning-surface-active: #FFCF99;
  --ds-color-warning-border-subtle: #5C3100;
  --ds-color-warning-border-default: #472600;
  --ds-color-warning-border-strong: #291600;
  --ds-color-warning-text-subtle: #472600;
  --ds-color-warning-text-default: #291600;
  --ds-color-warning-base-default: #FF8700;
  --ds-color-warning-base-hover: #FF9933;
  --ds-color-warning-base-active: #FFAB57;
  --ds-color-warning-base-contrast-subtle: #291600;
  --ds-color-warning-base-contrast-default: #0A0500;
  --ds-color-danger-background-default: #FFF5F5;
  --ds-color-danger-background-tinted: #FDE2E2;
  --ds-color-danger-surface-default: #FFEBEB;
  --ds-color-danger-surface-tinted: #FDD8D8;
  --ds-color-danger-surface-hover: #F9B4B4;
  --ds-color-danger-surface-active: #F8A5A5;
  --ds-color-danger-border-subtle: #9C1616;
  --ds-color-danger-border-default: #861313;
  --ds-color-danger-border-strong: #570505;
  --ds-color-danger-text-subtle: #861313;
  --ds-color-danger-text-default: #570505;
  --ds-color-danger-base-default: #570505;
  --ds-color-danger-base-hover: #861313;
  --ds-color-danger-base-active: #9C1616;
  --ds-color-danger-base-contrast-subtle: #FDE2E2;
  --ds-color-danger-base-contrast-default: #FFF5F5;
  --ds-color-focus-inner: #ECC238;
  --ds-color-focus-outer: #15181E;
  --ds-link-color-visited: #4D1386;

  color-scheme: light;
}

}

}

@layer ds.theme.typography.secondary {
[data-typography="secondary"] {
  --ds-line-height-sm: 1.3;
  --ds-line-height-md: 1.5;
  --ds-line-height-lg: 1.7;
  --ds-letter-spacing-1: -0.01em;
  --ds-letter-spacing-2: -0.005em;
  --ds-letter-spacing-3: -0.0025em;
  --ds-letter-spacing-4: -0.0015em;
  --ds-letter-spacing-5: 0em;
  --ds-letter-spacing-6: 0.0015em;
  --ds-letter-spacing-7: 0.0025em;
  --ds-letter-spacing-8: 0.005em;
  --ds-letter-spacing-9: 0.015em;
  --ds-font-family: Inter;
  --ds-font-weight-medium: 500;
  --ds-font-weight-semibold: 600;
  --ds-font-weight-regular: 400;
  --ds-heading-2xl-font-weight: 500;
  --ds-heading-2xl-line-height: 1.3;
  --ds-heading-2xl-letter-spacing: -0.01em;
  --ds-heading-xl-font-weight: 500;
  --ds-heading-xl-line-height: 1.3;
  --ds-heading-xl-letter-spacing: -0.01em;
  --ds-heading-lg-font-weight: 500;
  --ds-heading-lg-line-height: 1.3;
  --ds-heading-lg-letter-spacing: -0.005em;
  --ds-heading-md-font-weight: 500;
  --ds-heading-md-line-height: 1.3;
  --ds-heading-md-letter-spacing: -0.0025em;
  --ds-heading-sm-font-weight: 500;
  --ds-heading-sm-line-height: 1.3;
  --ds-heading-sm-letter-spacing: 0em;
  --ds-heading-xs-font-weight: 500;
  --ds-heading-xs-line-height: 1.3;
  --ds-heading-xs-letter-spacing: 0.0015em;
  --ds-heading-2xs-font-weight: 500;
  --ds-heading-2xs-line-height: 1.3;
  --ds-heading-2xs-letter-spacing: 0.0015em;
  --ds-body-xl-font-weight: 400;
  --ds-body-xl-line-height: 1.5;
  --ds-body-xl-letter-spacing: 0.005em;
  --ds-body-lg-font-weight: 400;
  --ds-body-lg-line-height: 1.5;
  --ds-body-lg-letter-spacing: 0.005em;
  --ds-body-md-font-weight: 400;
  --ds-body-md-line-height: 1.5;
  --ds-body-md-letter-spacing: 0.005em;
  --ds-body-sm-font-weight: 400;
  --ds-body-sm-line-height: 1.5;
  --ds-body-sm-letter-spacing: 0.0025em;
  --ds-body-xs-font-weight: 400;
  --ds-body-xs-line-height: 1.5;
  --ds-body-xs-letter-spacing: 0.0015em;
  --ds-body-short-xl-font-weight: 400;
  --ds-body-short-xl-line-height: 1.3;
  --ds-body-short-xl-letter-spacing: 0.005em;
  --ds-body-short-lg-font-weight: 400;
  --ds-body-short-lg-line-height: 1.3;
  --ds-body-short-lg-letter-spacing: 0.005em;
  --ds-body-short-md-font-weight: 400;
  --ds-body-short-md-line-height: 1.3;
  --ds-body-short-md-letter-spacing: 0.005em;
  --ds-body-short-sm-font-weight: 400;
  --ds-body-short-sm-line-height: 1.3;
  --ds-body-short-sm-letter-spacing: 0.0025em;
  --ds-body-short-xs-font-weight: 400;
  --ds-body-short-xs-line-height: 1.3;
  --ds-body-short-xs-letter-spacing: 0.0015em;
  --ds-body-long-xl-font-weight: 400;
  --ds-body-long-xl-line-height: 1.7;
  --ds-body-long-xl-letter-spacing: 0.005em;
  --ds-body-long-lg-font-weight: 400;
  --ds-body-long-lg-line-height: 1.7;
  --ds-body-long-lg-letter-spacing: 0.005em;
  --ds-body-long-md-font-weight: 400;
  --ds-body-long-md-line-height: 1.7;
  --ds-body-long-md-letter-spacing: 0.005em;
  --ds-body-long-sm-font-weight: 400;
  --ds-body-long-sm-line-height: 1.7;
  --ds-body-long-sm-letter-spacing: 0.0025em;
  --ds-body-long-xs-font-weight: 400;
  --ds-body-long-xs-line-height: 1.7;
  --ds-body-long-xs-letter-spacing: 0.0015em;
}
}
@layer ds.theme.size {
:root, [data-size] {
  --ds-size-base: 18;
  --ds-size-step: 4;

  --ds-size-0: calc(var(--ds-size-unit) * 0);
  --ds-size-1: calc(var(--ds-size-unit) * 1);
  --ds-size-2: calc(var(--ds-size-unit) * 2);
  --ds-size-3: calc(var(--ds-size-unit) * 3);
  --ds-size-4: calc(var(--ds-size-unit) * 4);
  --ds-size-5: calc(var(--ds-size-unit) * 5);
  --ds-size-6: calc(var(--ds-size-unit) * 6);
  --ds-size-7: calc(var(--ds-size-unit) * 7);
  --ds-size-8: calc(var(--ds-size-unit) * 8);
  --ds-size-9: calc(var(--ds-size-unit) * 9);
  --ds-size-10: calc(var(--ds-size-unit) * 10);
  --ds-size-11: calc(var(--ds-size-unit) * 11);
  --ds-size-12: calc(var(--ds-size-unit) * 12);
  --ds-size-13: calc(var(--ds-size-unit) * 13);
  --ds-size-14: calc(var(--ds-size-unit) * 14);
  --ds-size-15: calc(var(--ds-size-unit) * 15);
  --ds-size-18: calc(var(--ds-size-unit) * 18);
  --ds-size-22: calc(var(--ds-size-unit) * 22);
  --ds-size-26: calc(var(--ds-size-unit) * 26);
  --ds-size-30: calc(var(--ds-size-unit) * 30);
  --ds-size-unit: calc(1rem * var(--ds-size-step) / var(--ds-size-base) * var(--ds-size-mode-font-size));

  @supports (width: round(down, .1em, 1px)) {
    --ds-size-0: round(down, calc(var(--ds-size-unit) * 0), 1px);
    --ds-size-1: round(down, calc(var(--ds-size-unit) * 1), 1px);
    --ds-size-2: round(down, calc(var(--ds-size-unit) * 2), 1px);
    --ds-size-3: round(down, calc(var(--ds-size-unit) * 3), 1px);
    --ds-size-4: round(down, calc(var(--ds-size-unit) * 4), 1px);
    --ds-size-5: round(down, calc(var(--ds-size-unit) * 5), 1px);
    --ds-size-6: round(down, calc(var(--ds-size-unit) * 6), 1px);
    --ds-size-7: round(down, calc(var(--ds-size-unit) * 7), 1px);
    --ds-size-8: round(down, calc(var(--ds-size-unit) * 8), 1px);
    --ds-size-9: round(down, calc(var(--ds-size-unit) * 9), 1px);
    --ds-size-10: round(down, calc(var(--ds-size-unit) * 10), 1px);
    --ds-size-11: round(down, calc(var(--ds-size-unit) * 11), 1px);
    --ds-size-12: round(down, calc(var(--ds-size-unit) * 12), 1px);
    --ds-size-13: round(down, calc(var(--ds-size-unit) * 13), 1px);
    --ds-size-14: round(down, calc(var(--ds-size-unit) * 14), 1px);
    --ds-size-15: round(down, calc(var(--ds-size-unit) * 15), 1px);
    --ds-size-18: round(down, calc(var(--ds-size-unit) * 18), 1px);
    --ds-size-22: round(down, calc(var(--ds-size-unit) * 22), 1px);
    --ds-size-26: round(down, calc(var(--ds-size-unit) * 26), 1px);
    --ds-size-30: round(down, calc(var(--ds-size-unit) * 30), 1px);
  }
}

}

@layer ds.theme.semantic {
:root {
  --ds-border-radius-base: 0.25rem;
  --ds-border-radius-scale: 0.25rem;
  --ds-border-radius-sm: min(var(--ds-border-radius-base)*0.5,var(--ds-border-radius-scale));
  --ds-border-radius-md: min(var(--ds-border-radius-base),var(--ds-border-radius-scale)*2);
  --ds-border-radius-lg: min(var(--ds-border-radius-base)*2,var(--ds-border-radius-scale)*5);
  --ds-border-radius-xl: min(var(--ds-border-radius-base)*3,var(--ds-border-radius-scale)*7);
  --ds-border-radius-default: var(--ds-border-radius-base);
  --ds-border-radius-full: 624.9375rem;
  --ds-border-width-default: 1px;
  --ds-border-width-focus: 3px;
  --ds-shadow-xs: 0 0 1px 0 rgba(0,0,0,0.16), 0 1px 2px 0 rgba(0,0,0,0.12);
  --ds-shadow-sm: 0 0 1px 0 rgba(0,0,0,0.15), 0 1px 2px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.1);
  --ds-shadow-md: 0 0 1px 0 rgba(0,0,0,0.14), 0 2px 4px 0 rgba(0,0,0,0.12), 0 4px 8px 0 rgba(0,0,0,0.12);
  --ds-shadow-lg: 0 0 1px 0 rgba(0,0,0,0.13), 0 3px 5px 0 rgba(0,0,0,0.13), 0 6px 12px 0 rgba(0,0,0,0.14);
  --ds-shadow-xl: 0 0 1px 0 rgba(0,0,0,0.12), 0 4px 8px 0 rgba(0,0,0,0.16), 0 12px 24px 0 rgba(0,0,0,0.16);
  --ds-opacity-disabled: 30%;
}

}

@layer ds.theme.color-scheme.dark {
[data-color-scheme="dark"] {
  --ds-color-main1-background-default: #010509;
  --ds-color-main1-background-tinted: #001429;
  --ds-color-main1-surface-default: #020C18;
  --ds-color-main1-surface-tinted: #001C3A;
  --ds-color-main1-surface-hover: #002C5A;
  --ds-color-main1-surface-active: #003A80;
  --ds-color-main1-border-subtle: #66ABFF;
  --ds-color-main1-border-default: #9ECAFF;
  --ds-color-main1-border-strong: #D6EAFF;
  --ds-color-main1-text-subtle: #9ECAFF;
  --ds-color-main1-text-default: #D6EAFF;
  --ds-color-main1-base-default: #9ECAFF;
  --ds-color-main1-base-hover: #80B9FF;
  --ds-color-main1-base-active: #66ABFF;
  --ds-color-main1-base-contrast-subtle: #001C3A;
  --ds-color-main1-base-contrast-default: #020C18;
  --ds-color-main2-background-default: #0A0500;
  --ds-color-main2-background-tinted: #291600;
  --ds-color-main2-surface-default: #1A0E00;
  --ds-color-main2-surface-tinted: #381E00;
  --ds-color-main2-surface-hover: #472600;
  --ds-color-main2-surface-active: #5C3100;
  --ds-color-main2-border-subtle: #FFAB57;
  --ds-color-main2-border-default: #FFDBB2;
  --ds-color-main2-border-strong: #FFF3E5;
  --ds-color-main2-text-subtle: #FFDBB2;
  --ds-color-main2-text-default: #FFF3E5;
  --ds-color-main2-base-default: #FF8700;
  --ds-color-main2-base-hover: #FF9933;
  --ds-color-main2-base-active: #FFAB57;
  --ds-color-main2-base-contrast-subtle: #291600;
  --ds-color-main2-base-contrast-default: #0A0500;
  --ds-color-main3-background-default: #010609;
  --ds-color-main3-background-tinted: #041825;
  --ds-color-main3-surface-default: #030F17;
  --ds-color-main3-surface-tinted: #062232;
  --ds-color-main3-surface-hover: #093853;
  --ds-color-main3-surface-active: #0D4E72;
  --ds-color-main3-border-subtle: #85BFE0;
  --ds-color-main3-border-default: #ADD7F0;
  --ds-color-main3-border-strong: #DAEFFB;
  --ds-color-main3-text-subtle: #ADD7F0;
  --ds-color-main3-text-default: #DAEFFB;
  --ds-color-main3-base-default: #DAEFFB;
  --ds-color-main3-base-hover: #BCDDF1;
  --ds-color-main3-base-active: #ADD7F0;
  --ds-color-main3-base-contrast-subtle: #062232;
  --ds-color-main3-base-contrast-default: #030F17;
  --ds-color-maintest-background-default: #1A0018;
  --ds-color-maintest-background-tinted: #3D0039;
  --ds-color-maintest-surface-default: #290026;
  --ds-color-maintest-surface-tinted: #5C0055;
  --ds-color-maintest-surface-hover: #800076;
  --ds-color-maintest-surface-active: #99008E;
  --ds-color-maintest-border-subtle: #FF66F4;
  --ds-color-maintest-border-default: #FF9EF8;
  --ds-color-maintest-border-strong: #FFCCFB;
  --ds-color-maintest-text-subtle: #FF9EF8;
  --ds-color-maintest-text-default: #FFCCFB;
  --ds-color-maintest-base-default: #FF9EF8;
  --ds-color-maintest-base-hover: #FF80F6;
  --ds-color-maintest-base-active: #FF66F4;
  --ds-color-maintest-base-contrast-subtle: #3D0039;
  --ds-color-maintest-base-contrast-default: #1A0018;
  --ds-color-support1-background-default: #010509;
  --ds-color-support1-background-tinted: #001429;
  --ds-color-support1-surface-default: #020C18;
  --ds-color-support1-surface-tinted: #001C3A;
  --ds-color-support1-surface-hover: #002C5A;
  --ds-color-support1-surface-active: #003A80;
  --ds-color-support1-border-subtle: #66ABFF;
  --ds-color-support1-border-default: #9ECAFF;
  --ds-color-support1-border-strong: #D6EAFF;
  --ds-color-support1-text-subtle: #9ECAFF;
  --ds-color-support1-text-default: #D6EAFF;
  --ds-color-support1-base-default: #9ECAFF;
  --ds-color-support1-base-hover: #80B9FF;
  --ds-color-support1-base-active: #66ABFF;
  --ds-color-support1-base-contrast-subtle: #001C3A;
  --ds-color-support1-base-contrast-default: #020C18;
  --ds-color-support2-background-default: #0A0500;
  --ds-color-support2-background-tinted: #291600;
  --ds-color-support2-surface-default: #1A0E00;
  --ds-color-support2-surface-tinted: #381E00;
  --ds-color-support2-surface-hover: #472600;
  --ds-color-support2-surface-active: #5C3100;
  --ds-color-support2-border-subtle: #FFAB57;
  --ds-color-support2-border-default: #FFDBB2;
  --ds-color-support2-border-strong: #FFF3E5;
  --ds-color-support2-text-subtle: #FFDBB2;
  --ds-color-support2-text-default: #FFF3E5;
  --ds-color-support2-base-default: #FF8700;
  --ds-color-support2-base-hover: #FF9933;
  --ds-color-support2-base-active: #FFAB57;
  --ds-color-support2-base-contrast-subtle: #291600;
  --ds-color-support2-base-contrast-default: #0A0500;
  --ds-color-supporttest-background-default: #1A0018;
  --ds-color-supporttest-background-tinted: #3D0039;
  --ds-color-supporttest-surface-default: #290026;
  --ds-color-supporttest-surface-tinted: #5C0055;
  --ds-color-supporttest-surface-hover: #800076;
  --ds-color-supporttest-surface-active: #99008E;
  --ds-color-supporttest-border-subtle: #FF66F4;
  --ds-color-supporttest-border-default: #FF9EF8;
  --ds-color-supporttest-border-strong: #FFCCFB;
  --ds-color-supporttest-text-subtle: #FF9EF8;
  --ds-color-supporttest-text-default: #FFCCFB;
  --ds-color-supporttest-base-default: #FF9EF8;
  --ds-color-supporttest-base-hover: #FF80F6;
  --ds-color-supporttest-base-active: #FF66F4;
  --ds-color-supporttest-base-contrast-subtle: #3D0039;
  --ds-color-supporttest-base-contrast-default: #1A0018;
  --ds-color-neutral-background-default: #050505;
  --ds-color-neutral-background-tinted: #141414;
  --ds-color-neutral-surface-default: #0D0D0D;
  --ds-color-neutral-surface-tinted: #1C1C1C;
  --ds-color-neutral-surface-hover: #2E2E2E;
  --ds-color-neutral-surface-active: #404040;
  --ds-color-neutral-border-subtle: #ABABAB;
  --ds-color-neutral-border-default: #BFBFBF;
  --ds-color-neutral-border-strong: #EBEBEB;
  --ds-color-neutral-text-subtle: #BFBFBF;
  --ds-color-neutral-text-default: #EBEBEB;
  --ds-color-neutral-base-default: #EBEBEB;
  --ds-color-neutral-base-hover: #D6D6D6;
  --ds-color-neutral-base-active: #BFBFBF;
  --ds-color-neutral-base-contrast-subtle: #1C1C1C;
  --ds-color-neutral-base-contrast-default: #0D0D0D;
  --ds-color-info-background-default: #010509;
  --ds-color-info-background-tinted: #001429;
  --ds-color-info-surface-default: #020C18;
  --ds-color-info-surface-tinted: #001C3A;
  --ds-color-info-surface-hover: #002C5A;
  --ds-color-info-surface-active: #003A80;
  --ds-color-info-border-subtle: #66ABFF;
  --ds-color-info-border-default: #9ECAFF;
  --ds-color-info-border-strong: #D6EAFF;
  --ds-color-info-text-subtle: #9ECAFF;
  --ds-color-info-text-default: #D6EAFF;
  --ds-color-info-base-default: #9ECAFF;
  --ds-color-info-base-hover: #80B9FF;
  --ds-color-info-base-active: #66ABFF;
  --ds-color-info-base-contrast-subtle: #001C3A;
  --ds-color-info-base-contrast-default: #020C18;
  --ds-color-success-background-default: #000A02;
  --ds-color-success-background-tinted: #002906;
  --ds-color-success-surface-default: #001A04;
  --ds-color-success-surface-tinted: #003808;
  --ds-color-success-surface-hover: #005C0E;
  --ds-color-success-surface-active: #008013;
  --ds-color-success-border-subtle: #9DE1A8;
  --ds-color-success-border-default: #B8F4C1;
  --ds-color-success-border-strong: #DAFCDF;
  --ds-color-success-text-subtle: #B8F4C1;
  --ds-color-success-text-default: #DAFCDF;
  --ds-color-success-base-default: #DAFCDF;
  --ds-color-success-base-hover: #B8F4C1;
  --ds-color-success-base-active: #9DE1A8;
  --ds-color-success-base-contrast-subtle: #003808;
  --ds-color-success-base-contrast-default: #001A04;
  --ds-color-warning-background-default: #0A0500;
  --ds-color-warning-background-tinted: #291600;
  --ds-color-warning-surface-default: #1A0E00;
  --ds-color-warning-surface-tinted: #381E00;
  --ds-color-warning-surface-hover: #472600;
  --ds-color-warning-surface-active: #5C3100;
  --ds-color-warning-border-subtle: #FFAB57;
  --ds-color-warning-border-default: #FFDBB2;
  --ds-color-warning-border-strong: #FFF3E5;
  --ds-color-warning-text-subtle: #FFDBB2;
  --ds-color-warning-text-default: #FFF3E5;
  --ds-color-warning-base-default: #FF8700;
  --ds-color-warning-base-hover: #FF9933;
  --ds-color-warning-base-active: #FFAB57;
  --ds-color-warning-base-contrast-subtle: #291600;
  --ds-color-warning-base-contrast-default: #0A0500;
  --ds-color-danger-background-default: #1A0000;
  --ds-color-danger-background-tinted: #380000;
  --ds-color-danger-surface-default: #290000;
  --ds-color-danger-surface-tinted: #5C0000;
  --ds-color-danger-surface-hover: #760A0A;
  --ds-color-danger-surface-active: #861313;
  --ds-color-danger-border-subtle: #F47171;
  --ds-color-danger-border-default: #F8A5A5;
  --ds-color-danger-border-strong: #FDD8D8;
  --ds-color-danger-text-subtle: #F8A5A5;
  --ds-color-danger-text-default: #FDD8D8;
  --ds-color-danger-base-default: #F8A5A5;
  --ds-color-danger-base-hover: #F58989;
  --ds-color-danger-base-active: #F47171;
  --ds-color-danger-base-contrast-subtle: #380000;
  --ds-color-danger-base-contrast-default: #1A0000;
  --ds-color-focus-inner: #15181E;
  --ds-color-focus-outer: #ECC238;
  --ds-link-color-visited: #CDA6F2;

  color-scheme: dark;
}
 
@media (prefers-color-scheme: dark) {
  [data-color-scheme="auto"] {
  --ds-color-main1-background-default: #010509;
  --ds-color-main1-background-tinted: #001429;
  --ds-color-main1-surface-default: #020C18;
  --ds-color-main1-surface-tinted: #001C3A;
  --ds-color-main1-surface-hover: #002C5A;
  --ds-color-main1-surface-active: #003A80;
  --ds-color-main1-border-subtle: #66ABFF;
  --ds-color-main1-border-default: #9ECAFF;
  --ds-color-main1-border-strong: #D6EAFF;
  --ds-color-main1-text-subtle: #9ECAFF;
  --ds-color-main1-text-default: #D6EAFF;
  --ds-color-main1-base-default: #9ECAFF;
  --ds-color-main1-base-hover: #80B9FF;
  --ds-color-main1-base-active: #66ABFF;
  --ds-color-main1-base-contrast-subtle: #001C3A;
  --ds-color-main1-base-contrast-default: #020C18;
  --ds-color-main2-background-default: #0A0500;
  --ds-color-main2-background-tinted: #291600;
  --ds-color-main2-surface-default: #1A0E00;
  --ds-color-main2-surface-tinted: #381E00;
  --ds-color-main2-surface-hover: #472600;
  --ds-color-main2-surface-active: #5C3100;
  --ds-color-main2-border-subtle: #FFAB57;
  --ds-color-main2-border-default: #FFDBB2;
  --ds-color-main2-border-strong: #FFF3E5;
  --ds-color-main2-text-subtle: #FFDBB2;
  --ds-color-main2-text-default: #FFF3E5;
  --ds-color-main2-base-default: #FF8700;
  --ds-color-main2-base-hover: #FF9933;
  --ds-color-main2-base-active: #FFAB57;
  --ds-color-main2-base-contrast-subtle: #291600;
  --ds-color-main2-base-contrast-default: #0A0500;
  --ds-color-main3-background-default: #010609;
  --ds-color-main3-background-tinted: #041825;
  --ds-color-main3-surface-default: #030F17;
  --ds-color-main3-surface-tinted: #062232;
  --ds-color-main3-surface-hover: #093853;
  --ds-color-main3-surface-active: #0D4E72;
  --ds-color-main3-border-subtle: #85BFE0;
  --ds-color-main3-border-default: #ADD7F0;
  --ds-color-main3-border-strong: #DAEFFB;
  --ds-color-main3-text-subtle: #ADD7F0;
  --ds-color-main3-text-default: #DAEFFB;
  --ds-color-main3-base-default: #DAEFFB;
  --ds-color-main3-base-hover: #BCDDF1;
  --ds-color-main3-base-active: #ADD7F0;
  --ds-color-main3-base-contrast-subtle: #062232;
  --ds-color-main3-base-contrast-default: #030F17;
  --ds-color-maintest-background-default: #1A0018;
  --ds-color-maintest-background-tinted: #3D0039;
  --ds-color-maintest-surface-default: #290026;
  --ds-color-maintest-surface-tinted: #5C0055;
  --ds-color-maintest-surface-hover: #800076;
  --ds-color-maintest-surface-active: #99008E;
  --ds-color-maintest-border-subtle: #FF66F4;
  --ds-color-maintest-border-default: #FF9EF8;
  --ds-color-maintest-border-strong: #FFCCFB;
  --ds-color-maintest-text-subtle: #FF9EF8;
  --ds-color-maintest-text-default: #FFCCFB;
  --ds-color-maintest-base-default: #FF9EF8;
  --ds-color-maintest-base-hover: #FF80F6;
  --ds-color-maintest-base-active: #FF66F4;
  --ds-color-maintest-base-contrast-subtle: #3D0039;
  --ds-color-maintest-base-contrast-default: #1A0018;
  --ds-color-support1-background-default: #010509;
  --ds-color-support1-background-tinted: #001429;
  --ds-color-support1-surface-default: #020C18;
  --ds-color-support1-surface-tinted: #001C3A;
  --ds-color-support1-surface-hover: #002C5A;
  --ds-color-support1-surface-active: #003A80;
  --ds-color-support1-border-subtle: #66ABFF;
  --ds-color-support1-border-default: #9ECAFF;
  --ds-color-support1-border-strong: #D6EAFF;
  --ds-color-support1-text-subtle: #9ECAFF;
  --ds-color-support1-text-default: #D6EAFF;
  --ds-color-support1-base-default: #9ECAFF;
  --ds-color-support1-base-hover: #80B9FF;
  --ds-color-support1-base-active: #66ABFF;
  --ds-color-support1-base-contrast-subtle: #001C3A;
  --ds-color-support1-base-contrast-default: #020C18;
  --ds-color-support2-background-default: #0A0500;
  --ds-color-support2-background-tinted: #291600;
  --ds-color-support2-surface-default: #1A0E00;
  --ds-color-support2-surface-tinted: #381E00;
  --ds-color-support2-surface-hover: #472600;
  --ds-color-support2-surface-active: #5C3100;
  --ds-color-support2-border-subtle: #FFAB57;
  --ds-color-support2-border-default: #FFDBB2;
  --ds-color-support2-border-strong: #FFF3E5;
  --ds-color-support2-text-subtle: #FFDBB2;
  --ds-color-support2-text-default: #FFF3E5;
  --ds-color-support2-base-default: #FF8700;
  --ds-color-support2-base-hover: #FF9933;
  --ds-color-support2-base-active: #FFAB57;
  --ds-color-support2-base-contrast-subtle: #291600;
  --ds-color-support2-base-contrast-default: #0A0500;
  --ds-color-supporttest-background-default: #1A0018;
  --ds-color-supporttest-background-tinted: #3D0039;
  --ds-color-supporttest-surface-default: #290026;
  --ds-color-supporttest-surface-tinted: #5C0055;
  --ds-color-supporttest-surface-hover: #800076;
  --ds-color-supporttest-surface-active: #99008E;
  --ds-color-supporttest-border-subtle: #FF66F4;
  --ds-color-supporttest-border-default: #FF9EF8;
  --ds-color-supporttest-border-strong: #FFCCFB;
  --ds-color-supporttest-text-subtle: #FF9EF8;
  --ds-color-supporttest-text-default: #FFCCFB;
  --ds-color-supporttest-base-default: #FF9EF8;
  --ds-color-supporttest-base-hover: #FF80F6;
  --ds-color-supporttest-base-active: #FF66F4;
  --ds-color-supporttest-base-contrast-subtle: #3D0039;
  --ds-color-supporttest-base-contrast-default: #1A0018;
  --ds-color-neutral-background-default: #050505;
  --ds-color-neutral-background-tinted: #141414;
  --ds-color-neutral-surface-default: #0D0D0D;
  --ds-color-neutral-surface-tinted: #1C1C1C;
  --ds-color-neutral-surface-hover: #2E2E2E;
  --ds-color-neutral-surface-active: #404040;
  --ds-color-neutral-border-subtle: #ABABAB;
  --ds-color-neutral-border-default: #BFBFBF;
  --ds-color-neutral-border-strong: #EBEBEB;
  --ds-color-neutral-text-subtle: #BFBFBF;
  --ds-color-neutral-text-default: #EBEBEB;
  --ds-color-neutral-base-default: #EBEBEB;
  --ds-color-neutral-base-hover: #D6D6D6;
  --ds-color-neutral-base-active: #BFBFBF;
  --ds-color-neutral-base-contrast-subtle: #1C1C1C;
  --ds-color-neutral-base-contrast-default: #0D0D0D;
  --ds-color-info-background-default: #010509;
  --ds-color-info-background-tinted: #001429;
  --ds-color-info-surface-default: #020C18;
  --ds-color-info-surface-tinted: #001C3A;
  --ds-color-info-surface-hover: #002C5A;
  --ds-color-info-surface-active: #003A80;
  --ds-color-info-border-subtle: #66ABFF;
  --ds-color-info-border-default: #9ECAFF;
  --ds-color-info-border-strong: #D6EAFF;
  --ds-color-info-text-subtle: #9ECAFF;
  --ds-color-info-text-default: #D6EAFF;
  --ds-color-info-base-default: #9ECAFF;
  --ds-color-info-base-hover: #80B9FF;
  --ds-color-info-base-active: #66ABFF;
  --ds-color-info-base-contrast-subtle: #001C3A;
  --ds-color-info-base-contrast-default: #020C18;
  --ds-color-success-background-default: #000A02;
  --ds-color-success-background-tinted: #002906;
  --ds-color-success-surface-default: #001A04;
  --ds-color-success-surface-tinted: #003808;
  --ds-color-success-surface-hover: #005C0E;
  --ds-color-success-surface-active: #008013;
  --ds-color-success-border-subtle: #9DE1A8;
  --ds-color-success-border-default: #B8F4C1;
  --ds-color-success-border-strong: #DAFCDF;
  --ds-color-success-text-subtle: #B8F4C1;
  --ds-color-success-text-default: #DAFCDF;
  --ds-color-success-base-default: #DAFCDF;
  --ds-color-success-base-hover: #B8F4C1;
  --ds-color-success-base-active: #9DE1A8;
  --ds-color-success-base-contrast-subtle: #003808;
  --ds-color-success-base-contrast-default: #001A04;
  --ds-color-warning-background-default: #0A0500;
  --ds-color-warning-background-tinted: #291600;
  --ds-color-warning-surface-default: #1A0E00;
  --ds-color-warning-surface-tinted: #381E00;
  --ds-color-warning-surface-hover: #472600;
  --ds-color-warning-surface-active: #5C3100;
  --ds-color-warning-border-subtle: #FFAB57;
  --ds-color-warning-border-default: #FFDBB2;
  --ds-color-warning-border-strong: #FFF3E5;
  --ds-color-warning-text-subtle: #FFDBB2;
  --ds-color-warning-text-default: #FFF3E5;
  --ds-color-warning-base-default: #FF8700;
  --ds-color-warning-base-hover: #FF9933;
  --ds-color-warning-base-active: #FFAB57;
  --ds-color-warning-base-contrast-subtle: #291600;
  --ds-color-warning-base-contrast-default: #0A0500;
  --ds-color-danger-background-default: #1A0000;
  --ds-color-danger-background-tinted: #380000;
  --ds-color-danger-surface-default: #290000;
  --ds-color-danger-surface-tinted: #5C0000;
  --ds-color-danger-surface-hover: #760A0A;
  --ds-color-danger-surface-active: #861313;
  --ds-color-danger-border-subtle: #F47171;
  --ds-color-danger-border-default: #F8A5A5;
  --ds-color-danger-border-strong: #FDD8D8;
  --ds-color-danger-text-subtle: #F8A5A5;
  --ds-color-danger-text-default: #FDD8D8;
  --ds-color-danger-base-default: #F8A5A5;
  --ds-color-danger-base-hover: #F58989;
  --ds-color-danger-base-active: #F47171;
  --ds-color-danger-base-contrast-subtle: #380000;
  --ds-color-danger-base-contrast-default: #1A0000;
  --ds-color-focus-inner: #15181E;
  --ds-color-focus-outer: #ECC238;
  --ds-link-color-visited: #CDA6F2;

  color-scheme: dark;
}

}

}

@layer ds.theme.typography.primary {
:root, [data-typography="primary"] {
  --ds-line-height-sm: 1.3;
  --ds-line-height-md: 1.5;
  --ds-line-height-lg: 1.7;
  --ds-letter-spacing-1: -0.01em;
  --ds-letter-spacing-2: -0.005em;
  --ds-letter-spacing-3: -0.0025em;
  --ds-letter-spacing-4: -0.0015em;
  --ds-letter-spacing-5: 0em;
  --ds-letter-spacing-6: 0.0015em;
  --ds-letter-spacing-7: 0.0025em;
  --ds-letter-spacing-8: 0.005em;
  --ds-letter-spacing-9: 0.015em;
  --ds-font-family: Inter;
  --ds-font-weight-medium: 500;
  --ds-font-weight-semibold: 600;
  --ds-font-weight-regular: 400;
  --ds-heading-2xl-font-weight: 500;
  --ds-heading-2xl-line-height: 1.3;
  --ds-heading-2xl-letter-spacing: -0.01em;
  --ds-heading-xl-font-weight: 500;
  --ds-heading-xl-line-height: 1.3;
  --ds-heading-xl-letter-spacing: -0.01em;
  --ds-heading-lg-font-weight: 500;
  --ds-heading-lg-line-height: 1.3;
  --ds-heading-lg-letter-spacing: -0.005em;
  --ds-heading-md-font-weight: 500;
  --ds-heading-md-line-height: 1.3;
  --ds-heading-md-letter-spacing: -0.0025em;
  --ds-heading-sm-font-weight: 500;
  --ds-heading-sm-line-height: 1.3;
  --ds-heading-sm-letter-spacing: 0em;
  --ds-heading-xs-font-weight: 500;
  --ds-heading-xs-line-height: 1.3;
  --ds-heading-xs-letter-spacing: 0.0015em;
  --ds-heading-2xs-font-weight: 500;
  --ds-heading-2xs-line-height: 1.3;
  --ds-heading-2xs-letter-spacing: 0.0015em;
  --ds-body-xl-font-weight: 400;
  --ds-body-xl-line-height: 1.5;
  --ds-body-xl-letter-spacing: 0.005em;
  --ds-body-lg-font-weight: 400;
  --ds-body-lg-line-height: 1.5;
  --ds-body-lg-letter-spacing: 0.005em;
  --ds-body-md-font-weight: 400;
  --ds-body-md-line-height: 1.5;
  --ds-body-md-letter-spacing: 0.005em;
  --ds-body-sm-font-weight: 400;
  --ds-body-sm-line-height: 1.5;
  --ds-body-sm-letter-spacing: 0.0025em;
  --ds-body-xs-font-weight: 400;
  --ds-body-xs-line-height: 1.5;
  --ds-body-xs-letter-spacing: 0.0015em;
  --ds-body-short-xl-font-weight: 400;
  --ds-body-short-xl-line-height: 1.3;
  --ds-body-short-xl-letter-spacing: 0.005em;
  --ds-body-short-lg-font-weight: 400;
  --ds-body-short-lg-line-height: 1.3;
  --ds-body-short-lg-letter-spacing: 0.005em;
  --ds-body-short-md-font-weight: 400;
  --ds-body-short-md-line-height: 1.3;
  --ds-body-short-md-letter-spacing: 0.005em;
  --ds-body-short-sm-font-weight: 400;
  --ds-body-short-sm-line-height: 1.3;
  --ds-body-short-sm-letter-spacing: 0.0025em;
  --ds-body-short-xs-font-weight: 400;
  --ds-body-short-xs-line-height: 1.3;
  --ds-body-short-xs-letter-spacing: 0.0015em;
  --ds-body-long-xl-font-weight: 400;
  --ds-body-long-xl-line-height: 1.7;
  --ds-body-long-xl-letter-spacing: 0.005em;
  --ds-body-long-lg-font-weight: 400;
  --ds-body-long-lg-line-height: 1.7;
  --ds-body-long-lg-letter-spacing: 0.005em;
  --ds-body-long-md-font-weight: 400;
  --ds-body-long-md-line-height: 1.7;
  --ds-body-long-md-letter-spacing: 0.005em;
  --ds-body-long-sm-font-weight: 400;
  --ds-body-long-sm-line-height: 1.7;
  --ds-body-long-sm-letter-spacing: 0.0025em;
  --ds-body-long-xs-font-weight: 400;
  --ds-body-long-xs-line-height: 1.7;
  --ds-body-long-xs-letter-spacing: 0.0015em;
}
}
@layer ds.theme.color {
[data-color="danger"], [data-color-scheme][data-color="danger"] {
  --ds-color-background-default: var(--ds-color-danger-background-default);
  --ds-color-background-tinted: var(--ds-color-danger-background-tinted);
  --ds-color-surface-default: var(--ds-color-danger-surface-default);
  --ds-color-surface-tinted: var(--ds-color-danger-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-danger-surface-hover);
  --ds-color-surface-active: var(--ds-color-danger-surface-active);
  --ds-color-border-subtle: var(--ds-color-danger-border-subtle);
  --ds-color-border-default: var(--ds-color-danger-border-default);
  --ds-color-border-strong: var(--ds-color-danger-border-strong);
  --ds-color-text-subtle: var(--ds-color-danger-text-subtle);
  --ds-color-text-default: var(--ds-color-danger-text-default);
  --ds-color-base-default: var(--ds-color-danger-base-default);
  --ds-color-base-hover: var(--ds-color-danger-base-hover);
  --ds-color-base-active: var(--ds-color-danger-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-danger-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-danger-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="info"], [data-color-scheme][data-color="info"] {
  --ds-color-background-default: var(--ds-color-info-background-default);
  --ds-color-background-tinted: var(--ds-color-info-background-tinted);
  --ds-color-surface-default: var(--ds-color-info-surface-default);
  --ds-color-surface-tinted: var(--ds-color-info-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-info-surface-hover);
  --ds-color-surface-active: var(--ds-color-info-surface-active);
  --ds-color-border-subtle: var(--ds-color-info-border-subtle);
  --ds-color-border-default: var(--ds-color-info-border-default);
  --ds-color-border-strong: var(--ds-color-info-border-strong);
  --ds-color-text-subtle: var(--ds-color-info-text-subtle);
  --ds-color-text-default: var(--ds-color-info-text-default);
  --ds-color-base-default: var(--ds-color-info-base-default);
  --ds-color-base-hover: var(--ds-color-info-base-hover);
  --ds-color-base-active: var(--ds-color-info-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-info-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-info-base-contrast-default);
}

}

@layer ds.theme.color {
:root, [data-color-scheme], [data-color="main1"] {
  --ds-color-background-default: var(--ds-color-main1-background-default);
  --ds-color-background-tinted: var(--ds-color-main1-background-tinted);
  --ds-color-surface-default: var(--ds-color-main1-surface-default);
  --ds-color-surface-tinted: var(--ds-color-main1-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-main1-surface-hover);
  --ds-color-surface-active: var(--ds-color-main1-surface-active);
  --ds-color-border-subtle: var(--ds-color-main1-border-subtle);
  --ds-color-border-default: var(--ds-color-main1-border-default);
  --ds-color-border-strong: var(--ds-color-main1-border-strong);
  --ds-color-text-subtle: var(--ds-color-main1-text-subtle);
  --ds-color-text-default: var(--ds-color-main1-text-default);
  --ds-color-base-default: var(--ds-color-main1-base-default);
  --ds-color-base-hover: var(--ds-color-main1-base-hover);
  --ds-color-base-active: var(--ds-color-main1-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-main1-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-main1-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="main2"], [data-color-scheme][data-color="main2"] {
  --ds-color-background-default: var(--ds-color-main2-background-default);
  --ds-color-background-tinted: var(--ds-color-main2-background-tinted);
  --ds-color-surface-default: var(--ds-color-main2-surface-default);
  --ds-color-surface-tinted: var(--ds-color-main2-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-main2-surface-hover);
  --ds-color-surface-active: var(--ds-color-main2-surface-active);
  --ds-color-border-subtle: var(--ds-color-main2-border-subtle);
  --ds-color-border-default: var(--ds-color-main2-border-default);
  --ds-color-border-strong: var(--ds-color-main2-border-strong);
  --ds-color-text-subtle: var(--ds-color-main2-text-subtle);
  --ds-color-text-default: var(--ds-color-main2-text-default);
  --ds-color-base-default: var(--ds-color-main2-base-default);
  --ds-color-base-hover: var(--ds-color-main2-base-hover);
  --ds-color-base-active: var(--ds-color-main2-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-main2-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-main2-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="main3"], [data-color-scheme][data-color="main3"] {
  --ds-color-background-default: var(--ds-color-main3-background-default);
  --ds-color-background-tinted: var(--ds-color-main3-background-tinted);
  --ds-color-surface-default: var(--ds-color-main3-surface-default);
  --ds-color-surface-tinted: var(--ds-color-main3-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-main3-surface-hover);
  --ds-color-surface-active: var(--ds-color-main3-surface-active);
  --ds-color-border-subtle: var(--ds-color-main3-border-subtle);
  --ds-color-border-default: var(--ds-color-main3-border-default);
  --ds-color-border-strong: var(--ds-color-main3-border-strong);
  --ds-color-text-subtle: var(--ds-color-main3-text-subtle);
  --ds-color-text-default: var(--ds-color-main3-text-default);
  --ds-color-base-default: var(--ds-color-main3-base-default);
  --ds-color-base-hover: var(--ds-color-main3-base-hover);
  --ds-color-base-active: var(--ds-color-main3-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-main3-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-main3-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="maintest"], [data-color-scheme][data-color="maintest"] {
  --ds-color-background-default: var(--ds-color-maintest-background-default);
  --ds-color-background-tinted: var(--ds-color-maintest-background-tinted);
  --ds-color-surface-default: var(--ds-color-maintest-surface-default);
  --ds-color-surface-tinted: var(--ds-color-maintest-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-maintest-surface-hover);
  --ds-color-surface-active: var(--ds-color-maintest-surface-active);
  --ds-color-border-subtle: var(--ds-color-maintest-border-subtle);
  --ds-color-border-default: var(--ds-color-maintest-border-default);
  --ds-color-border-strong: var(--ds-color-maintest-border-strong);
  --ds-color-text-subtle: var(--ds-color-maintest-text-subtle);
  --ds-color-text-default: var(--ds-color-maintest-text-default);
  --ds-color-base-default: var(--ds-color-maintest-base-default);
  --ds-color-base-hover: var(--ds-color-maintest-base-hover);
  --ds-color-base-active: var(--ds-color-maintest-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-maintest-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-maintest-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="neutral"], [data-color-scheme][data-color="neutral"] {
  --ds-color-background-default: var(--ds-color-neutral-background-default);
  --ds-color-background-tinted: var(--ds-color-neutral-background-tinted);
  --ds-color-surface-default: var(--ds-color-neutral-surface-default);
  --ds-color-surface-tinted: var(--ds-color-neutral-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-neutral-surface-hover);
  --ds-color-surface-active: var(--ds-color-neutral-surface-active);
  --ds-color-border-subtle: var(--ds-color-neutral-border-subtle);
  --ds-color-border-default: var(--ds-color-neutral-border-default);
  --ds-color-border-strong: var(--ds-color-neutral-border-strong);
  --ds-color-text-subtle: var(--ds-color-neutral-text-subtle);
  --ds-color-text-default: var(--ds-color-neutral-text-default);
  --ds-color-base-default: var(--ds-color-neutral-base-default);
  --ds-color-base-hover: var(--ds-color-neutral-base-hover);
  --ds-color-base-active: var(--ds-color-neutral-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-neutral-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-neutral-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="success"], [data-color-scheme][data-color="success"] {
  --ds-color-background-default: var(--ds-color-success-background-default);
  --ds-color-background-tinted: var(--ds-color-success-background-tinted);
  --ds-color-surface-default: var(--ds-color-success-surface-default);
  --ds-color-surface-tinted: var(--ds-color-success-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-success-surface-hover);
  --ds-color-surface-active: var(--ds-color-success-surface-active);
  --ds-color-border-subtle: var(--ds-color-success-border-subtle);
  --ds-color-border-default: var(--ds-color-success-border-default);
  --ds-color-border-strong: var(--ds-color-success-border-strong);
  --ds-color-text-subtle: var(--ds-color-success-text-subtle);
  --ds-color-text-default: var(--ds-color-success-text-default);
  --ds-color-base-default: var(--ds-color-success-base-default);
  --ds-color-base-hover: var(--ds-color-success-base-hover);
  --ds-color-base-active: var(--ds-color-success-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-success-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-success-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="support1"], [data-color-scheme][data-color="support1"] {
  --ds-color-background-default: var(--ds-color-support1-background-default);
  --ds-color-background-tinted: var(--ds-color-support1-background-tinted);
  --ds-color-surface-default: var(--ds-color-support1-surface-default);
  --ds-color-surface-tinted: var(--ds-color-support1-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-support1-surface-hover);
  --ds-color-surface-active: var(--ds-color-support1-surface-active);
  --ds-color-border-subtle: var(--ds-color-support1-border-subtle);
  --ds-color-border-default: var(--ds-color-support1-border-default);
  --ds-color-border-strong: var(--ds-color-support1-border-strong);
  --ds-color-text-subtle: var(--ds-color-support1-text-subtle);
  --ds-color-text-default: var(--ds-color-support1-text-default);
  --ds-color-base-default: var(--ds-color-support1-base-default);
  --ds-color-base-hover: var(--ds-color-support1-base-hover);
  --ds-color-base-active: var(--ds-color-support1-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-support1-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-support1-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="support2"], [data-color-scheme][data-color="support2"] {
  --ds-color-background-default: var(--ds-color-support2-background-default);
  --ds-color-background-tinted: var(--ds-color-support2-background-tinted);
  --ds-color-surface-default: var(--ds-color-support2-surface-default);
  --ds-color-surface-tinted: var(--ds-color-support2-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-support2-surface-hover);
  --ds-color-surface-active: var(--ds-color-support2-surface-active);
  --ds-color-border-subtle: var(--ds-color-support2-border-subtle);
  --ds-color-border-default: var(--ds-color-support2-border-default);
  --ds-color-border-strong: var(--ds-color-support2-border-strong);
  --ds-color-text-subtle: var(--ds-color-support2-text-subtle);
  --ds-color-text-default: var(--ds-color-support2-text-default);
  --ds-color-base-default: var(--ds-color-support2-base-default);
  --ds-color-base-hover: var(--ds-color-support2-base-hover);
  --ds-color-base-active: var(--ds-color-support2-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-support2-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-support2-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="supporttest"], [data-color-scheme][data-color="supporttest"] {
  --ds-color-background-default: var(--ds-color-supporttest-background-default);
  --ds-color-background-tinted: var(--ds-color-supporttest-background-tinted);
  --ds-color-surface-default: var(--ds-color-supporttest-surface-default);
  --ds-color-surface-tinted: var(--ds-color-supporttest-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-supporttest-surface-hover);
  --ds-color-surface-active: var(--ds-color-supporttest-surface-active);
  --ds-color-border-subtle: var(--ds-color-supporttest-border-subtle);
  --ds-color-border-default: var(--ds-color-supporttest-border-default);
  --ds-color-border-strong: var(--ds-color-supporttest-border-strong);
  --ds-color-text-subtle: var(--ds-color-supporttest-text-subtle);
  --ds-color-text-default: var(--ds-color-supporttest-text-default);
  --ds-color-base-default: var(--ds-color-supporttest-base-default);
  --ds-color-base-hover: var(--ds-color-supporttest-base-hover);
  --ds-color-base-active: var(--ds-color-supporttest-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-supporttest-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-supporttest-base-contrast-default);
}

}

@layer ds.theme.color {
[data-color="warning"], [data-color-scheme][data-color="warning"] {
  --ds-color-background-default: var(--ds-color-warning-background-default);
  --ds-color-background-tinted: var(--ds-color-warning-background-tinted);
  --ds-color-surface-default: var(--ds-color-warning-surface-default);
  --ds-color-surface-tinted: var(--ds-color-warning-surface-tinted);
  --ds-color-surface-hover: var(--ds-color-warning-surface-hover);
  --ds-color-surface-active: var(--ds-color-warning-surface-active);
  --ds-color-border-subtle: var(--ds-color-warning-border-subtle);
  --ds-color-border-default: var(--ds-color-warning-border-default);
  --ds-color-border-strong: var(--ds-color-warning-border-strong);
  --ds-color-text-subtle: var(--ds-color-warning-text-subtle);
  --ds-color-text-default: var(--ds-color-warning-text-default);
  --ds-color-base-default: var(--ds-color-warning-base-default);
  --ds-color-base-hover: var(--ds-color-warning-base-hover);
  --ds-color-base-active: var(--ds-color-warning-base-active);
  --ds-color-base-contrast-subtle: var(--ds-color-warning-base-contrast-subtle);
  --ds-color-base-contrast-default: var(--ds-color-warning-base-contrast-default);
}

}

@layer ds-override {
  :root, .ds-skip-link {
    --dsc-skiplink-background: var(--ds-color-focus-outer);
    --dsc-skiplink-color: var(--ds-color-focus-inner);
  }
}