/* Generated from Figma Variables. First mode = :root default.
   FLOAT tokens are unitless — multiply by 1px in calc() where a length is needed. */

:root {
  --accent-primary-2: rgb(0,123,157); /* @kind color */
  --accent-primary-red: rgb(237,28,36); /* @kind color */
  --accent-primary: rgb(0,123,157); /* @kind color */
  --accent-secondary-2: rgb(237,28,36); /* @kind color */
  --accent-secondary-3: rgb(0,123,157); /* @kind color */
  --accent-secondary: rgb(228,18,26); /* @kind color */
  --background-bg-accent-hover: var(--blue-600); /* @kind color */
  --background-bg-accent-inverse: var(--blue-50); /* @kind color */
  --background-bg-accent: var(--blue-500); /* @kind color */
  --background-bg-black: var(--neutrals-black); /* @kind color */
  --background-bg-dark-blue-inverse: var(--blue-800); /* @kind color */
  --background-bg-electric-accent: var(--blue-50); /* @kind color */
  --background-bg-gold-inverse: var(--gold-50); /* @kind color */
  --background-bg-gold: var(--gold-700); /* @kind color */
  --background-bg-green-inverse: var(--green-100); /* @kind color */
  --background-bg-helper-hover: var(--neutrals-300); /* @kind color */
  --background-bg-helper: var(--neutrals-200); /* @kind color */
  --background-bg-inverse-hover: var(--neutrals-800); /* @kind color */
  --background-bg-inverse: var(--neutrals-900); /* @kind color */
  --background-bg-primary-hover: var(--neutrals-100); /* @kind color */
  --background-bg-primary: var(--neutrals-50); /* @kind color */
  --background-bg-pure: var(--neutrals-white); /* @kind color */
  --background-bg-red-inverse: var(--red-100); /* @kind color */
  --background-bg-secondary-hover: var(--neutrals-200); /* @kind color */
  --background-bg-secondary: var(--neutrals-100); /* @kind color */
  --background-bg-yellow-inverse: var(--yellow-100); /* @kind color */
  --background-black: var(--neutrals-black-2); /* @kind color */
  --background-primary: var(--neutrals-50-2); /* @kind color */
  --background-secondary: var(--neutrals-100-2); /* @kind color */
  --blue-100: rgb(210,239,244); /* @kind color */
  --blue-200: rgb(157,212,224); /* @kind color */
  --blue-300: rgb(97,190,208); /* @kind color */
  --blue-400: rgb(25,144,174); /* @kind color */
  --blue-500: rgb(0,123,157); /* @kind color */
  --blue-50: rgb(244,250,251); /* @kind color */
  --blue-600: rgb(0,104,133); /* @kind color */
  --blue-700: rgb(0,86,111); /* @kind color */
  --blue-800: rgb(0,68,89); /* @kind color */
  --blue-900: rgb(0,31,42); /* @kind color */
  --border-accent-primary: var(--accent-primary); /* @kind color */
  --border-accent-secondary: var(--accent-secondary); /* @kind color */
  --border-black: var(--neutrals-black-2); /* @kind color */
  --border-border-black: var(--neutrals-black-2); /* @kind color */
  --border-border-dark-blue: var(--accent-primary); /* @kind color */
  --border-border-dark-grey: var(--neutrals-400-2); /* @kind color */
  --border-border-red: var(--accent-secondary); /* @kind color */
  --border-primary-2: var(--neutrals-200-2); /* @kind color */
  --border-primary: var(--neutrals-200-2); /* @kind color */
  --border-secondary-2: var(--neutrals-300-2); /* @kind color */
  --border-secondary: var(--neutrals-300-2); /* @kind color */
  --border-tertiary-2: var(--neutrals-400-2); /* @kind color */
  --border-tertiary: var(--neutrals-400-2); /* @kind color */
  --brand-primary-2: rgb(239,248,250); /* @kind color */
  --brand-primary: rgb(239,248,250); /* @kind color */
  --brand-secondary-2: rgb(239,248,250); /* @kind color */
  --brand-secondary: rgb(228,18,26); /* @kind color */
  --buttons-button-accent-disabled: var(--red-200); /* @kind color */
  --buttons-button-accent-hover: var(--red-600); /* @kind color */
  --buttons-button-accent: var(--red-500); /* @kind color */
  --buttons-button-electric-disabled: var(--electric-blue-100); /* @kind color */
  --buttons-button-electric-hover: var(--electric-blue-600); /* @kind color */
  --buttons-button-electric: var(--electric-blue-500); /* @kind color */
  --buttons-button-gap: 8;
  --buttons-button-horizontal-lg: 32;
  --buttons-button-horizontal-md: 24;
  --buttons-button-horizontal-sm: 16;
  --buttons-button-primary-disabled: var(--blue-200); /* @kind color */
  --buttons-button-primary-hover: var(--blue-800); /* @kind color */
  --buttons-button-primary: var(--blue-600); /* @kind color */
  --buttons-button-secondary-disabled: var(--neutrals-100); /* @kind color */
  --buttons-button-secondary-hover: var(--neutrals-300); /* @kind color */
  --buttons-button-secondary: var(--neutrals-200); /* @kind color */
  --buttons-button-shadow-focus: var(--blue-200); /* @kind color */
  --buttons-button-tertiary-accent-active: var(--neutrals-700); /* @kind color */
  --buttons-button-tertiary-accent-disabled: var(--neutrals-400); /* @kind color */
  --buttons-button-tertiary-accent: var(--blue-500); /* @kind color */
  --buttons-button-tertiary-active: var(--neutrals-700); /* @kind color */
  --buttons-button-tertiary-disabled: var(--neutrals-400); /* @kind color */
  --buttons-button-tertiary: var(--neutrals-900); /* @kind color */
  --buttons-button-text-acccent-disabled: rgba(255,255,255,0.8); /* @kind color */
  --buttons-button-text-acccent: var(--neutrals-white); /* @kind color */
  --buttons-button-text-primary-disabled: rgba(255,255,255,0.8); /* @kind color */
  --buttons-button-text-primary: var(--neutrals-white); /* @kind color */
  --buttons-button-text-secondary-disabled-2: var(--neutrals-600); /* @kind color */
  --buttons-button-text-secondary-disabled: var(--neutrals-500); /* @kind color */
  --buttons-button-text-secondary: var(--neutrals-900); /* @kind color */
  --buttons-button-vertical-lg-2: 16;
  --buttons-button-vertical-lg: 12;
  --buttons-button-vertical-md: 12;
  --buttons-button-vertical-sm: 8;
  --container-gaps-gap-lg: 16;
  --container-gaps-gap-md: 12;
  --container-gaps-gap-sm: 8;
  --container-gaps-gap-xl: 24;
  --container-gaps-gap-xs: 4;
  --container-paddings-padding-default: 40;
  --container-paddings-padding-lg: 48;
  --container-paddings-padding-sm: 24;
  --container-paddings-padding-xl: 64;
  --container-paddings-padding-xs: 16;
  --container-paddings-padding-xxs: 8;
  --container-paddings-padding-xxxs: 4;
  --critical-critical-border: var(--red-500); /* @kind color */
  --critical-critical-surface: var(--red-50); /* @kind color */
  --critical-critical-text: var(--red-700); /* @kind color */
  --electric-blue-100: rgb(205,208,255); /* @kind color */
  --electric-blue-200: rgb(165,172,255); /* @kind color */
  --electric-blue-300: rgb(125,135,255); /* @kind color */
  --electric-blue-400: rgb(86,98,255); /* @kind color */
  --electric-blue-500: rgb(46,61,255); /* @kind color */
  --electric-blue-50: rgb(245,245,255); /* @kind color */
  --electric-blue-600: rgb(38,50,209); /* @kind color */
  --electric-blue-700: rgb(29,39,163); /* @kind color */
  --electric-blue-800: rgb(21,28,117); /* @kind color */
  --electric-blue-900: rgb(13,17,71); /* @kind color */
  --electric-blue-950: rgb(5,6,26); /* @kind color */
  --focus-focus-border: var(--blue-300); /* @kind color */
  --fonts-responsive-l2: 40;
  --fonts-responsive-l: 32;
  --fonts-responsive-m: 24;
  --fonts-responsive-titles: 24;
  --fonts-responsive-xl: 48;
  --fonts-responsive-xxl: 60;
  --gold-100: rgb(243,240,229); /* @kind color */
  --gold-200: rgb(232,225,197); /* @kind color */
  --gold-300: rgb(228,212,145); /* @kind color */
  --gold-400: rgb(221,198,121); /* @kind color */
  --gold-500: rgb(201,172,92); /* @kind color */
  --gold-50: rgb(250,249,245); /* @kind color */
  --gold-600: rgb(178,149,60); /* @kind color */
  --gold-700: rgb(156,135,60); /* @kind color */
  --gold-800: rgb(113,97,34); /* @kind color */
  --gold-900: rgb(48,42,21); /* @kind color */
  --gold-gold-accent: var(--gold-700); /* @kind color */
  --gold-gold-bg: var(--gold-50); /* @kind color */
  --gold-gold-text: var(--gold-800); /* @kind color */
  --green-100: rgb(206,239,227); /* @kind color */
  --green-200: rgb(141,213,187); /* @kind color */
  --green-300: rgb(85,192,157); /* @kind color */
  --green-400: rgb(40,158,125); /* @kind color */
  --green-500: rgb(0,132,98); /* @kind color */
  --green-50: rgb(244,251,248); /* @kind color */
  --green-600: rgb(0,114,85); /* @kind color */
  --green-700: rgb(0,95,73); /* @kind color */
  --green-800: rgb(0,77,60); /* @kind color */
  --green-900: rgb(1,51,41); /* @kind color */
  --icon-accent-primary-2: var(--accent-primary); /* @kind color */
  --icon-accent-primary: var(--accent-primary); /* @kind color */
  --icon-accent-secondary: var(--accent-secondary); /* @kind color */
  --icon-icon-accent: var(--blue-500); /* @kind color */
  --icon-icon-primary: var(--neutrals-900); /* @kind color */
  --icon-icon-secondary: var(--neutrals-500); /* @kind color */
  --icon-primary-2: var(--neutrals-black-2); /* @kind color */
  --icon-primary: var(--neutrals-black-2); /* @kind color */
  --icon-secondary-2: var(--neutrals-400-2); /* @kind color */
  --icon-secondary-3: var(--neutrals-400-2); /* @kind color */
  --icon-secondary: var(--neutrals-400-2); /* @kind color */
  --icon-tertiary: var(--neutrals-350); /* @kind color */
  --icon-white: var(--neutrals-white-2); /* @kind color */
  --icons-icon-accent-visited: var(--neutrals-400); /* @kind color */
  --icons-icon-accent: var(--blue-500); /* @kind color */
  --icons-icon-base: var(--neutrals-black-2); /* @kind color */
  --icons-icon-dark-blue-2: var(--accent-primary); /* @kind color */
  --icons-icon-dark-blue: var(--accent-primary); /* @kind color */
  --icons-icon-dark-grey: var(--neutrals-400-2); /* @kind color */
  --icons-icon-electric: var(--electric-blue-500); /* @kind color */
  --icons-icon-helper: var(--neutrals-500); /* @kind color */
  --icons-icon-primary-hover: var(--blue-500); /* @kind color */
  --icons-icon-primary-inverse: var(--neutrals-50); /* @kind color */
  --icons-icon-primary-pressed: var(--blue-500); /* @kind color */
  --icons-icon-primary-visited: var(--blue-300); /* @kind color */
  --icons-icon-primary: var(--neutrals-900); /* @kind color */
  --icons-icon-red: var(--red-500); /* @kind color */
  --icons-icon-secondary: var(--neutrals-600); /* @kind color */
  --icons-icon-white-2: var(--neutrals-white-2); /* @kind color */
  --icons-icon-white: var(--neutrals-50); /* @kind color */
  --info-info-border: var(--blue-500); /* @kind color */
  --info-info-surface: var(--blue-50); /* @kind color */
  --info-info-text: var(--blue-700); /* @kind color */
  --inputs-field-bg-default: var(--neutrals-white); /* @kind color */
  --inputs-field-bg-disabled: var(--neutrals-100); /* @kind color */
  --inputs-input-gap: 8;
  --inputs-input-horizontal-lg: 16;
  --inputs-input-horizontal-md: 12;
  --inputs-input-horizontal-sm: 8;
  --inputs-input-vertical-lg: 16;
  --inputs-input-vertical-md: 12;
  --inputs-input-vertical-sm: 8;
  --layout-articlepage-h2-margin: var(--spacings-spacing-32);
  --layout-articlepage-headings-margin: var(--spacings-spacing-24);
  --layout-articlepage-paragraph-margin: var(--spacings-spacing-24);
  --layout-articlepage-widget-margin: var(--spacings-spacing-40);
  --layout-breakpoint: 1280;
  --layout-footer-margin: var(--spacings-spacing-80);
  --layout-grid-gap-2: var(--spacings-spacing-40);
  --layout-grid-gap: var(--spacings-spacing-40);
  --layout-grid-margin: var(--spacings-spacing-48);
  --layout-heading-margin: var(--spacings-spacing-24);
  --layout-layout-footer-gap: 80;
  --layout-layout-gap-default: 64;
  --layout-layout-gap-md: 40;
  --layout-layout-gap-sm: 32;
  --layout-layout-gap-xl: 96;
  --layout-layout-gap-xs: 24;
  --layout-layout-grid-gap: 40;
  --layout-layout-nav-gap: 40;
  --layout-layout-responsive-breakpoint: 1280;
  --layout-layout-safe-area: 48;
  --layout-layout-screen-size: 1280;
  --layout-nav-margin: var(--spacings-spacing-40);
  --layout-section-margin: var(--spacings-spacing-68);
  --link-link-primary: var(--blue-500); /* @kind color */
  --link-link-secondary: var(--red-500); /* @kind color */
  --neutrals-100-2: rgb(249,249,249); /* @kind color */
  --neutrals-100: rgb(248,248,248); /* @kind color */
  --neutrals-200-2: rgb(242,242,242); /* @kind color */
  --neutrals-200: rgb(237,237,237); /* @kind color */
  --neutrals-300-2: rgb(209,209,214); /* @kind color */
  --neutrals-300: rgb(224,224,224); /* @kind color */
  --neutrals-350: rgb(153,153,153); /* @kind color */
  --neutrals-400-2: rgb(102,102,102); /* @kind color */
  --neutrals-400: rgb(211,211,211); /* @kind color */
  --neutrals-50-2: rgb(254,254,254); /* @kind color */
  --neutrals-500-2: rgb(37,37,37); /* @kind color */
  --neutrals-500: rgb(156,156,156); /* @kind color */
  --neutrals-50: rgb(254,254,254); /* @kind color */
  --neutrals-600: rgb(98,98,98); /* @kind color */
  --neutrals-700: rgb(51,51,51); /* @kind color */
  --neutrals-800: rgb(36,36,36); /* @kind color */
  --neutrals-900: rgb(17,17,17); /* @kind color */
  --neutrals-black-2: rgb(17,17,17); /* @kind color */
  --neutrals-black: rgb(0,0,0); /* @kind color */
  --neutrals-dark-grey: rgb(102,102,102); /* @kind color */
  --neutrals-light-grey-2: rgb(242,242,242); /* @kind color */
  --neutrals-light-grey-3: rgb(209,209,214); /* @kind color */
  --neutrals-soft-black: rgb(37,37,37); /* @kind color */
  --neutrals-white-2: rgb(255,255,255); /* @kind color */
  --neutrals-white: rgb(255,255,255); /* @kind color */
  --radius-radius-lg: 16;
  --radius-radius-md: 8;
  --radius-radius-none: 0;
  --radius-radius-round: 999;
  --radius-radius-sm: 4;
  --red-100: rgb(252,217,219); /* @kind color */
  --red-200: rgb(255,167,167); /* @kind color */
  --red-300: rgb(248,117,120); /* @kind color */
  --red-400: rgb(237,60,66); /* @kind color */
  --red-500: rgb(207,20,23); /* @kind color */
  --red-50: rgb(255,244,244); /* @kind color */
  --red-600: rgb(178,18,21); /* @kind color */
  --red-700: rgb(148,16,17); /* @kind color */
  --red-800: rgb(120,13,15); /* @kind color */
  --red-900: rgb(90,10,11); /* @kind color */
  --semantic-succes: rgb(50,166,166); /* @kind color */
  --shades-accent-shadeaccentsecondary-200: rgb(249,198,200); /* @kind color */
  --shades-accent-shadeaccentsecondary-700: rgb(173,61,65); /* @kind color */
  --shades-brand-shadebrandprimary-100: rgb(241,249,251); /* @kind color */
  --shades-brand-shadebrandprimary-200: rgb(218,241,246); /* @kind color */
  --shades-brand-shadebrandprimary-500: rgb(193,234,243); /* @kind color */
  --shades-brand-shadebrandprimary-50: rgb(240,248,249); /* @kind color */
  --shades-brand-shadebrandsecondary-200: rgb(249,198,200); /* @kind color */
  --shades-brand-shadebrandsecondary-500: rgb(227,88,94); /* @kind color */
  --shades-semantic-shadesemanticwarning-200: rgb(255,232,181); /* @kind color */
  --spacings-spacing-12: 12;
  --spacings-spacing-16-2: 16;
  --spacings-spacing-16: 16;
  --spacings-spacing-20-2: 20;
  --spacings-spacing-20: 20;
  --spacings-spacing-24-2: 24;
  --spacings-spacing-24: 24;
  --spacings-spacing-32: 32;
  --spacings-spacing-4-2: 4;
  --spacings-spacing-40-2: 40;
  --spacings-spacing-40: 40;
  --spacings-spacing-48: 48;
  --spacings-spacing-4: 4;
  --spacings-spacing-68: 68;
  --spacings-spacing-72: 72;
  --spacings-spacing-8-2: 8;
  --spacings-spacing-8-3: 8;
  --spacings-spacing-8-4: 8;
  --spacings-spacing-80: 80;
  --spacings-spacing-8: 8;
  --spacings-spacing-96: 96;
  --special-blue-1: rgb(46,61,255); /* @kind color */
  --special-blue-2: rgb(0,174,239); /* @kind color */
  --special-blue-3: rgb(21,29,124); /* @kind color */
  --special-green-1: rgb(46,214,171); /* @kind color */
  --special-green-2: rgb(0,138,140); /* @kind color */
  --stroke-stroke-accent: var(--blue-500); /* @kind color */
  --stroke-stroke-electric: var(--electric-blue-500); /* @kind color */
  --stroke-stroke-helper-2: var(--neutrals-600); /* @kind color */
  --stroke-stroke-helper: var(--neutrals-300); /* @kind color */
  --stroke-stroke-inverse: var(--neutrals-900); /* @kind color */
  --stroke-stroke-primary: var(--neutrals-100); /* @kind color */
  --stroke-stroke-red: var(--red-500); /* @kind color */
  --stroke-stroke-secondary: var(--neutrals-200); /* @kind color */
  --strokes-stroke-0: 0;
  --strokes-stroke-1: 1;
  --strokes-stroke-2: 2;
  --strokes-stroke-4: 4;
  --success-success-border: var(--green-500); /* @kind color */
  --success-success-surface: var(--green-50); /* @kind color */
  --success-success-text: var(--green-700); /* @kind color */
  --surfaces-black: var(--neutrals-black-2); /* @kind color */
  --surfaces-brand-2: var(--brand-primary); /* @kind color */
  --surfaces-brand: var(--brand-primary); /* @kind color */
  --surfaces-primary: var(--neutrals-100-2); /* @kind color */
  --surfaces-quaternary-2: var(--neutrals-400-2); /* @kind color */
  --surfaces-quaternary: var(--neutrals-400-2); /* @kind color */
  --surfaces-secondary-2: var(--neutrals-200-2); /* @kind color */
  --surfaces-secondary: var(--neutrals-200-2); /* @kind color */
  --surfaces-surface-secondary: var(--brand-secondary); /* @kind color */
  --surfaces-surface-white: var(--neutrals-white-2); /* @kind color */
  --surfaces-tertiary-2: var(--neutrals-300-2); /* @kind color */
  --surfaces-tertiary: var(--neutrals-300-2); /* @kind color */
  --surfaces-white: var(--neutrals-white-2); /* @kind color */
  --text-accent-primary-2: var(--accent-primary); /* @kind color */
  --text-accent-primary-3: var(--accent-primary); /* @kind color */
  --text-accent-primary: var(--accent-primary); /* @kind color */
  --text-accent-secondary-2: var(--accent-secondary); /* @kind color */
  --text-accent-secondary: var(--accent-secondary); /* @kind color */
  --text-link: rgb(0,123,157); /* @kind color */
  --text-primary-2: var(--neutrals-black-2); /* @kind color */
  --text-primary: var(--neutrals-black-2); /* @kind color */
  --text-secondary-2: var(--neutrals-400-2); /* @kind color */
  --text-secondary-3: var(--neutrals-400-2); /* @kind color */
  --text-secondary: var(--neutrals-400-2); /* @kind color */
  --text-tertiary: var(--neutrals-350); /* @kind color */
  --text-text-accent-2: var(--accent-primary); /* @kind color */
  --text-text-accent-visited: var(--neutrals-400); /* @kind color */
  --text-text-accent: var(--blue-500); /* @kind color */
  --text-text-base-hover-2: var(--accent-primary); /* @kind color */
  --text-text-base-hover: var(--accent-primary); /* @kind color */
  --text-text-base: var(--neutrals-black-2); /* @kind color */
  --text-text-dark-grey: var(--neutrals-400-2); /* @kind color */
  --text-text-default-2: 16;
  --text-text-default: 16;
  --text-text-electric: var(--electric-blue-500); /* @kind color */
  --text-text-gold: var(--gold-800); /* @kind color */
  --text-text-helper: var(--neutrals-500); /* @kind color */
  --text-text-large-2: 48;
  --text-text-large: 48;
  --text-text-level-1-2: 40;
  --text-text-level-1: 40;
  --text-text-level-2-2: 32;
  --text-text-level-2: 32;
  --text-text-level-3-2: 28;
  --text-text-level-3: 28;
  --text-text-level-4-2: 24;
  --text-text-level-4: 24;
  --text-text-level-5-2: 20;
  --text-text-level-5: 20;
  --text-text-level-6-2: 18;
  --text-text-level-6: 18;
  --text-text-link: var(--accent-primary); /* @kind color */
  --text-text-primary-hover: var(--blue-500); /* @kind color */
  --text-text-primary-inverse: var(--neutrals-50); /* @kind color */
  --text-text-primary-pressed: var(--blue-500); /* @kind color */
  --text-text-primary-visited: var(--blue-300); /* @kind color */
  --text-text-primary: var(--neutrals-900); /* @kind color */
  --text-text-red-2: var(--accent-secondary); /* @kind color */
  --text-text-red: var(--red-500); /* @kind color */
  --text-text-secondary: var(--neutrals-600); /* @kind color */
  --text-text-small-2: 14;
  --text-text-small: 14;
  --text-text-white: var(--neutrals-50); /* @kind color */
  --text-text-xlarge-2: 60;
  --text-text-xlarge: 60;
  --text-text-xsmall-2: 12;
  --text-text-xsmall: 12;
  --text-text-xxlarge-2: 96;
  --text-text-xxlarge: 96;
  --text-text-xxsmall-2: 10;
  --text-text-xxsmall: 10;
  --text-white-2: var(--neutrals-white-2); /* @kind color */
  --text-white: var(--neutrals-white-2); /* @kind color */
  --warning-warning-border: var(--yellow-500); /* @kind color */
  --warning-warning-surface: var(--yellow-50); /* @kind color */
  --warning-warning-text: var(--yellow-800); /* @kind color */
  --yellow-100: rgb(255,244,212); /* @kind color */
  --yellow-200: rgb(255,232,173); /* @kind color */
  --yellow-300: rgb(255,217,122); /* @kind color */
  --yellow-400: rgb(255,201,75); /* @kind color */
  --yellow-500: rgb(241,175,23); /* @kind color */
  --yellow-50: rgb(255,252,242); /* @kind color */
  --yellow-600: rgb(210,152,21); /* @kind color */
  --yellow-700: rgb(178,129,18); /* @kind color */
  --yellow-800: rgb(142,102,14); /* @kind color */
  --yellow-900: rgb(56,41,5); /* @kind color */
}

:root[data-theme="dark"], .dark {
  --background-bg-accent-hover: var(--blue-200); /* @kind color */
  --background-bg-accent-inverse: var(--blue-900); /* @kind color */
  --background-bg-accent: var(--blue-300); /* @kind color */
  --background-bg-black: rgb(0,0,0); /* @kind color */
  --background-bg-dark-blue-inverse: var(--blue-100); /* @kind color */
  --background-bg-electric-accent: var(--electric-blue-900); /* @kind color */
  --background-bg-gold-inverse: var(--gold-900); /* @kind color */
  --background-bg-gold: var(--gold-500); /* @kind color */
  --background-bg-green-inverse: var(--green-800); /* @kind color */
  --background-bg-helper-hover: var(--neutrals-500); /* @kind color */
  --background-bg-helper: var(--neutrals-600); /* @kind color */
  --background-bg-inverse-hover: var(--neutrals-500); /* @kind color */
  --background-bg-inverse: var(--neutrals-600); /* @kind color */
  --background-bg-primary-hover: var(--neutrals-700); /* @kind color */
  --background-bg-primary: var(--neutrals-900); /* @kind color */
  --background-bg-pure: var(--neutrals-800); /* @kind color */
  --background-bg-red-inverse: var(--red-800); /* @kind color */
  --background-bg-secondary-hover: var(--neutrals-600); /* @kind color */
  --background-bg-secondary: var(--neutrals-700); /* @kind color */
  --background-bg-yellow-inverse: var(--yellow-800); /* @kind color */
  --buttons-button-accent-disabled: var(--red-800); /* @kind color */
  --buttons-button-accent-hover: var(--red-300); /* @kind color */
  --buttons-button-accent: var(--red-400); /* @kind color */
  --buttons-button-electric-disabled: var(--electric-blue-800); /* @kind color */
  --buttons-button-electric-hover: var(--electric-blue-300); /* @kind color */
  --buttons-button-electric: var(--electric-blue-400); /* @kind color */
  --buttons-button-primary-disabled: var(--blue-600); /* @kind color */
  --buttons-button-primary-hover: var(--blue-300); /* @kind color */
  --buttons-button-primary: var(--blue-400); /* @kind color */
  --buttons-button-secondary-disabled: var(--neutrals-800); /* @kind color */
  --buttons-button-secondary-hover: var(--neutrals-600); /* @kind color */
  --buttons-button-secondary: var(--neutrals-700); /* @kind color */
  --buttons-button-shadow-focus: var(--blue-400); /* @kind color */
  --buttons-button-tertiary-accent-active: var(--neutrals-500); /* @kind color */
  --buttons-button-tertiary-accent-disabled: var(--neutrals-700); /* @kind color */
  --buttons-button-tertiary-accent: var(--blue-300); /* @kind color */
  --buttons-button-tertiary-active: var(--neutrals-300); /* @kind color */
  --buttons-button-tertiary-disabled: var(--neutrals-600); /* @kind color */
  --buttons-button-tertiary: var(--neutrals-100); /* @kind color */
  --buttons-button-text-acccent-disabled: rgba(255,255,255,0.4); /* @kind color */
  --buttons-button-text-acccent: var(--neutrals-white); /* @kind color */
  --buttons-button-text-primary-disabled: rgba(255,255,255,0.4); /* @kind color */
  --buttons-button-text-primary: var(--neutrals-white); /* @kind color */
  --buttons-button-text-secondary-disabled-2: rgba(255,255,255,0.4); /* @kind color */
  --buttons-button-text-secondary-disabled: var(--neutrals-500); /* @kind color */
  --buttons-button-text-secondary: var(--neutrals-white); /* @kind color */
  --critical-critical-border: var(--red-400); /* @kind color */
  --critical-critical-surface: var(--red-900); /* @kind color */
  --critical-critical-text: var(--red-300); /* @kind color */
  --focus-focus-border: var(--blue-300); /* @kind color */
  --gold-gold-accent: var(--gold-500); /* @kind color */
  --gold-gold-bg: var(--gold-900); /* @kind color */
  --gold-gold-text: var(--gold-600); /* @kind color */
  --icon-icon-accent: var(--blue-400); /* @kind color */
  --icon-icon-primary: var(--neutrals-50); /* @kind color */
  --icon-icon-secondary: var(--neutrals-200); /* @kind color */
  --icons-icon-accent-visited: var(--neutrals-200); /* @kind color */
  --icons-icon-accent: var(--blue-300); /* @kind color */
  --icons-icon-electric: var(--electric-blue-300); /* @kind color */
  --icons-icon-helper: var(--neutrals-300); /* @kind color */
  --icons-icon-primary-hover: var(--blue-300); /* @kind color */
  --icons-icon-primary-inverse: var(--neutrals-900); /* @kind color */
  --icons-icon-primary-pressed: var(--blue-300); /* @kind color */
  --icons-icon-primary-visited: var(--blue-100); /* @kind color */
  --icons-icon-primary: var(--neutrals-50); /* @kind color */
  --icons-icon-red: var(--red-400); /* @kind color */
  --icons-icon-secondary: var(--neutrals-400); /* @kind color */
  --icons-icon-white: var(--neutrals-white); /* @kind color */
  --info-info-border: var(--blue-400); /* @kind color */
  --info-info-surface: var(--blue-900); /* @kind color */
  --info-info-text: var(--blue-300); /* @kind color */
  --inputs-field-bg-default: var(--neutrals-800); /* @kind color */
  --inputs-field-bg-disabled: var(--neutrals-700); /* @kind color */
  --link-link-primary: var(--blue-300); /* @kind color */
  --link-link-secondary: var(--red-400); /* @kind color */
  --stroke-stroke-accent: var(--blue-300); /* @kind color */
  --stroke-stroke-electric: var(--electric-blue-300); /* @kind color */
  --stroke-stroke-helper-2: var(--neutrals-500); /* @kind color */
  --stroke-stroke-helper: var(--neutrals-600); /* @kind color */
  --stroke-stroke-inverse: var(--neutrals-50); /* @kind color */
  --stroke-stroke-primary: var(--neutrals-800); /* @kind color */
  --stroke-stroke-red: var(--red-400); /* @kind color */
  --stroke-stroke-secondary: var(--neutrals-700); /* @kind color */
  --success-success-border: var(--green-400); /* @kind color */
  --success-success-surface: var(--green-900); /* @kind color */
  --success-success-text: var(--green-300); /* @kind color */
  --text-text-accent-visited: var(--neutrals-200); /* @kind color */
  --text-text-accent: var(--blue-300); /* @kind color */
  --text-text-electric: var(--electric-blue-300); /* @kind color */
  --text-text-gold: var(--gold-500); /* @kind color */
  --text-text-helper: var(--neutrals-300); /* @kind color */
  --text-text-primary-hover: var(--blue-300); /* @kind color */
  --text-text-primary-inverse: var(--neutrals-900); /* @kind color */
  --text-text-primary-pressed: var(--blue-300); /* @kind color */
  --text-text-primary-visited: var(--blue-100); /* @kind color */
  --text-text-primary: var(--neutrals-50); /* @kind color */
  --text-text-red: var(--red-400); /* @kind color */
  --text-text-secondary: var(--neutrals-400); /* @kind color */
  --text-text-white: var(--neutrals-white); /* @kind color */
  --warning-warning-border: var(--yellow-400); /* @kind color */
  --warning-warning-surface: var(--yellow-900); /* @kind color */
  --warning-warning-text: var(--yellow-300); /* @kind color */
}

:root[data-mode="recommends"] {
  --accent-primary-2: rgb(0,143,106); /* @kind color */
  --accent-primary-red: rgb(237,28,36); /* @kind color */
  --accent-primary: rgb(0,132,98); /* @kind color */
  --accent-secondary-2: rgb(237,28,36); /* @kind color */
  --accent-secondary-3: rgb(0,143,106); /* @kind color */
  --accent-secondary: rgb(228,18,26); /* @kind color */
  --background-black: var(--neutrals-black-2); /* @kind color */
  --background-primary: var(--neutrals-50-2); /* @kind color */
  --background-secondary: var(--neutrals-100-2); /* @kind color */
  --border-accent-primary: var(--accent-primary); /* @kind color */
  --border-accent-secondary: var(--accent-secondary); /* @kind color */
  --border-black: var(--neutrals-black-2); /* @kind color */
  --border-primary-2: var(--neutrals-200-2); /* @kind color */
  --border-primary: var(--neutrals-200-2); /* @kind color */
  --border-secondary-2: var(--neutrals-300-2); /* @kind color */
  --border-secondary: var(--neutrals-300-2); /* @kind color */
  --border-tertiary-2: var(--neutrals-400-2); /* @kind color */
  --border-tertiary: var(--neutrals-400-2); /* @kind color */
  --brand-primary-2: rgb(0,143,106); /* @kind color */
  --brand-primary: rgb(0,132,98); /* @kind color */
  --brand-secondary-2: rgb(255,188,34); /* @kind color */
  --brand-secondary: rgb(255,188,34); /* @kind color */
  --icon-accent-primary: var(--accent-primary); /* @kind color */
  --icon-accent-secondary: var(--accent-secondary); /* @kind color */
  --icon-primary: var(--neutrals-black-2); /* @kind color */
  --icon-secondary-2: var(--neutrals-400-2); /* @kind color */
  --icon-secondary: var(--neutrals-400-2); /* @kind color */
  --icon-tertiary: var(--neutrals-350); /* @kind color */
  --icon-white: var(--neutrals-white-2); /* @kind color */
  --icons-icon-dark-blue-2: var(--accent-primary); /* @kind color */
  --icons-icon-dark-blue: var(--accent-primary); /* @kind color */
  --neutrals-100-2: rgb(249,249,249); /* @kind color */
  --neutrals-200-2: rgb(242,242,242); /* @kind color */
  --neutrals-300-2: rgb(209,209,214); /* @kind color */
  --neutrals-350: rgb(153,153,153); /* @kind color */
  --neutrals-400-2: rgb(102,102,102); /* @kind color */
  --neutrals-50-2: rgb(254,254,254); /* @kind color */
  --neutrals-500-2: rgb(37,37,37); /* @kind color */
  --neutrals-black-2: rgb(17,17,17); /* @kind color */
  --neutrals-dark-grey: rgb(102,102,102); /* @kind color */
  --neutrals-light-grey-2: rgb(242,242,242); /* @kind color */
  --neutrals-light-grey-3: rgb(209,209,214); /* @kind color */
  --neutrals-soft-black: rgb(37,37,37); /* @kind color */
  --neutrals-white-2: rgb(255,255,255); /* @kind color */
  --semantic-succes: rgb(50,166,166); /* @kind color */
  --shades-accent-shadeaccentsecondary-200: rgb(249,198,200); /* @kind color */
  --shades-accent-shadeaccentsecondary-700: rgb(173,61,65); /* @kind color */
  --shades-brand-shadebrandprimary-100: rgb(230,250,245); /* @kind color */
  --shades-brand-shadebrandprimary-200: rgb(184,241,226); /* @kind color */
  --shades-brand-shadebrandprimary-500: rgb(46,214,171); /* @kind color */
  --shades-brand-shadebrandprimary-50: rgb(242,252,249); /* @kind color */
  --shades-brand-shadebrandsecondary-200: rgb(255,236,193); /* @kind color */
  --shades-brand-shadebrandsecondary-500: rgb(218,181,99); /* @kind color */
  --shades-semantic-shadesemanticwarning-200: rgb(255,232,181); /* @kind color */
  --spacings-spacing-12: 12;
  --spacings-spacing-16: 16;
  --spacings-spacing-20: 20;
  --spacings-spacing-24: 24;
  --spacings-spacing-32: 32;
  --spacings-spacing-40: 40;
  --spacings-spacing-48: 48;
  --spacings-spacing-4: 4;
  --spacings-spacing-68: 68;
  --spacings-spacing-72: 72;
  --spacings-spacing-8-2: 8;
  --spacings-spacing-80: 80;
  --spacings-spacing-8: 8;
  --spacings-spacing-96: 96;
  --surfaces-black: var(--neutrals-black-2); /* @kind color */
  --surfaces-brand-2: var(--brand-primary); /* @kind color */
  --surfaces-primary: var(--neutrals-100-2); /* @kind color */
  --surfaces-quaternary-2: var(--neutrals-400-2); /* @kind color */
  --surfaces-quaternary: var(--neutrals-400-2); /* @kind color */
  --surfaces-secondary-2: var(--neutrals-200-2); /* @kind color */
  --surfaces-secondary: var(--neutrals-200-2); /* @kind color */
  --surfaces-tertiary-2: var(--neutrals-300-2); /* @kind color */
  --surfaces-tertiary: var(--neutrals-300-2); /* @kind color */
  --surfaces-white: var(--neutrals-white-2); /* @kind color */
  --text-accent-primary-3: var(--accent-primary); /* @kind color */
  --text-accent-primary: var(--accent-primary); /* @kind color */
  --text-accent-secondary-2: var(--accent-secondary); /* @kind color */
  --text-accent-secondary: var(--accent-secondary); /* @kind color */
  --text-link: rgb(0,123,157); /* @kind color */
  --text-primary: var(--neutrals-black-2); /* @kind color */
  --text-secondary-2: var(--neutrals-400-2); /* @kind color */
  --text-secondary: var(--neutrals-400-2); /* @kind color */
  --text-tertiary: var(--neutrals-350); /* @kind color */
  --text-text-base-hover-2: var(--accent-primary); /* @kind color */
  --text-text-base-hover: var(--accent-primary); /* @kind color */
  --text-white: var(--neutrals-white-2); /* @kind color */
}

:root[data-mode="crypto"] {
  --accent-primary-2: rgb(135,115,41); /* @kind color */
  --accent-primary-red: rgb(237,28,36); /* @kind color */
  --accent-primary: rgb(135,115,41); /* @kind color */
  --accent-secondary-2: rgb(237,28,36); /* @kind color */
  --accent-secondary-3: rgb(135,115,41); /* @kind color */
  --accent-secondary: rgb(228,18,26); /* @kind color */
  --background-black: var(--neutrals-black-2); /* @kind color */
  --background-primary: var(--neutrals-50-2); /* @kind color */
  --background-secondary: var(--neutrals-100-2); /* @kind color */
  --border-accent-primary: var(--accent-primary); /* @kind color */
  --border-accent-secondary: var(--accent-secondary); /* @kind color */
  --border-black: var(--neutrals-black-2); /* @kind color */
  --border-primary-2: var(--neutrals-200-2); /* @kind color */
  --border-primary: var(--neutrals-200-2); /* @kind color */
  --border-secondary-2: var(--neutrals-300-2); /* @kind color */
  --border-secondary: var(--neutrals-300-2); /* @kind color */
  --border-tertiary-2: var(--neutrals-400-2); /* @kind color */
  --border-tertiary: var(--neutrals-400-2); /* @kind color */
  --brand-primary-2: rgb(135,115,41); /* @kind color */
  --brand-primary: rgb(135,115,41); /* @kind color */
  --brand-secondary-2: rgb(0,0,130); /* @kind color */
  --brand-secondary: rgb(0,0,130); /* @kind color */
  --icon-accent-primary: var(--accent-primary); /* @kind color */
  --icon-accent-secondary: var(--accent-secondary); /* @kind color */
  --icon-primary: var(--neutrals-black-2); /* @kind color */
  --icon-secondary-2: var(--neutrals-400-2); /* @kind color */
  --icon-secondary: var(--neutrals-400-2); /* @kind color */
  --icon-tertiary: var(--neutrals-350); /* @kind color */
  --icon-white: var(--neutrals-white-2); /* @kind color */
  --icons-icon-dark-blue-2: var(--accent-primary); /* @kind color */
  --icons-icon-dark-blue: var(--accent-primary); /* @kind color */
  --neutrals-100-2: rgb(249,249,249); /* @kind color */
  --neutrals-200-2: rgb(242,242,242); /* @kind color */
  --neutrals-300-2: rgb(209,209,214); /* @kind color */
  --neutrals-350: rgb(153,153,153); /* @kind color */
  --neutrals-400-2: rgb(102,102,102); /* @kind color */
  --neutrals-50-2: rgb(254,254,254); /* @kind color */
  --neutrals-500-2: rgb(37,37,37); /* @kind color */
  --neutrals-black-2: rgb(17,17,17); /* @kind color */
  --neutrals-dark-grey: rgb(102,102,102); /* @kind color */
  --neutrals-light-grey-2: rgb(242,242,242); /* @kind color */
  --neutrals-light-grey-3: rgb(209,209,214); /* @kind color */
  --neutrals-soft-black: rgb(37,37,37); /* @kind color */
  --neutrals-white-2: rgb(255,255,255); /* @kind color */
  --semantic-succes: rgb(50,166,166); /* @kind color */
  --shades-accent-shadeaccentsecondary-200: rgb(249,198,200); /* @kind color */
  --shades-accent-shadeaccentsecondary-700: rgb(173,61,65); /* @kind color */
  --shades-brand-shadebrandprimary-100: rgb(243,241,234); /* @kind color */
  --shades-brand-shadebrandprimary-200: rgb(219,213,191); /* @kind color */
  --shades-brand-shadebrandprimary-500: rgb(159,143,84); /* @kind color */
  --shades-brand-shadebrandprimary-50: rgb(241,240,236); /* @kind color */
  --shades-brand-shadebrandsecondary-200: rgb(184,184,220); /* @kind color */
  --shades-brand-shadebrandsecondary-500: rgb(116,116,208); /* @kind color */
  --shades-semantic-shadesemanticwarning-200: rgb(255,232,181); /* @kind color */
  --spacings-spacing-12: 12;
  --spacings-spacing-16: 16;
  --spacings-spacing-20: 20;
  --spacings-spacing-24: 24;
  --spacings-spacing-32: 32;
  --spacings-spacing-40: 40;
  --spacings-spacing-48: 48;
  --spacings-spacing-4: 4;
  --spacings-spacing-68: 68;
  --spacings-spacing-72: 72;
  --spacings-spacing-8-2: 8;
  --spacings-spacing-80: 80;
  --spacings-spacing-8: 8;
  --spacings-spacing-96: 96;
  --surfaces-black: var(--neutrals-black-2); /* @kind color */
  --surfaces-brand-2: var(--brand-primary); /* @kind color */
  --surfaces-primary: var(--neutrals-100-2); /* @kind color */
  --surfaces-quaternary-2: var(--neutrals-400-2); /* @kind color */
  --surfaces-quaternary: var(--neutrals-400-2); /* @kind color */
  --surfaces-secondary-2: var(--neutrals-200-2); /* @kind color */
  --surfaces-secondary: var(--neutrals-200-2); /* @kind color */
  --surfaces-tertiary-2: var(--neutrals-300-2); /* @kind color */
  --surfaces-tertiary: var(--neutrals-300-2); /* @kind color */
  --surfaces-white: var(--neutrals-white-2); /* @kind color */
  --text-accent-primary-3: var(--accent-primary); /* @kind color */
  --text-accent-primary: var(--accent-primary); /* @kind color */
  --text-accent-secondary-2: var(--accent-secondary); /* @kind color */
  --text-accent-secondary: var(--accent-secondary); /* @kind color */
  --text-link: rgb(0,123,157); /* @kind color */
  --text-primary: var(--neutrals-black-2); /* @kind color */
  --text-secondary-2: var(--neutrals-400-2); /* @kind color */
  --text-secondary: var(--neutrals-400-2); /* @kind color */
  --text-tertiary: var(--neutrals-350); /* @kind color */
  --text-text-base-hover-2: var(--accent-primary); /* @kind color */
  --text-text-base-hover: var(--accent-primary); /* @kind color */
  --text-white: var(--neutrals-white-2); /* @kind color */
}

:root[data-mode="well"] {
  --accent-primary-2: rgb(46,61,255); /* @kind color */
  --accent-primary-red: rgb(237,28,36); /* @kind color */
  --accent-primary: rgb(46,61,255); /* @kind color */
  --accent-secondary-2: rgb(237,28,36); /* @kind color */
  --accent-secondary-3: rgb(46,61,255); /* @kind color */
  --accent-secondary: rgb(228,18,26); /* @kind color */
  --background-black: var(--neutrals-black-2); /* @kind color */
  --background-primary: var(--neutrals-50-2); /* @kind color */
  --background-secondary: var(--neutrals-100-2); /* @kind color */
  --border-accent-primary: var(--accent-primary); /* @kind color */
  --border-accent-secondary: var(--accent-secondary); /* @kind color */
  --border-black: var(--neutrals-black-2); /* @kind color */
  --border-primary-2: var(--neutrals-200-2); /* @kind color */
  --border-primary: var(--neutrals-200-2); /* @kind color */
  --border-secondary-2: var(--neutrals-300-2); /* @kind color */
  --border-secondary: var(--neutrals-300-2); /* @kind color */
  --border-tertiary-2: var(--neutrals-400-2); /* @kind color */
  --border-tertiary: var(--neutrals-400-2); /* @kind color */
  --brand-primary-2: rgb(46,61,255); /* @kind color */
  --brand-primary: rgb(46,61,255); /* @kind color */
  --brand-secondary-2: rgb(0,174,239); /* @kind color */
  --brand-secondary: rgb(0,174,239); /* @kind color */
  --icon-accent-primary: var(--accent-primary); /* @kind color */
  --icon-accent-secondary: var(--accent-secondary); /* @kind color */
  --icon-primary: var(--neutrals-black-2); /* @kind color */
  --icon-secondary-2: var(--neutrals-400-2); /* @kind color */
  --icon-secondary: var(--neutrals-400-2); /* @kind color */
  --icon-tertiary: var(--neutrals-350); /* @kind color */
  --icon-white: var(--neutrals-white-2); /* @kind color */
  --icons-icon-dark-blue-2: var(--accent-primary); /* @kind color */
  --icons-icon-dark-blue: var(--accent-primary); /* @kind color */
  --neutrals-100-2: rgb(249,249,249); /* @kind color */
  --neutrals-200-2: rgb(242,242,242); /* @kind color */
  --neutrals-300-2: rgb(209,209,214); /* @kind color */
  --neutrals-350: rgb(153,153,153); /* @kind color */
  --neutrals-400-2: rgb(102,102,102); /* @kind color */
  --neutrals-50-2: rgb(254,254,254); /* @kind color */
  --neutrals-500-2: rgb(37,37,37); /* @kind color */
  --neutrals-black-2: rgb(17,17,17); /* @kind color */
  --neutrals-dark-grey: rgb(102,102,102); /* @kind color */
  --neutrals-light-grey-2: rgb(242,242,242); /* @kind color */
  --neutrals-light-grey-3: rgb(209,209,214); /* @kind color */
  --neutrals-soft-black: rgb(37,37,37); /* @kind color */
  --neutrals-white-2: rgb(255,255,255); /* @kind color */
  --semantic-succes: rgb(50,166,166); /* @kind color */
  --shades-accent-shadeaccentsecondary-200: rgb(249,198,200); /* @kind color */
  --shades-accent-shadeaccentsecondary-700: rgb(168,19,25); /* @kind color */
  --shades-brand-shadebrandprimary-100: rgb(242,243,255); /* @kind color */
  --shades-brand-shadebrandprimary-200: rgb(196,201,255); /* @kind color */
  --shades-brand-shadebrandprimary-500: rgb(84,96,255); /* @kind color */
  --shades-brand-shadebrandprimary-50: rgb(243,244,254); /* @kind color */
  --shades-brand-shadebrandsecondary-200: rgb(185,225,240); /* @kind color */
  --shades-brand-shadebrandsecondary-500: rgb(122,198,227); /* @kind color */
  --shades-semantic-shadesemanticwarning-200: rgb(255,232,181); /* @kind color */
  --spacings-spacing-12: 12;
  --spacings-spacing-16: 16;
  --spacings-spacing-20: 20;
  --spacings-spacing-24: 24;
  --spacings-spacing-32: 32;
  --spacings-spacing-40: 40;
  --spacings-spacing-48: 48;
  --spacings-spacing-4: 4;
  --spacings-spacing-68: 68;
  --spacings-spacing-72: 72;
  --spacings-spacing-8-2: 8;
  --spacings-spacing-80: 80;
  --spacings-spacing-8: 8;
  --spacings-spacing-96: 96;
  --surfaces-black: var(--neutrals-black-2); /* @kind color */
  --surfaces-brand-2: var(--brand-primary); /* @kind color */
  --surfaces-primary: var(--neutrals-100-2); /* @kind color */
  --surfaces-quaternary-2: var(--neutrals-400-2); /* @kind color */
  --surfaces-quaternary: var(--neutrals-400-2); /* @kind color */
  --surfaces-secondary-2: var(--neutrals-200-2); /* @kind color */
  --surfaces-secondary: var(--neutrals-200-2); /* @kind color */
  --surfaces-tertiary-2: var(--neutrals-300-2); /* @kind color */
  --surfaces-tertiary: var(--neutrals-300-2); /* @kind color */
  --surfaces-white: var(--neutrals-white-2); /* @kind color */
  --text-accent-primary-3: var(--accent-primary); /* @kind color */
  --text-accent-primary: var(--accent-primary); /* @kind color */
  --text-accent-secondary-2: var(--accent-secondary); /* @kind color */
  --text-accent-secondary: var(--accent-secondary); /* @kind color */
  --text-link: rgb(0,123,157); /* @kind color */
  --text-primary: var(--neutrals-black-2); /* @kind color */
  --text-secondary-2: var(--neutrals-400-2); /* @kind color */
  --text-secondary: var(--neutrals-400-2); /* @kind color */
  --text-tertiary: var(--neutrals-350); /* @kind color */
  --text-text-base-hover-2: var(--accent-primary); /* @kind color */
  --text-text-base-hover: var(--accent-primary); /* @kind color */
  --text-white: var(--neutrals-white-2); /* @kind color */
}

:root[data-mode="1025"] {
  --fonts-responsive-l2: 40;
  --fonts-responsive-l: 32;
  --fonts-responsive-m: 24;
  --fonts-responsive-titles: 20;
  --fonts-responsive-xl: 48;
  --fonts-responsive-xxl: 48;
  --layout-articlepage-h2-margin: var(--spacings-spacing-32);
  --layout-articlepage-headings-margin: var(--spacings-spacing-24);
  --layout-articlepage-paragraph-margin: var(--spacings-spacing-24);
  --layout-articlepage-widget-margin: var(--spacings-spacing-40);
  --layout-breakpoint: 1025;
  --layout-footer-margin: var(--spacings-spacing-80);
  --layout-grid-gap-2: var(--spacings-spacing-24);
  --layout-grid-gap: var(--spacings-spacing-24);
  --layout-grid-margin: var(--spacings-spacing-32);
  --layout-heading-margin: var(--spacings-spacing-24);
  --layout-nav-margin: var(--spacings-spacing-40);
  --layout-section-margin: var(--spacings-spacing-68);
}

:root[data-mode="768"] {
  --fonts-responsive-l2: 32;
  --fonts-responsive-l: 24;
  --fonts-responsive-m: 20;
  --fonts-responsive-titles: 18;
  --fonts-responsive-xl: 40;
  --fonts-responsive-xxl: 40;
  --layout-articlepage-h2-margin: var(--spacings-spacing-24);
  --layout-articlepage-headings-margin: var(--spacings-spacing-24);
  --layout-articlepage-paragraph-margin: var(--spacings-spacing-24);
  --layout-articlepage-widget-margin: var(--spacings-spacing-40);
  --layout-breakpoint: 768;
  --layout-footer-margin: var(--spacings-spacing-80);
  --layout-grid-gap-2: var(--spacings-spacing-24);
  --layout-grid-gap: var(--spacings-spacing-24);
  --layout-grid-margin: var(--spacings-spacing-32);
  --layout-heading-margin: var(--spacings-spacing-24);
  --layout-nav-margin: var(--spacings-spacing-32);
  --layout-section-margin: var(--spacings-spacing-48);
}

:root[data-mode="360"] {
  --fonts-responsive-l2: 24;
  --fonts-responsive-l: 24;
  --fonts-responsive-m: 20;
  --fonts-responsive-titles: 18;
  --fonts-responsive-xl: 32;
  --fonts-responsive-xxl: 32;
  --layout-articlepage-h2-margin: var(--spacings-spacing-24);
  --layout-articlepage-headings-margin: var(--spacings-spacing-24);
  --layout-articlepage-paragraph-margin: var(--spacings-spacing-24);
  --layout-articlepage-widget-margin: var(--spacings-spacing-40);
  --layout-breakpoint: 360;
  --layout-footer-margin: var(--spacings-spacing-80);
  --layout-grid-gap-2: var(--spacings-spacing-16);
  --layout-grid-gap: var(--spacings-spacing-32);
  --layout-grid-margin: var(--spacings-spacing-20);
  --layout-heading-margin: var(--spacings-spacing-24);
  --layout-nav-margin: var(--spacings-spacing-24);
  --layout-section-margin: var(--spacings-spacing-48);
}

:root[data-mode="small-screens"] {
  --buttons-button-vertical-lg: 12;
  --container-gaps-gap-lg: 16;
  --container-gaps-gap-md: 12;
  --container-gaps-gap-sm: 8;
  --container-gaps-gap-xl: 24;
  --container-gaps-gap-xs: 4;
  --container-paddings-padding-default: 32;
  --container-paddings-padding-lg: 40;
  --container-paddings-padding-sm: 24;
  --container-paddings-padding-xl: 48;
  --container-paddings-padding-xs: 16;
  --container-paddings-padding-xxs: 8;
  --container-paddings-padding-xxxs: 4;
  --layout-layout-footer-gap: 80;
  --layout-layout-gap-default: 48;
  --layout-layout-gap-md: 40;
  --layout-layout-gap-sm: 32;
  --layout-layout-gap-xl: 64;
  --layout-layout-gap-xs: 24;
  --layout-layout-grid-gap: 24;
  --layout-layout-nav-gap: 40;
  --layout-layout-responsive-breakpoint: 1025;
  --layout-layout-safe-area: 32;
  --layout-layout-screen-size: 1025;
  --text-text-default-2: 16;
  --text-text-default: 16;
  --text-text-large-2: 40;
  --text-text-large: 40;
  --text-text-level-1-2: 36;
  --text-text-level-1: 36;
  --text-text-level-2-2: 28;
  --text-text-level-2: 28;
  --text-text-level-3-2: 24;
  --text-text-level-3: 24;
  --text-text-level-4-2: 24;
  --text-text-level-4: 20;
  --text-text-level-5-2: 20;
  --text-text-level-5: 18;
  --text-text-level-6-2: 18;
  --text-text-level-6: 18;
  --text-text-small-2: 14;
  --text-text-small: 14;
  --text-text-xlarge-2: 48;
  --text-text-xlarge: 48;
  --text-text-xsmall-2: 12;
  --text-text-xsmall: 12;
  --text-text-xxlarge-2: 72;
  --text-text-xxlarge: 72;
  --text-text-xxsmall-2: 10;
  --text-text-xxsmall: 10;
}

:root[data-mode="tablet"] {
  --buttons-button-vertical-lg: 12;
  --container-gaps-gap-lg: 16;
  --container-gaps-gap-md: 12;
  --container-gaps-gap-sm: 8;
  --container-gaps-gap-xl: 24;
  --container-gaps-gap-xs: 4;
  --container-paddings-padding-default: 24;
  --container-paddings-padding-lg: 24;
  --container-paddings-padding-sm: 24;
  --container-paddings-padding-xl: 32;
  --container-paddings-padding-xs: 16;
  --container-paddings-padding-xxs: 8;
  --container-paddings-padding-xxxs: 4;
  --layout-layout-footer-gap: 80;
  --layout-layout-gap-default: 40;
  --layout-layout-gap-md: 32;
  --layout-layout-gap-sm: 24;
  --layout-layout-gap-xl: 48;
  --layout-layout-gap-xs: 16;
  --layout-layout-grid-gap: 24;
  --layout-layout-nav-gap: 32;
  --layout-layout-responsive-breakpoint: 768;
  --layout-layout-safe-area: 32;
  --layout-layout-screen-size: 768;
  --text-text-default-2: 16;
  --text-text-default: 16;
  --text-text-large-2: 32;
  --text-text-large: 32;
  --text-text-level-1-2: 28;
  --text-text-level-1: 28;
  --text-text-level-2-2: 24;
  --text-text-level-2: 24;
  --text-text-level-3-2: 20;
  --text-text-level-3: 20;
  --text-text-level-4-2: 20;
  --text-text-level-4: 18;
  --text-text-level-5-2: 18;
  --text-text-level-5: 16;
  --text-text-level-6-2: 18;
  --text-text-level-6: 16;
  --text-text-small-2: 14;
  --text-text-small: 14;
  --text-text-xlarge-2: 40;
  --text-text-xlarge: 40;
  --text-text-xsmall-2: 12;
  --text-text-xsmall: 12;
  --text-text-xxlarge-2: 64;
  --text-text-xxlarge: 64;
  --text-text-xxsmall-2: 10;
  --text-text-xxsmall: 10;
}

:root[data-mode="mobile"] {
  --buttons-button-vertical-lg: 12;
  --container-gaps-gap-lg: 16;
  --container-gaps-gap-md: 12;
  --container-gaps-gap-sm: 8;
  --container-gaps-gap-xl: 24;
  --container-gaps-gap-xs: 4;
  --container-paddings-padding-default: 24;
  --container-paddings-padding-lg: 16;
  --container-paddings-padding-sm: 24;
  --container-paddings-padding-xl: 24;
  --container-paddings-padding-xs: 16;
  --container-paddings-padding-xxs: 8;
  --container-paddings-padding-xxxs: 4;
  --layout-layout-footer-gap: 80;
  --layout-layout-gap-default: 40;
  --layout-layout-gap-md: 32;
  --layout-layout-gap-sm: 24;
  --layout-layout-gap-xl: 48;
  --layout-layout-gap-xs: 16;
  --layout-layout-grid-gap: 16;
  --layout-layout-nav-gap: 24;
  --layout-layout-responsive-breakpoint: 360;
  --layout-layout-safe-area: 16;
  --layout-layout-screen-size: 360;
  --text-text-default-2: 16;
  --text-text-default: 16;
  --text-text-large-2: 24;
  --text-text-large: 24;
  --text-text-level-1-2: 28;
  --text-text-level-1: 24;
  --text-text-level-2-2: 24;
  --text-text-level-2: 20;
  --text-text-level-3-2: 20;
  --text-text-level-3: 18;
  --text-text-level-4-2: 20;
  --text-text-level-4: 16;
  --text-text-level-5-2: 18;
  --text-text-level-5: 16;
  --text-text-level-6-2: 18;
  --text-text-level-6: 16;
  --text-text-small-2: 14;
  --text-text-small: 14;
  --text-text-xlarge-2: 32;
  --text-text-xlarge: 32;
  --text-text-xsmall-2: 12;
  --text-text-xsmall: 12;
  --text-text-xxlarge-2: 48;
  --text-text-xxlarge: 48;
  --text-text-xxsmall-2: 10;
  --text-text-xxsmall: 10;
}