@charset "UTF-8";



:root {

    --secondary-opacity-1: rgba(255, 255, 255, .2);

    --font-color: #dce0e6;

    --title-color: #ffffff;

    --link-color: #03f295;

    --paper-color: #1e1f23;

    --paper-color-light: #2c2d32;

    --paper-color-dark: #141518;

    --paper-color-light-font: #e8fdf3;

    --paper-color-dark-font: #98f7cf;

    --app-background: #101114;

    --primary-hero-color: #2c2d32;

    --primary-hero-text-color: #ffffff;

    --primary-color: #03f295;

    --primary-hover: #19ffac;

    --primary-font-color: #0f1b17;

    --primary-hover-font-color: #101114;

    --badge-color: #11825f;

    --badge-font-color: #e2fff5;

    --secondary-color: #2e3c36;

    --secondary-font-color: #c3f7e4;

    --secondary-hover: #3d594e;

    --secondary-border-color: #4cd2a6;

    --tertiary-color: #40e6b1;

    --tertiary-font-color: #10221a;

    --tertiary-hover: #67f2c7;

    --secondary-1: #7a918b;

    --input-background: #2a2b30;

    --bonus-badge-color: #1fb47a;

    --bonus-badge-font-color: #ffffff

}



:root {

    --accordion-border-radius: 8px;

    --accordion-border-size: 2px;

    --accordion-description-expand: 8px 16px;

    --accordion-header-border-size: 2px;

    --accordion-header-content-min-height: 20px;

    --accordion-header-expand: 8px 16px;

    --accordion-header-icon-container-border-radius: 1000px;

    --accordion-header-icon-container-border-radius-l: 4px;

    --accordion-header-icon-container-border-radius-l-2: 4px;

    --accordion-header-icon-container-border-radius-l-3: 8px;

    --accordion-header-icon-container-border-radius-l-4: 8px;

    --accordion-header-icon-container-border-radius-l-5: 8px;

    --accordion-header-icon-container-border-radius-l-6: 8px;

    --accordion-header-icon-container-border-size: 1px;

    --accordion-header-icon-container-icon-size: 20px;

    --accordion-header-spacing: 8px;

    --avatar-border-radius: 1000px;

    --avatar-border-size: 2px;

    --avatar-rakeback-border-radius: 1000px;

    --avatar-rakeback-border-size: 1px;

    --avatar-rakeback-expand: 1px;

    --avatar-rakeback-icon-size: 10px;

    --avatar-size: 32px;

    --badge-border-pill: 1000px;

    --badge-border-radius-l: 8px;

    --badge-border-radius-m: 6px;

    --badge-border-radius-s: 4px;

    --badge-border-radius-xs: 2px;

    --badge-border-size-l: 2px;

    --badge-border-size-m: 2px;

    --badge-border-size-s: 2px;

    --badge-border-size-xs: 2px;

    --badge-content-height-l: 20px;

    --badge-content-height-m: 16px;

    --badge-content-height-s: 14px;

    --badge-content-height-xs: 8px;

    --badge-expand-l: 4px;

    --badge-expand-m: 4px;

    --badge-expand-s: 2px;

    --badge-expand-xs: 2px;

    --badge-icon-container-border-radius-l: 1000px;

    --badge-icon-container-border-radius-m: 1000px;

    --badge-icon-container-border-radius-s: 1000px;

    --badge-icon-container-border-radius-xs: 1000px;

    --badge-icon-container-border-size-l: 1px;

    --badge-icon-container-border-size-m: 1px;

    --badge-icon-container-border-size-s: 1px;

    --badge-icon-container-border-size-xs: 1px;

    --badge-icon-container-icon-size-l: 20px;

    --badge-icon-container-icon-size-m: 16px;

    --badge-icon-container-icon-size-s: 14px;

    --badge-icon-container-icon-size-xs: 8px;

    --badge-text-container-expand-l: 0 4px;

    --badge-text-container-expand-m: 0 4px;

    --badge-text-container-expand-s: 0 2px;

    --badge-text-container-expand-xs: 0 2px;

    --base-background: var(--color-background-page);

    --blur-br1: 8px;

    --blur-br2: 16px;

    --blur-br3: 32px;

    --blur-br4: 48px;

    --blur-br5: 64px;

    --border-1: 1px;

    --border-2: 2px;

    --border-3: 3px;

    --border-4: 4px;

    --border-m: 2px;

    --border-radius-2xl: 20px;

    --border-radius-2xs: 2px;

    --border-radius-3xl: 24px;

    --border-radius-4xl: 28px;

    --border-radius-5xl: 32px;

    --border-radius-l: 12px;

    --border-radius-m: 8px;

    --border-radius-pill: 1000px;

    --border-radius-s: 6px;

    --border-radius-xl: 16px;

    --border-radius-xs: 4px;

    --border-radius-xxl: 24px;

    --border-s: 1px;

    --breakpoints-desktop: 1280px;

    --breakpoints-expand: 256px;

    --breakpoints-max-width: 1280px;

    --breakpoints-min-width: 360px;

    --breakpoints-mobile: 360px;

    --button-border-radius-l: 28px;

    --button-border-radius-m: 24px;

    --button-border-radius-s: 16px;

    --button-border-size-l: 2px;

    --button-border-size-m: 2px;

    --button-border-size-s: 2px;

    --button-content-height-l: 24px;

    --button-content-height-m: 20px;

    --button-content-height-s: 16px;

    --button-expand-l: 16px;

    --button-expand-m: 12px;

    --button-expand-s: 8px;

    --button-icon-container-border-radius-l: 1000px;

    --button-icon-container-border-radius-m: 1000px;

    --button-icon-container-border-radius-s: 1000px;

    --button-icon-container-border-size-l: 1px;

    --button-icon-container-border-size-m: 1px;

    --button-icon-container-border-size-s: 1px;

    --button-icon-container-icon-size-l: 24px;

    --button-icon-container-icon-size-m: 20px;

    --button-icon-container-icon-size-s: 16px;

    --button-link-content-height-l: 24px;

    --button-link-content-height-m: 20px;

    --button-link-content-height-s: 16px;

    --button-link-icon-container-border-radius-l: 1000px;

    --button-link-icon-container-border-radius-m: 1000px;

    --button-link-icon-container-border-radius-s: 1000px;

    --button-link-icon-container-border-size-l: 1px;

    --button-link-icon-container-border-size-m: 1px;

    --button-link-icon-container-border-size-s: 1px;

    --button-link-icon-container-icon-size-l: 24px;

    --button-link-icon-container-icon-size-m: 20px;

    --button-link-icon-container-icon-size-s: 16px;

    --button-link-spacing-l: 8px;

    --button-link-spacing-m: 8px;

    --button-link-spacing-s: 4px;

    --button-navigation-border-radius-2xs: 12px;

    --button-navigation-border-radius-3xs: 12px;

    --button-navigation-border-radius-m: 24px;

    --button-navigation-border-radius-s: 16px;

    --button-navigation-border-radius-xs: 12px;

    --button-navigation-border-size-2xs: 2px;

    --button-navigation-border-size-3xs: 2px;

    --button-navigation-border-size-m: 2px;

    --button-navigation-border-size-s: 2px;

    --button-navigation-border-size-xs: 2px;

    --button-navigation-expand-2xs: 4px;

    --button-navigation-expand-3xs: 4px;

    --button-navigation-expand-m: 12px;

    --button-navigation-expand-s: 8px;

    --button-navigation-expand-xs: 5px;

    --button-navigation-icon-size-2xs: 14px;

    --button-navigation-icon-size-3xs: 12px;

    --button-navigation-icon-size-m: 20px;

    --button-navigation-icon-size-s: 16px;

    --button-navigation-icon-size-xs: 14px;

    --button-store-border-radius-l: 12px;

    --button-store-border-radius-m: 8px;

    --button-store-content-height-l: 32px;

    --button-store-content-height-m: 30px;

    --button-store-expand-l: 8px 16px;

    --button-store-expand-m: 4px 12px;

    --button-store-icon-size-l: 28px;

    --button-store-icon-size-m: 20px;

    --button-store-text-container-description-height-l: 12px;

    --button-store-text-container-description-height-m: 12px;

    --button-store-text-container-expand-l: 0 12px;

    --button-store-text-container-expand-m: 0 8px;

    --button-store-text-container-min-width-l: 124px;

    --button-store-text-container-min-width-m: 104px;

    --button-store-text-container-text-height-l: 20px;

    --button-store-text-container-text-height-m: 18px;

    --button-text-container-expand-l: 0 8px;

    --button-text-container-expand-m: 0 8px;

    --button-text-container-expand-s: 0 4px;

    --buttons-group-spacing-l: 8px;

    --buttons-group-spacing-m: 8px;

    --buttons-group-spacing-s: 4px;

    --calendar-border-radius: 8px;

    --calendar-border-radius-m: 12px;

    --calendar-border-radius-s: 8px;

    --calendar-border-size-m: 2px;

    --calendar-border-size-s: 2px;

    --calendar-day-border-radius-m: 12px;

    --calendar-day-border-radius-s: 8px;

    --calendar-day-button-border-radius-m: 12px;

    --calendar-day-button-border-radius-s: 8px;

    --calendar-day-button-border-size-m: 2px;

    --calendar-day-button-border-size-s: 2px;

    --calendar-day-button-size-m: 36px;

    --calendar-day-button-size-s: 32px;

    --calendar-day-expand-m: 4px;

    --calendar-day-expand-s: 2px;

    --calendar-expand-m: 16px 24px;

    --calendar-expand-s: 12px 16px;

    --calendar-header-day-height-m: 44px;

    --calendar-header-day-height-s: 36px;

    --calendar-header-day-width-m: 44px;

    --calendar-header-day-width-s: 36px;

    --calendar-header-spacing-m: 8px;

    --calendar-header-spacing-s: 4px;

    --checkbox-radius-l: 6px;

    --checkbox-radius-m: 6px;

    --checkbox-radius-s: 6px;

    --color-000: #FFFFFF;

    --color-1: #FFFFFF;

    --color-1-background-start: #FFA80000;

    --color-2: #FFFFFF;

    --color-2-background-start: #E8001000;

    --color-3: #FFFFFF;

    --color-3-background-start: #006EDD00;

    --color-4-background-finish: #8C0038;

    --color-4-background-start: #EA005D00;

    --color-5-background-start: #2EEB0000;

    --color-6-background-start: #6D00D800;

    --color-accent-icon: #069815CC;

    --color-accent-icon-hover: #069815CC;

    --color-accordion-background: var(--color-dark-grey-2);

    --color-accordion-background-finish: var(--color-dark-grey-2);

    --color-accordion-background-start: var(--color-dark-grey-2);

    --color-accordion-description: var(--color-mid-grey-5);

    --color-accordion-header-background: #1e1f23;

    --color-accordion-header-background-active: var(--color-dark-grey-3);

    --color-accordion-header-background-disabled: var(--color-dark-grey-3);

    --color-accordion-header-background-finish: var(--color-dark-grey-3);

    --color-accordion-header-background-finish-active: var(--color-dark-grey-3);

    --color-accordion-header-background-finish-disabled: var(--color-dark-grey-3);

    --color-accordion-header-background-finish-hover: var(--color-dark-grey-4);

    --color-accordion-header-background-hover: var(--color-dark-grey-4);

    --color-accordion-header-background-start: var(--color-dark-grey-3);

    --color-accordion-header-background-start-active: var(--color-dark-grey-3);

    --color-accordion-header-background-start-disabled: var(--color-dark-grey-3);

    --color-accordion-header-background-start-hover: var(--color-dark-grey-4);

    --color-accordion-header-icon-container-border-radius-background-start: var(--color-pr500);

    --color-accordion-header-icon-container-icon: var(--color-mid-grey-5);

    --color-accordion-header-icon-container-icon-active: var(--color-mid-grey-5);

    --color-accordion-header-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-accordion-header-icon-container-icon-hover: var(--color-mid-grey-5);

    --color-accordion-header-text: var(--color-white);

    --color-accordion-header-text-active: var(--color-white);

    --color-accordion-header-text-disabled: var(--color-mid-grey-2);

    --color-accordion-header-text-hover: var(--color-white);

    --color-arrow-icon: #54596DCC;

    --color-arrow-icon-hover: #54596DCC;

    --color-at050: #FDF8D3;

    --color-at100: #FCF0A7;

    --color-at200: #FAE97C;

    --color-at300: #F8E150;

    --color-at400: #F6DA24;

    --color-at500: #E4C609;

    --color-at600: #BEA508;

    --color-at700: #988406;

    --color-at800: #726305;

    --color-at900: #4C4203;

    --color-avatar-background: var(--color-dark-grey-2);

    --color-avatar-background-finish: var(--color-dark-grey-2);

    --color-avatar-background-start: var(--color-dark-grey-2);

    --color-avatar-icon: var(--color-light-grey-4);

    --color-avatar-rakeback-background: var(--color-dark-grey-1);

    --color-avatar-rakeback-background-finish: var(--color-dark-grey-1);

    --color-avatar-rakeback-background-start: var(--color-dark-grey-1);

    --color-b000: #00000000;

    --color-b002: #00000005;

    --color-b005: #0000000D;

    --color-b010: #0000001A;

    --color-b020: #00000033;

    --color-b030: #0000004D;

    --color-b040: #00000066;

    --color-b050: #00000080;

    --color-b060: #00000099;

    --color-b070: #000000B3;

    --color-b080: #000000CC;

    --color-b090: #000000E6;

    --color-background: #1DBF59;

    --color-background-active: #1FAC5A;

    --color-background-attention: var(--color-at400);

    --color-background-danger: var(--color-da600);

    --color-background-disabled: #1C9854;

    --color-background-finish: #7113D4;

    --color-background-finish-hover: #721CFF;

    --color-background-hover: #3FC972;

    --color-background-info: var(--color-in400);

    --color-background-inverse-overlay: #FFFFFFB3;

    --color-background-inverse-overlay-1: var(--color-w070);

    --color-background-inverse-overlay-2: var(--color-w010);

    --color-background-inverse-page: var(--color-white);

    --color-background-inverse-surface-1: var(--color-light-grey-5);

    --color-background-inverse-surface-2: var(--color-light-grey-4);

    --color-background-inverse-surface-3: var(--color-light-grey-3);

    --color-background-inverse-surface-4: var(--color-light-grey-2);

    --color-background-inverse-surface-5: var(--color-light-grey-1);

    --color-background-inverse-transparent-1: var(--color-b010);

    --color-background-inverse-transparent-10: #0000001A;

    --color-background-inverse-transparent-2: var(--color-b020);

    --color-background-inverse-transparent-3: var(--color-b040);

    --color-background-inverse-transparent-4: var(--color-b080);

    --color-background-minor: var(--color-mi500);

    --color-background-overlay: var(--color-black);

    --color-background-overlay-1: var(--color-b070);

    --color-background-overlay-2: var(--color-b010);

    --color-background-page: var(--color-dark-grey-0);

    --color-background-primary: var(--color-pr500);

    --color-background-start: #1A799F;

    --color-background-start-hover: #1A799F;

    --color-background-success: var(--color-su600);

    --color-background-sucesss: #00C31F;

    --color-background-surface-1: var(--color-dark-grey-1);

    --color-background-surface-2: var(--color-dark-grey-2);

    --color-background-surface-3: var(--color-dark-grey-3);

    --color-background-surface-4: var(--color-dark-grey-4);

    --color-background-surface-5: var(--color-dark-grey-5);

    --color-background-transparent-1: var(--color-w010);

    --color-background-transparent-10: #FFFFFF1A;

    --color-background-transparent-2: var(--color-w020);

    --color-background-transparent-3: var(--color-w040);

    --color-background-transparent-30: #FFFFFF4D;

    --color-background-transparent-4: var(--color-w080);

    --color-background-warning: var(--color-wa400);

    --color-badge-attention-background: var(--color-at400);

    --color-badge-attention-background-finish: var(--color-at400);

    --color-badge-attention-background-start: var(--color-at400);

    --color-badge-attention-border: var(--color-b000);

    --color-badge-attention-border-finish: var(--color-b000);

    --color-badge-attention-icon-container-background: var(--color-b000);

    --color-badge-attention-icon-container-background-finish: var(--color-b000);

    --color-badge-attention-icon-container-background-start: var(--color-b000);

    --color-badge-attention-icon-container-border: var(--color-b000);

    --color-badge-attention-icon-container-border-finish: var(--color-b000);

    --color-badge-attention-icon-container-icon: var(--color-b080);

    --color-badge-attention-text: var(--color-black);

    --color-badge-danger-background: var(--color-da600);

    --color-badge-danger-background-finish: var(--color-da600);

    --color-badge-danger-background-start: var(--color-da600);

    --color-badge-danger-icon-container-icon: var(--color-w080);

    --color-badge-danger-text: var(--color-white);

    --color-badge-dark-background: var(--color-dark-grey-0);

    --color-badge-dark-background-finish: var(--color-dark-grey-0);

    --color-badge-dark-background-start: var(--color-dark-grey-0);

    --color-badge-dark-icon-container-icon: var(--color-at300);

    --color-badge-dark-text: var(--color-white);

    --color-badge-info-background: var(--color-in400);

    --color-badge-info-background-finish: var(--color-in400);

    --color-badge-info-background-start: var(--color-in400);

    --color-badge-info-icon-container-icon: var(--color-w080);

    --color-badge-info-text: var(--color-white);

    --color-badge-jackpot-background: linear-gradient(90deg, var(--color-badge-jackpot-background-start) 0%, var(--color-badge-jackpot-background-finish) 100%);

    --color-badge-jackpot-background-finish: #6F02FF;

    --color-badge-jackpot-background-start: #0238E1;

    --color-badge-jackpot-icon-container-icon: var(--color-at300);

    --color-badge-jackpot-text: var(--color-white);

    --color-badge-light-background: var(--color-white);

    --color-badge-light-background-finish: var(--color-white);

    --color-badge-light-background-start: var(--color-white);

    --color-badge-light-border: var(--color-b000);

    --color-badge-light-border-finish: var(--color-b000);

    --color-badge-light-icon-container-background: var(--color-b000);

    --color-badge-light-icon-container-background-finish: var(--color-b000);

    --color-badge-light-icon-container-background-start: var(--color-b000);

    --color-badge-light-icon-container-border: var(--color-b000);

    --color-badge-light-icon-container-border-finish: var(--color-b000);

    --color-badge-light-icon-container-icon: var(--color-dgz080);

    --color-badge-light-text: var(--color-black);

    --color-badge-minor-background: var(--color-mi500);

    --color-badge-minor-background-finish: var(--color-mi500);

    --color-badge-minor-background-start: var(--color-mi500);

    --color-badge-minor-icon-container-icon: var(--color-w080);

    --color-badge-minor-text: var(--color-white);

    --color-badge-primary-background: var(--color-pr500);

    --color-badge-primary-background-finish: var(--color-pr500);

    --color-badge-primary-background-start: var(--color-pr500);

    --color-badge-primary-icon-container-icon: var(--color-w080);

    --color-badge-primary-text: var(--color-button-primary);

    --color-badge-secondary-background: #11825f;

    --color-badge-secondary-background-finish: #11825f;

    --color-badge-secondary-background-start: #11825f;

    --color-badge-secondary-icon-container-icon: var(--color-w080);

    --color-badge-secondary-text: var(--color-white);

    --color-badge-success-background: var(--color-su600);

    --color-badge-success-background-finish: var(--color-su600);

    --color-badge-success-background-start: var(--color-su600);

    --color-badge-success-icon-container-icon: var(--color-w080);

    --color-badge-success-text: var(--color-white);

    --color-badge-transparent-background: var(--color-w020);

    --color-badge-transparent-background-finish: var(--color-w020);

    --color-badge-transparent-background-start: var(--color-w020);

    --color-badge-transparent-icon-container-icon: var(--color-w080);

    --color-badge-transparent-text: var(--color-white);

    --color-badge-vip-background: linear-gradient(260deg, var(--color-badge-vip-background-start) 0%, var(--color-badge-vip-background-finish) 100%);

    --color-badge-vip-background-finish: #B48457;

    --color-badge-vip-background-start: #FFEA81;

    --color-badge-vip-icon-container-icon: var(--color-b080);

    --color-badge-vip-text: var(--color-black);

    --color-badge-warning-background: var(--color-wa400);

    --color-badge-warning-background-finish: var(--color-wa400);

    --color-badge-warning-background-start: var(--color-wa400);

    --color-badge-warning-icon-container-icon: var(--color-w080);

    --color-badge-warning-text: var(--color-white);

    --color-black: #000000;

    --color-blue: #2196F3;

    --color-border-error-outline: #FF0E0E99;

    --color-border-focused-outline: #54596D99;

    --color-border-success-outline: #09E41F99;

    --color-button-fill-attention-background: var(--color-at400);

    --color-button-fill-attention-background-active: var(--color-at500);

    --color-button-fill-attention-background-disabled: var(--color-at900);

    --color-button-fill-attention-background-finish: var(--color-at400);

    --color-button-fill-attention-background-finish-active: var(--color-at500);

    --color-button-fill-attention-background-finish-disabled: var(--color-w005);

    --color-button-fill-attention-background-finish-hover: var(--color-at300);

    --color-button-fill-attention-background-hover: var(--color-at300);

    --color-button-fill-attention-background-start: var(--color-at400);

    --color-button-fill-attention-background-start-active: var(--color-at500);

    --color-button-fill-attention-background-start-disabled: var(--color-w005);

    --color-button-fill-attention-background-start-hover: var(--color-at300);

    --color-button-fill-attention-icon-container-icon: #FFF;

    --color-button-fill-attention-icon-container-icon-active: #FFF;

    --color-button-fill-attention-icon-container-icon-disabled: var(--color-at700);

    --color-button-fill-attention-icon-container-icon-hover: #FFF;

    --color-button-fill-attention-text: #FFF;

    --color-button-fill-attention-text-active: #FFF;

    --color-button-fill-attention-text-disabled: var(--color-at700);

    --color-button-fill-attention-text-hover: #FFF;

    --color-button-fill-danger-background: var(--color-da600);

    --color-button-fill-danger-background-active: var(--color-da700);

    --color-button-fill-danger-background-disabled: var(--color-da900);

    --color-button-fill-danger-background-finish: var(--color-da600);

    --color-button-fill-danger-background-finish-active: var(--color-da700);

    --color-button-fill-danger-background-finish-disabled: var(--color-w005);

    --color-button-fill-danger-background-finish-hover: var(--color-da500);

    --color-button-fill-danger-background-hover: var(--color-da500);

    --color-button-fill-danger-background-start: var(--color-da600);

    --color-button-fill-danger-background-start-active: var(--color-da700);

    --color-button-fill-danger-background-start-disabled: var(--color-w005);

    --color-button-fill-danger-background-start-hover: var(--color-da500);

    --color-button-fill-danger-icon-container-icon: var(--color-da050);

    --color-button-fill-danger-icon-container-icon-active: var(--color-da050);

    --color-button-fill-danger-icon-container-icon-disabled: var(--color-da700);

    --color-button-fill-danger-icon-container-icon-hover: var(--color-da050);

    --color-button-fill-danger-text: #FFF;

    --color-button-fill-danger-text-active: #FFF;

    --color-button-fill-danger-text-disabled: var(--color-da700);

    --color-button-fill-danger-text-hover: #FFF;

    --color-button-fill-dark-background: var(--color-dark-grey-0);

    --color-button-fill-dark-background-active: var(--color-dark-grey-5);

    --color-button-fill-dark-background-disabled: var(--color-b005);

    --color-button-fill-dark-background-finish: var(--color-dark-grey-0);

    --color-button-fill-dark-background-finish-active: var(--color-dark-grey-5);

    --color-button-fill-dark-background-finish-disabled: var(--color-b005);

    --color-button-fill-dark-background-finish-hover: var(--color-dark-grey-3);

    --color-button-fill-dark-background-hover: var(--color-dark-grey-3);

    --color-button-fill-dark-background-start: var(--color-dark-grey-0);

    --color-button-fill-dark-background-start-active: var(--color-dark-grey-5);

    --color-button-fill-dark-background-start-disabled: var(--color-b005);

    --color-button-fill-dark-background-start-hover: var(--color-dark-grey-3);

    --color-button-fill-dark-icon-container-icon: var(--color-w080);

    --color-button-fill-dark-icon-container-icon-active: var(--color-w080);

    --color-button-fill-dark-icon-container-icon-disabled: var(--color-b050);

    --color-button-fill-dark-icon-container-icon-hover: var(--color-w080);

    --color-button-fill-dark-text: var(--color-white);

    --color-button-fill-dark-text-active: var(--color-white);

    --color-button-fill-dark-text-disabled: var(--color-b070);

    --color-button-fill-dark-text-hover: var(--color-white);

    --color-button-fill-info-background: var(--color-in400);

    --color-button-fill-info-background-active: var(--color-in700);

    --color-button-fill-info-background-disabled: var(--color-in800);

    --color-button-fill-info-background-finish: var(--color-in400);

    --color-button-fill-info-background-finish-active: var(--color-in700);

    --color-button-fill-info-background-finish-disabled: var(--color-w005);

    --color-button-fill-info-background-finish-hover: var(--color-in500);

    --color-button-fill-info-background-hover: var(--color-in500);

    --color-button-fill-info-background-start: var(--color-in400);

    --color-button-fill-info-background-start-active: var(--color-in700);

    --color-button-fill-info-background-start-disabled: var(--color-w005);

    --color-button-fill-info-background-start-hover: var(--color-in500);

    --color-button-fill-info-icon-container-icon: #FFF;

    --color-button-fill-info-icon-container-icon-active: #FFF;

    --color-button-fill-info-icon-container-icon-disabled: var(--color-in600);

    --color-button-fill-info-icon-container-icon-hover: #FFF;

    --color-button-fill-info-text: #FFF;

    --color-button-fill-info-text-active: #FFF;

    --color-button-fill-info-text-disabled: var(--color-in600);

    --color-button-fill-info-text-hover: #FFF;

    --color-button-fill-light-background: var(--color-white);

    --color-button-fill-light-background-active: var(--color-light-grey-4);

    --color-button-fill-light-background-disabled: var(--color-b005);

    --color-button-fill-light-background-finish: var(--color-white);

    --color-button-fill-light-background-finish-active: var(--color-light-grey-4);

    --color-button-fill-light-background-finish-disabled: var(--color-b005);

    --color-button-fill-light-background-finish-hover: var(--color-light-grey-5);

    --color-button-fill-light-background-hover: var(--color-light-grey-5);

    --color-button-fill-light-background-start: var(--color-white);

    --color-button-fill-light-background-start-active: var(--color-light-grey-4);

    --color-button-fill-light-background-start-disabled: var(--color-b005);

    --color-button-fill-light-background-start-hover: var(--color-light-grey-5);

    --color-button-fill-light-icon-container-icon: var(--color-dgz080);

    --color-button-fill-light-icon-container-icon-active: var(--color-dgz080);

    --color-button-fill-light-icon-container-icon-disabled: var(--color-dgz080);

    --color-button-fill-light-icon-container-icon-hover: var(--color-dgz080);

    --color-button-fill-light-text: var(--color-black);

    --color-button-fill-light-text-active: var(--color-black);

    --color-button-fill-light-text-disabled: var(--color-b070);

    --color-button-fill-light-text-hover: var(--color-black);

    --color-button-fill-minor-background: var(--color-mi500);

    --color-button-fill-minor-background-active: var(--color-vi700);

    --color-button-fill-minor-background-disabled: var(--color-vi900);

    --color-button-fill-minor-background-finish: var(--color-mi500);

    --color-button-fill-minor-background-finish-active: var(--color-mi700);

    --color-button-fill-minor-background-finish-disabled: var(--color-w005);

    --color-button-fill-minor-background-finish-hover: var(--color-mi400);

    --color-button-fill-minor-background-hover: var(--color-vi400);

    --color-button-fill-minor-background-start: var(--color-mi500);

    --color-button-fill-minor-background-start-active: var(--color-mi700);

    --color-button-fill-minor-background-start-disabled: var(--color-w005);

    --color-button-fill-minor-background-start-hover: var(--color-mi400);

    --color-button-fill-minor-icon-container-icon: var(--color-w080);

    --color-button-fill-minor-icon-container-icon-active: var(--color-w080);

    --color-button-fill-minor-icon-container-icon-disabled: var(--color-vi700);

    --color-button-fill-minor-icon-container-icon-hover: var(--color-w080);

    --color-button-fill-minor-text: #FFF;

    --color-button-fill-minor-text-active: #FFF;

    --color-button-fill-minor-text-disabled: var(--color-vi700);

    --color-button-fill-minor-text-hover: #FFF;

    --color-button-fill-primary-background: #40e6b1;

    --color-button-fill-primary-background-active: #10221a;

    --color-button-fill-primary-background-disabled: #10221a;

    --color-button-fill-primary-background-finish: #10221a;

    --color-button-fill-primary-background-finish-active: #10221a;

    --color-button-fill-primary-background-finish-disabled: #10221a;

    --color-button-fill-primary-background-finish-hover: #10221a;

    --color-button-fill-primary-background-hover: #10221a;

    --color-button-fill-primary-background-start: #10221a;

    --color-button-fill-primary-background-start-active: #10221a;

    --color-button-fill-primary-background-start-disabled: #10221a;

    --color-button-fill-primary-background-start-hover: #10221a;

    --color-button-fill-primary-icon-container-icon: var(--color-pr700);

    --color-button-fill-primary-icon-container-icon-active: var(--color-pr700);

    --color-button-fill-primary-icon-container-icon-disabled: var(--color-pr700);

    --color-button-fill-primary-icon-container-icon-hover: var(--color-pr700);

    --color-button-fill-primary-progress-background: var(--color-pr500);

    --color-button-fill-primary-progress-background-active: var(--color-pr600);

    --color-button-fill-primary-progress-background-disabled: var(--color-w005);

    --color-button-fill-primary-progress-background-finish: var(--color-pr500);

    --color-button-fill-primary-progress-background-finish-active: var(--color-pr600);

    --color-button-fill-primary-progress-background-finish-disabled: var(--color-w005);

    --color-button-fill-primary-progress-background-finish-hover: var(--color-pr400);

    --color-button-fill-primary-progress-background-hover: var(--color-pr400);

    --color-button-fill-primary-progress-background-start: var(--color-pr500);

    --color-button-fill-primary-progress-background-start-active: var(--color-pr600);

    --color-button-fill-primary-progress-background-start-disabled: var(--color-w005);

    --color-button-fill-primary-progress-background-start-hover: var(--color-pr400);

    --color-button-fill-primary-progress-icon-container-icon: var(--color-w080);

    --color-button-fill-primary-progress-icon-container-icon-active: var(--color-w080);

    --color-button-fill-primary-progress-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-button-fill-primary-progress-icon-container-icon-hover: var(--color-w080);

    --color-button-fill-primary-progress-progress: var(--color-pr400);

    --color-button-fill-primary-progress-progress-active: var(--color-pr500);

    --color-button-fill-primary-progress-progress-background-finish: var(--color-pr400);

    --color-button-fill-primary-progress-progress-background-finish-active: var(--color-pr500);

    --color-button-fill-primary-progress-progress-background-finish-disabled: var(--color-dark-grey-3);

    --color-button-fill-primary-progress-progress-background-finish-hover: var(--color-pr300);

    --color-button-fill-primary-progress-progress-background-start: var(--color-pr400);

    --color-button-fill-primary-progress-progress-background-start-active: var(--color-pr500);

    --color-button-fill-primary-progress-progress-background-start-disabled: var(--color-dark-grey-3);

    --color-button-fill-primary-progress-progress-background-start-hover: var(--color-pr300);

    --color-button-fill-primary-progress-progress-disabled: var(--color-dark-grey-3);

    --color-button-fill-primary-progress-progress-hover: var(--color-pr300);

    --color-button-fill-primary-progress-text: var(--color-white);

    --color-button-fill-primary-progress-text-active: var(--color-white);

    --color-button-fill-primary-progress-text-disabled: var(--color-mid-grey-2);

    --color-button-fill-primary-progress-text-hover: var(--color-white);

    --color-button-fill-primary-text: var(--color-button-primary);

    --color-button-fill-primary-text-active: var(--color-button-primary);

    --color-button-fill-primary-text-disabled: var(--color-pr700);

    --color-button-fill-primary-text-hover: var(--color-button-primary);

    --color-button-fill-secondary-background: var(--color-dark-grey-4);

    --color-button-fill-secondary-background-active: var(--color-dark-grey-3);

    --color-button-fill-secondary-background-disabled: var(--color-w005);

    --color-button-fill-secondary-background-finish: var(--color-dark-grey-4);

    --color-button-fill-secondary-background-finish-active: var(--color-dark-grey-3);

    --color-button-fill-secondary-background-finish-disabled: var(--color-w005);

    --color-button-fill-secondary-background-finish-hover: var(--color-dark-grey-5);

    --color-button-fill-secondary-background-hover: var(--color-dark-grey-5);

    --color-button-fill-secondary-background-start: var(--color-dark-grey-4);

    --color-button-fill-secondary-background-start-active: var(--color-dark-grey-3);

    --color-button-fill-secondary-background-start-disabled: var(--color-w005);

    --color-button-fill-secondary-background-start-hover: var(--color-dark-grey-5);

    --color-button-fill-secondary-icon-container-icon: var(--color-mid-grey-5);

    --color-button-fill-secondary-icon-container-icon-active: var(--color-mid-grey-5);

    --color-button-fill-secondary-icon-container-icon-disabled: var(--color-mid-grey-5);

    --color-button-fill-secondary-icon-container-icon-hover: var(--color-mid-grey-5);

    --color-button-fill-secondary-progress-background: var(--color-dark-grey-4);

    --color-button-fill-secondary-progress-background-active: var(--color-dark-grey-3);

    --color-button-fill-secondary-progress-background-disabled: var(--color-w005);

    --color-button-fill-secondary-progress-background-finish: var(--color-dark-grey-4);

    --color-button-fill-secondary-progress-background-finish-active: var(--color-dark-grey-3);

    --color-button-fill-secondary-progress-background-finish-disabled: var(--color-w005);

    --color-button-fill-secondary-progress-background-finish-hover: var(--color-dark-grey-5);

    --color-button-fill-secondary-progress-background-hover: var(--color-dark-grey-5);

    --color-button-fill-secondary-progress-background-start: var(--color-dark-grey-4);

    --color-button-fill-secondary-progress-background-start-active: var(--color-dark-grey-3);

    --color-button-fill-secondary-progress-background-start-disabled: var(--color-w005);

    --color-button-fill-secondary-progress-background-start-hover: var(--color-dark-grey-5);

    --color-button-fill-secondary-progress-icon-container-icon: var(--color-w080);

    --color-button-fill-secondary-progress-icon-container-icon-active: var(--color-w080);

    --color-button-fill-secondary-progress-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-button-fill-secondary-progress-icon-container-icon-hover: var(--color-w080);

    --color-button-fill-secondary-progress-progress: var(--color-pr400);

    --color-button-fill-secondary-progress-progress-active: var(--color-pr500);

    --color-button-fill-secondary-progress-progress-background-finish: var(--color-pr400);

    --color-button-fill-secondary-progress-progress-background-finish-active: var(--color-pr500);

    --color-button-fill-secondary-progress-progress-background-finish-disabled: var(--color-dark-grey-3);

    --color-button-fill-secondary-progress-progress-background-finish-hover: var(--color-pr300);

    --color-button-fill-secondary-progress-progress-background-start: var(--color-pr400);

    --color-button-fill-secondary-progress-progress-background-start-active: var(--color-pr500);

    --color-button-fill-secondary-progress-progress-background-start-disabled: var(--color-dark-grey-3);

    --color-button-fill-secondary-progress-progress-background-start-hover: var(--color-pr300);

    --color-button-fill-secondary-progress-progress-disabled: var(--color-dark-grey-3);

    --color-button-fill-secondary-progress-progress-hover: var(--color-pr300);

    --color-button-fill-secondary-progress-text: var(--color-white);

    --color-button-fill-secondary-progress-text-active: var(--color-white);

    --color-button-fill-secondary-progress-text-disabled: var(--color-mid-grey-2);

    --color-button-fill-secondary-progress-text-hover: var(--color-white);

    --color-button-fill-secondary-text: var(--color-white);

    --color-button-fill-secondary-text-active: var(--color-white);

    --color-button-fill-secondary-text-disabled: var(--color-mid-grey-1);

    --color-button-fill-secondary-text-hover: var(--color-white);

    --color-button-fill-success-background: var(--color-su600);

    --color-button-fill-success-background-active: var(--color-su700);

    --color-button-fill-success-background-disabled: var(--color-su800);

    --color-button-fill-success-background-finish: var(--color-su600);

    --color-button-fill-success-background-finish-active: var(--color-su700);

    --color-button-fill-success-background-finish-disabled: var(--color-w005);

    --color-button-fill-success-background-finish-hover: var(--color-su500);

    --color-button-fill-success-background-hover: var(--color-su500);

    --color-button-fill-success-background-start: var(--color-su600);

    --color-button-fill-success-background-start-active: var(--color-su700);

    --color-button-fill-success-background-start-disabled: var(--color-w005);

    --color-button-fill-success-background-start-hover: var(--color-su500);

    --color-button-fill-success-icon-container-icon: var(--color-w080);

    --color-button-fill-success-icon-container-icon-active: var(--color-w080);

    --color-button-fill-success-icon-container-icon-disabled: var(--color-su600);

    --color-button-fill-success-icon-container-icon-hover: var(--color-w080);

    --color-button-fill-success-text: #FFF;

    --color-button-fill-success-text-active: #FFF;

    --color-button-fill-success-text-disabled: var(--color-su600);

    --color-button-fill-success-text-hover: #FFF;

    --color-button-fill-vip-background: linear-gradient(263deg, var(--color-button-fill-vip-background-start) 0%, var(--color-button-fill-vip-background-finish) 100%);

    --color-button-fill-vip-background-active: linear-gradient(263deg, var(--color-button-fill-vip-background-start-active) 0%, var(--color-button-fill-vip-background-finish-active) 100%);

    --color-button-fill-vip-background-disabled: var(--color-w005);

    --color-button-fill-vip-background-finish: #B48457;

    --color-button-fill-vip-background-finish-active: #906A46;

    --color-button-fill-vip-background-finish-disabled: var(--color-w005);

    --color-button-fill-vip-background-finish-hover: #C39D79;

    --color-button-fill-vip-background-hover: linear-gradient(263deg, var(--color-button-fill-vip-background-start-hover) 0%, var(--color-button-fill-vip-background-finish-hover) 100%);

    --color-button-fill-vip-background-overlay-active: var(--color-b020);

    --color-button-fill-vip-background-overlay-hover: var(--color-w020);

    --color-button-fill-vip-background-start: #FFEA81;

    --color-button-fill-vip-background-start-active: #CCBB67;

    --color-button-fill-vip-background-start-disabled: var(--color-w005);

    --color-button-fill-vip-background-start-hover: #FFEE9A;

    --color-button-fill-vip-icon-container-icon: var(--color-b080);

    --color-button-fill-vip-icon-container-icon-active: var(--color-b080);

    --color-button-fill-vip-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-button-fill-vip-icon-container-icon-hover: var(--color-b080);

    --color-button-fill-vip-text: var(--color-black);

    --color-button-fill-vip-text-active: var(--color-black);

    --color-button-fill-vip-text-disabled: var(--color-mid-grey-2);

    --color-button-fill-vip-text-hover: var(--color-black);

    --color-button-fill-warning-background: var(--color-wa400);

    --color-button-fill-warning-background-active: var(--color-wa600);

    --color-button-fill-warning-background-disabled: var(--color-wa900);

    --color-button-fill-warning-background-finish: var(--color-wa400);

    --color-button-fill-warning-background-finish-active: var(--color-wa600);

    --color-button-fill-warning-background-finish-disabled: var(--color-w005);

    --color-button-fill-warning-background-finish-hover: var(--color-wa300);

    --color-button-fill-warning-background-hover: var(--color-wa400);

    --color-button-fill-warning-background-start: var(--color-wa400);

    --color-button-fill-warning-background-start-active: var(--color-wa600);

    --color-button-fill-warning-background-start-disabled: var(--color-w005);

    --color-button-fill-warning-background-start-hover: var(--color-wa300);

    --color-button-fill-warning-icon-container-icon: var(--color-pr050);

    --color-button-fill-warning-icon-container-icon-active: var(--color-pr050);

    --color-button-fill-warning-icon-container-icon-disabled: var(--color-wa700);

    --color-button-fill-warning-icon-container-icon-hover: var(--color-pr050);

    --color-button-fill-warning-text: #FFF;

    --color-button-fill-warning-text-active: #FFF;

    --color-button-fill-warning-text-disabled: var(--color-wa700);

    --color-button-fill-warning-text-hover: #FFF;

    --color-button-link-dark-icon-container-background: var(--color-b000);

    --color-button-link-dark-icon-container-background-active: var(--color-b000);

    --color-button-link-dark-icon-container-background-disabled: var(--color-b000);

    --color-button-link-dark-icon-container-background-finish: var(--color-b000);

    --color-button-link-dark-icon-container-background-finish-active: var(--color-b000);

    --color-button-link-dark-icon-container-background-finish-disabled: var(--color-b000);

    --color-button-link-dark-icon-container-background-finish-hover: var(--color-b000);

    --color-button-link-dark-icon-container-background-hover: var(--color-b000);

    --color-button-link-dark-icon-container-background-start: var(--color-b000);

    --color-button-link-dark-icon-container-background-start-active: var(--color-b000);

    --color-button-link-dark-icon-container-background-start-disabled: var(--color-b000);

    --color-button-link-dark-icon-container-background-start-hover: var(--color-b000);

    --color-button-link-dark-icon-container-border: var(--color-b000);

    --color-button-link-dark-icon-container-border-active: var(--color-b000);

    --color-button-link-dark-icon-container-border-disabled: var(--color-b000);

    --color-button-link-dark-icon-container-border-finish: var(--color-b000);

    --color-button-link-dark-icon-container-border-finish-active: var(--color-b000);

    --color-button-link-dark-icon-container-border-finish-disabled: var(--color-b000);

    --color-button-link-dark-icon-container-border-finish-hover: var(--color-b000);

    --color-button-link-dark-icon-container-border-hover: var(--color-b000);

    --color-button-link-dark-icon-container-icon: #353B52CC;

    --color-button-link-dark-icon-container-icon-active: #060E2ACC;

    --color-button-link-dark-icon-container-icon-disabled: #828695CC;

    --color-button-link-dark-icon-container-icon-hover: #060E2ACC;

    --color-button-link-dark-text: var(--color-dark-grey-3);

    --color-button-link-dark-text-active: var(--color-black);

    --color-button-link-dark-text-disabled: var(--color-mid-grey-3);

    --color-button-link-dark-text-hover: var(--color-black);

    --color-button-link-info-icon-container-icon: var(--color-in200);

    --color-button-link-info-icon-container-icon-active: var(--color-in100);

    --color-button-link-info-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-button-link-info-icon-container-icon-hover: var(--color-in200);

    --color-button-link-info-text: var(--color-in200);

    --color-button-link-info-text-active: var(--color-in100);

    --color-button-link-info-text-disabled: var(--color-mid-grey-2);

    --color-button-link-info-text-hover: var(--color-in200);

    --color-button-link-light-icon-container-icon: var(--color-light-grey-3);

    --color-button-link-light-icon-container-icon-active: var(--color-white);

    --color-button-link-light-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-button-link-light-icon-container-icon-hover: var(--color-white);

    --color-button-link-light-text: var(--color-light-grey-3);

    --color-button-link-light-text-active: var(--color-white);

    --color-button-link-light-text-disabled: var(--color-mid-grey-2);

    --color-button-link-light-text-hover: var(--color-white);

    --color-button-link-primary-icon-container-icon: var(--color-pr500);

    --color-button-link-primary-icon-container-icon-active: var(--color-pr200);

    --color-button-link-primary-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-button-link-primary-icon-container-icon-hover: var(--color-pr400);

    --color-button-link-primary-text: var(--color-pr500);

    --color-button-link-primary-text-active: var(--color-pr200);

    --color-button-link-primary-text-disabled: var(--color-mid-grey-2);

    --color-button-link-primary-text-hover: var(--color-pr400);

    --color-button-link-secondary-icon-container-icon: var(--color-mid-grey-3);

    --color-button-link-secondary-icon-container-icon-active: var(--color-pr200);

    --color-button-link-secondary-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-button-link-secondary-icon-container-icon-hover: var(--color-pr400);

    --color-button-link-secondary-text: var(--color-mid-grey-3);

    --color-button-link-secondary-text-active: var(--color-pr200);

    --color-button-link-secondary-text-disabled: var(--color-mid-grey-2);

    --color-button-link-secondary-text-hover: var(--color-pr400);

    --color-button-navigation-inverse-background: var(--color-b010);

    --color-button-navigation-inverse-background-active: var(--color-b005);

    --color-button-navigation-inverse-background-disabled: var(--color-b005);

    --color-button-navigation-inverse-background-finish: var(--color-b010);

    --color-button-navigation-inverse-background-finish-active: var(--color-b005);

    --color-button-navigation-inverse-background-finish-disabled: var(--color-b005);

    --color-button-navigation-inverse-background-finish-hover: var(--color-b020);

    --color-button-navigation-inverse-background-hover: var(--color-b020);

    --color-button-navigation-inverse-background-start: var(--color-b010);

    --color-button-navigation-inverse-background-start-active: var(--color-b005);

    --color-button-navigation-inverse-background-start-disabled: var(--color-b005);

    --color-button-navigation-inverse-background-start-hover: var(--color-b020);

    --color-button-navigation-inverse-border: var(--color-b000);

    --color-button-navigation-inverse-border-active: var(--color-b000);

    --color-button-navigation-inverse-border-disabled: var(--color-b000);

    --color-button-navigation-inverse-border-finish: var(--color-b000);

    --color-button-navigation-inverse-border-finish-active: var(--color-b000);

    --color-button-navigation-inverse-border-finish-disabled: var(--color-b000);

    --color-button-navigation-inverse-border-finish-hover: var(--color-b000);

    --color-button-navigation-inverse-border-hover: var(--color-b000);

    --color-button-navigation-inverse-icon: var(--color-dgz080);

    --color-button-navigation-inverse-icon-active: var(--color-black);

    --color-button-navigation-inverse-icon-disabled: var(--color-b050);

    --color-button-navigation-inverse-icon-hover: var(--color-black);

    --color-button-navigation-secondary-background: var(--color-w010);

    --color-button-navigation-secondary-background-active: var(--color-w005);

    --color-button-navigation-secondary-background-disabled: var(--color-w005);

    --color-button-navigation-secondary-background-finish: var(--color-w010);

    --color-button-navigation-secondary-background-finish-active: var(--color-w005);

    --color-button-navigation-secondary-background-finish-disabled: var(--color-w005);

    --color-button-navigation-secondary-background-finish-hover: var(--color-w020);

    --color-button-navigation-secondary-background-hover: var(--color-w020);

    --color-button-navigation-secondary-background-start: var(--color-w010);

    --color-button-navigation-secondary-background-start-active: var(--color-w005);

    --color-button-navigation-secondary-background-start-disabled: var(--color-w005);

    --color-button-navigation-secondary-background-start-hover: var(--color-w020);

    --color-button-navigation-secondary-icon: var(--color-w080);

    --color-button-navigation-secondary-icon-active: var(--color-white);

    --color-button-navigation-secondary-icon-disabled: var(--color-mid-grey-2);

    --color-button-navigation-secondary-icon-hover: var(--color-white);

    --color-button-navigation-transparent-background: var(--color-w010);

    --color-button-navigation-transparent-background-active: var(--color-w005);

    --color-button-navigation-transparent-background-disabled: var(--color-w005);

    --color-button-navigation-transparent-background-finish: var(--color-w010);

    --color-button-navigation-transparent-background-finish-active: var(--color-w005);

    --color-button-navigation-transparent-background-finish-disabled: var(--color-w005);

    --color-button-navigation-transparent-background-finish-hover: var(--color-w020);

    --color-button-navigation-transparent-background-hover: var(--color-w020);

    --color-button-navigation-transparent-background-start: var(--color-w010);

    --color-button-navigation-transparent-background-start-active: var(--color-w005);

    --color-button-navigation-transparent-background-start-disabled: var(--color-w005);

    --color-button-navigation-transparent-background-start-hover: var(--color-w020);

    --color-button-navigation-transparent-icon: var(--color-w080);

    --color-button-navigation-transparent-icon-active: var(--color-white);

    --color-button-navigation-transparent-icon-disabled: var(--color-mid-grey-2);

    --color-button-navigation-transparent-icon-hover: var(--color-white);

    --color-button-outline-attention-background-active: var(--color-at700);

    --color-button-outline-attention-background-finish-active: var(--color-at500);

    --color-button-outline-attention-background-finish-hover: var(--color-at300);

    --color-button-outline-attention-background-hover: var(--color-at600);

    --color-button-outline-attention-background-start-active: var(--color-at500);

    --color-button-outline-attention-background-start-hover: var(--color-at300);

    --color-button-outline-attention-border: var(--color-at400);

    --color-button-outline-attention-border-disabled: var(--color-at900);

    --color-button-outline-attention-border-finish: var(--color-at400);

    --color-button-outline-attention-border-finish-disabled: var(--color-w005);

    --color-button-outline-attention-icon-container-icon: var(--color-at050);

    --color-button-outline-attention-icon-container-icon-active: var(--color-at050);

    --color-button-outline-attention-icon-container-icon-disabled: var(--color-at050);

    --color-button-outline-attention-icon-container-icon-hover: var(--color-at050);

    --color-button-outline-attention-text: var(--color-white);

    --color-button-outline-attention-text-active: #FFF;

    --color-button-outline-attention-text-disabled: var(--color-at800);

    --color-button-outline-attention-text-hover: #FFF;

    --color-button-outline-danger-background-active: var(--color-da700);

    --color-button-outline-danger-background-finish-active: var(--color-da700);

    --color-button-outline-danger-background-finish-hover: var(--color-da500);

    --color-button-outline-danger-background-hover: var(--color-da500);

    --color-button-outline-danger-background-start-active: var(--color-da700);

    --color-button-outline-danger-background-start-hover: var(--color-da500);

    --color-button-outline-danger-border: var(--color-da600);

    --color-button-outline-danger-border-disabled: var(--color-da900);

    --color-button-outline-danger-border-finish: var(--color-da600);

    --color-button-outline-danger-border-finish-disabled: var(--color-w005);

    --color-button-outline-danger-icon-container-icon: var(--color-da500);

    --color-button-outline-danger-icon-container-icon-active: var(--color-da050);

    --color-button-outline-danger-icon-container-icon-disabled: var(--color-da800);

    --color-button-outline-danger-icon-container-icon-hover: var(--color-da050);

    --color-button-outline-danger-text: var(--color-white);

    --color-button-outline-danger-text-active: var(--color-white);

    --color-button-outline-danger-text-disabled: var(--color-da800);

    --color-button-outline-danger-text-hover: var(--color-white);

    --color-button-outline-dark-background-active: var(--color-dark-grey-5);

    --color-button-outline-dark-background-finish-active: var(--color-dark-grey-5);

    --color-button-outline-dark-background-finish-hover: var(--color-dark-grey-3);

    --color-button-outline-dark-background-hover: var(--color-dark-grey-3);

    --color-button-outline-dark-background-start-active: var(--color-dark-grey-5);

    --color-button-outline-dark-background-start-hover: var(--color-dark-grey-3);

    --color-button-outline-dark-border: var(--color-dark-grey-0);

    --color-button-outline-dark-border-disabled: var(--color-b005);

    --color-button-outline-dark-border-finish: var(--color-dark-grey-0);

    --color-button-outline-dark-border-finish-disabled: var(--color-b005);

    --color-button-outline-dark-icon-container-icon: var(--color-dgz080);

    --color-button-outline-dark-icon-container-icon-active: var(--color-w080);

    --color-button-outline-dark-icon-container-icon-disabled: var(--color-b050);

    --color-button-outline-dark-icon-container-icon-hover: var(--color-w080);

    --color-button-outline-dark-text: var(--color-black);

    --color-button-outline-dark-text-active: var(--color-white);

    --color-button-outline-dark-text-disabled: var(--color-b070);

    --color-button-outline-dark-text-hover: var(--color-white);

    --color-button-outline-info-background-active: var(--color-in700);

    --color-button-outline-info-background-finish-active: var(--color-in700);

    --color-button-outline-info-background-finish-hover: var(--color-in500);

    --color-button-outline-info-background-hover: var(--color-in500);

    --color-button-outline-info-background-start-active: var(--color-in700);

    --color-button-outline-info-background-start-hover: var(--color-in500);

    --color-button-outline-info-border: var(--color-in400);

    --color-button-outline-info-border-disabled: var(--color-in800);

    --color-button-outline-info-border-finish: var(--color-in400);

    --color-button-outline-info-border-finish-disabled: var(--color-w005);

    --color-button-outline-info-icon-container-icon: var(--color-in050);

    --color-button-outline-info-icon-container-icon-active: var(--color-in050);

    --color-button-outline-info-icon-container-icon-disabled: var(--color-in050);

    --color-button-outline-info-icon-container-icon-hover: var(--color-in050);

    --color-button-outline-info-text: var(--color-white);

    --color-button-outline-info-text-active: #FFF;

    --color-button-outline-info-text-disabled: var(--color-in600);

    --color-button-outline-info-text-hover: #FFF;

    --color-button-outline-light-background-active: var(--color-light-grey-4);

    --color-button-outline-light-background-finish-active: var(--color-light-grey-4);

    --color-button-outline-light-background-finish-hover: var(--color-light-grey-5);

    --color-button-outline-light-background-hover: var(--color-light-grey-5);

    --color-button-outline-light-background-start-active: var(--color-light-grey-4);

    --color-button-outline-light-background-start-hover: var(--color-light-grey-5);

    --color-button-outline-light-border: var(--color-white);

    --color-button-outline-light-border-disabled: var(--color-b005);

    --color-button-outline-light-border-finish: var(--color-white);

    --color-button-outline-light-border-finish-disabled: var(--color-b005);

    --color-button-outline-light-icon-container-icon: var(--color-w080);

    --color-button-outline-light-icon-container-icon-active: var(--color-dgz080);

    --color-button-outline-light-icon-container-icon-disabled: var(--color-b050);

    --color-button-outline-light-icon-container-icon-hover: var(--color-dgz080);

    --color-button-outline-light-text: var(--color-white);

    --color-button-outline-light-text-active: var(--color-black);

    --color-button-outline-light-text-disabled: var(--color-b070);

    --color-button-outline-light-text-hover: var(--color-black);

    --color-button-outline-minor-background-active: var(--color-vi700);

    --color-button-outline-minor-background-finish-active: var(--color-mi700);

    --color-button-outline-minor-background-finish-hover: var(--color-mi400);

    --color-button-outline-minor-background-hover: var(--color-vi400);

    --color-button-outline-minor-background-start-active: var(--color-mi700);

    --color-button-outline-minor-background-start-hover: var(--color-mi400);

    --color-button-outline-minor-border: var(--color-mi500);

    --color-button-outline-minor-border-disabled: var(--color-vi800);

    --color-button-outline-minor-border-finish: var(--color-mi500);

    --color-button-outline-minor-border-finish-disabled: var(--color-w005);

    --color-button-outline-minor-icon-container-icon: var(--color-in050);

    --color-button-outline-minor-icon-container-icon-active: var(--color-in050);

    --color-button-outline-minor-icon-container-icon-disabled: var(--color-in050);

    --color-button-outline-minor-icon-container-icon-hover: var(--color-in050);

    --color-button-outline-minor-text: var(--color-white);

    --color-button-outline-minor-text-active: var(--color-white);

    --color-button-outline-minor-text-disabled: var(--color-vi700);

    --color-button-outline-minor-text-hover: var(--color-white);

    --color-button-outline-primary-background-active: var(--color-pr600);

    --color-button-outline-primary-background-finish-active: var(--color-pr600);

    --color-button-outline-primary-background-finish-hover: var(--color-pr400);

    --color-button-outline-primary-background-hover: var(--color-pr400);

    --color-button-outline-primary-background-start-active: var(--color-pr600);

    --color-button-outline-primary-background-start-hover: var(--color-pr400);

    --color-button-outline-primary-border: var(--color-pr500);

    --color-button-outline-primary-border-disabled: var(--color-pr900);

    --color-button-outline-primary-border-finish: var(--color-pr500);

    --color-button-outline-primary-border-finish-disabled: var(--color-w005);

    --color-button-outline-primary-icon-container-icon: var(--color-pr050);

    --color-button-outline-primary-icon-container-icon-active: var(--color-pr700);

    --color-button-outline-primary-icon-container-icon-disabled: var(--color-pr700);

    --color-button-outline-primary-icon-container-icon-hover: var(--color-pr700);

    --color-button-outline-primary-text: var(--color-white);

    --color-button-outline-primary-text-active: var(--color-white);

    --color-button-outline-primary-text-disabled: var(--color-pr700);

    --color-button-outline-primary-text-hover: var(--color-white);

    --color-button-outline-secondary-background-active: var(--color-dark-grey-3);

    --color-button-outline-secondary-background-finish-active: var(--color-dark-grey-3);

    --color-button-outline-secondary-background-finish-hover: var(--color-dark-grey-5);

    --color-button-outline-secondary-background-hover: var(--color-dark-grey-5);

    --color-button-outline-secondary-background-start-active: var(--color-dark-grey-3);

    --color-button-outline-secondary-background-start-hover: var(--color-dark-grey-5);

    --color-button-outline-secondary-border: #4cd2a6;

    --color-button-outline-secondary-border-disabled: #4cd2a6;

    --color-button-outline-secondary-border-finish: #4cd2a6;

    --color-button-outline-secondary-border-finish-disabled: #4cd2a6;

    --color-button-outline-secondary-icon-container-icon: var(--color-mid-grey-5);

    --color-button-outline-secondary-icon-container-icon-active: var(--color-mid-grey-5);

    --color-button-outline-secondary-icon-container-icon-disabled: var(--color-mid-grey-5);

    --color-button-outline-secondary-icon-container-icon-hover: var(--color-mid-grey-5);

    --color-button-outline-secondary-text: var(--color-white);

    --color-button-outline-secondary-text-active: var(--color-white);

    --color-button-outline-secondary-text-disabled: var(--color-mid-grey-1);

    --color-button-outline-secondary-text-hover: var(--color-white);

    --color-button-outline-success-background-active: var(--color-su700);

    --color-button-outline-success-background-finish-active: var(--color-su700);

    --color-button-outline-success-background-finish-hover: var(--color-su500);

    --color-button-outline-success-background-hover: var(--color-su600);

    --color-button-outline-success-background-start-active: var(--color-su700);

    --color-button-outline-success-background-start-hover: var(--color-su500);

    --color-button-outline-success-border: var(--color-su600);

    --color-button-outline-success-border-disabled: var(--color-su800);

    --color-button-outline-success-border-finish: var(--color-su600);

    --color-button-outline-success-border-finish-disabled: var(--color-w005);

    --color-button-outline-success-icon-container-icon: var(--color-su050);

    --color-button-outline-success-icon-container-icon-active: var(--color-su050);

    --color-button-outline-success-icon-container-icon-disabled: var(--color-su050);

    --color-button-outline-success-icon-container-icon-hover: var(--color-su050);

    --color-button-outline-success-text: var(--color-white);

    --color-button-outline-success-text-active: #FFF;

    --color-button-outline-success-text-disabled: var(--color-su600);

    --color-button-outline-success-text-hover: #FFF;

    --color-button-outline-warning-background-active: var(--color-wa600);

    --color-button-outline-warning-background-finish-active: var(--color-wa600);

    --color-button-outline-warning-background-finish-hover: var(--color-wa300);

    --color-button-outline-warning-background-hover: var(--color-wa400);

    --color-button-outline-warning-background-start-active: var(--color-wa600);

    --color-button-outline-warning-background-start-hover: var(--color-wa300);

    --color-button-outline-warning-border: var(--color-wa400);

    --color-button-outline-warning-border-disabled: var(--color-wa900);

    --color-button-outline-warning-border-finish: var(--color-wa400);

    --color-button-outline-warning-border-finish-disabled: var(--color-w005);

    --color-button-outline-warning-icon-container-icon: var(--color-pr050);

    --color-button-outline-warning-icon-container-icon-active: var(--color-wa050);

    --color-button-outline-warning-icon-container-icon-disabled: var(--color-wa800);

    --color-button-outline-warning-icon-container-icon-hover: var(--color-wa050);

    --color-button-outline-warning-text: var(--color-white);

    --color-button-outline-warning-text-active: #FFF;

    --color-button-outline-warning-text-disabled: var(--color-wa800);

    --color-button-outline-warning-text-hover: #FFF;

    --color-button-primary: #000000;

    --color-button-store-basic-background: var(--color-dark-grey-2);

    --color-button-store-basic-background-active: var(--color-dark-grey-4);

    --color-button-store-basic-background-finish: var(--color-dark-grey-2);

    --color-button-store-basic-background-finish-active: var(--color-dark-grey-4);

    --color-button-store-basic-background-finish-hover: var(--color-dark-grey-3);

    --color-button-store-basic-background-hover: var(--color-dark-grey-3);

    --color-button-store-basic-background-start: var(--color-dark-grey-2);

    --color-button-store-basic-background-start-active: var(--color-dark-grey-4);

    --color-button-store-basic-background-start-hover: var(--color-dark-grey-3);

    --color-button-store-basic-description: var(--color-mid-grey-5);

    --color-button-store-basic-description-active: var(--color-mid-grey-5);

    --color-button-store-basic-description-hover: var(--color-mid-grey-5);

    --color-button-store-basic-icon: var(--color-white);

    --color-button-store-basic-icon-active: var(--color-white);

    --color-button-store-basic-icon-hover: var(--color-white);

    --color-button-store-basic-text: var(--color-white);

    --color-button-store-basic-text-active: var(--color-white);

    --color-button-store-basic-text-hover: var(--color-white);

    --color-button-store-inverse-background: var(--color-light-grey-4);

    --color-button-store-inverse-background-active: var(--color-light-grey-2);

    --color-button-store-inverse-background-finish: var(--color-light-grey-4);

    --color-button-store-inverse-background-finish-active: var(--color-light-grey-2);

    --color-button-store-inverse-background-finish-hover: var(--color-light-grey-3);

    --color-button-store-inverse-background-hover: var(--color-light-grey-3);

    --color-button-store-inverse-background-start: var(--color-light-grey-4);

    --color-button-store-inverse-background-start-active: var(--color-light-grey-2);

    --color-button-store-inverse-background-start-hover: var(--color-light-grey-3);

    --color-button-store-inverse-border: var(--color-b000);

    --color-button-store-inverse-border-active: var(--color-b000);

    --color-button-store-inverse-border-finish: var(--color-b000);

    --color-button-store-inverse-border-finish-active: var(--color-b000);

    --color-button-store-inverse-border-finish-hover: var(--color-b000);

    --color-button-store-inverse-border-hover: var(--color-b000);

    --color-button-store-inverse-description: var(--color-dark-grey-5);

    --color-button-store-inverse-description-active: var(--color-dark-grey-5);

    --color-button-store-inverse-description-hover: var(--color-dark-grey-5);

    --color-button-store-inverse-icon: var(--color-black);

    --color-button-store-inverse-icon-active: var(--color-black);

    --color-button-store-inverse-icon-hover: var(--color-black);

    --color-button-store-inverse-text: var(--color-black);

    --color-button-store-inverse-text-active: var(--color-black);

    --color-button-store-inverse-text-hover: var(--color-black);

    --color-c1: #00000024;

    --color-c2: #0000003D;

    --color-c3: #00000052;

    --color-calendar-background: var(--color-dark-grey-2);

    --color-calendar-background-finish: var(--color-dark-grey-2);

    --color-calendar-background-start: var(--color-dark-grey-2);

    --color-calendar-border: var(--color-dark-grey-2);

    --color-calendar-border-finish: var(--color-dark-grey-2);

    --color-calendar-day-active: var(--color-white);

    --color-calendar-day-active-background: var(--color-pr500);

    --color-calendar-day-active-background-active: var(--color-pr600);

    --color-calendar-day-active-background-disabled: var(--color-pr900);

    --color-calendar-day-active-background-focus: var(--color-pr400);

    --color-calendar-day-active-background-hover: var(--color-pr400);

    --color-calendar-day-active-disabled: var(--color-wa700);

    --color-calendar-day-active-focus: var(--color-pr200);

    --color-calendar-day-button-background-active: var(--color-dark-grey-3);

    --color-calendar-day-button-background-finish-active: var(--color-dark-grey-3);

    --color-calendar-day-button-background-finish-focus: var(--color-dark-grey-4);

    --color-calendar-day-button-background-finish-hover: var(--color-dark-grey-4);

    --color-calendar-day-button-background-focus: var(--color-dark-grey-4);

    --color-calendar-day-button-background-hover: var(--color-dark-grey-4);

    --color-calendar-day-button-background-start-active: var(--color-dark-grey-3);

    --color-calendar-day-button-background-start-focus: var(--color-dark-grey-4);

    --color-calendar-day-button-background-start-hover: var(--color-dark-grey-4);

    --color-calendar-day-button-border-finish-focus: var(--color-mid-grey-1);

    --color-calendar-day-button-border-focus: var(--color-mid-grey-1);

    --color-calendar-day-button-checked-background: var(--color-pr500);

    --color-calendar-day-button-checked-background-active: var(--color-pr600);

    --color-calendar-day-button-checked-background-disabled: var(--color-pr900);

    --color-calendar-day-button-checked-background-finish: var(--color-pr500);

    --color-calendar-day-button-checked-background-finish-active: var(--color-pr600);

    --color-calendar-day-button-checked-background-finish-disabled: var(--color-pr900);

    --color-calendar-day-button-checked-background-finish-focus: var(--color-pr400);

    --color-calendar-day-button-checked-background-finish-hover: var(--color-pr400);

    --color-calendar-day-button-checked-background-focus: var(--color-pr400);

    --color-calendar-day-button-checked-background-hover: var(--color-pr400);

    --color-calendar-day-button-checked-background-start: var(--color-pr500);

    --color-calendar-day-button-checked-background-start-active: var(--color-pr600);

    --color-calendar-day-button-checked-background-start-disabled: var(--color-pr900);

    --color-calendar-day-button-checked-background-start-focus: var(--color-pr400);

    --color-calendar-day-button-checked-background-start-hover: var(--color-pr400);

    --color-calendar-day-button-checked-border-finish-focus: var(--color-pr200);

    --color-calendar-day-button-checked-border-focus: var(--color-pr200);

    --color-calendar-day-button-checked-day-text: var(--color-white);

    --color-calendar-day-button-checked-day-text-active: var(--color-white);

    --color-calendar-day-button-checked-day-text-disabled: var(--color-pr700);

    --color-calendar-day-button-checked-day-text-focus: var(--color-white);

    --color-calendar-day-button-checked-day-text-hover: var(--color-white);

    --color-calendar-day-button-checked-holiday-text: var(--color-white);

    --color-calendar-day-button-checked-holiday-text-active: var(--color-white);

    --color-calendar-day-button-checked-holiday-text-disabled: var(--color-pr700);

    --color-calendar-day-button-checked-holiday-text-focus: var(--color-white);

    --color-calendar-day-button-checked-holiday-text-hover: var(--color-white);

    --color-calendar-day-button-checked-today-dot-background: var(--color-white);

    --color-calendar-day-button-checked-today-dot-background-active: var(--color-white);

    --color-calendar-day-button-checked-today-dot-background-disabled: var(--color-pr700);

    --color-calendar-day-button-checked-today-dot-background-focus: var(--color-white);

    --color-calendar-day-button-checked-today-dot-background-hover: var(--color-white);

    --color-calendar-day-button-checked-today-text: var(--color-white);

    --color-calendar-day-button-checked-today-text-active: var(--color-white);

    --color-calendar-day-button-checked-today-text-disabled: var(--color-pr700);

    --color-calendar-day-button-checked-today-text-focus: var(--color-white);

    --color-calendar-day-button-checked-today-text-hover: var(--color-white);

    --color-calendar-day-button-day-text: var(--color-mid-grey-5);

    --color-calendar-day-button-day-text-active: var(--color-mid-grey-5);

    --color-calendar-day-button-day-text-disabled: var(--color-mid-grey-2);

    --color-calendar-day-button-day-text-focus: var(--color-mid-grey-5);

    --color-calendar-day-button-day-text-hover: var(--color-mid-grey-5);

    --color-calendar-day-button-holiday-text: var(--color-da500);

    --color-calendar-day-button-holiday-text-active: var(--color-da500);

    --color-calendar-day-button-holiday-text-disabled: var(--color-mid-grey-2);

    --color-calendar-day-button-holiday-text-focus: var(--color-da500);

    --color-calendar-day-button-holiday-text-hover: var(--color-da500);

    --color-calendar-day-button-today-border: var(--color-dark-grey-3);

    --color-calendar-day-button-today-border-disabled: var(--color-dark-grey-3);

    --color-calendar-day-button-today-border-finish: var(--color-dark-grey-3);

    --color-calendar-day-button-today-border-finish-disabled: var(--color-dark-grey-3);

    --color-calendar-day-button-today-dot-background: var(--color-pr400);

    --color-calendar-day-button-today-dot-background-active: var(--color-pr400);

    --color-calendar-day-button-today-dot-background-disabled: var(--color-mid-grey-2);

    --color-calendar-day-button-today-dot-background-focus: var(--color-pr400);

    --color-calendar-day-button-today-dot-background-hover: var(--color-pr400);

    --color-calendar-day-button-today-text: var(--color-pr400);

    --color-calendar-day-button-today-text-active: var(--color-pr400);

    --color-calendar-day-button-today-text-disabled: var(--color-mid-grey-2);

    --color-calendar-day-button-today-text-focus: var(--color-pr400);

    --color-calendar-day-button-today-text-hover: var(--color-pr400);

    --color-calendar-day-inactive: var(--color-mid-grey-5);

    --color-calendar-day-inactive-background-active: var(--color-dark-grey-3);

    --color-calendar-day-inactive-background-focus: var(--color-dark-grey-4);

    --color-calendar-day-inactive-background-hover: var(--color-dark-grey-4);

    --color-calendar-day-inactive-disabled: var(--color-mid-grey-2);

    --color-calendar-day-inactive-focus: var(--color-mid-grey-1);

    --color-calendar-day-inactive-focus-inner: var(--color-dark-grey-3);

    --color-calendar-day-inactive-holiday: var(--color-da500);

    --color-calendar-day-inactive-today: var(--color-pr400);

    --color-calendar-day-range-background: var(--color-dark-grey-3);

    --color-calendar-day-range-background-finish: var(--color-dark-grey-3);

    --color-calendar-day-range-background-start: var(--color-dark-grey-3);

    --color-calendar-range-background: var(--color-dark-grey-3);

    --color-calendar-surface-background: var(--color-dark-grey-2);

    --color-calendar-week-day-text: var(--color-mid-grey-2);

    --color-calendar-week-holiday-text: var(--color-da500);

    --color-card-game-card-background: var(--color-dark-grey-2);

    --color-card-game-card-base: var(--color-light-grey-4);

    --color-card-game-card-title: var(--color-white);

    --color-countdown-background: var(--color-w010);

    --color-countdown-background-finish: var(--color-w010);

    --color-countdown-background-start: var(--color-w010);

    --color-countdown-description: var(--color-w060);

    --color-countdown-divider-background: var(--color-w020);

    --color-countdown-text: var(--color-white);

    --color-counter-attention-background: var(--color-at400);

    --color-counter-attention-background-finish: var(--color-at400);

    --color-counter-attention-background-start: var(--color-at400);

    --color-counter-attention-border: var(--color-b000);

    --color-counter-attention-border-finish: var(--color-b000);

    --color-counter-attention-text: var(--color-black);

    --color-counter-danger-background: var(--color-da600);

    --color-counter-danger-background-finish: var(--color-da600);

    --color-counter-danger-background-start: var(--color-da600);

    --color-counter-danger-text: var(--color-white);

    --color-counter-dark-background: var(--color-dark-grey-0);

    --color-counter-dark-background-finish: var(--color-dark-grey-0);

    --color-counter-dark-background-start: var(--color-dark-grey-0);

    --color-counter-dark-border: var(--color-b000);

    --color-counter-dark-border-finish: var(--color-b000);

    --color-counter-dark-text: var(--color-white);

    --color-counter-info-background: var(--color-in400);

    --color-counter-info-background-finish: var(--color-in400);

    --color-counter-info-background-start: var(--color-in400);

    --color-counter-info-text: var(--color-white);

    --color-counter-light-background: var(--color-white);

    --color-counter-light-background-finish: var(--color-white);

    --color-counter-light-background-start: var(--color-white);

    --color-counter-light-text: var(--color-black);

    --color-counter-minor-background: var(--color-mi500);

    --color-counter-minor-background-finish: var(--color-mi500);

    --color-counter-minor-background-start: var(--color-mi500);

    --color-counter-minor-text: var(--color-white);

    --color-counter-primary-background: var(--color-pr500);

    --color-counter-primary-background-finish: var(--color-pr500);

    --color-counter-primary-background-start: var(--color-pr500);

    --color-counter-primary-text: var(--color-button-primary);

    --color-counter-secondary-background: #11825f;

    --color-counter-secondary-background-finish: #11825f;

    --color-counter-secondary-background-start: #11825f;

    --color-counter-secondary-text: #e2fff5;

    --color-counter-success-background: var(--color-su600);

    --color-counter-success-background-finish: var(--color-su600);

    --color-counter-success-background-start: var(--color-su600);

    --color-counter-success-text: var(--color-white);

    --color-counter-transparent-background: var(--color-w020);

    --color-counter-transparent-background-finish: var(--color-w020);

    --color-counter-transparent-background-start: var(--color-w020);

    --color-counter-transparent-text: var(--color-white);

    --color-counter-vip-background: linear-gradient(260deg, var(--color-counter-vip-background-start) 0%, var(--color-counter-vip-background-finish) 100%);

    --color-counter-vip-background-finish: #B48457;

    --color-counter-vip-background-start: #FFEA81;

    --color-counter-vip-text: var(--color-black);

    --color-counter-warning-background: var(--color-wa400);

    --color-counter-warning-background-finish: var(--color-wa400);

    --color-counter-warning-background-start: var(--color-wa400);

    --color-counter-warning-text: var(--color-white);

    --color-da050: #FFE0E0;

    --color-da100: #FFC1C1;

    --color-da200: #FFA2A2;

    --color-da300: #FF8282;

    --color-da400: #FF6363;

    --color-da500: #FF4444;

    --color-da600: #FF0E0E;

    --color-da700: #D70000;

    --color-da800: #A20000;

    --color-da900: #6C0000;

    --color-dark-grey-0: #101114;

    --color-dark-grey-1: #1e1f23;

    --color-dark-grey-2: #141518;

    --color-dark-grey-3: #19ffac;

    --color-dark-grey-4: #2c2d32;

    --color-dark-grey-5: #5C1E85;

    --color-dgz000: #060E2A00;

    --color-dgz002: #00000005;

    --color-dgz005: #0000000D;

    --color-dgz010: #0000001A;

    --color-dgz020: #00000033;

    --color-dgz030: #0000004D;

    --color-dgz040: #00000066;

    --color-dgz050: #00000080;

    --color-dgz060: #00000099;

    --color-dgz070: #000000B3;

    --color-dgz080: #000000CC;

    --color-dgz090: #000000E6;

    --color-dot: var(--color-white);

    --color-dot-background: #FFFFFF4D;

    --color-dot-background-inverse: #0000004D;

    --color-dot-inverse: var(--color-dark-grey-3);

    --color-dropdown-basic-background: var(--color-dark-grey-2);

    --color-dropdown-basic-background-finish: var(--color-dark-grey-2);

    --color-dropdown-basic-background-start: var(--color-dark-grey-2);

    --color-dropdown-basic-divider-background: var(--color-dark-grey-3);

    --color-dropdown-basic-divider-descrition: var(--color-mid-grey-2);

    --color-dropdown-basic-row-background-active: var(--color-dark-grey-5);

    --color-dropdown-basic-row-background-finish-active: var(--color-dark-grey-5);

    --color-dropdown-basic-row-background-finish-hover: var(--color-dark-grey-3);

    --color-dropdown-basic-row-background-finish-primary: var(--color-pr500);

    --color-dropdown-basic-row-background-hover: var(--color-dark-grey-3);

    --color-dropdown-basic-row-background-primary: var(--color-pr500);

    --color-dropdown-basic-row-background-start-active: var(--color-dark-grey-5);

    --color-dropdown-basic-row-background-start-hover: var(--color-dark-grey-3);

    --color-dropdown-basic-row-background-start-primary: var(--color-pr500);

    --color-dropdown-basic-row-description: var(--color-w070);

    --color-dropdown-basic-row-description-active: var(--color-w070);

    --color-dropdown-basic-row-description-hover: var(--color-w070);

    --color-dropdown-basic-row-description-primary: var(--color-button-primary);

    --color-dropdown-basic-row-icon-container-icon: var(--color-white);

    --color-dropdown-basic-row-icon-container-icon-active: var(--color-white);

    --color-dropdown-basic-row-icon-container-icon-hover: var(--color-white);

    --color-dropdown-basic-row-icon-container-icon-primary: var(--color-button-primary);

    --color-dropdown-basic-row-text: var(--color-white);

    --color-dropdown-basic-row-text-active: var(--color-white);

    --color-dropdown-basic-row-text-hover: var(--color-white);

    --color-dropdown-basic-row-text-primary: var(--color-button-primary);

    --color-dropdown-basic-tail-background: var(--color-dark-grey-2);

    --color-dropdown-inverse-background: var(--color-light-grey-4);

    --color-dropdown-inverse-background-finish: var(--color-light-grey-4);

    --color-dropdown-inverse-background-start: var(--color-light-grey-4);

    --color-dropdown-inverse-border: var(--color-b000);

    --color-dropdown-inverse-border-finish: var(--color-b000);

    --color-dropdown-inverse-divider-background: var(--color-light-grey-3);

    --color-dropdown-inverse-divider-descrition: var(--color-mid-grey-3);

    --color-dropdown-inverse-row-background-active: var(--color-light-grey-1);

    --color-dropdown-inverse-row-background-finish-active: var(--color-light-grey-1);

    --color-dropdown-inverse-row-background-finish-hover: var(--color-light-grey-3);

    --color-dropdown-inverse-row-background-finish-primary: var(--color-pr500);

    --color-dropdown-inverse-row-background-hover: var(--color-light-grey-3);

    --color-dropdown-inverse-row-background-primary: var(--color-pr500);

    --color-dropdown-inverse-row-background-start-active: var(--color-light-grey-1);

    --color-dropdown-inverse-row-background-start-hover: var(--color-light-grey-3);

    --color-dropdown-inverse-row-background-start-primary: var(--color-pr500);

    --color-dropdown-inverse-row-description: var(--color-b070);

    --color-dropdown-inverse-row-description-active: var(--color-b070);

    --color-dropdown-inverse-row-description-hover: var(--color-b070);

    --color-dropdown-inverse-row-description-primary: var(--color-b070);

    --color-dropdown-inverse-row-icon-container-background: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-active: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-finish: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-finish-active: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-finish-hover: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-finish-primary: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-hover: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-primary: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-start: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-start-active: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-start-hover: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-background-start-primary: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border-active: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border-finish: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border-finish-active: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border-finish-hover: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border-finish-primary: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border-hover: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-border-primary: var(--color-b000);

    --color-dropdown-inverse-row-icon-container-icon: var(--color-black);

    --color-dropdown-inverse-row-icon-container-icon-active: var(--color-black);

    --color-dropdown-inverse-row-icon-container-icon-hover: var(--color-black);

    --color-dropdown-inverse-row-icon-container-icon-primary: var(--color-black);

    --color-dropdown-inverse-row-text: var(--color-black);

    --color-dropdown-inverse-row-text-active: var(--color-black);

    --color-dropdown-inverse-row-text-hover: var(--color-black);

    --color-dropdown-inverse-row-text-primary: var(--color-black);

    --color-dropdown-inverse-tail-background: var(--color-light-grey-4);

    --color-field-basic-description: var(--color-mid-grey-5);

    --color-field-basic-description-error: var(--color-da500);

    --color-field-basic-icon: var(--color-mid-grey-5);

    --color-field-basic-label: var(--color-white);

    --color-field-inverse-description: var(--color-dark-grey-5);

    --color-field-inverse-description-error: var(--color-da500);

    --color-field-inverse-icon: var(--color-dark-grey-5);

    --color-field-inverse-label: var(--color-black);

    --color-footer-contact-icon: var(--color-pr500);

    --color-footer-description: var(--color-mid-grey-2);

    --color-footer-divider-background: var(--color-dark-grey-1);

    --color-footer-divider-background-finish: var(--color-dark-grey-1);

    --color-footer-divider-background-start: var(--color-dark-grey-1);

    --color-footer-inverse-background-finish: var(--color-b000);

    --color-footer-inverse-background-start: var(--color-b000);

    --color-footer-inverse-border-finish: var(--color-b000);

    --color-footer-inverse-border-start: var(--color-b000);

    --color-footer-inverse-contact-icon: var(--color-pr500);

    --color-footer-inverse-description: var(--color-mid-grey-3);

    --color-footer-inverse-divider-background-finish: var(--color-light-grey-5);

    --color-footer-inverse-divider-background-start: var(--color-light-grey-5);

    --color-footer-inverse-link-text: var(--color-pr400);

    --color-footer-inverse-logo-icon: var(--color-dark-grey-5);

    --color-footer-inverse-menu-text: var(--color-dark-grey-5);

    --color-footer-inverse-menu-text-hover: var(--color-dark-grey-3);

    --color-footer-inverse-payment-card-background-finish: var(--color-b000);

    --color-footer-inverse-payment-card-background-start: var(--color-b000);

    --color-footer-inverse-payment-card-border-finish: var(--color-b000);

    --color-footer-inverse-payment-card-border-start: var(--color-b000);

    --color-footer-inverse-payment-card-icon: var(--color-light-grey-1);

    --color-footer-inverse-payment-container-background-finish: var(--color-light-grey-5);

    --color-footer-inverse-payment-container-background-start: var(--color-light-grey-5);

    --color-footer-inverse-payment-container-border-finish: var(--color-b000);

    --color-footer-inverse-payment-container-border-start: var(--color-b000);

    --color-footer-inverse-ssl-icon: var(--color-b070);

    --color-footer-inverse-text: var(--color-dark-grey-5);

    --color-footer-inverse-title: var(--color-dark-grey-3);

    --color-footer-link-text: var(--color-pr400);

    --color-footer-logo-icon: var(--color-mid-grey-5);

    --color-footer-menu-text: var(--color-mid-grey-5);

    --color-footer-menu-text-hover: var(--color-light-grey-3);

    --color-footer-payment-card-icon: var(--color-dark-grey-5);

    --color-footer-payment-container-background: var(--color-dark-grey-1);

    --color-footer-payment-container-background-finish: var(--color-dark-grey-1);

    --color-footer-payment-container-background-start: var(--color-dark-grey-1);

    --color-footer-ssl-icon: var(--color-w070);

    --color-footer-text: var(--color-mid-grey-5);

    --color-footer-title: var(--color-light-grey-3);

    --color-game-card-background: var(--color-dark-grey-2);

    --color-game-card-background-finish: var(--color-dark-grey-2);

    --color-game-card-background-start: var(--color-dark-grey-2);

    --color-game-card-footer-0-background: linear-gradient(180deg, var(--color-dgz000) 0%, var(--color-dark-grey-1) 100%);

    --color-game-card-footer-0-background-finish: var(--color-dark-grey-1);

    --color-game-card-footer-0-background-start: var(--color-dgz000);

    --color-game-card-footer-1-background: linear-gradient(180deg, var(--color-1-background-start) 0%, var(--color-pr700) 100%);

    --color-game-card-footer-1-background-finish: var(--color-pr700);

    --color-game-card-footer-2-background: linear-gradient(180deg, var(--color-2-background-start) 0%, var(--color-da800) 100%);

    --color-game-card-footer-2-background-finish: var(--color-da800);

    --color-game-card-footer-3-background: linear-gradient(180deg, var(--color-3-background-start) 0%, var(--color-in700) 100%);

    --color-game-card-footer-3-background-finish: var(--color-in700);

    --color-game-card-footer-4-background: linear-gradient(180deg, var(--color-4-background-start) 0%, var(--color-4-background-finish) 100%);

    --color-game-card-footer-5-background: linear-gradient(180deg, var(--color-5-background-start) 0%, var(--color-su800) 100%);

    --color-game-card-footer-5-background-finish: var(--color-su800);

    --color-game-card-footer-6-background: linear-gradient(180deg, var(--color-6-background-start) 0%, var(--color-mi700) 100%);

    --color-game-card-footer-6-background-finish: var(--color-mi700);

    --color-game-card-footer-7-background: linear-gradient(84deg, #a8884c 0%, #f3dc9c 100%);

    --color-game-card-header-icon: var(--color-w080);

    --color-game-card-header-icon-hover: var(--color-white);

    --color-game-card-inverse-background-finish: var(--color-light-grey-4);

    --color-game-card-inverse-background-start: var(--color-light-grey-4);

    --color-game-card-inverse-border-finish: var(--color-b000);

    --color-game-card-inverse-border-start: var(--color-b000);

    --color-game-card-like-icon: var(--color-light-grey-5);

    --color-game-card-like-icon-active: var(--color-white);

    --color-game-card-like-icon-active-finish: var(--color-white);

    --color-game-card-like-icon-active-start: var(--color-white);

    --color-game-card-like-icon-checked: var(--color-white);

    --color-game-card-like-icon-checked-finish: var(--color-white);

    --color-game-card-like-icon-checked-start: var(--color-white);

    --color-game-card-like-icon-finish: var(--color-light-grey-5);

    --color-game-card-like-icon-hover: var(--color-white);

    --color-game-card-like-icon-hover-finish: var(--color-white);

    --color-game-card-like-icon-hover-start: var(--color-white);

    --color-game-card-like-icon-start: var(--color-light-grey-5);

    --color-game-card-like-text: var(--color-white);

    --color-game-card-like-text-active: var(--color-white);

    --color-game-card-like-text-checked: var(--color-white);

    --color-game-card-like-text-hover: var(--color-white);

    --color-game-card-line: linear-gradient(90deg, #17292400 0%, #f4d691 48%, #17292400 100%);

    --color-game-card-live-background-finish: var(--color-white);

    --color-game-card-live-background-start: var(--color-white);

    --color-game-card-live-backlground: var(--color-white);

    --color-game-card-live-bet-background-base: var(--color-dark-grey-1);

    --color-game-card-live-bet-background-black: var(--color-black);

    --color-game-card-live-bet-background-green: var(--color-su500);

    --color-game-card-live-bet-background-red: var(--color-da500);

    --color-game-card-live-bet-text: var(--color-white);

    --color-game-card-live-dot-background: var(--color-white);

    --color-game-card-live-seat-icon: var(--color-mid-grey-5);

    --color-game-card-live-seat-text: var(--color-mid-grey-2);

    --color-game-card-overlay-background: var(--color-b010);

    --color-game-card-overlay-background-finish: var(--color-b010);

    --color-game-card-overlay-background-start: var(--color-b010);

    --color-game-card-overlay-icon: var(--color-w070);

    --color-game-card-title-0-background: var(--color-dark-grey-1);

    --color-game-card-title-0-background-finish: var(--color-dark-grey-1);

    --color-game-card-title-0-background-start: var(--color-dark-grey-1);

    --color-game-card-title-1-background: var(--color-at500);

    --color-game-card-title-1-background-finish: var(--color-at500);

    --color-game-card-title-1-background-start: var(--color-at500);

    --color-game-card-title-2-background: var(--color-wa400);

    --color-game-card-title-2-background-finish: var(--color-wa400);

    --color-game-card-title-2-background-start: var(--color-wa400);

    --color-game-card-title-3-background: var(--color-in400);

    --color-game-card-title-3-background-finish: var(--color-in400);

    --color-game-card-title-3-background-start: var(--color-in400);

    --color-game-card-title-4-background: var(--color-da600);

    --color-game-card-title-4-background-finish: var(--color-da600);

    --color-game-card-title-4-background-start: var(--color-da600);

    --color-game-card-title-5-background: var(--color-su600);

    --color-game-card-title-5-background-finish: var(--color-su600);

    --color-game-card-title-5-background-start: var(--color-su600);

    --color-game-card-title-6-background: var(--color-mi500);

    --color-game-card-title-6-background-finish: var(--color-mi500);

    --color-game-card-title-6-background-start: var(--color-mi500);

    --color-game-card-title-game-text-finish: var(--color-white);

    --color-game-card-title-game-text-start: var(--color-white);

    --color-game-card-title-provider-text: var(--color-w070);

    --color-game-card-title-text: var(--color-white);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-bonus-money-step-1: var(--color-su900);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-bonus-money-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-daily-cashback-step-1: var(--color-mi700);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-daily-cashback-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-rakeback-step-1: var(--color-in700);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-rakeback-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-real-money-step-1: var(--color-dark-grey-2);

    --color-gradient-activity-hub-bonus-hub-balance-dropdown-real-money-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-bonuses-bonus-round-step-1: var(--color-mi700);

    --color-gradient-activity-hub-bonus-hub-bonuses-bonus-round-step-2: var(--color-in800);

    --color-gradient-activity-hub-bonus-hub-bonuses-casino-bonus-step-1: var(--color-mi600);

    --color-gradient-activity-hub-bonus-hub-bonuses-casino-bonus-step-2: var(--color-in800);

    --color-gradient-activity-hub-bonus-hub-bonuses-deposit-bonus-step-1: var(--color-mi600);

    --color-gradient-activity-hub-bonus-hub-bonuses-deposit-bonus-step-2: var(--color-in800);

    --color-gradient-activity-hub-bonus-hub-bonuses-free-spins-step-1: var(--color-mi700);

    --color-gradient-activity-hub-bonus-hub-bonuses-free-spins-step-2: var(--color-in800);

    --color-gradient-activity-hub-bonus-hub-bonuses-sport-bonus-step-1: var(--color-in300);

    --color-gradient-activity-hub-bonus-hub-bonuses-sport-bonus-step-2: var(--color-in700);

    --color-gradient-activity-hub-bonus-hub-bonuses-sport-deposit-bonus-step-1: var(--color-in300);

    --color-gradient-activity-hub-bonus-hub-bonuses-sport-deposit-bonus-step-2: var(--color-in700);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-bronze-step-1: var(--color-pr700);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-bronze-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-gold-step-1: var(--color-su700);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-gold-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-instant-wheel-step-1: var(--color-da900);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-instant-wheel-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-lock-wheel-step-1: var(--color-dark-grey-3);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-lock-wheel-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-platinum-step-1: var(--color-mi600);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-platinum-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-silver-step-1: var(--color-in600);

    --color-gradient-activity-hub-bonus-hub-loyalty-wheels-silver-step-2: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-master-step-1: var(--color-in600);

    --color-gradient-activity-hub-bonus-hub-master-step-2: var(--color-in800);

    --color-gradient-activity-hub-bonus-hub-master-step-3: var(--color-dark-grey-1);

    --color-gradient-activity-hub-bonus-hub-special-step-1: var(--color-at500);

    --color-gradient-activity-hub-bonus-hub-special-step-2: var(--color-wa800);

    --color-gradient-activity-hub-bonus-hub-special-step-3: var(--color-wa900);

    --color-gradient-activity-hub-bonus-hub-special-step-4: var(--color-dark-grey-1);

    --color-gradient-activity-hub-calendar-grid-everyday-off-grid-everyday-off: var(--color-dark-grey-1);

    --color-gradient-activity-hub-calendar-grid-everyday-on-step-1: var(--color-in400);

    --color-gradient-activity-hub-calendar-grid-everyday-on-step-2: var(--color-in600);

    --color-gradient-activity-hub-calendar-grid-everyday-on-step-3: var(--color-in700);

    --color-gradient-activity-hub-calendar-grid-everyday-on-step-4: var(--color-in800);

    --color-gradient-activity-hub-calendar-grid-special-off-step-1: var(--color-at800);

    --color-gradient-activity-hub-calendar-grid-special-off-step-2: var(--color-wa900);

    --color-gradient-activity-hub-calendar-grid-special-on-step-1: var(--color-at400);

    --color-gradient-activity-hub-calendar-grid-special-on-step-2: var(--color-wa700);

    --color-gradient-activity-hub-calendar-grid-special-on-step-3: var(--color-wa800);

    --color-gradient-activity-hub-today-card-everyday-step-1: var(--color-in300);

    --color-gradient-activity-hub-today-card-everyday-step-2: var(--color-in400);

    --color-gradient-activity-hub-today-card-everyday-step-3: var(--color-in600);

    --color-gradient-activity-hub-today-card-everyday-step-4: var(--color-in800);

    --color-gradient-activity-hub-today-card-special-day-step-1: var(--color-at100);

    --color-gradient-activity-hub-today-card-special-day-step-2: var(--color-at400);

    --color-gradient-activity-hub-today-card-special-day-step-3: var(--color-wa700);

    --color-gradient-activity-hub-today-card-special-day-step-4: var(--color-wa800);

    --color-gradient-bonus-selector-hover-step-1: #0E7FB5;

    --color-gradient-bonus-selector-hover-step-2: #0F71AD;

    --color-gradient-bonus-selector-hover-step-3: #1061A3;

    --color-gradient-bonus-selector-hover-step-4: #124793;

    --color-gradient-bonus-selector-step-1: #085F8A;

    --color-gradient-bonus-selector-step-2: #09507E;

    --color-gradient-bonus-selector-step-3: #0A4475;

    --color-gradient-bonus-selector-step-4: #0B3064;

    --color-gradient-gr-1-step-1: #501091;

    --color-gradient-gr-1-step-2: #3831A4;

    --color-gradient-gr-1-step-3: #213A96;

    --color-gradient-gr-2-step-1: #0D6EFD;

    --color-gradient-gr-2-step-2: #3C0DFD;

    --color-gradient-gr-2-step-3: #840DFD;

    --color-gradient-gr-2-step-4: #CC0DFD;

    --color-gradient-gr-2-step-5: #FD0DE6;

    --color-gradient-gr-3-step-1: #1B2A64;

    --color-gradient-gr-3-step-2: #291F61;

    --color-gradient-gr-3-step-3: #5C2559;

    --color-gradient-gr-3-step-4: #772D4F;

    --color-gradient-gr-3-step-5: #5A2062;

    --color-gradient-gr-4-step-1: #FFEA81;

    --color-gradient-gr-4-step-2: #80462D;

    --color-gradient-gr-5-step-1: #80462D;

    --color-gradient-gr-5-step-2: #FFEA81;

    --color-gradient-gr-5-step-3: #80462D;

    --color-gradient-gr-6-step-1: #0238E1;

    --color-gradient-gr-6-step-2: #6F02FF;

    --color-gradient-vip-3-step-1: var(--color-wa400);

    --color-gradient-vip-3-step-2: #FBE67B;

    --color-gradient-vip-3-step-3: #FCFBE7;

    --color-gradient-vip-3-step-4: var(--color-at300);

    --color-gradient-vip-3-step-5: var(--color-wa500);

    --color-gradient-vip-step-1: var(--color-at100);

    --color-gradient-vip-step-2: var(--color-dgz000);

    --color-green: #43A047;

    --color-icon: #54596DCC;

    --color-icon-hover: #353B52CC;

    --color-in050: #D7DEF9;

    --color-in100: #AEBEF3;

    --color-in200: #869DEE;

    --color-in300: #5D7CE8;

    --color-in400: #355BE2;

    --color-in500: #1D44CC;

    --color-in600: #1736A3;

    --color-in700: #12297B;

    --color-in800: #0C1B52;

    --color-in900: #060E2A;

    --color-input-basic-background: var(--color-dark-grey-0);

    --color-input-basic-background-disabled: var(--color-dark-grey-0);

    --color-input-basic-background-finish: var(--color-dark-grey-0);

    --color-input-basic-background-finish-disabled: var(--color-dark-grey-0);

    --color-input-basic-background-finish-focus: var(--color-dgz070);

    --color-input-basic-background-finish-hover: var(--color-dgz070);

    --color-input-basic-background-focus: var(--color-dgz070);

    --color-input-basic-background-hover: var(--color-dgz070);

    --color-input-basic-background-start: var(--color-dark-grey-0);

    --color-input-basic-background-start-disabled: var(--color-dark-grey-0);

    --color-input-basic-background-start-focus: var(--color-dgz070);

    --color-input-basic-background-start-hover: var(--color-dgz070);

    --color-input-basic-border: var(--color-w010);

    --color-input-basic-border-disabled: var(--color-w010);

    --color-input-basic-border-finish: var(--color-w010);

    --color-input-basic-border-finish-disabled: var(--color-w010);

    --color-input-basic-border-finish-focus: var(--color-dark-grey-5);

    --color-input-basic-border-finish-hover: var(--color-w010);

    --color-input-basic-border-focus: var(--color-dark-grey-5);

    --color-input-basic-border-hover: var(--color-w010);

    --color-input-basic-button-icon-icon: var(--color-mid-grey-5);

    --color-input-basic-button-icon-icon-disabled: var(--color-mid-grey-2);

    --color-input-basic-button-icon-icon-focus: var(--color-mid-grey-5);

    --color-input-basic-button-icon-icon-hover: var(--color-mid-grey-5);

    --color-input-basic-error-background: var(--color-dark-grey-0);

    --color-input-basic-error-background-finish: var(--color-dark-grey-0);

    --color-input-basic-error-background-finish-focus: var(--color-dgz070);

    --color-input-basic-error-background-finish-hover: var(--color-dgz070);

    --color-input-basic-error-background-focus: var(--color-dgz070);

    --color-input-basic-error-background-hover: var(--color-dgz070);

    --color-input-basic-error-background-start: var(--color-dark-grey-0);

    --color-input-basic-error-background-start-focus: var(--color-dgz070);

    --color-input-basic-error-background-start-hover: var(--color-dgz070);

    --color-input-basic-error-border: var(--color-da600);

    --color-input-basic-error-border-finish: var(--color-da600);

    --color-input-basic-error-border-finish-focus: var(--color-da600);

    --color-input-basic-error-border-finish-hover: var(--color-da600);

    --color-input-basic-error-border-focus: var(--color-da600);

    --color-input-basic-error-border-hover: var(--color-da600);

    --color-input-basic-error-button-icon-icon: var(--color-mid-grey-5);

    --color-input-basic-error-button-icon-icon-focus: var(--color-mid-grey-5);

    --color-input-basic-error-button-icon-icon-hover: var(--color-mid-grey-5);

    --color-input-basic-error-icon-container-icon: var(--color-mid-grey-5);

    --color-input-basic-error-icon-container-icon-focus: var(--color-white);

    --color-input-basic-error-icon-container-icon-hover: var(--color-white);

    --color-input-basic-error-label: var(--color-mid-grey-5);

    --color-input-basic-error-label-focus: var(--color-mid-grey-5);

    --color-input-basic-error-label-hover: var(--color-mid-grey-5);

    --color-input-basic-error-outside-border-finish-focus: #FF0E0E99;

    --color-input-basic-error-outside-border-focus: #FF0E0E99;

    --color-input-basic-error-placeholder: var(--color-mid-grey-2);

    --color-input-basic-error-placeholder-focus: var(--color-mid-grey-2);

    --color-input-basic-error-placeholder-hover: var(--color-mid-grey-2);

    --color-input-basic-error-value: var(--color-white);

    --color-input-basic-error-value-focus: var(--color-white);

    --color-input-basic-error-value-hover: var(--color-white);

    --color-input-basic-icon-container-icon: var(--color-mid-grey-5);

    --color-input-basic-icon-container-icon-disabled: var(--color-mid-grey-2);

    --color-input-basic-icon-container-icon-focus: var(--color-white);

    --color-input-basic-icon-container-icon-hover: var(--color-white);

    --color-input-basic-label: var(--color-mid-grey-5);

    --color-input-basic-label-disabled: var(--color-mid-grey-2);

    --color-input-basic-label-focus: var(--color-mid-grey-5);

    --color-input-basic-label-hover: var(--color-mid-grey-5);

    --color-input-basic-outside-border-finish-focus: #54596D99;

    --color-input-basic-outside-border-focus: #54596D99;

    --color-input-basic-placeholder: var(--color-mid-grey-2);

    --color-input-basic-placeholder-disabled: var(--color-mid-grey-2);

    --color-input-basic-placeholder-focus: var(--color-mid-grey-2);

    --color-input-basic-placeholder-hover: var(--color-mid-grey-2);

    --color-input-basic-success-background: var(--color-dark-grey-0);

    --color-input-basic-success-background-finish: var(--color-dark-grey-0);

    --color-input-basic-success-background-finish-focus: var(--color-dgz070);

    --color-input-basic-success-background-finish-hover: var(--color-dgz070);

    --color-input-basic-success-background-focus: var(--color-dgz070);

    --color-input-basic-success-background-hover: var(--color-dgz070);

    --color-input-basic-success-background-start: var(--color-dark-grey-0);

    --color-input-basic-success-background-start-focus: var(--color-dgz070);

    --color-input-basic-success-background-start-hover: var(--color-dgz070);

    --color-input-basic-success-border: var(--color-su400);

    --color-input-basic-success-border-finish: var(--color-su400);

    --color-input-basic-success-border-finish-focus: var(--color-su400);

    --color-input-basic-success-border-finish-hover: var(--color-su400);

    --color-input-basic-success-border-focus: var(--color-su400);

    --color-input-basic-success-border-hover: var(--color-su400);

    --color-input-basic-success-button-icon-icon: var(--color-mid-grey-5);

    --color-input-basic-success-button-icon-icon-focus: var(--color-mid-grey-5);

    --color-input-basic-success-button-icon-icon-hover: var(--color-mid-grey-5);

    --color-input-basic-success-icon-container-icon: var(--color-mid-grey-5);

    --color-input-basic-success-icon-container-icon-focus: var(--color-white);

    --color-input-basic-success-icon-container-icon-hover: var(--color-white);

    --color-input-basic-success-label: var(--color-mid-grey-5);

    --color-input-basic-success-label-focus: var(--color-mid-grey-5);

    --color-input-basic-success-label-hover: var(--color-mid-grey-5);

    --color-input-basic-success-outside-border-finish-focus: #09E41F99;

    --color-input-basic-success-outside-border-focus: #09E41F99;

    --color-input-basic-success-placeholder: var(--color-mid-grey-2);

    --color-input-basic-success-placeholder-focus: var(--color-mid-grey-2);

    --color-input-basic-success-placeholder-hover: var(--color-mid-grey-2);

    --color-input-basic-success-value: var(--color-white);

    --color-input-basic-success-value-focus: var(--color-white);

    --color-input-basic-success-value-hover: var(--color-white);

    --color-input-basic-value: var(--color-white);

    --color-input-basic-value-disabled: var(--color-mid-grey-2);

    --color-input-basic-value-focus: var(--color-white);

    --color-input-basic-value-hover: var(--color-white);

    --color-input-dark-background: var(--color-dark-grey-0);

    --color-input-dark-background-disabled: var(--color-dark-grey-0);

    --color-input-dark-background-focus: var(--color-dgz070);

    --color-input-dark-background-hover: var(--color-dgz070);

    --color-input-dark-border: transparent;

    --color-input-dark-border-disabled: transparent;

    --color-input-dark-border-focus: transparent;

    --color-input-dark-border-hover: transparent;

    --color-input-dark-icon-container-icon: var(--color-mid-grey-5);

    --color-input-dark-icon-container-icon-disabled: var(--color-mid-grey-1);

    --color-input-dark-icon-container-icon-focus: var(--color-mid-grey-5);

    --color-input-dark-icon-container-icon-hover: var(--color-mid-grey-5);

    --color-input-dark-label: var(--color-mid-grey-5);

    --color-input-dark-label-disabled: var(--color-mid-grey-1);

    --color-input-dark-label-focus: var(--color-mid-grey-5);

    --color-input-dark-label-hover: var(--color-mid-grey-5);

    --color-input-dark-outside-border-focus: var(--color-dark-grey-5);

    --color-input-dark-value: var(--color-light-grey-5);

    --color-input-dark-value-disabled: var(--color-mid-grey-3);

    --color-input-dark-value-focus: var(--color-light-grey-5);

    --color-input-dark-value-hover: var(--color-light-grey-5);

    --color-input-external-text-basic-description: var(--color-mid-grey-5);

    --color-input-external-text-basic-error-message: var(--color-da500);

    --color-input-external-text-basic-label: var(--color-white);

    --color-input-external-text-basic-label-required: var(--color-da500);

    --color-input-external-text-inverse-description: var(--color-dark-grey-5);

    --color-input-external-text-inverse-error-message: var(--color-da500);

    --color-input-external-text-inverse-label: var(--color-black);

    --color-input-external-text-inverse-label-required: var(--color-da500);

    --color-input-inverse-background: var(--color-white);

    --color-input-inverse-background-disabled: var(--color-white);

    --color-input-inverse-background-finish: var(--color-white);

    --color-input-inverse-background-finish-disabled: var(--color-white);

    --color-input-inverse-background-finish-focus: var(--color-w070);

    --color-input-inverse-background-finish-hover: var(--color-w070);

    --color-input-inverse-background-focus: var(--color-w070);

    --color-input-inverse-background-hover: var(--color-w070);

    --color-input-inverse-background-start: var(--color-white);

    --color-input-inverse-background-start-disabled: var(--color-white);

    --color-input-inverse-background-start-focus: var(--color-w070);

    --color-input-inverse-background-start-hover: var(--color-w070);

    --color-input-inverse-border: var(--color-b010);

    --color-input-inverse-border-disabled: var(--color-b010);

    --color-input-inverse-border-finish: var(--color-b010);

    --color-input-inverse-border-finish-disabled: var(--color-b010);

    --color-input-inverse-border-finish-focus: var(--color-light-grey-1);

    --color-input-inverse-border-finish-hover: var(--color-b010);

    --color-input-inverse-border-focus: var(--color-light-grey-1);

    --color-input-inverse-border-hover: var(--color-b010);

    --color-input-inverse-button-icon-background: var(--color-b000);

    --color-input-inverse-button-icon-background-disabled: var(--color-b000);

    --color-input-inverse-button-icon-background-finish: var(--color-b000);

    --color-input-inverse-button-icon-background-finish-disabled: var(--color-b000);

    --color-input-inverse-button-icon-background-finish-focus: var(--color-b000);

    --color-input-inverse-button-icon-background-finish-hover: var(--color-b000);

    --color-input-inverse-button-icon-background-focus: var(--color-b000);

    --color-input-inverse-button-icon-background-hover: var(--color-b000);

    --color-input-inverse-button-icon-background-start: var(--color-b000);

    --color-input-inverse-button-icon-background-start-disabled: var(--color-b000);

    --color-input-inverse-button-icon-background-start-focus: var(--color-b000);

    --color-input-inverse-button-icon-background-start-hover: var(--color-b000);

    --color-input-inverse-button-icon-border: var(--color-b000);

    --color-input-inverse-button-icon-border-disabled: var(--color-b000);

    --color-input-inverse-button-icon-border-finish: var(--color-b000);

    --color-input-inverse-button-icon-border-finish-disabled: var(--color-b000);

    --color-input-inverse-button-icon-border-finish-focus: var(--color-b000);

    --color-input-inverse-button-icon-border-finish-hover: var(--color-b000);

    --color-input-inverse-button-icon-border-focus: var(--color-b000);

    --color-input-inverse-button-icon-border-hover: var(--color-b000);

    --color-input-inverse-button-icon-icon: var(--color-dark-grey-5);

    --color-input-inverse-button-icon-icon-disabled: var(--color-mid-grey-3);

    --color-input-inverse-button-icon-icon-focus: var(--color-dark-grey-5);

    --color-input-inverse-button-icon-icon-hover: var(--color-dark-grey-5);

    --color-input-inverse-error-background: var(--color-white);

    --color-input-inverse-error-background-finish: var(--color-white);

    --color-input-inverse-error-background-finish-focus: var(--color-w070);

    --color-input-inverse-error-background-finish-hover: var(--color-w070);

    --color-input-inverse-error-background-focus: var(--color-w070);

    --color-input-inverse-error-background-hover: var(--color-w070);

    --color-input-inverse-error-background-start: var(--color-white);

    --color-input-inverse-error-background-start-focus: var(--color-w070);

    --color-input-inverse-error-background-start-hover: var(--color-w070);

    --color-input-inverse-error-border: var(--color-da600);

    --color-input-inverse-error-border-finish: var(--color-da600);

    --color-input-inverse-error-border-finish-focus: var(--color-da600);

    --color-input-inverse-error-border-finish-hover: var(--color-da600);

    --color-input-inverse-error-border-focus: var(--color-da600);

    --color-input-inverse-error-border-hover: var(--color-da600);

    --color-input-inverse-error-button-icon-background: var(--color-b000);

    --color-input-inverse-error-button-icon-background-finish: var(--color-b000);

    --color-input-inverse-error-button-icon-background-finish-focus: var(--color-b000);

    --color-input-inverse-error-button-icon-background-finish-hover: var(--color-b000);

    --color-input-inverse-error-button-icon-background-focus: var(--color-b000);

    --color-input-inverse-error-button-icon-background-hover: var(--color-b000);

    --color-input-inverse-error-button-icon-background-start: var(--color-b000);

    --color-input-inverse-error-button-icon-background-start-focus: var(--color-b000);

    --color-input-inverse-error-button-icon-background-start-hover: var(--color-b000);

    --color-input-inverse-error-button-icon-border: var(--color-b000);

    --color-input-inverse-error-button-icon-border-finish: var(--color-b000);

    --color-input-inverse-error-button-icon-border-finish-focus: var(--color-b000);

    --color-input-inverse-error-button-icon-border-finish-hover: var(--color-b000);

    --color-input-inverse-error-button-icon-border-focus: var(--color-b000);

    --color-input-inverse-error-button-icon-border-hover: var(--color-b000);

    --color-input-inverse-error-button-icon-icon: var(--color-dark-grey-5);

    --color-input-inverse-error-button-icon-icon-focus: var(--color-dark-grey-5);

    --color-input-inverse-error-button-icon-icon-hover: var(--color-dark-grey-5);

    --color-input-inverse-error-icon-container-background: var(--color-b000);

    --color-input-inverse-error-icon-container-background-finish: var(--color-b000);

    --color-input-inverse-error-icon-container-background-finish-focus: var(--color-b000);

    --color-input-inverse-error-icon-container-background-finish-hover: var(--color-b000);

    --color-input-inverse-error-icon-container-background-focus: var(--color-b000);

    --color-input-inverse-error-icon-container-background-hover: var(--color-b000);

    --color-input-inverse-error-icon-container-background-start: var(--color-b000);

    --color-input-inverse-error-icon-container-background-start-focus: var(--color-b000);

    --color-input-inverse-error-icon-container-background-start-hover: var(--color-b000);

    --color-input-inverse-error-icon-container-border: var(--color-b000);

    --color-input-inverse-error-icon-container-border-focus: var(--color-b000);

    --color-input-inverse-error-icon-container-border-hover: var(--color-b000);

    --color-input-inverse-error-icon-container-icon: var(--color-dark-grey-5);

    --color-input-inverse-error-icon-container-icon-focus: var(--color-black);

    --color-input-inverse-error-icon-container-icon-hover: var(--color-black);

    --color-input-inverse-error-label: var(--color-dark-grey-5);

    --color-input-inverse-error-label-focus: var(--color-dark-grey-5);

    --color-input-inverse-error-label-hover: var(--color-dark-grey-5);

    --color-input-inverse-error-outside-border-finish-focus: #FF0E0E99;

    --color-input-inverse-error-outside-border-focus: #FF0E0E99;

    --color-input-inverse-error-placeholder: var(--color-mid-grey-3);

    --color-input-inverse-error-placeholder-focus: var(--color-mid-grey-3);

    --color-input-inverse-error-placeholder-hover: var(--color-mid-grey-3);

    --color-input-inverse-error-value: var(--color-black);

    --color-input-inverse-error-value-focus: var(--color-black);

    --color-input-inverse-error-value-hover: var(--color-black);

    --color-input-inverse-icon-container-background: var(--color-b000);

    --color-input-inverse-icon-container-background-disabled: var(--color-b000);

    --color-input-inverse-icon-container-background-finish: var(--color-b000);

    --color-input-inverse-icon-container-background-finish-disabled: var(--color-b000);

    --color-input-inverse-icon-container-background-finish-focus: var(--color-b000);

    --color-input-inverse-icon-container-background-finish-hover: var(--color-b000);

    --color-input-inverse-icon-container-background-focus: var(--color-b000);

    --color-input-inverse-icon-container-background-hover: var(--color-b000);

    --color-input-inverse-icon-container-background-start: var(--color-b000);

    --color-input-inverse-icon-container-background-start-disabled: var(--color-b000);

    --color-input-inverse-icon-container-background-start-focus: var(--color-b000);

    --color-input-inverse-icon-container-background-start-hover: var(--color-b000);

    --color-input-inverse-icon-container-border: var(--color-b000);

    --color-input-inverse-icon-container-border-disabled: var(--color-b000);

    --color-input-inverse-icon-container-border-focus: var(--color-b000);

    --color-input-inverse-icon-container-border-hover: var(--color-b000);

    --color-input-inverse-icon-container-icon: var(--color-dark-grey-5);

    --color-input-inverse-icon-container-icon-disabled: var(--color-mid-grey-3);

    --color-input-inverse-icon-container-icon-focus: var(--color-black);

    --color-input-inverse-icon-container-icon-hover: var(--color-black);

    --color-input-inverse-label: var(--color-dark-grey-5);

    --color-input-inverse-label-disabled: var(--color-mid-grey-3);

    --color-input-inverse-label-focus: var(--color-dark-grey-5);

    --color-input-inverse-label-hover: var(--color-dark-grey-5);

    --color-input-inverse-outside-border-finish-focus: #B1B4BC99;

    --color-input-inverse-outside-border-focus: #B1B4BC99;

    --color-input-inverse-placeholder: var(--color-mid-grey-3);

    --color-input-inverse-placeholder-disabled: var(--color-mid-grey-3);

    --color-input-inverse-placeholder-focus: var(--color-mid-grey-3);

    --color-input-inverse-placeholder-hover: var(--color-mid-grey-3);

    --color-input-inverse-success-background: var(--color-white);

    --color-input-inverse-success-background-finish: var(--color-white);

    --color-input-inverse-success-background-finish-focus: var(--color-w070);

    --color-input-inverse-success-background-finish-hover: var(--color-w070);

    --color-input-inverse-success-background-focus: var(--color-w070);

    --color-input-inverse-success-background-hover: var(--color-w070);

    --color-input-inverse-success-background-start: var(--color-white);

    --color-input-inverse-success-background-start-focus: var(--color-w070);

    --color-input-inverse-success-background-start-hover: var(--color-w070);

    --color-input-inverse-success-border: var(--color-su400);

    --color-input-inverse-success-border-finish: var(--color-su400);

    --color-input-inverse-success-border-finish-focus: var(--color-su400);

    --color-input-inverse-success-border-finish-hover: var(--color-su400);

    --color-input-inverse-success-border-focus: var(--color-su400);

    --color-input-inverse-success-border-hover: var(--color-su400);

    --color-input-inverse-success-button-icon-background: var(--color-b000);

    --color-input-inverse-success-button-icon-background-finish: var(--color-b000);

    --color-input-inverse-success-button-icon-background-finish-focus: var(--color-b000);

    --color-input-inverse-success-button-icon-background-finish-hover: var(--color-b000);

    --color-input-inverse-success-button-icon-background-focus: var(--color-b000);

    --color-input-inverse-success-button-icon-background-hover: var(--color-b000);

    --color-input-inverse-success-button-icon-background-start: var(--color-b000);

    --color-input-inverse-success-button-icon-background-start-focus: var(--color-b000);

    --color-input-inverse-success-button-icon-background-start-hover: var(--color-b000);

    --color-input-inverse-success-button-icon-border: var(--color-b000);

    --color-input-inverse-success-button-icon-border-finish: var(--color-b000);

    --color-input-inverse-success-button-icon-border-finish-focus: var(--color-b000);

    --color-input-inverse-success-button-icon-border-finish-hover: var(--color-b000);

    --color-input-inverse-success-button-icon-border-focus: var(--color-b000);

    --color-input-inverse-success-button-icon-border-hover: var(--color-b000);

    --color-input-inverse-success-button-icon-icon: var(--color-dark-grey-5);

    --color-input-inverse-success-button-icon-icon-focus: var(--color-dark-grey-5);

    --color-input-inverse-success-button-icon-icon-hover: var(--color-dark-grey-5);

    --color-input-inverse-success-icon-container-background: var(--color-b000);

    --color-input-inverse-success-icon-container-background-finish: var(--color-b000);

    --color-input-inverse-success-icon-container-background-finish-focus: var(--color-b000);

    --color-input-inverse-success-icon-container-background-finish-hover: var(--color-b000);

    --color-input-inverse-success-icon-container-background-focus: var(--color-b000);

    --color-input-inverse-success-icon-container-background-hover: var(--color-b000);

    --color-input-inverse-success-icon-container-background-start: var(--color-b000);

    --color-input-inverse-success-icon-container-background-start-focus: var(--color-b000);

    --color-input-inverse-success-icon-container-background-start-hover: var(--color-b000);

    --color-input-inverse-success-icon-container-border: var(--color-b000);

    --color-input-inverse-success-icon-container-border-focus: var(--color-b000);

    --color-input-inverse-success-icon-container-border-hover: var(--color-b000);

    --color-input-inverse-success-icon-container-icon: var(--color-dark-grey-5);

    --color-input-inverse-success-icon-container-icon-focus: var(--color-black);

    --color-input-inverse-success-icon-container-icon-hover: var(--color-black);

    --color-input-inverse-success-label: var(--color-dark-grey-5);

    --color-input-inverse-success-label-focus: var(--color-dark-grey-5);

    --color-input-inverse-success-label-hover: var(--color-dark-grey-5);

    --color-input-inverse-success-outside-border-finish-focus: #09E41F99;

    --color-input-inverse-success-outside-border-focus: #09E41F99;

    --color-input-inverse-success-placeholder: var(--color-mid-grey-3);

    --color-input-inverse-success-placeholder-focus: var(--color-mid-grey-3);

    --color-input-inverse-success-placeholder-hover: var(--color-mid-grey-3);

    --color-input-inverse-success-value: var(--color-black);

    --color-input-inverse-success-value-focus: var(--color-black);

    --color-input-inverse-success-value-hover: var(--color-black);

    --color-input-inverse-value: var(--color-black);

    --color-input-inverse-value-disabled: var(--color-mid-grey-3);

    --color-input-inverse-value-focus: var(--color-black);

    --color-input-inverse-value-hover: var(--color-black);

    --color-level-1: #BDCCD1;

    --color-level-3: #4FF7F7;

    --color-light-grey-1: #c3f7e4;

    --color-light-grey-2: #D3B3E8;

    --color-light-grey-3: #dce0e6;

    --color-light-grey-4: #F6E9FF;

    --color-light-grey-5: #FBF5FF;

    --color-link: #D0D2D7;

    --color-link-active: var(--color-pr600);

    --color-link-default: var(--color-light-grey-3);

    --color-link-primary: var(--color-pr400);

    --color-link-secondary: var(--color-mid-grey-2);

    --color-menu: var(--color-light-grey-1);

    --color-menu-active: var(--color-white);

    --color-menu-background: var(--color-dark-grey-0);

    --color-menu-base: var(--color-light-grey-3);

    --color-menu-bottom-background: var(--color-dark-grey-1);

    --color-menu-bottom-background-finish: var(--color-dark-grey-1);

    --color-menu-bottom-background-start: var(--color-dark-grey-1);

    --color-menu-bottom-border: var(--color-dark-grey-2);

    --color-menu-bottom-border-finish: var(--color-dark-grey-2);

    --color-menu-bottom-inverse-background-finish: var(--color-light-grey-5);

    --color-menu-bottom-inverse-background-start: var(--color-light-grey-5);

    --color-menu-bottom-inverse-border-finish: var(--color-light-grey-4);

    --color-menu-bottom-inverse-border-start: var(--color-light-grey-4);

    --color-menu-horizontal: var(--color-mid-grey-5);

    --color-menu-horizontal-active: var(--color-pr500);

    --color-menu-horizontal-active-inverse: var(--color-pr500);

    --color-menu-horizontal-hover: var(--color-white);

    --color-menu-horizontal-hover-inverse: var(--color-dark-grey-0);

    --color-menu-horizontal-inverse: var(--color-dark-grey-5);

    --color-menu-hover: var(--color-light-grey-4);

    --color-menu-item: var(--color-light-grey-4);

    --color-menu-item-active: var(--color-light-grey-5);

    --color-menu-item-background: var(--color-dark-grey-5);

    --color-menu-item-background-hover: #FFFFFF1A;

    --color-menu-item-check: #FF2684;

    --color-menu-primary: #2740F5;

    --color-menu-surface: var(--color-dark-grey-2);

    --color-menu-surface-active: var(--color-dark-grey-3);

    --color-menu-surface-border: var(--color-dark-grey-3);

    --color-menu-surface-border-focus: var(--color-dark-grey-2);

    --color-menu-surface-bottom: var(--color-dark-grey-1);

    --color-menu-surface-focus: var(--color-dark-grey-1);

    --color-menu-surface-hover: var(--color-dark-grey-4);

    --color-menu-surface-primary: var(--color-pr500);

    --color-menu-title: var(--color-white);

    --color-menu-top-amount-background: var(--color-dark-grey-1);

    --color-menu-top-amount-background-finish: var(--color-dark-grey-1);

    --color-menu-top-amount-background-finish-focus: var(--color-dark-grey-1);

    --color-menu-top-amount-background-finish-hover: var(--color-dark-grey-2);

    --color-menu-top-amount-background-focus: var(--color-dark-grey-1);

    --color-menu-top-amount-background-hover: var(--color-dark-grey-2);

    --color-menu-top-amount-background-start: var(--color-dark-grey-1);

    --color-menu-top-amount-background-start-focus: var(--color-dark-grey-1);

    --color-menu-top-amount-background-start-hover: var(--color-dark-grey-2);

    --color-menu-top-amount-outside-border-finish-focus: var(--color-dark-grey-2);

    --color-menu-top-amount-outside-border-focus: var(--color-dark-grey-2);

    --color-menu-top-amount-text: var(--color-white);

    --color-menu-top-amount-text-focus: var(--color-white);

    --color-menu-top-amount-text-hover: var(--color-white);

    --color-menu-top-background: var(--color-dark-grey-0);

    --color-menu-top-background-finish: var(--color-dark-grey-0);

    --color-menu-top-background-start: var(--color-dark-grey-0);

    --color-menu-top-icon: var(--color-mid-grey-5);

    --color-menu-top-icon-hover: #2e3c36;

    --color-menu-top-inverse-amount-background-finish: var(--color-light-grey-5);

    --color-menu-top-inverse-amount-background-finish-focus: var(--color-light-grey-5);

    --color-menu-top-inverse-amount-background-finish-hover: var(--color-light-grey-4);

    --color-menu-top-inverse-amount-background-start: var(--color-light-grey-5);

    --color-menu-top-inverse-amount-background-start-focus: var(--color-light-grey-5);

    --color-menu-top-inverse-amount-background-start-hover: var(--color-light-grey-4);

    --color-menu-top-inverse-amount-border-finish: var(--color-b000);

    --color-menu-top-inverse-amount-border-finish-focus: var(--color-b000);

    --color-menu-top-inverse-amount-border-finish-hover: var(--color-b000);

    --color-menu-top-inverse-amount-border-start: var(--color-b000);

    --color-menu-top-inverse-amount-border-start-focus: var(--color-b000);

    --color-menu-top-inverse-amount-border-start-hover: var(--color-b000);

    --color-menu-top-inverse-amount-outside-border-finish-focus: var(--color-light-grey-4);

    --color-menu-top-inverse-amount-outside-border-start-focus: var(--color-light-grey-4);

    --color-menu-top-inverse-amount-text: var(--color-black);

    --color-menu-top-inverse-amount-text-focus: var(--color-black);

    --color-menu-top-inverse-amount-text-hover: var(--color-black);

    --color-menu-top-inverse-background-finish: var(--color-white);

    --color-menu-top-inverse-background-start: var(--color-white);

    --color-menu-top-inverse-border-finish: var(--color-b000);

    --color-menu-top-inverse-border-start: var(--color-b000);

    --color-menu-vertical: var(--color-light-grey-3);

    --color-menu-vertical-background: var(--color-dark-grey-2);

    --color-menu-vertical-background-hover: var(--color-dark-grey-3);

    --color-menu-vertical-background-hover-inverse: var(--color-light-grey-3);

    --color-menu-vertical-background-inverse: var(--color-light-grey-4);

    --color-menu-vertical-hover: var(--color-white);

    --color-menu-vertical-hover-inverse: var(--color-dark-grey-0);

    --color-menu-vertical-inverse: var(--color-dark-grey-3);

    --color-message-attention-background: var(--color-dark-grey-2);

    --color-message-attention-background-finish: var(--color-dark-grey-2);

    --color-message-attention-background-start: var(--color-dark-grey-2);

    --color-message-attention-description: var(--color-light-grey-3);

    --color-message-attention-icon-container-icon: var(--color-at300);

    --color-message-attention-text: var(--color-at300);

    --color-message-basic-background: var(--color-dark-grey-2);

    --color-message-basic-background-finish: var(--color-dark-grey-2);

    --color-message-basic-background-start: var(--color-dark-grey-2);

    --color-message-basic-description: var(--color-light-grey-3);

    --color-message-basic-icon-container-icon: var(--color-w080);

    --color-message-basic-text: var(--color-white);

    --color-message-danger-background: var(--color-dark-grey-2);

    --color-message-danger-background-finish: var(--color-dark-grey-2);

    --color-message-danger-background-start: var(--color-dark-grey-2);

    --color-message-danger-description: var(--color-light-grey-3);

    --color-message-danger-icon-container-icon: var(--color-da500);

    --color-message-danger-text: var(--color-da500);

    --color-message-info-background: var(--color-dark-grey-2);

    --color-message-info-background-finish: var(--color-dark-grey-2);

    --color-message-info-background-start: var(--color-dark-grey-2);

    --color-message-info-description: var(--color-light-grey-3);

    --color-message-info-icon-container-icon: var(--color-in200);

    --color-message-info-text: var(--color-in200);

    --color-message-line-attention-background-finish: var(--color-dark-grey-5);

    --color-message-line-attention-background-start: var(--color-dark-grey-5);

    --color-message-line-attention-description: var(--color-light-grey-3);

    --color-message-line-attention-icon-container-icon: #FFFFFFCC;

    --color-message-line-attention-text: var(--color-at300);

    --color-message-line-basic-background: var(--color-dark-grey-5);

    --color-message-line-basic-background-finish: var(--color-dark-grey-5);

    --color-message-line-basic-background-start: var(--color-dark-grey-5);

    --color-message-line-basic-description: var(--color-light-grey-3);

    --color-message-line-basic-icon-container-icon: var(--color-w080);

    --color-message-line-basic-text: var(--color-white);

    --color-message-line-cookies-background: var(--color-dark-grey-2);

    --color-message-line-cookies-background-finish: var(--color-dark-grey-2);

    --color-message-line-cookies-background-start: var(--color-dark-grey-2);

    --color-message-line-cookies-link-text: var(--color-pr400);

    --color-message-line-cookies-text: var(--color-light-grey-3);

    --color-message-line-danger-background: var(--color-da800);

    --color-message-line-danger-background-finish: var(--color-da800);

    --color-message-line-danger-background-start: var(--color-da800);

    --color-message-line-danger-description: var(--color-light-grey-3);

    --color-message-line-danger-icon-container-icon: var(--color-w080);

    --color-message-line-danger-text: var(--color-white);

    --color-message-line-info-background: var(--color-in500);

    --color-message-line-info-background-finish: var(--color-in500);

    --color-message-line-info-background-start: var(--color-in500);

    --color-message-line-info-description: var(--color-light-grey-3);

    --color-message-line-info-icon-container-icon: var(--color-w080);

    --color-message-line-info-text: var(--color-white);

    --color-message-primary-background: var(--color-dark-grey-2);

    --color-message-primary-background-finish: var(--color-dark-grey-2);

    --color-message-primary-background-start: var(--color-dark-grey-2);

    --color-message-primary-description: var(--color-light-grey-3);

    --color-message-primary-icon-container-icon: var(--color-pr400);

    --color-message-primary-text: var(--color-pr400);

    --color-message-success-background: var(--color-dark-grey-2);

    --color-message-success-background-finish: var(--color-dark-grey-2);

    --color-message-success-background-start: var(--color-dark-grey-2);

    --color-message-success-description: var(--color-light-grey-3);

    --color-message-success-icon-container-icon: var(--color-su400);

    --color-message-success-text: var(--color-su400);

    --color-message-warning-background: var(--color-dark-grey-2);

    --color-message-warning-background-finish: var(--color-dark-grey-2);

    --color-message-warning-background-start: var(--color-dark-grey-2);

    --color-message-warning-description: var(--color-light-grey-3);

    --color-message-warning-icon-container-icon: var(--color-wa400);

    --color-message-warning-text: var(--color-wa400);

    --color-mi050: #F3D4FF;

    --color-mi100: #E7AAFF;

    --color-mi200: #DC80FF;

    --color-mi300: #D055FF;

    --color-mi400: #B800FF;

    --color-mi500: #9900D5;

    --color-mi600: #7B00AA;

    --color-mi700: #5C0080;

    --color-mi800: #3D0055;

    --color-mi900: #1F002B;

    --color-mid-grey-1: #6E3792;

    --color-mid-grey-2: #c3f7e4;

    --color-mid-grey-3: #dce0e6;

    --color-mid-grey-4: #c3f7e4;

    --color-mid-grey-5: #98f7cf;

    --color-modal-background: var(--color-dark-grey-1);

    --color-modal-background-finish: var(--color-dark-grey-1);

    --color-modal-background-start: var(--color-dark-grey-1);

    --color-modal-description: var(--color-mid-grey-5);

    --color-modal-divider-background: var(--color-dark-grey-2);

    --color-modal-divider-background-finish: var(--color-dark-grey-2);

    --color-modal-divider-background-start: var(--color-dark-grey-2);

    --color-modal-status-attention-icon: var(--color-at300);

    --color-modal-status-background: var(--color-dark-grey-2);

    --color-modal-status-background-finish: var(--color-dark-grey-2);

    --color-modal-status-background-start: var(--color-dark-grey-2);

    --color-modal-status-basic-icon: var(--color-light-grey-3);

    --color-modal-status-danger-icon: var(--color-da500);

    --color-modal-status-info-icon: var(--color-in200);

    --color-modal-status-primary-icon: var(--color-pr400);

    --color-modal-status-susses-icon: var(--color-su400);

    --color-modal-status-warning-icon: var(--color-wa400);

    --color-modal-text: var(--color-white);

    --color-navbar-icon-container-icon: var(--color-mid-grey-5);

    --color-navbar-icon-container-icon-active: var(--color-pr400);

    --color-navbar-icon-container-icon-hover: var(--color-white);

    --color-navbar-inverse-icon-container-background-finish: var(--color-b000);

    --color-navbar-inverse-icon-container-background-finish-active: var(--color-b000);

    --color-navbar-inverse-icon-container-background-finish-hover: var(--color-b000);

    --color-navbar-inverse-icon-container-background-start: var(--color-b000);

    --color-navbar-inverse-icon-container-background-start-active: var(--color-b000);

    --color-navbar-inverse-icon-container-background-start-hover: var(--color-b000);

    --color-navbar-inverse-icon-container-border-finish: var(--color-b000);

    --color-navbar-inverse-icon-container-border-finish-active: var(--color-b000);

    --color-navbar-inverse-icon-container-border-finish-hover: var(--color-b000);

    --color-navbar-inverse-icon-container-border-start: var(--color-b000);

    --color-navbar-inverse-icon-container-border-start-active: var(--color-b000);

    --color-navbar-inverse-icon-container-border-start-hover: var(--color-b000);

    --color-navbar-inverse-icon-container-icon: var(--color-dark-grey-5);

    --color-navbar-inverse-icon-container-icon-active: var(--color-pr400);

    --color-navbar-inverse-icon-container-icon-hover: var(--color-black);

    --color-navbar-inverse-text: var(--color-dark-grey-5);

    --color-navbar-inverse-text-active: var(--color-pr400);

    --color-navbar-inverse-text-hover: var(--color-black);

    --color-navbar-text: var(--color-mid-grey-5);

    --color-navbar-text-active: var(--color-pr400);

    --color-navbar-text-hover: var(--color-white);

    --color-notification-background: var(--color-dark-grey-2);

    --color-notification-background-finish: var(--color-dark-grey-2);

    --color-notification-background-start: var(--color-dark-grey-2);

    --color-notification-button-icon: var(--color-light-grey-3);

    --color-notification-description: var(--color-light-grey-3);

    --color-notification-fade-background: linear-gradient(360deg, var(--color-dark-grey-2) 0%, var(--color-notification-fade-background-finish) 100%);

    --color-notification-fade-background-finish: #252C4500;

    --color-notification-fade-background-start: var(--color-dark-grey-2);

    --color-notification-icon-container-attention-icon: var(--color-at300);

    --color-notification-icon-container-basic-icon: var(--color-light-grey-3);

    --color-notification-icon-container-error-icon: var(--color-da500);

    --color-notification-icon-container-success-icon: var(--color-su400);

    --color-notification-text: var(--color-white);

    --color-notification-timer-background: var(--color-dark-grey-3);

    --color-notification-timer-background-finish: var(--color-dark-grey-3);

    --color-notification-timer-background-start: var(--color-dark-grey-3);

    --color-notification-timer-text: var(--color-w070);

    --color-pagination-active: var(--color-white);

    --color-pagination-active-background: var(--color-pr500);

    --color-pagination-active-background-active: var(--color-pr600);

    --color-pagination-active-background-disabled: var(--color-pr900);

    --color-pagination-active-background-hover: var(--color-pr400);

    --color-pagination-active-disabled: var(--color-wa700);

    --color-pagination-base: var(--color-light-grey-3);

    --color-pagination-base-background: var(--color-dark-grey-3);

    --color-pagination-base-background-active: var(--color-dark-grey-2);

    --color-pagination-base-background-disabled: var(--color-dark-grey-2);

    --color-pagination-base-background-hover: var(--color-dark-grey-4);

    --color-pagination-base-disabled: var(--color-mid-grey-2);

    --color-pagination-button-background: var(--color-dark-grey-4);

    --color-pagination-button-background-active: var(--color-dark-grey-3);

    --color-pagination-button-background-disabled: var(--color-w005);

    --color-pagination-button-background-finish: var(--color-dark-grey-4);

    --color-pagination-button-background-finish-active: var(--color-dark-grey-3);

    --color-pagination-button-background-finish-disabled: var(--color-w005);

    --color-pagination-button-background-finish-hover: var(--color-dark-grey-5);

    --color-pagination-button-background-hover: var(--color-dark-grey-5);

    --color-pagination-button-background-start: var(--color-dark-grey-4);

    --color-pagination-button-background-start-active: var(--color-dark-grey-3);

    --color-pagination-button-background-start-disabled: var(--color-w005);

    --color-pagination-button-background-start-hover: var(--color-dark-grey-5);

    --color-pagination-button-border-finish: unset;

    --color-pagination-button-checked-background: var(--color-pr500);

    --color-pagination-button-checked-background-active: var(--color-pr600);

    --color-pagination-button-checked-background-disabled: var(--color-w005);

    --color-pagination-button-checked-background-finish: var(--color-pr500);

    --color-pagination-button-checked-background-finish-active: var(--color-pr600);

    --color-pagination-button-checked-background-finish-disabled: var(--color-w005);

    --color-pagination-button-checked-background-finish-hover: var(--color-pr400);

    --color-pagination-button-checked-background-hover: var(--color-pr400);

    --color-pagination-button-checked-background-start: var(--color-pr500);

    --color-pagination-button-checked-background-start-active: var(--color-pr600);

    --color-pagination-button-checked-background-start-disabled: var(--color-w005);

    --color-pagination-button-checked-background-start-hover: var(--color-pr400);

    --color-pagination-button-checked-text: var(--color-white);

    --color-pagination-button-checked-text-active: var(--color-white);

    --color-pagination-button-checked-text-disabled: var(--color-mid-grey-2);

    --color-pagination-button-checked-text-hover: var(--color-white);

    --color-pagination-button-icon: var(--color-light-grey-3);

    --color-pagination-button-icon-active: var(--color-light-grey-3);

    --color-pagination-button-icon-disabled: var(--color-mid-grey-2);

    --color-pagination-button-icon-hover: var(--color-light-grey-3);

    --color-pagination-button-text: var(--color-light-grey-3);

    --color-pagination-button-text-active: var(--color-light-grey-3);

    --color-pagination-button-text-disabled: var(--color-mid-grey-2);

    --color-pagination-button-text-hover: var(--color-light-grey-3);

    --color-pink: #F50057;

    --color-platinum: #4FF7F7;

    --color-pr050: #EFFFDA;

    --color-pr100: #E3FFBC;

    --color-pr200: #D7FAA6;

    --color-pr300: #C7F387;

    --color-pr400: #B6EE67;

    --color-pr500: #40e6b1;

    --color-pr600: #85C42B;

    --color-pr700: #6B9E23;

    --color-pr800: #52791B;

    --color-pr900: #395412;

    --color-preloader-attention-icon: var(--color-at400);

    --color-preloader-base: var(--color-mid-grey-5);

    --color-preloader-danger-icon: var(--color-da600);

    --color-preloader-dark-icon: var(--color-dark-grey-0);

    --color-preloader-info-icon: var(--color-in400);

    --color-preloader-light-icon: var(--color-white);

    --color-preloader-minor-icon: var(--color-mi500);

    --color-preloader-primary: var(--color-pr500);

    --color-preloader-primary-icon: var(--color-pr500);

    --color-preloader-secondary-icon: var(--color-mid-grey-5);

    --color-preloader-success-icon: var(--color-su600);

    --color-preloader-warning-icon: var(--color-wa400);

    --color-progress: var(--color-white);

    --color-progress-background: var(--color-dark-grey-3);

    --color-progress-bar-attention-background: var(--color-dark-grey-3);

    --color-progress-bar-attention-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-attention-background-start: var(--color-dark-grey-3);

    --color-progress-bar-attention-divider-background: var(--color-w020);

    --color-progress-bar-attention-progress-background: var(--color-at400);

    --color-progress-bar-attention-progress-background-finish: var(--color-at400);

    --color-progress-bar-attention-progress-background-start: var(--color-at400);

    --color-progress-bar-attention-text: var(--color-black);

    --color-progress-bar-danger-background: var(--color-dark-grey-3);

    --color-progress-bar-danger-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-danger-background-start: var(--color-dark-grey-3);

    --color-progress-bar-danger-divider-background: var(--color-w020);

    --color-progress-bar-danger-progress-background: var(--color-da600);

    --color-progress-bar-danger-progress-background-finish: var(--color-da600);

    --color-progress-bar-danger-progress-background-start: var(--color-da600);

    --color-progress-bar-danger-text: var(--color-white);

    --color-progress-bar-dark-background: var(--color-light-grey-3);

    --color-progress-bar-dark-background-finish: var(--color-light-grey-3);

    --color-progress-bar-dark-background-start: var(--color-light-grey-3);

    --color-progress-bar-dark-divider-background: var(--color-b020);

    --color-progress-bar-dark-progress-background: var(--color-dark-grey-0);

    --color-progress-bar-dark-progress-background-finish: var(--color-dark-grey-0);

    --color-progress-bar-dark-progress-background-start: var(--color-dark-grey-0);

    --color-progress-bar-dark-text: var(--color-white);

    --color-progress-bar-info-background: var(--color-dark-grey-3);

    --color-progress-bar-info-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-info-background-start: var(--color-dark-grey-3);

    --color-progress-bar-info-divider-background: var(--color-w020);

    --color-progress-bar-info-inverse-background-finish: var(--color-light-grey-3);

    --color-progress-bar-info-inverse-background-start: var(--color-light-grey-3);

    --color-progress-bar-info-inverse-divider-background: var(--color-b020);

    --color-progress-bar-info-inverse-progress-background-finish: var(--color-in400);

    --color-progress-bar-info-inverse-progress-background-start: var(--color-in400);

    --color-progress-bar-info-inverse-text: var(--color-white);

    --color-progress-bar-info-progress-background: var(--color-in400);

    --color-progress-bar-info-progress-background-finish: var(--color-in400);

    --color-progress-bar-info-progress-background-start: var(--color-in400);

    --color-progress-bar-info-text: var(--color-white);

    --color-progress-bar-light-background: var(--color-light-grey-3);

    --color-progress-bar-light-background-finish: var(--color-light-grey-3);

    --color-progress-bar-light-background-start: var(--color-light-grey-3);

    --color-progress-bar-light-divider-background: var(--color-b020);

    --color-progress-bar-light-progress-background: var(--color-white);

    --color-progress-bar-light-progress-background-finish: var(--color-white);

    --color-progress-bar-light-progress-background-start: var(--color-white);

    --color-progress-bar-light-text: var(--color-black);

    --color-progress-bar-minor-background: var(--color-dark-grey-3);

    --color-progress-bar-minor-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-minor-background-start: var(--color-dark-grey-3);

    --color-progress-bar-minor-divider-background: var(--color-w020);

    --color-progress-bar-minor-progress-background: var(--color-mi500);

    --color-progress-bar-minor-progress-background-finish: var(--color-mi500);

    --color-progress-bar-minor-progress-background-start: var(--color-mi500);

    --color-progress-bar-minor-text: var(--color-white);

    --color-progress-bar-primary-background: var(--color-dark-grey-3);

    --color-progress-bar-primary-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-primary-background-start: var(--color-dark-grey-3);

    --color-progress-bar-primary-divider-background: var(--color-w020);

    --color-progress-bar-primary-progress-background: var(--color-pr500);

    --color-progress-bar-primary-progress-background-finish: var(--color-pr500);

    --color-progress-bar-primary-progress-background-start: var(--color-pr500);

    --color-progress-bar-primary-text: var(--color-white);

    --color-progress-bar-secondary-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-secondary-background-r: var(--color-dark-grey-3);

    --color-progress-bar-secondary-background-start: var(--color-dark-grey-3);

    --color-progress-bar-secondary-divider-background: var(--color-w020);

    --color-progress-bar-secondary-progress-background: var(--color-mid-grey-1);

    --color-progress-bar-secondary-progress-background-finish: var(--color-mid-grey-1);

    --color-progress-bar-secondary-progress-background-start: var(--color-mid-grey-1);

    --color-progress-bar-secondary-text: var(--color-white);

    --color-progress-bar-success-background: var(--color-dark-grey-3);

    --color-progress-bar-success-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-success-background-start: var(--color-dark-grey-3);

    --color-progress-bar-success-divider-background: var(--color-w020);

    --color-progress-bar-success-progress-background: var(--color-su600);

    --color-progress-bar-success-progress-background-finish: var(--color-su600);

    --color-progress-bar-success-progress-background-start: var(--color-su600);

    --color-progress-bar-success-text: var(--color-white);

    --color-progress-bar-warning-background: var(--color-dark-grey-3);

    --color-progress-bar-warning-background-finish: var(--color-dark-grey-3);

    --color-progress-bar-warning-background-start: var(--color-dark-grey-3);

    --color-progress-bar-warning-divider-background: var(--color-w020);

    --color-progress-bar-warning-progress-background: var(--color-wa400);

    --color-progress-bar-warning-progress-background-finish: var(--color-wa400);

    --color-progress-bar-warning-progress-background-start: var(--color-wa400);

    --color-progress-bar-warning-text: var(--color-white);

    --color-progress-dark: var(--color-dark-grey-0);

    --color-progress-dots: #FFFFFF33;

    --color-progress-progress-attention: var(--color-at400);

    --color-progress-progress-danger: var(--color-da600);

    --color-progress-progress-info: var(--color-in400);

    --color-progress-progress-minor: var(--color-vi500);

    --color-progress-progress-primary: var(--color-pr500);

    --color-progress-progress-secondary: var(--color-mid-grey-1);

    --color-progress-progress-success: #07BE1A;

    --color-progress-progress-white: var(--color-white);

    --color-progress-round-attention-border: #F6DA244D;

    --color-progress-round-attention-border-finish: #F6DA244D;

    --color-progress-round-attention-progress-border: var(--color-at400);

    --color-progress-round-attention-progress-border-finish: var(--color-at400);

    --color-progress-round-danger-border: #FF0E0E4D;

    --color-progress-round-danger-border-finish: #FF0E0E4D;

    --color-progress-round-danger-progress-border: var(--color-da600);

    --color-progress-round-danger-progress-border-finish: var(--color-da600);

    --color-progress-round-dark-border: var(--color-dgz030);

    --color-progress-round-dark-border-finish: var(--color-dgz030);

    --color-progress-round-dark-progress-border: var(--color-dark-grey-0);

    --color-progress-round-dark-progress-border-finish: var(--color-dark-grey-0);

    --color-progress-round-info-border: #355BE24D;

    --color-progress-round-info-border-finish: #355BE24D;

    --color-progress-round-info-progress-border: var(--color-in400);

    --color-progress-round-info-progress-border-finish: var(--color-in400);

    --color-progress-round-light-border: var(--color-w030);

    --color-progress-round-light-progress-border: var(--color-white);

    --color-progress-round-minor-border: #9900D54D;

    --color-progress-round-minor-border-finish: #9900D54D;

    --color-progress-round-minor-progress-border: var(--color-mi500);

    --color-progress-round-minor-progress-border-finish: var(--color-mi500);

    --color-progress-round-primary-border: #E458094D;

    --color-progress-round-primary-border-finish: #E458094D;

    --color-progress-round-primary-progress-border: var(--color-pr500);

    --color-progress-round-primary-progress-border-finish: var(--color-pr500);

    --color-progress-round-secondary-border: #63687A4D;

    --color-progress-round-secondary-border-finish: #63687A4D;

    --color-progress-round-secondary-progress-border: var(--color-mid-grey-1);

    --color-progress-round-secondary-progress-border-finish: var(--color-mid-grey-1);

    --color-progress-round-success-border: #0698154D;

    --color-progress-round-success-border-finish: #0698154D;

    --color-progress-round-success-progress-border: var(--color-su600);

    --color-progress-round-success-progress-border-finish: var(--color-su600);

    --color-progress-round-warning-border: #E458094D;

    --color-progress-round-warning-border-finish: #E458094D;

    --color-progress-round-warning-progress-border: var(--color-wa400);

    --color-progress-round-warning-progress-border-finish: var(--color-wa400);

    --color-purple: #D500F9;

    --color-rating-bronze: var(--color-pr400);

    --color-rating-gold: var(--color-at400);

    --color-rating-level-0: var(--color-pr400);

    --color-rating-level-1: #BDCCD1;

    --color-rating-level-2: var(--color-at400);

    --color-rating-level-3: #4FF7F7;

    --color-red: #F44336;

    --color-scrollbar-background: var(--color-w020);

    --color-selector-basic-background: var(--color-dark-grey-5);

    --color-selector-basic-background-disabled: var(--color-dark-grey-3);

    --color-selector-basic-background-finish: var(--color-dark-grey-5);

    --color-selector-basic-background-finish-disabled: var(--color-dark-grey-3);

    --color-selector-basic-background-finish-focus: var(--color-mid-grey-1);

    --color-selector-basic-background-finish-hover: var(--color-mid-grey-1);

    --color-selector-basic-background-focus: var(--color-mid-grey-1);

    --color-selector-basic-background-hover: var(--color-mid-grey-1);

    --color-selector-basic-background-start: var(--color-dark-grey-5);

    --color-selector-basic-background-start-disabled: var(--color-dark-grey-3);

    --color-selector-basic-background-start-focus: var(--color-mid-grey-1);

    --color-selector-basic-background-start-hover: var(--color-mid-grey-1);

    --color-selector-basic-border: var(--color-dark-grey-5);

    --color-selector-basic-border-disabled: var(--color-dark-grey-3);

    --color-selector-basic-border-finish: var(--color-dark-grey-5);

    --color-selector-basic-border-finish-disabled: var(--color-dark-grey-3);

    --color-selector-basic-border-finish-focus: var(--color-mid-grey-1);

    --color-selector-basic-border-finish-hover: var(--color-mid-grey-1);

    --color-selector-basic-border-focus: var(--color-mid-grey-1);

    --color-selector-basic-border-hover: var(--color-mid-grey-1);

    --color-selector-basic-checked-background: var(--color-dark-grey-5);

    --color-selector-basic-checked-background-disabled: var(--color-dark-grey-3);

    --color-selector-basic-checked-background-finish: var(--color-dark-grey-5);

    --color-selector-basic-checked-background-finish-disabled: var(--color-dark-grey-3);

    --color-selector-basic-checked-background-finish-focus: var(--color-mid-grey-1);

    --color-selector-basic-checked-background-finish-hover: var(--color-mid-grey-1);

    --color-selector-basic-checked-background-focus: var(--color-mid-grey-1);

    --color-selector-basic-checked-background-hover: var(--color-mid-grey-1);

    --color-selector-basic-checked-background-start: var(--color-dark-grey-5);

    --color-selector-basic-checked-background-start-disabled: var(--color-dark-grey-3);

    --color-selector-basic-checked-background-start-focus: var(--color-mid-grey-1);

    --color-selector-basic-checked-background-start-hover: var(--color-mid-grey-1);

    --color-selector-basic-checked-border: var(--color-dark-grey-5);

    --color-selector-basic-checked-border-disabled: var(--color-dark-grey-3);

    --color-selector-basic-checked-border-finish: var(--color-dark-grey-5);

    --color-selector-basic-checked-border-finish-disabled: var(--color-dark-grey-3);

    --color-selector-basic-checked-border-finish-focus: var(--color-mid-grey-1);

    --color-selector-basic-checked-border-finish-hover: var(--color-mid-grey-1);

    --color-selector-basic-checked-border-focus: var(--color-mid-grey-1);

    --color-selector-basic-checked-border-hover: var(--color-mid-grey-1);

    --color-selector-basic-checked-element: var(--color-white);

    --color-selector-basic-checked-element-disabled: var(--color-mid-grey-2);

    --color-selector-basic-checked-element-focus: var(--color-white);

    --color-selector-basic-checked-element-hover: var(--color-white);

    --color-selector-basic-checked-outside-border-finish-focus: var(--color-dark-grey-3);

    --color-selector-basic-checked-outside-border-focus: var(--color-dark-grey-3);

    --color-selector-basic-element: var(--color-white);

    --color-selector-basic-element-disabled: var(--color-mid-grey-2);

    --color-selector-basic-element-focus: var(--color-white);

    --color-selector-basic-element-hover: var(--color-white);

    --color-selector-basic-outside-border-finish-focus: var(--color-dark-grey-3);

    --color-selector-basic-outside-border-focus: var(--color-dark-grey-3);

    --color-selector-primary-background: var(--color-dark-grey-5);

    --color-selector-primary-background-disabled: var(--color-dark-grey-3);

    --color-selector-primary-background-finish: var(--color-dark-grey-5);

    --color-selector-primary-background-finish-disabled: var(--color-dark-grey-3);

    --color-selector-primary-background-finish-focus: var(--color-mid-grey-1);

    --color-selector-primary-background-finish-hover: var(--color-mid-grey-1);

    --color-selector-primary-background-focus: var(--color-mid-grey-1);

    --color-selector-primary-background-hover: var(--color-mid-grey-1);

    --color-selector-primary-background-start: var(--color-dark-grey-5);

    --color-selector-primary-background-start-disabled: var(--color-dark-grey-3);

    --color-selector-primary-background-start-focus: var(--color-mid-grey-1);

    --color-selector-primary-background-start-hover: var(--color-mid-grey-1);

    --color-selector-primary-border: var(--color-dark-grey-5);

    --color-selector-primary-border-disabled: var(--color-dark-grey-3);

    --color-selector-primary-border-finish: var(--color-dark-grey-5);

    --color-selector-primary-border-finish-disabled: var(--color-dark-grey-3);

    --color-selector-primary-border-finish-focus: var(--color-mid-grey-1);

    --color-selector-primary-border-finish-hover: var(--color-mid-grey-1);

    --color-selector-primary-border-focus: var(--color-mid-grey-1);

    --color-selector-primary-border-hover: var(--color-mid-grey-1);

    --color-selector-primary-checked-background: var(--color-pr500);

    --color-selector-primary-checked-background-disabled: var(--color-pr800);

    --color-selector-primary-checked-background-finish: var(--color-pr500);

    --color-selector-primary-checked-background-finish-disabled: var(--color-pr800);

    --color-selector-primary-checked-background-finish-focus: var(--color-pr400);

    --color-selector-primary-checked-background-finish-hover: var(--color-pr400);

    --color-selector-primary-checked-background-focus: var(--color-pr400);

    --color-selector-primary-checked-background-hover: var(--color-pr400);

    --color-selector-primary-checked-background-start: var(--color-pr500);

    --color-selector-primary-checked-background-start-disabled: var(--color-pr800);

    --color-selector-primary-checked-background-start-focus: var(--color-pr400);

    --color-selector-primary-checked-background-start-hover: var(--color-pr400);

    --color-selector-primary-checked-border: var(--color-pr500);

    --color-selector-primary-checked-border-disabled: var(--color-pr800);

    --color-selector-primary-checked-border-finish: var(--color-pr500);

    --color-selector-primary-checked-border-finish-disabled: var(--color-pr800);

    --color-selector-primary-checked-border-finish-focus: var(--color-pr400);

    --color-selector-primary-checked-border-finish-hover: var(--color-pr400);

    --color-selector-primary-checked-border-focus: var(--color-pr400);

    --color-selector-primary-checked-border-hover: var(--color-pr400);

    --color-selector-primary-checked-element: var(--color-button-primary);

    --color-selector-primary-checked-element-disabled: var(--color-pr700);

    --color-selector-primary-checked-element-focus: var(--color-button-primary);

    --color-selector-primary-checked-element-hover: var(--color-button-primary);

    --color-selector-primary-checked-outside-border-finish-focus: var(--color-pr200);

    --color-selector-primary-checked-outside-border-focus: var(--color-pr200);

    --color-selector-primary-element: var(--color-white);

    --color-selector-primary-element-disabled: var(--color-mid-grey-2);

    --color-selector-primary-element-focus: var(--color-white);

    --color-selector-primary-element-hover: var(--color-white);

    --color-selector-primary-outside-border-finish-focus: var(--color-dark-grey-3);

    --color-selector-primary-outside-border-focus: var(--color-dark-grey-3);

    --color-sidebar: var(--color-mid-grey-5);

    --color-sidebar-active: var(--color-white);

    --color-sidebar-background: var(--color-dark-grey-1);

    --color-sidebar-background-finish: var(--color-dark-grey-1);

    --color-sidebar-background-start: var(--color-dark-grey-1);

    --color-sidebar-base: var(--color-light-grey-3);

    --color-sidebar-card-mini-background-finish-hover: var(--color-dark-grey-2);

    --color-sidebar-card-mini-background-hover: var(--color-dark-grey-2);

    --color-sidebar-card-mini-background-start-hover: var(--color-dark-grey-2);

    --color-sidebar-card-mini-inverse-background-finish-hover: var(--color-light-grey-4);

    --color-sidebar-card-mini-inverse-background-start-hover: var(--color-light-grey-4);

    --color-sidebar-card-mini-inverse-border-finish: var(--color-b000);

    --color-sidebar-card-mini-inverse-border-finish-hover: var(--color-b000);

    --color-sidebar-card-mini-inverse-border-start: var(--color-b000);

    --color-sidebar-card-mini-inverse-border-start-hover: var(--color-b000);

    --color-sidebar-card-mini-inverse-lock-icon: var(--color-dark-grey-5);

    --color-sidebar-card-mini-inverse-lock-icon-hover: var(--color-dark-grey-5);

    --color-sidebar-card-mini-lock-icon: var(--color-mid-grey-5);

    --color-sidebar-card-mini-lock-icon-hover: var(--color-mid-grey-5);

    --color-sidebar-card-referal-background: linear-gradient(90deg, var(--color-background-start) 0%, var(--color-background-finish) 75%);

    --color-sidebar-card-referal-background-hover: linear-gradient(90deg, var(--color-background-start-hover) 0%, var(--color-background-finish-hover) 75%);

    --color-sidebar-card-referal-description: var(--color-light-grey-3);

    --color-sidebar-card-referal-description-hover: var(--color-light-grey-3);

    --color-sidebar-card-referal-text: var(--color-white);

    --color-sidebar-card-referal-text-hover: var(--color-white);

    --color-sidebar-card-widget-background: linear-gradient(104deg, var(--color-background-start) 0%, var(--color-dark-grey-2) 86%);

    --color-sidebar-card-widget-background-finish: var(--color-dark-grey-2);

    --color-sidebar-card-widget-background-finish-hover: var(--color-dark-grey-3);

    --color-sidebar-card-widget-background-hover: linear-gradient(104deg, var(--color-background-start-hover) 0%, var(--color-dark-grey-3) 86%);

    --color-sidebar-card-widget-description: var(--color-mid-grey-5);

    --color-sidebar-card-widget-description-hover: var(--color-mid-grey-5);

    --color-sidebar-card-widget-inverse-background-finish: var(--color-light-grey-4);

    --color-sidebar-card-widget-inverse-background-finish-hover: var(--color-light-grey-4);

    --color-sidebar-card-widget-inverse-border-finish: var(--color-b000);

    --color-sidebar-card-widget-inverse-border-finish-hover: var(--color-b000);

    --color-sidebar-card-widget-inverse-border-start: var(--color-b000);

    --color-sidebar-card-widget-inverse-border-start-hover: var(--color-b000);

    --color-sidebar-card-widget-inverse-description: var(--color-dark-grey-3);

    --color-sidebar-card-widget-inverse-description-hover: var(--color-dark-grey-3);

    --color-sidebar-card-widget-inverse-lock-icon: var(--color-dark-grey-5);

    --color-sidebar-card-widget-inverse-lock-icon-hover: var(--color-dark-grey-5);

    --color-sidebar-card-widget-inverse-text: var(--color-black);

    --color-sidebar-card-widget-inverse-text-hover: var(--color-black);

    --color-sidebar-card-widget-lock-icon: var(--color-mid-grey-5);

    --color-sidebar-card-widget-lock-icon-hover: var(--color-mid-grey-5);

    --color-sidebar-card-widget-text: var(--color-white);

    --color-sidebar-card-widget-text-hover: var(--color-white);

    --color-sidebar-divider-background: var(--color-dark-grey-3);

    --color-sidebar-divider-background-finish: var(--color-dark-grey-3);

    --color-sidebar-divider-background-start: var(--color-dark-grey-3);

    --color-sidebar-header-background: var(--color-dark-grey-1);

    --color-sidebar-header-background-finish: var(--color-dark-grey-1);

    --color-sidebar-header-background-start: var(--color-dark-grey-1);

    --color-sidebar-header-icon: var(--color-mid-grey-5);

    --color-sidebar-header-icon-hover: var(--color-light-grey-3);

    --color-sidebar-hover: var(--color-light-grey-3);

    --color-sidebar-inverse-background-finish: var(--color-light-grey-5);

    --color-sidebar-inverse-background-start: var(--color-light-grey-5);

    --color-sidebar-inverse-border-finish: var(--color-b000);

    --color-sidebar-inverse-border-start: var(--color-b000);

    --color-sidebar-inverse-divider-background-finish: var(--color-light-grey-3);

    --color-sidebar-inverse-divider-background-start: var(--color-light-grey-3);

    --color-sidebar-inverse-header-background-finish: var(--color-light-grey-5);

    --color-sidebar-inverse-header-background-start: var(--color-light-grey-5);

    --color-sidebar-inverse-header-border-finish: var(--color-b000);

    --color-sidebar-inverse-header-border-start: var(--color-b000);

    --color-sidebar-inverse-header-icon: var(--color-dark-grey-5);

    --color-sidebar-inverse-header-icon-hover: var(--color-dark-grey-3);

    --color-sidebar-inverse-multiscreen-background-finish: var(--color-light-grey-4);

    --color-sidebar-inverse-multiscreen-background-finish-hover: var(--color-light-grey-4);

    --color-sidebar-inverse-multiscreen-background-start: var(--color-light-grey-4);

    --color-sidebar-inverse-multiscreen-background-start-hover: var(--color-light-grey-4);

    --color-sidebar-inverse-multiscreen-border-finish: var(--color-b000);

    --color-sidebar-inverse-multiscreen-border-finish-hover: var(--color-b000);

    --color-sidebar-inverse-multiscreen-border-start: var(--color-b000);

    --color-sidebar-inverse-multiscreen-border-start-hover: var(--color-b000);

    --color-sidebar-inverse-multiscreen-content-border-right-finish: var(--color-light-grey-5);

    --color-sidebar-inverse-multiscreen-content-border-right-finish-hover: var(--color-light-grey-5);

    --color-sidebar-inverse-multiscreen-content-border-right-start: var(--color-light-grey-5);

    --color-sidebar-inverse-multiscreen-content-border-right-start-hover: var(--color-light-grey-5);

    --color-sidebar-inverse-multiscreen-icon: var(--color-dark-grey-5);

    --color-sidebar-inverse-multiscreen-icon-hover: var(--color-dark-grey-3);

    --color-sidebar-list-header-background: var(--color-dark-grey-2);

    --color-sidebar-list-header-background-finish: var(--color-dark-grey-2);

    --color-sidebar-list-header-background-finish-hover: var(--color-dark-grey-3);

    --color-sidebar-list-header-background-hover: var(--color-dark-grey-3);

    --color-sidebar-list-header-background-start: var(--color-dark-grey-2);

    --color-sidebar-list-header-background-start-hover: var(--color-dark-grey-3);

    --color-sidebar-list-header-text: #dce0e6;

    --color-sidebar-list-header-text-hover: #101114;

    --color-sidebar-list-inverse-header-text: var(--color-dark-grey-3);

    --color-sidebar-list-inverse-header-text-hover: var(--color-black);

    --color-sidebar-list-inverse-row-text: var(--color-dark-grey-5);

    --color-sidebar-list-inverse-row-text-hover: var(--color-dark-grey-3);

    --color-sidebar-list-row-text: var(--color-mid-grey-5);

    --color-sidebar-list-row-text-hover: var(--color-light-grey-3);

    --color-sidebar-multiscreen-background: var(--color-dark-grey-2);

    --color-sidebar-multiscreen-background-finish: var(--color-dark-grey-2);

    --color-sidebar-multiscreen-background-finish-hover: var(--color-dark-grey-2);

    --color-sidebar-multiscreen-background-hover: var(--color-dark-grey-2);

    --color-sidebar-multiscreen-background-start: var(--color-dark-grey-2);

    --color-sidebar-multiscreen-background-start-hover: var(--color-dark-grey-2);

    --color-sidebar-multiscreen-content-border-right: unset;

    --color-sidebar-multiscreen-content-border-right-finish-hover: var(--color-dark-grey-1);

    --color-sidebar-multiscreen-content-border-right-hover: linear-gradient(180deg, unset 0%, var(--color-dark-grey-1) 100%);

    --color-sidebar-multiscreen-icon: var(--color-mid-grey-5);

    --color-sidebar-multiscreen-icon-hover: var(--color-light-grey-3);

    --color-sidebar-primary: var(--color-pr400);

    --color-sidebar-surface: var(--color-dark-grey-2);

    --color-sidebar-surface-active: var(--color-dark-grey-5);

    --color-sidebar-surface-border-focus: var(--color-dark-grey-3);

    --color-sidebar-surface-focus: var(--color-dark-grey-2);

    --color-sidebar-surface-hover: var(--color-dark-grey-3);

    --color-sidebar-surface-primary: var(--color-pr500);

    --color-sidebar-title: var(--color-white);

    --color-silver: #BDCCD1;

    --color-slideshow-dots-dot: var(--color-light-grey-5);

    --color-slideshow-dots-dot-background: var(--color-w040);

    --color-slideshow-dots-dot-background-hover: var(--color-w060);

    --color-slideshow-dots-dot-background-hover-inverse: var(--color-b020);

    --color-slideshow-dots-dot-background-inverse: var(--color-b010);

    --color-slideshow-dots-dot-button: var(--color-light-grey-5);

    --color-slideshow-dots-dot-button-active: var(--color-dark-grey-5);

    --color-slideshow-dots-dot-button-background: var(--color-w040);

    --color-slideshow-dots-dot-button-background-active: var(--color-light-grey-5);

    --color-slideshow-dots-dot-button-background-hover: var(--color-w060);

    --color-slideshow-dots-dot-button-hover: var(--color-light-grey-5);

    --color-slideshow-dots-dot-hover: var(--color-light-grey-5);

    --color-slideshow-dots-dot-hover-inverse: var(--color-mid-grey-2);

    --color-slideshow-dots-dot-inverse: var(--color-mid-grey-4);

    --color-step-body-base: var(--color-dark-grey-4);

    --color-step-body-error: var(--color-da600);

    --color-step-body-success: var(--color-su600);

    --color-step-description: var(--color-dark-grey-5);

    --color-step-label: var(--color-white);

    --color-step-label-secondary: var(--color-mid-grey-5);

    --color-step-line-background: var(--color-dark-grey-4);

    --color-step-line-background-error: var(--color-da600);

    --color-step-line-background-finish: var(--color-dark-grey-4);

    --color-step-line-background-finish-error: var(--color-da600);

    --color-step-line-background-finish-success: var(--color-su600);

    --color-step-line-background-start: var(--color-dark-grey-4);

    --color-step-line-background-start-error: var(--color-da600);

    --color-step-line-background-start-success: var(--color-su600);

    --color-step-line-background-success: var(--color-su600);

    --color-step-point-border: var(--color-dark-grey-4);

    --color-step-point-border-error: var(--color-da600);

    --color-step-point-border-finish: var(--color-dark-grey-4);

    --color-step-point-border-finish-error: var(--color-da600);

    --color-step-point-border-finish-success: var(--color-su600);

    --color-step-point-border-success: var(--color-su600);

    --color-step-point-element: var(--color-dark-grey-4);

    --color-step-point-element-error: var(--color-da600);

    --color-step-point-element-finish: var(--color-dark-grey-4);

    --color-step-point-element-finish-error: var(--color-da600);

    --color-step-point-element-finish-success: var(--color-su600);

    --color-step-point-element-start: var(--color-dark-grey-4);

    --color-step-point-element-start-error: var(--color-da600);

    --color-step-point-element-start-success: var(--color-su600);

    --color-step-point-element-success: var(--color-su600);

    --color-step-point-text: var(--color-white);

    --color-step-text: var(--color-white);

    --color-su050: #D3FDD7;

    --color-su100: #A7FCB0;

    --color-su200: #7CFA88;

    --color-su300: #50F861;

    --color-su400: #40e6b1;

    --color-su500: #07BE1A;

    --color-su600: #40e6b1;

    --color-su700: #04720F;

    --color-su800: #034C0A;

    --color-su900: #012605;

    --color-surface-invite: #7113D4;

    --color-surface-invite-hover: #721CFF;

    --color-surface-invite-lumin: #CB438A;

    --color-surface-lumin: #1A799F;

    --color-tab-group: #FFFFFF1A;

    --color-tab-group-inverse: #0000000D;

    --color-tab-info-background-active: var(--color-in400);

    --color-tab-info-background-finish-active: var(--color-in400);

    --color-tab-info-background-start-active: var(--color-in400);

    --color-tab-info-icon-container-icon: #A2A5AFCC;

    --color-tab-info-icon-container-icon-active: var(--color-w080);

    --color-tab-info-icon-container-icon-hover: var(--color-w080);

    --color-tab-info-text: var(--color-mid-grey-5);

    --color-tab-info-text-active: var(--color-white);

    --color-tab-info-text-hover: var(--color-white);

    --color-tab-inverse-background-active: var(--color-dark-grey-1);

    --color-tab-inverse-background-finish-active: var(--color-dark-grey-1);

    --color-tab-inverse-background-start-active: var(--color-dark-grey-1);

    --color-tab-inverse-icon-container-icon: #54596DCC;

    --color-tab-inverse-icon-container-icon-active: var(--color-w080);

    --color-tab-inverse-icon-container-icon-hover: var(--color-dgz080);

    --color-tab-inverse-text: var(--color-dark-grey-5);

    --color-tab-inverse-text-active: var(--color-white);

    --color-tab-inverse-text-hover: var(--color-black);

    --color-tab-primary-background-active: var(--color-pr500);

    --color-tab-primary-background-finish-active: var(--color-pr500);

    --color-tab-primary-background-start-active: var(--color-pr500);

    --color-tab-primary-icon-container-icon: #A2A5AFCC;

    --color-tab-primary-icon-container-icon-active: var(--color-tab-primary-text-active);

    --color-tab-primary-icon-container-icon-hover: var(--color-w080);

    --color-tab-primary-text: var(--color-mid-grey-5);

    --color-tab-primary-text-active: var(--color-button-primary);

    --color-tab-primary-text-hover: var(--color-white);

    --color-tab-secondary-background-active: var(--color-dark-grey-4);

    --color-tab-secondary-background-finish-active: var(--color-dark-grey-4);

    --color-tab-secondary-background-start-active: var(--color-dark-grey-4);

    --color-tab-secondary-icon-container-icon: #A2A5AFCC;

    --color-tab-secondary-icon-container-icon-active: var(--color-w080);

    --color-tab-secondary-icon-container-icon-hover: var(--color-w080);

    --color-tab-secondary-text: var(--color-mid-grey-5);

    --color-tab-secondary-text-active: var(--color-white);

    --color-tab-secondary-text-hover: var(--color-white);

    --color-tab-underline-inverse-icon-container-background-disabled: unset;

    --color-tab-underline-inverse-icon-container-icon: #54596DCC;

    --color-tab-underline-inverse-icon-container-icon-active: var(--color-dgz080);

    --color-tab-underline-inverse-icon-container-icon-hover: var(--color-dgz080);

    --color-tab-underline-inverse-text: var(--color-dark-grey-5);

    --color-tab-underline-inverse-text-active: var(--color-black);

    --color-tab-underline-inverse-text-hover: var(--color-black);

    --color-tab-underline-inverse-underline-background: var(--color-dark-grey-1);

    --color-tab-underline-inverse-underline-background-finish-active: var(--color-dark-grey-1);

    --color-tab-underline-inverse-underline-background-start-active: var(--color-dark-grey-1);

    --color-tab-underline-primary-icon-container-background-disabled: unset;

    --color-tab-underline-primary-icon-container-icon: #A2A5AFCC;

    --color-tab-underline-primary-icon-container-icon-active: var(--color-w080);

    --color-tab-underline-primary-icon-container-icon-hover: var(--color-w080);

    --color-tab-underline-primary-text: var(--color-mid-grey-5);

    --color-tab-underline-primary-text-active: var(--color-white);

    --color-tab-underline-primary-text-hover: var(--color-white);

    --color-tab-underline-primary-underline-background: var(--color-background-primary);

    --color-tab-underline-primary-underline-background-finish-active: var(--color-pr500);

    --color-tab-underline-primary-underline-background-start-active: var(--color-pr500);

    --color-table-base-body: var(--color-white);

    --color-table-base-body-background-active: var(--color-dark-grey-2);

    --color-table-base-body-background-hover: var(--color-dark-grey-3);

    --color-table-base-body-background-sf-1: var(--color-dark-grey-1);

    --color-table-base-body-background-sf-2: var(--color-dark-grey-2);

    --color-table-base-body-background-sf1: var(--color-dark-grey-1);

    --color-table-base-body-background-sf2: var(--color-dark-grey-2);

    --color-table-base-header: var(--color-light-grey-1);

    --color-table-base-header-background-active: var(--color-dark-grey-2);

    --color-table-base-header-background-hover: var(--color-dark-grey-3);

    --color-table-base-header-background-sf-1: var(--color-dark-grey-1);

    --color-table-base-header-background-sf-2: var(--color-dark-grey-2);

    --color-table-base-header-background-sf1: var(--color-dark-grey-1);

    --color-table-base-header-background-sf2: var(--color-dark-grey-2);

    --color-table-fill-header-background-active: var(--color-dark-grey-2);

    --color-table-fill-header-background-finish-active: var(--color-dark-grey-2);

    --color-table-fill-header-background-finish-hover: var(--color-dark-grey-3);

    --color-table-fill-header-background-finish-sf1: var(--color-dark-grey-1);

    --color-table-fill-header-background-finish-sf2: var(--color-dark-grey-2);

    --color-table-fill-header-background-hover: var(--color-dark-grey-3);

    --color-table-fill-header-background-sf1: var(--color-dark-grey-1);

    --color-table-fill-header-background-sf2: var(--color-dark-grey-2);

    --color-table-fill-header-background-start-active: var(--color-dark-grey-2);

    --color-table-fill-header-background-start-hover: var(--color-dark-grey-3);

    --color-table-fill-header-background-start-sf1: var(--color-dark-grey-1);

    --color-table-fill-header-background-start-sf2: var(--color-dark-grey-2);

    --color-table-fill-header-icon-container-icon: #A2A5AFCC;

    --color-table-fill-header-icon-container-icon-active: #A2A5AFCC;

    --color-table-fill-header-icon-container-icon-hover: #A2A5AFCC;

    --color-table-fill-header-text: var(--color-mid-grey-5);

    --color-table-fill-header-text-active: var(--color-mid-grey-5);

    --color-table-fill-header-text-hover: var(--color-mid-grey-5);

    --color-table-fill-row-background-active: var(--color-dark-grey-2);

    --color-table-fill-row-background-finish-active: var(--color-dark-grey-2);

    --color-table-fill-row-background-finish-hover: var(--color-dark-grey-3);

    --color-table-fill-row-background-finish-sf1: var(--color-dark-grey-1);

    --color-table-fill-row-background-finish-sf2: var(--color-dark-grey-2);

    --color-table-fill-row-background-hover: var(--color-dark-grey-3);

    --color-table-fill-row-background-sf1: var(--color-dark-grey-1);

    --color-table-fill-row-background-sf2: var(--color-dark-grey-2);

    --color-table-fill-row-background-start-active: var(--color-dark-grey-2);

    --color-table-fill-row-background-start-hover: var(--color-dark-grey-3);

    --color-table-fill-row-background-start-sf1: var(--color-dark-grey-1);

    --color-table-fill-row-background-start-sf2: var(--color-dark-grey-2);

    --color-table-fill-row-icon-container-icon: #FFFFFFCC;

    --color-table-fill-row-icon-container-icon-active: #FFFFFFCC;

    --color-table-fill-row-icon-container-icon-hover: #FFFFFFCC;

    --color-table-fill-row-text: var(--color-white);

    --color-table-fill-row-text-active: var(--color-white);

    --color-table-fill-row-text-hover: var(--color-white);

    --color-table-line-body: var(--color-white);

    --color-table-line-body-background: var(--color-dark-grey-2);

    --color-table-line-body-background-active: var(--color-dark-grey-2);

    --color-table-line-body-background-hover: var(--color-dark-grey-3);

    --color-table-line-header: var(--color-mid-grey-5);

    --color-table-line-header-background: var(--color-dark-grey-2);

    --color-table-line-header-background-active: var(--color-dark-grey-2);

    --color-table-line-header-background-hover: var(--color-dark-grey-3);

    --color-table-lineal-header-background-active: var(--color-dark-grey-2);

    --color-table-lineal-header-background-finish-active: var(--color-dark-grey-2);

    --color-table-lineal-header-background-finish-hover: var(--color-dark-grey-3);

    --color-table-lineal-header-background-hover: var(--color-dark-grey-3);

    --color-table-lineal-header-background-start-active: var(--color-dark-grey-2);

    --color-table-lineal-header-background-start-hover: var(--color-dark-grey-3);

    --color-table-lineal-header-border-bottom: linear-gradient(180deg, unset 0%, var(--color-dark-grey-2) 100%);

    --color-table-lineal-header-border-bottom-finish: var(--color-dark-grey-2);

    --color-table-lineal-header-icon-container-icon: #A2A5AFCC;

    --color-table-lineal-header-icon-container-icon-active: #A2A5AFCC;

    --color-table-lineal-header-icon-container-icon-hover: #A2A5AFCC;

    --color-table-lineal-header-text: var(--color-mid-grey-5);

    --color-table-lineal-header-text-active: var(--color-mid-grey-5);

    --color-table-lineal-header-text-hover: var(--color-mid-grey-5);

    --color-table-lineal-row-background-active: var(--color-dark-grey-2);

    --color-table-lineal-row-background-finish-active: var(--color-dark-grey-2);

    --color-table-lineal-row-background-finish-hover: var(--color-dark-grey-3);

    --color-table-lineal-row-background-hover: var(--color-dark-grey-3);

    --color-table-lineal-row-background-start-active: var(--color-dark-grey-2);

    --color-table-lineal-row-background-start-hover: var(--color-dark-grey-3);

    --color-table-lineal-row-border-bottom: linear-gradient(180deg, unset 0%, var(--color-dark-grey-2) 100%);

    --color-table-lineal-row-border-bottom-finish: var(--color-dark-grey-2);

    --color-table-lineal-row-icon-container-icon: #FFFFFFCC;

    --color-table-lineal-row-icon-container-icon-active: #FFFFFFCC;

    --color-table-lineal-row-icon-container-icon-hover: #FFFFFFCC;

    --color-table-lineal-row-text: var(--color-white);

    --color-table-lineal-row-text-active: var(--color-white);

    --color-table-lineal-row-text-hover: var(--color-white);

    --color-table-modal-background-finish-sf1: var(--color-dark-grey-1);

    --color-table-modal-background-finish-sf2: var(--color-dark-grey-2);

    --color-table-modal-background-sf1: var(--color-dark-grey-1);

    --color-table-modal-background-sf2: var(--color-dark-grey-2);

    --color-table-modal-background-start-sf1: var(--color-dark-grey-1);

    --color-table-modal-background-start-sf2: var(--color-dark-grey-2);

    --color-table-modal-description: var(--color-mid-grey-5);

    --color-table-modal-icon-container-icon: #A2A5AFCC;

    --color-table-modal-text: var(--color-mid-grey-5);

    --color-table-modal-value: var(--color-white);

    --color-tabs-group-fill-info-background: var(--color-w010);

    --color-tabs-group-fill-info-background-finish: var(--color-w010);

    --color-tabs-group-fill-info-background-start: var(--color-w010);

    --color-tabs-group-fill-inverse-background: var(--color-b005);

    --color-tabs-group-fill-inverse-background-finish: var(--color-b005);

    --color-tabs-group-fill-inverse-background-start: var(--color-b005);

    --color-tabs-group-fill-inverse-border: var(--color-b000);

    --color-tabs-group-fill-inverse-border-finish: var(--color-b000);

    --color-tabs-group-fill-primary-background: var(--color-w010);

    --color-tabs-group-fill-primary-background-finish: var(--color-w010);

    --color-tabs-group-fill-primary-background-start: var(--color-w010);

    --color-tabs-group-fill-secondary-background: var(--color-w010);

    --color-tabs-group-fill-secondary-background-finish: var(--color-w010);

    --color-tabs-group-fill-secondary-background-start: var(--color-w010);

    --color-tabs-group-outline-info-border: var(--color-dark-grey-4);

    --color-tabs-group-outline-info-border-finish: var(--color-dark-grey-4);

    --color-tabs-group-outline-inverse-background: var(--color-b000);

    --color-tabs-group-outline-inverse-background-finish: var(--color-b000);

    --color-tabs-group-outline-inverse-background-start: var(--color-b000);

    --color-tabs-group-outline-inverse-border: var(--color-light-grey-2);

    --color-tabs-group-outline-inverse-border-finish: var(--color-light-grey-2);

    --color-tabs-group-outline-primary-border: var(--color-dark-grey-4);

    --color-tabs-group-outline-primary-border-finish: var(--color-dark-grey-4);

    --color-tabs-group-outline-secondary-border: var(--color-dark-grey-4);

    --color-tabs-group-outline-secondary-border-finish: var(--color-dark-grey-4);

    --color-tabs-group-underline-inverse-background: var(--color-b000);

    --color-tabs-group-underline-inverse-background-finish: var(--color-b000);

    --color-tabs-group-underline-inverse-background-start: var(--color-b000);

    --color-tabs-group-underline-inverse-border-bottom: var(--color-light-grey-4);

    --color-tabs-group-underline-inverse-border-bottom-finish: var(--color-light-grey-4);

    --color-tabs-group-underline-primary-border-bottom: var(--color-dark-grey-2);

    --color-tabs-group-underline-primary-border-bottom-finish: var(--color-dark-grey-2);

    --color-tag-fill-background: var(--color-dark-grey-3);

    --color-tag-fill-background-active: var(--color-pr500);

    --color-tag-fill-background-active-hover: var(--color-pr400);

    --color-tag-fill-background-finish: var(--color-dark-grey-3);

    --color-tag-fill-background-finish-active: var(--color-pr500);

    --color-tag-fill-background-finish-active-hover: var(--color-pr400);

    --color-tag-fill-background-finish-hover: var(--color-dark-grey-4);

    --color-tag-fill-background-hover: var(--color-dark-grey-4);

    --color-tag-fill-background-start: var(--color-dark-grey-3);

    --color-tag-fill-background-start-active: var(--color-pr500);

    --color-tag-fill-background-start-active-hover: var(--color-pr400);

    --color-tag-fill-background-start-hover: var(--color-dark-grey-4);

    --color-tag-fill-icon-container-icon: #FFFFFFCC;

    --color-tag-fill-icon-container-icon-active: var(--color-mid-grey-2);

    --color-tag-fill-icon-container-icon-active-hover: var(--color-mid-grey-2);

    --color-tag-fill-icon-container-icon-hover: #FFFFFFCC;

    --color-tag-fill-text: var(--color-white);

    --color-tag-fill-text-active: var(--color-button-primary);

    --color-tag-fill-text-active-hover: var(--color-button-primary);

    --color-tag-fill-text-hover: var(--color-white);

    --color-tag-ghost-background-active: var(--color-pr500);

    --color-tag-ghost-background-active-hover: var(--color-pr400);

    --color-tag-ghost-background-finish-active: var(--color-pr500);

    --color-tag-ghost-background-finish-active-hover: var(--color-pr400);

    --color-tag-ghost-background-finish-hover: var(--color-dark-grey-4);

    --color-tag-ghost-background-hover: var(--color-dark-grey-4);

    --color-tag-ghost-background-start-active: var(--color-pr500);

    --color-tag-ghost-background-start-active-hover: var(--color-pr400);

    --color-tag-ghost-background-start-hover: var(--color-dark-grey-4);

    --color-tag-ghost-icon-container-icon: #FFFFFFCC;

    --color-tag-ghost-icon-container-icon-active: var(--color-white);

    --color-tag-ghost-icon-container-icon-active-hover: var(--color-white);

    --color-tag-ghost-icon-container-icon-hover: #FFFFFFCC;

    --color-tag-ghost-secondary-background-active: var(--color-dark-grey-3);

    --color-tag-ghost-secondary-background-active-hover: var(--color-dark-grey-5);

    --color-tag-ghost-secondary-background-finish-active: var(--color-dark-grey-3);

    --color-tag-ghost-secondary-background-finish-active-hover: var(--color-dark-grey-5);

    --color-tag-ghost-secondary-background-finish-hover: var(--color-dark-grey-4);

    --color-tag-ghost-secondary-background-hover: var(--color-dark-grey-4);

    --color-tag-ghost-secondary-background-start-active: var(--color-dark-grey-3);

    --color-tag-ghost-secondary-background-start-active-hover: var(--color-dark-grey-5);

    --color-tag-ghost-secondary-background-start-hover: var(--color-dark-grey-4);

    --color-tag-ghost-secondary-icon-container-icon: #D0D2D7CC;

    --color-tag-ghost-secondary-icon-container-icon-active: var(--color-white);

    --color-tag-ghost-secondary-icon-container-icon-active-hover: var(--color-white);

    --color-tag-ghost-secondary-icon-container-icon-hover: #FFFFFFCC;

    --color-tag-ghost-secondary-text: var(--color-light-grey-3);

    --color-tag-ghost-secondary-text-active: var(--color-white);

    --color-tag-ghost-secondary-text-active-hover: var(--color-white);

    --color-tag-ghost-secondary-text-hover: var(--color-white);

    --color-tag-ghost-text: var(--color-white);

    --color-tag-ghost-text-active: var(--color-white);

    --color-tag-ghost-text-active-hover: var(--color-white);

    --color-tag-ghost-text-hover: var(--color-white);

    --color-tag-outline-background-active: var(--color-pr500);

    --color-tag-outline-background-active-hover: var(--color-pr400);

    --color-tag-outline-background-finish-active: var(--color-pr500);

    --color-tag-outline-background-finish-active-hover: var(--color-pr400);

    --color-tag-outline-background-finish-hover: var(--color-dark-grey-4);

    --color-tag-outline-background-hover: var(--color-dark-grey-4);

    --color-tag-outline-background-start-active: var(--color-pr500);

    --color-tag-outline-background-start-active-hover: var(--color-pr400);

    --color-tag-outline-background-start-hover: var(--color-dark-grey-4);

    --color-tag-outline-border: var(--color-dark-grey-4);

    --color-tag-outline-border-finish: var(--color-dark-grey-4);

    --color-tag-outline-icon-container-icon: #FFFFFFCC;

    --color-tag-outline-icon-container-icon-active: var(--color-white);

    --color-tag-outline-icon-container-icon-active-hover: var(--color-white);

    --color-tag-outline-icon-container-icon-hover: #FFFFFFCC;

    --color-tag-outline-text: var(--color-white);

    --color-tag-outline-text-active: var(--color-white);

    --color-tag-outline-text-active-hover: var(--color-white);

    --color-tag-outline-text-hover: var(--color-white);

    --color-text-attention: var(--color-at300);

    --color-text-base: var(--color-light-grey-3);

    --color-text-danger: var(--color-da500);

    --color-text-info: var(--color-in200);

    --color-text-inverse-base: var(--color-dark-grey-3);

    --color-text-inverse-muted: var(--color-mid-grey-3);

    --color-text-inverse-secondary: var(--color-dark-grey-5);

    --color-text-inverse-title: var(--color-black);

    --color-text-inverse-transparent: var(--color-b070);

    --color-text-minor: var(--color-mi300);

    --color-text-muted: var(--color-mid-grey-2);

    --color-text-primary: #000000;

    --color-text-secondary: var(--color-mid-grey-5);

    --color-text-success: var(--color-su400);

    --color-text-title: var(--color-white);

    --color-text-transparent: var(--color-w070);

    --color-text-warning: var(--color-wa400);

    --color-title-basic-description: var(--color-mid-grey-5);

    --color-title-basic-icon-container-icon: #FFFFFFCC;

    --color-title-basic-text: var(--color-white);

    --color-title-inverse-background: var(--color-b000);

    --color-title-inverse-background-finish: var(--color-b000);

    --color-title-inverse-background-start: var(--color-b000);

    --color-title-inverse-border: var(--color-b000);

    --color-title-inverse-border-finish: var(--color-b000);

    --color-title-inverse-description: var(--color-dark-grey-5);

    --color-title-inverse-icon-container-background: var(--color-b000);

    --color-title-inverse-icon-container-background-finish: var(--color-b000);

    --color-title-inverse-icon-container-background-start: var(--color-b000);

    --color-title-inverse-icon-container-border: var(--color-b000);

    --color-title-inverse-icon-container-border-finish: var(--color-b000);

    --color-title-inverse-icon-container-icon: #060E2ACC;

    --color-title-inverse-text: var(--color-black);

    --color-tooltip: var(--color-white);

    --color-tooltip-background: var(--color-dark-grey-4);

    --color-tooltip-background-finish: var(--color-dark-grey-4);

    --color-tooltip-background-start: var(--color-dark-grey-4);

    --color-tooltip-text: var(--color-white);

    --color-user-background-finish: #377EE800;

    --color-user-background-start: #8236FF;

    --color-user-menu-background: var(--color-dark-grey-0);

    --color-user-menu-background-finish: var(--color-dark-grey-0);

    --color-user-menu-background-start: var(--color-dark-grey-0);

    --color-user-menu-description: var(--color-mid-grey-2);

    --color-user-menu-email-text: var(--color-mid-grey-5);

    --color-user-menu-header-bottom-border: var(--color-dark-grey-0);

    --color-user-menu-header-bottom-border-finish: var(--color-dark-grey-0);

    --color-user-menu-header-text: var(--color-white);

    --color-user-menu-inverse-background-finish: var(--color-white);

    --color-user-menu-inverse-background-start: var(--color-white);

    --color-user-menu-inverse-border-finish: var(--color-b000);

    --color-user-menu-inverse-border-start: var(--color-b000);

    --color-user-menu-inverse-content-border-finish: var(--color-b000);

    --color-user-menu-inverse-content-border-start: var(--color-b000);

    --color-user-menu-inverse-description: var(--color-mid-grey-3);

    --color-user-menu-inverse-email-text: var(--color-dark-grey-5);

    --color-user-menu-inverse-header-bottom-border-finish: var(--color-white);

    --color-user-menu-inverse-header-bottom-border-start: var(--color-white);

    --color-user-menu-inverse-header-text: var(--color-black);

    --color-user-menu-inverse-list-background-finish: var(--color-light-grey-5);

    --color-user-menu-inverse-list-background-start: var(--color-light-grey-5);

    --color-user-menu-inverse-progress-background-finish: var(--color-white);

    --color-user-menu-inverse-progress-background-start: var(--color-white);

    --color-user-menu-inverse-progress-border-finish: var(--color-b000);

    --color-user-menu-inverse-progress-border-start: var(--color-b000);

    --color-user-menu-inverse-progress-icon: var(--color-mid-grey-3);

    --color-user-menu-inverse-text: var(--color-dark-grey-3);

    --color-user-menu-inverse-title: var(--color-dark-grey-3);

    --color-user-menu-inverse-user-background-lower: var(--color-light-grey-5);

    --color-user-menu-inverse-value: var(--color-black);

    --color-user-menu-list-background: var(--color-dark-grey-1);

    --color-user-menu-list-background-finish: var(--color-dark-grey-1);

    --color-user-menu-list-background-start: var(--color-dark-grey-1);

    --color-user-menu-progreses-background: var(--color-dark-grey-0);

    --color-user-menu-progress-background-finish: var(--color-dark-grey-0);

    --color-user-menu-progress-background-start: var(--color-dark-grey-0);

    --color-user-menu-progress-icon: var(--color-mid-grey-5);

    --color-user-menu-text: var(--color-light-grey-3);

    --color-user-menu-title: var(--color-light-grey-3);

    --color-user-menu-user-background: linear-gradient(139deg, var(--color-user-background-start) 12%, var(--color-user-background-finish) 100%);

    --color-user-menu-user-background-lower: var(--color-dark-grey-1);

    --color-user-menu-value: var(--color-white);

    --color-vi050: #F3D4FF;

    --color-vi100: #E7AAFF;

    --color-vi200: #DC80FF;

    --color-vi300: #D055FF;

    --color-vi400: #B800FF;

    --color-vi500: #9900D5;

    --color-vi600: #7B00AA;

    --color-vi700: #5C0080;

    --color-vi800: #3D0055;

    --color-vi900: #1F002B;

    --color-w000: #FFFFFF00;

    --color-w002: #FFFFFF05;

    --color-w005: #FFFFFF0D;

    --color-w010: #FFFFFF1A;

    --color-w020: #FFFFFF33;

    --color-w030: #FFFFFF4D;

    --color-w040: #FFFFFF66;

    --color-w050: #FFFFFF80;

    --color-w060: #FFFFFF99;

    --color-w070: #FFFFFFB3;

    --color-w080: #FFFFFFCC;

    --color-w090: #FFFFFFE6;

    --color-wa050: #FDE2D3;

    --color-wa100: #FCC6A7;

    --color-wa200: #FAA97C;

    --color-wa300: #F88D50;

    --color-wa400: #F67024;

    --color-wa500: #E45809;

    --color-wa600: #BE4908;

    --color-wa700: #983B06;

    --color-wa800: #722C05;

    --color-wa900: #4C1D03;

    --color-white: #FFFFFF;

    --countdown-container-spacing-l: 4px;

    --countdown-container-spacing-m: 2px;

    --countdown-divider-dot-spacing-l: 8px;

    --countdown-divider-dot-spacing-m: 4px;

    --countdown-divider-line-width: 6px;

    --countdown-item-border-radius-l: 8px;

    --countdown-item-border-radius-m: 6px;

    --countdown-item-border-size-l: 2px;

    --countdown-item-border-size-m: 2px;

    --countdown-item-expand-l: 0 8px;

    --countdown-item-expand-m: 0 4px;

    --countdown-item-size-3xs: 6px;

    --countdown-item-size-l: 44px;

    --countdown-item-size-m: 32px;

    --countdown-item-size-s: 10px;

    --countdown-item-size-xs: 9px;

    --countdown-item-size-xxs: 7px;

    --countdown-spacing-3xs: 4px;

    --countdown-spacing-l: 8px;

    --countdown-spacing-m: 4px;

    --countdown-spacing-s: 4px;

    --countdown-spacing-xs: 4px;

    --countdown-spacing-xxs: 4px;

    --counter-border-radius-l: 12px;

    --counter-border-radius-m: 8px;

    --counter-border-radius-s: 6px;

    --counter-border-radius-xl: 12px;

    --counter-border-radius-xs: 4px;

    --counter-border-size-l: 2px;

    --counter-border-size-m: 1px;

    --counter-border-size-s: 1px;

    --counter-border-size-xl: 2px;

    --counter-border-size-xs: 1px;

    --counter-content-size-l: 12px;

    --counter-content-size-m: 12px;

    --counter-content-size-s: 8px;

    --counter-content-size-xl: 16px;

    --counter-content-size-xs: 4px;

    --counter-expand-l: 4px;

    --counter-expand-m: 2px;

    --counter-expand-s: 2px;

    --counter-expand-xl: 4px;

    --counter-expand-xs: 4px;

    --counter-size-l: 20px;

    --counter-size-m: 16px;

    --counter-size-s: 12px;

    --counter-size-xl: 24px;

    --counter-size-xs: 8px;

    --dot-size-m: 4px;

    --dot-size-s: 2px;

    --dropdown-border-radius-m: 8px;

    --dropdown-border-radius-s: 6px;

    --dropdown-border-size-m: 2px;

    --dropdown-border-size-s: 2px;

    --dropdown-divider-description-expand-m: 0 16px;

    --dropdown-divider-description-expand-s: 0 12px;

    --dropdown-divider-expand-m: 8px 0;

    --dropdown-divider-expand-s: 6px 0;

    --dropdown-divider-spacing-m: 8px;

    --dropdown-divider-spacing-s: 6px;

    --dropdown-expand-m: 8px 0;

    --dropdown-expand-s: 6px 0;

    --dropdown-item-m-margin: 16px;

    --dropdown-item-s-icon-size: 20px;

    --dropdown-item-s-margin: 12px;

    --dropdown-row-content-height-m: 32px;

    --dropdown-row-content-height-s: 28px;

    --dropdown-row-content-spacing-m: 8px;

    --dropdown-row-content-spacing-s: 8px;

    --dropdown-row-expand-1-m: 0 0 0 46px;

    --dropdown-row-expand-1-s: 0 0 0 40px;

    --dropdown-row-expand-2-m: 0 0 0 76px;

    --dropdown-row-expand-2-s: 0 0 0 68px;

    --dropdown-row-expand-m: 8px 16px;

    --dropdown-row-expand-s: 6px 12px;

    --dropdown-row-icon-container-border-radius-m: 1000px;

    --dropdown-row-icon-container-border-radius-s: 1000px;

    --dropdown-row-icon-container-border-size-m: 1px;

    --dropdown-row-icon-container-border-size-s: 1px;

    --dropdown-row-icon-container-icon-size-m: 22px;

    --dropdown-row-icon-container-icon-size-s: 20px;

    --dropdown-row-text-container-spacing-m: 4px;

    --dropdown-row-text-container-spacing-s: 2px;

    --dropdown-tail-expand-m: 0 8px;

    --dropdown-tail-expand-s: 0 8px;

    --dropdown-tail-height-m: 16px;

    --dropdown-tail-height-s: 8px;

    --expand: 0 10px;

    --field-horizontal-spacing: 8px;

    --field-vertical-icon-size: 16px;

    --field-vertical-spaсing: 4px;

    --field-vertical-text-spaсing: 4px;

    --font-accordion-description: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-accordion-header: var(--font-style-base) 600 14px/20px "Montserrat";

    --font-badge-text-l: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-badge-text-m: var(--font-style-base) 700 12px/16px "Montserrat";

    --font-badge-text-s: var(--font-style-base) 700 10px/14px "Montserrat";

    --font-badge-text-xs: var(--font-style-base) 700 8px/8px "Montserrat";

    --font-body-bold-2xs: var(--font-style-base) 700 8px/20px "Montserrat";

    --font-body-bold-l: var(--font-style-base) 700 16px/24px "Montserrat";

    --font-body-bold-m: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-body-bold-s: var(--font-style-base) 700 12px/20px "Montserrat";

    --font-body-bold-xl: var(--font-style-base) 700 18px/28px "Montserrat";

    --font-body-bold-xs: var(--font-style-base) 700 10px/20px "Montserrat";

    --font-body-regular-2xs: var(--font-style-base) 500 8px/20px "Montserrat";

    --font-body-regular-l: var(--font-style-base) 500 16px/24px "Montserrat";

    --font-body-regular-m: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-body-regular-s: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-body-regular-xl: var(--font-style-base) 500 18px/28px "Montserrat";

    --font-body-regular-xs: var(--font-style-base) 500 10px/20px "Montserrat";

    --font-body-semi-bold-2xs: var(--font-style-base) 600 8px/20px "Montserrat";

    --font-body-semi-bold-l: var(--font-style-base) 600 16px/24px "Montserrat";

    --font-body-semi-bold-m: var(--font-style-base) 600 14px/20px "Montserrat";

    --font-body-semi-bold-s: var(--font-style-base) 600 12px/20px "Montserrat";

    --font-body-semi-bold-xl: var(--font-style-base) 600 18px/28px "Montserrat";

    --font-body-semi-bold-xs: var(--font-style-base) 600 10px/20px "Montserrat";

    --font-button-store-description-l: var(--font-style-base) 500 10px/12px "Montserrat";

    --font-button-store-description-m: var(--font-style-base) 500 10px/12px "Montserrat";

    --font-button-store-text-l: var(--font-style-base) 600 16px/20px "Montserrat";

    --font-button-store-text-m: var(--font-style-base) 600 12px/18px "Montserrat";

    --font-button-text-l: var(--font-style-base) 700 18px/24px "Montserrat";

    --font-button-text-m: var(--font-style-base) 600 16px/20px "Montserrat";

    --font-button-text-s: var(--font-style-base) 600 12px/16px "Montserrat";

    --font-calendar-day-text-m: var(--font-style-base) 500 16px/24px "Montserrat";

    --font-calendar-day-text-s: var(--font-style-base) 500 14px/24px "Montserrat";

    --font-calendar-holiday-text-m: var(--font-style-base) 500 16px/24px "Montserrat";

    --font-calendar-holiday-text-s: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-calendar-today-text-m: var(--font-style-base) 700 16px/24px "Montserrat";

    --font-calendar-today-text-s: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-calendar-week-text-m: var(--font-style-base) 500 16px/24px "Montserrat";

    --font-calendar-week-text-s: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-countdown-description-l: var(--font-style-base) 600 12px/20px "Montserrat";

    --font-countdown-description-m: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-countdown-text-3xs: var(--font-style-base) 700 8px/8px "Montserrat";

    --font-countdown-text-l: var(--font-style-base) 600 20px/28px "Montserrat";

    --font-countdown-text-m: var(--font-style-base) 600 16px/24px "Montserrat";

    --font-countdown-text-s: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-countdown-text-xs: var(--font-style-base) 700 12px/16px "Montserrat";

    --font-countdown-text-xxs: var(--font-style-base) 700 10px/14px "Montserrat";

    --font-counter-text-l: var(--font-style-base) 700 12px/12px "Montserrat";

    --font-counter-text-m: var(--font-style-base) 700 10px/10px "Montserrat";

    --font-counter-text-s: var(--font-style-base) 700 8px/8px "Montserrat";

    --font-counter-text-xl: var(--font-style-base) 700 14px/14px "Montserrat";

    --font-dropdown-description-m: var(--font-style-base) 500 10px/10px "Montserrat";

    --font-dropdown-description-s: var(--font-style-base) 500 10px/10px "Montserrat";

    --font-dropdown-divider-description-m: var(--font-style-base) 600 12px/12px "Montserrat";

    --font-dropdown-divider-description-m-transform: uppercase;

    --font-dropdown-divider-description-s: var(--font-style-base) 600 10px/10px "Montserrat";

    --font-dropdown-divider-description-s-transform: uppercase;

    --font-dropdown-text-m: var(--font-style-base) 500 16px/16px "Montserrat";

    --font-dropdown-text-s: var(--font-style-base) 500 14px/14px "Montserrat";

    --font-family-base: Montserrat;

    --font-field-horizontal-description: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-field-horizontal-label: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-field-vertical-description: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-field-vertical-label: var(--font-style-base) 600 16px/24px "Montserrat";

    --font-footer-description: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-footer-menu-text: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-footer-subtitle: var(--font-style-base) 600 14px/14px "Montserrat";

    --font-footer-text: var(--font-style-base) 500 14px/14px "Montserrat";

    --font-footer-title: var(--font-style-base) 600 18px/18px "Montserrat";

    --font-game-card-game-text: var(--font-style-base) 950 14px/14px "Montserrat";

    --font-game-card-game-text-transform: uppercase;

    --font-game-card-like-text: var(--font-style-base) 600 16px/24px "Montserrat";

    --font-game-card-live-text: var(--font-style-base) 700 12px/20px "Montserrat";

    --font-game-card-provider-text: var(--font-style-base) 700 8px/8px "Montserrat";

    --font-game-card-provider-text-transform: uppercase;

    --font-header-black-2xs: var(--font-style-base) 900 16px/24px "Montserrat";

    --font-header-black-l: var(--font-style-base) 900 28px/40px "Montserrat";

    --font-header-black-m: var(--font-style-base) 900 24px/40px "Montserrat";

    --font-header-black-s: var(--font-style-base) 900 20px/28px "Montserrat";

    --font-header-black-xl: var(--font-style-base) 900 32px/40px "Montserrat";

    --font-header-black-xs: var(--font-style-base) 900 18px/28px "Montserrat";

    --font-header-bold-2xs: var(--font-style-base) 700 16px/24px "Montserrat";

    --font-header-bold-l: var(--font-style-base) 700 28px/40px "Montserrat";

    --font-header-bold-m: var(--font-style-base) 700 24px/40px "Montserrat";

    --font-header-bold-s: var(--font-style-base) 700 20px/28px "Montserrat";

    --font-header-bold-xl: var(--font-style-base) 700 32px/40px "Montserrat";

    --font-header-bold-xs: var(--font-style-base) 700 18px/28px "Montserrat";

    --font-header-semi-bold-2xs: var(--font-style-base) 600 16px/24px "Montserrat";

    --font-header-semi-bold-l: var(--font-style-base) 600 28px/40px "Montserrat";

    --font-header-semi-bold-m: var(--font-style-base) 600 24px/40px "Montserrat";

    --font-header-semi-bold-s: var(--font-style-base) 600 20px/28px "Montserrat";

    --font-header-semi-bold-xl: var(--font-style-base) 600 32px/40px "Montserrat";

    --font-header-semi-bold-xs: var(--font-style-base) 600 18px/28px "Montserrat";

    --font-input-label-focus-l: var(--font-style-base) 600 14px/14px "Montserrat";

    --font-input-label-focus-m: var(--font-style-base) 600 12px/12px "Montserrat";

    --font-input-label-focus-s: var(--font-style-base) 600 10px/10px "Montserrat";

    --font-input-label-l: var(--font-style-base) 700 18px/24px "Montserrat";

    --font-input-label-m: var(--font-style-base) 600 16px/20px "Montserrat";

    --font-input-label-s: var(--font-style-base) 600 12px/16px "Montserrat";

    --font-input-placeholder-l: var(--font-style-base) 700 18px/24px "Montserrat";

    --font-input-placeholder-m: var(--font-style-base) 600 16px/20px "Montserrat";

    --font-input-placeholder-s: var(--font-style-base) 600 12px/16px "Montserrat";

    --font-input-value-l: var(--font-style-base) 700 18px/24px "Montserrat";

    --font-input-value-m: var(--font-style-base) 600 16px/20px "Montserrat";

    --font-input-value-s: var(--font-style-base) 600 12px/16px "Montserrat";

    --font-line-height-accordion-description: 20px;

    --font-line-height-accordion-header: 20px;

    --font-line-height-badge-text-l: 20px;

    --font-line-height-badge-text-m: 16px;

    --font-line-height-badge-text-s: 14px;

    --font-line-height-badge-text-xs: 8px;

    --font-line-height-body-2xs: 14px;

    --font-line-height-body-l: 24px;

    --font-line-height-body-m: 20px;

    --font-line-height-body-s: 18px;

    --font-line-height-body-xl: 28px;

    --font-line-height-body-xs: 16px;

    --font-line-height-button-store-description-l: 12px;

    --font-line-height-button-store-description-m: 12px;

    --font-line-height-button-store-text-l: 20px;

    --font-line-height-button-store-text-m: 18px;

    --font-line-height-button-text-l: 24px;

    --font-line-height-button-text-m: 20px;

    --font-line-height-button-text-s: 16px;

    --font-line-height-calendar-day-text-m: 24px;

    --font-line-height-calendar-day-text-s: 20px;

    --font-line-height-calendar-holiday-text-m: 24px;

    --font-line-height-calendar-holiday-text-s: 20px;

    --font-line-height-calendar-today-text-m: 24px;

    --font-line-height-calendar-today-text-s: 20px;

    --font-line-height-calendar-week-text-m: 24px;

    --font-line-height-calendar-week-text-s: 20px;

    --font-line-height-countdown-description-l: 18px;

    --font-line-height-countdown-description-m: 18px;

    --font-line-height-countdown-text-3xs: 8px;

    --font-line-height-countdown-text-l: 28px;

    --font-line-height-countdown-text-m: 24px;

    --font-line-height-countdown-text-s: 20px;

    --font-line-height-countdown-text-xs: 16px;

    --font-line-height-countdown-text-xxs: 14px;

    --font-line-height-counter-text-l: 12px;

    --font-line-height-counter-text-m: 10px;

    --font-line-height-counter-text-s: 8px;

    --font-line-height-counter-text-xl: 14px;

    --font-line-height-dropdown-description-m: 10px;

    --font-line-height-dropdown-description-s: 10px;

    --font-line-height-dropdown-divider-description-m: 12px;

    --font-line-height-dropdown-divider-description-s: 10px;

    --font-line-height-dropdown-text-m: 16px;

    --font-line-height-dropdown-text-s: 14px;

    --font-line-height-field-horizontal-description: 18px;

    --font-line-height-field-horizontal-label: 20px;

    --font-line-height-field-vertical-description: 18px;

    --font-line-height-field-vertical-label: 24px;

    --font-line-height-footer-description: 18px;

    --font-line-height-footer-menu-text: 18px;

    --font-line-height-footer-subtitle: 14px;

    --font-line-height-footer-text: 14px;

    --font-line-height-footer-title: 18px;

    --font-line-height-game-card-game-text: 14px;

    --font-line-height-game-card-like-text: 24px;

    --font-line-height-game-card-live-text: 18px;

    --font-line-height-game-card-provider-text: 8px;

    --font-line-height-header-2xs: 24px;

    --font-line-height-header-l: 40px;

    --font-line-height-header-m: 40px;

    --font-line-height-header-s: 28px;

    --font-line-height-header-xl: 40px;

    --font-line-height-header-xs: 28px;

    --font-line-height-input-external-text-description: 18px;

    --font-line-height-input-external-text-message: 18px;

    --font-line-height-input-label-focus-l: 14px;

    --font-line-height-input-label-focus-m: 12px;

    --font-line-height-input-label-focus-s: 10px;

    --font-line-height-input-label-l: 24px;

    --font-line-height-input-label-m: 20px;

    --font-line-height-input-label-s: 16px;

    --font-line-height-input-placeholder-l: 24px;

    --font-line-height-input-placeholder-m: 20px;

    --font-line-height-input-placeholder-s: 16px;

    --font-line-height-input-value-l: 24px;

    --font-line-height-input-value-m: 20px;

    --font-line-height-input-value-s: 16px;

    --font-line-height-menu-top-amount-text: 18px;

    --font-line-height-message-description-l: 20px;

    --font-line-height-message-description-m: 18px;

    --font-line-height-message-description-s: 16px;

    --font-line-height-message-line-description-desktop: 18px;

    --font-line-height-message-line-description-mobile: 18px;

    --font-line-height-message-line-text-desktop: 20px;

    --font-line-height-message-line-text-mobile: 20px;

    --font-line-height-message-text-l: 24px;

    --font-line-height-message-text-m: 20px;

    --font-line-height-message-text-s: 18px;

    --font-line-height-modal-body-text-desktop: 40px;

    --font-line-height-modal-body-text-mobile: 28px;

    --font-line-height-modal-description-desktop: 24px;

    --font-line-height-modal-description-mobile: 20px;

    --font-line-height-modal-header-desktop: 28px;

    --font-line-height-modal-header-mobile: 24px;

    --font-line-height-modal-system-body-text-desktop: 40px;

    --font-line-height-modal-system-body-text-mobile: 28px;

    --font-line-height-modal-system-description-desktop: 24px;

    --font-line-height-modal-system-description-mobile: 20px;

    --font-line-height-navbar-text-desktop: 20px;

    --font-line-height-navbar-text-mobile: 16px;

    --font-line-height-notification-description-desktop: 20px;

    --font-line-height-notification-description-mobile: 18px;

    --font-line-height-notification-text-desktop: 24px;

    --font-line-height-notification-text-mobile: 20px;

    --font-line-height-notification-timer-text-desktop: 20px;

    --font-line-height-notification-timer-text-mobile: 16px;

    --font-line-height-pagination-text-m: 24px;

    --font-line-height-pagination-text-s: 20px;

    --font-line-height-progress-bar-text-l: 24px;

    --font-line-height-progress-bar-text-m: 16px;

    --font-line-height-progress-bar-text-s: 8px;

    --font-line-height-selector-external-text-message: 18px;

    --font-line-height-sidebar-card-description-l: 10px;

    --font-line-height-sidebar-card-description-m: 10px;

    --font-line-height-sidebar-card-description-s: 10px;

    --font-line-height-sidebar-card-text-l: 14px;

    --font-line-height-sidebar-card-text-m: 12px;

    --font-line-height-sidebar-card-text-s: 10px;

    --font-line-height-sidebar-list-header: 20px;

    --font-line-height-sidebar-list-text: 20px;

    --font-line-height-step-description-l: 16px;

    --font-line-height-step-description-m: 16px;

    --font-line-height-step-point-text-l: 18px;

    --font-line-height-step-text-l: 20px;

    --font-line-height-step-text-m: 12px;

    --font-line-height-tab-text-l: 24px;

    --font-line-height-tab-text-m: 20px;

    --font-line-height-tab-text-s: 16px;

    --font-line-height-table-header: 16px;

    --font-line-height-table-modal-description: 14px;

    --font-line-height-table-modal-text: 14px;

    --font-line-height-table-modal-value: 20px;

    --font-line-height-table-text: 20px;

    --font-line-height-tag-text-m: 16px;

    --font-line-height-tag-text-s: 16px;

    --font-line-height-title-block-description-desktop: 24px;

    --font-line-height-title-block-description-mobile: 20px;

    --font-line-height-title-block-text-desktop: 28px;

    --font-line-height-title-block-text-mobile: 20px;

    --font-line-height-title-card-description-desktop: 18px;

    --font-line-height-title-card-description-mobile: 16px;

    --font-line-height-title-card-text-desktop: 24px;

    --font-line-height-title-card-text-mobile: 20px;

    --font-line-height-tooltip-text: 20px;

    --font-line-height-user-menu-description: 16px;

    --font-line-height-user-menu-email-text: 16px;

    --font-line-height-user-menu-header: 24px;

    --font-line-height-user-menu-text: 16px;

    --font-line-height-user-menu-title: 18px;

    --font-line-height-user-menu-value: 16px;

    --font-menu-top-amount-text: var(--font-style-base) 700 12px/20px "Montserrat";

    --font-message-description-l: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-message-description-m: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-message-description-s: var(--font-style-base) 500 10px/20px "Montserrat";

    --font-message-line-description-desktop: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-message-line-description-mobile: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-message-line-text-desktop: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-message-line-text-mobile: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-message-text-l: var(--font-style-base) 700 16px/24px "Montserrat";

    --font-message-text-m: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-message-text-s: var(--font-style-base) 700 12px/20px "Montserrat";

    --font-modal-body-text-desktop: var(--font-style-base) 600 24px/40px "Montserrat";

    --font-modal-body-text-mobile: var(--font-style-base) 600 20px/28px "Montserrat";

    --font-modal-description-desktop: var(--font-style-base) 500 16px/24px "Montserrat";

    --font-modal-description-mobile: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-modal-header-desktop: var(--font-style-base) 700 18px/28px "Montserrat";

    --font-modal-header-mobile: var(--font-style-base) 700 16px/24px "Montserrat";

    --font-navbar-text-desktop: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-navbar-text-mobile: var(--font-style-base) 600 10px/16px "Montserrat";

    --font-pagination-text-m: var(--font-style-base) 500 16px/24px "Montserrat";

    --font-pagination-text-s: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-paragraph-spacing-accordion-description: 14px;

    --font-paragraph-spacing-body-2xs: 14px;

    --font-paragraph-spacing-body-l: 14px;

    --font-paragraph-spacing-body-m: 14px;

    --font-paragraph-spacing-body-s: 14px;

    --font-paragraph-spacing-body-xl: 14px;

    --font-paragraph-spacing-body-xs: 14px;

    --font-paragraph-spacing-footer-description: 14px;

    --font-paragraph-spacing-modal-description-desktop: 14px;

    --font-paragraph-spacing-modal-description-mobile: 14px;

    --font-paragraph-spacing-modal-system-description-desktop: 14px;

    --font-paragraph-spacing-modal-system-description-mobile: 14px;

    --font-progress-bar-text-l: var(--font-style-base) 700 16px/24px "Montserrat";

    --font-progress-bar-text-m: var(--font-style-base) 600 12px/16px "Montserrat";

    --font-progress-bar-text-s: var(--font-style-base) 600 8px/8px "Montserrat";

    --font-sidebar-card-description-l: var(--font-style-base) 500 10px/10px "Montserrat";

    --font-sidebar-card-description-m: var(--font-style-base) 500 10px/10px "Montserrat";

    --font-sidebar-card-description-s: var(--font-style-base) 500 10px/10px "Montserrat";

    --font-sidebar-card-text-l: var(--font-style-base) 700 14px/14px "Montserrat";

    --font-sidebar-card-text-m: var(--font-style-base) 700 12px/12px "Montserrat";

    --font-sidebar-card-text-s: var(--font-style-base) 700 10px/10px "Montserrat";

    --font-sidebar-list-header: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-sidebar-list-text: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-size-body-2xs: 8px;

    --font-size-body-l: 16px;

    --font-size-body-m: 14px;

    --font-size-body-s: 12px;

    --font-size-body-xl: 18px;

    --font-size-body-xs: 10px;

    --font-size-dropdown-divider-description-m: 12px;

    --font-size-dropdown-divider-description-s: 10px;

    --font-size-header-2xs: 16px;

    --font-size-header-l: 28px;

    --font-size-header-m: 24px;

    --font-size-header-s: 20px;

    --font-size-header-xl: 32px;

    --font-size-header-xs: 18px;

    --font-size-input-external-text-description: 12px;

    --font-size-input-external-text-message: 12px;

    --font-size-modal-system-body-text-desktop: 24px;

    --font-size-modal-system-body-text-mobile: 20px;

    --font-size-modal-system-description-desktop: 16px;

    --font-size-modal-system-description-mobile: 14px;

    --font-size-notification-description-desktop: 14px;

    --font-size-notification-description-mobile: 12px;

    --font-size-notification-text-desktop: 16px;

    --font-size-notification-text-mobile: 14px;

    --font-size-notification-timer-text-desktop: 14px;

    --font-size-notification-timer-text-mobile: 12px;

    --font-size-selector-external-text-message: 12px;

    --font-step-description-l: var(--font-style-base) 500 10px/20px "Montserrat";

    --font-step-description-m: var(--font-style-base) 500 10px/20px "Montserrat";

    --font-step-point-text-l: var(--font-style-base) 700 12px/20px "Montserrat";

    --font-step-text-l: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-step-text-m: var(--font-style-base) 500 12px/12px "Montserrat";

    --font-style-base: normal;

    --font-tab-text-l: var(--font-style-base) 600 18px/24px "Montserrat";

    --font-tab-text-m: var(--font-style-base) 600 16px/20px "Montserrat";

    --font-tab-text-s: var(--font-style-base) 600 12px/16px "Montserrat";

    --font-table-header: var(--font-style-base) 700 12px/16px "Montserrat";

    --font-table-modal-description: var(--font-style-base) 500 12px/14px "Montserrat";

    --font-table-modal-text: var(--font-style-base) 600 14px/14px "Montserrat";

    --font-table-modal-value: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-table-text: var(--font-style-base) 600 14px/20px "Montserrat";

    --font-tag-text-m: var(--font-style-base) 600 14px/16px "Montserrat";

    --font-tag-text-s: var(--font-style-base) 600 12px/16px "Montserrat";

    --font-title-block-description-desktop: var(--font-style-base) 500 16px/24px "Montserrat";

    --font-title-block-description-mobile: var(--font-style-base) 500 14px/20px "Montserrat";

    --font-title-block-text-desktop: var(--font-style-base) 700 28px/28px "Montserrat";

    --font-title-block-text-mobile: var(--font-style-base) 600 20px/20px "Montserrat";

    --font-title-card-description-desktop: var(--font-style-base) 500 12px/20px "Montserrat";

    --font-title-card-description-mobile: var(--font-style-base) 500 10px/20px "Montserrat";

    --font-title-card-text-desktop: var(--font-style-base) 700 16px/24px "Montserrat";

    --font-title-card-text-mobile: var(--font-style-base) 700 14px/20px "Montserrat";

    --font-tooltip-text: var(--font-body-semi-bold-m);

    --font-user-menu-description: var(--font-style-base) 500 10px/16px "Montserrat";

    --font-user-menu-email-text: var(--font-style-base) 500 10px/16px "Montserrat";

    --font-user-menu-header: var(--font-style-base) 700 20px/24px "Montserrat";

    --font-user-menu-text: var(--font-style-base) 500 10px/16px "Montserrat";

    --font-user-menu-title: var(--font-style-base) 500 12px/18px "Montserrat";

    --font-user-menu-value: var(--font-style-base) 700 10px/16px "Montserrat";

    --font-variant-numeric: normal;

    --font-weight-black: 900;

    --font-weight-bold: 700;

    --font-weight-dropdown-divider-description-m: 600;

    --font-weight-dropdown-divider-description-s: 600;

    --font-weight-extra-bold: 800;

    --font-weight-input-external-text-description: 500;

    --font-weight-input-external-text-message: 500;

    --font-weight-light: 300;

    --font-weight-modal-system-body-text-desktop: 600;

    --font-weight-modal-system-body-text-mobile: 600;

    --font-weight-modal-system-description-desktop: 500;

    --font-weight-modal-system-description-mobile: 500;

    --font-weight-notification-description-desktop: 500;

    --font-weight-notification-description-mobile: 500;

    --font-weight-notification-text-desktop: 600;

    --font-weight-notification-text-mobile: 600;

    --font-weight-notification-timer-text-desktop: 600;

    --font-weight-notification-timer-text-mobile: 600;

    --font-weight-regular: 500;

    --font-weight-selector-external-text-message: 500;

    --font-weight-semi-bold: 600;

    --footer-border-size: 2px;

    --footer-bottom-block-element-spacing: 16px;

    --footer-bottom-block-horizontal-spacing: 24px;

    --footer-bottom-block-license-text-spacing: 12px;

    --footer-bottom-block-vertical-spacing: 16px;

    --footer-expand-desktop: 24px 0;

    --footer-expand-mobile: 16px 0;

    --footer-payment-card-border-size: 2px;

    --footer-payment-card-icon-height: 56px;

    --footer-payment-card-icon-width: 87px;

    --footer-payment-container-border-radius: 6px;

    --footer-payment-container-border-size: 2px;

    --footer-payment-container-expand-desktop: 6px 40px;

    --footer-payment-container-expand-mobile: 6px 16px;

    --footer-spacing-desktop: 32px;

    --footer-spacing-mobile: 32px;

    --footer-top-block-content-spacing: 24px;

    --footer-top-block-element-spacing: 8px;

    --footer-top-block-list-spacing: 12px;

    --footer-top-block-social-icon-size: 32px;

    --game-card-border-radius: 12px;

    --game-card-border-size: 2px;

    --game-card-footer-expand: 4px 8px;

    --game-card-footer-spacing: 2px;

    --game-card-header-expand: 8px 8px 0 8px;

    --game-card-header-horizontal-spacing: 4px;

    --game-card-header-icon-size: 24px;

    --game-card-header-vertical-spacing: 4px;

    --game-card-like-active-icon-size: 28px;

    --game-card-like-border-size: 2px;

    --game-card-like-icon-size: 24px;

    --game-card-like-text-expand: 0 2px;

    --game-card-live-border-radius: 8px;

    --game-card-live-expand: 2px;

    --game-card-live-item-dot-size: 2px;

    --game-card-live-item-expand: 4px;

    --game-card-live-item-group-border-radius: 6px;

    --game-card-live-item-height: 20px;

    --game-card-live-item-icon-size: 12px;

    --game-card-live-item-min-width: 20px;

    --game-card-live-item-spacing: 2px;

    --game-card-max-height: 288px;

    --game-card-max-width: 216px;

    --game-card-min-height: 100px;

    --game-card-min-width: 80px;

    --game-card-overlay-background-blur: 8px;

    --game-card-overlay-expand: 16px 0 0 0;

    --game-card-overlay-icon-size: 40px;

    --game-card-title-border-radius: 8px;

    --game-card-title-expand: 4px;

    --game-card-title-height: 56px;

    --game-card-title-spacing: 4px;

    --gradient-activity-hub-bonus-hub-balance-dropdown-bonus-money: linear-gradient(90deg, var(--color-su900) 0%, var(--color-dark-grey-1) 50%);

    --gradient-activity-hub-bonus-hub-balance-dropdown-daily-cashback: linear-gradient(90deg, var(--color-mi700) 0%, var(--color-dark-grey-1) 100%);

    --gradient-activity-hub-bonus-hub-balance-dropdown-rakeback: linear-gradient(90deg, var(--color-in700) 0%, var(--color-dark-grey-1) 100%);

    --gradient-activity-hub-bonus-hub-balance-dropdown-real-money: linear-gradient(90deg, var(--color-dark-grey-2) 0%, var(--color-dark-grey-1) 50%);

    --gradient-activity-hub-bonus-hub-bonuses-bonus-round: linear-gradient(270deg, var(--color-mi700) 0%, var(--color-in800) 100%);

    --gradient-activity-hub-bonus-hub-bonuses-casino-bonus: linear-gradient(270deg, var(--color-mi600) 0%, var(--color-in800) 100%);

    --gradient-activity-hub-bonus-hub-bonuses-deposit-bonus: linear-gradient(270deg, var(--color-mi600) 0%, var(--color-in800) 100%);

    --gradient-activity-hub-bonus-hub-bonuses-free-spins: linear-gradient(270deg, var(--color-mi700) 0%, var(--color-in800) 100%);

    --gradient-activity-hub-bonus-hub-bonuses-sport-bonus: linear-gradient(270deg, var(--color-in300) 0%, var(--color-in700) 100%);

    --gradient-activity-hub-bonus-hub-bonuses-sport-deposit-bonus: linear-gradient(270deg, var(--color-in300) 0%, var(--color-in700) 100%);

    --gradient-activity-hub-bonus-hub-loyalty-wheels-bronze: linear-gradient(90deg, var(--color-pr700) 0%, var(--color-dark-grey-1) 26%);

    --gradient-activity-hub-bonus-hub-loyalty-wheels-gold: linear-gradient(90deg, var(--color-su700) 0%, var(--color-dark-grey-1) 26%);

    --gradient-activity-hub-bonus-hub-loyalty-wheels-instant-wheel: linear-gradient(90deg, var(--color-da900) 0%, var(--color-dark-grey-1) 26%);

    --gradient-activity-hub-bonus-hub-loyalty-wheels-lock-wheel: linear-gradient(90deg, var(--color-dark-grey-3) 0%, var(--color-dark-grey-1) 26%);

    --gradient-activity-hub-bonus-hub-loyalty-wheels-platinum: linear-gradient(90deg, var(--color-mi600) 0%, var(--color-dark-grey-1) 26%);

    --gradient-activity-hub-bonus-hub-loyalty-wheels-silver: linear-gradient(90deg, var(--color-in600) 0%, var(--color-dark-grey-1) 26%);

    --gradient-activity-hub-bonus-hub-master: linear-gradient(90deg, var(--color-in600) 0%, var(--color-in800) 56.00000000000001%, var(--color-dark-grey-1) 100%);

    --gradient-activity-hub-bonus-hub-special: linear-gradient(90deg, var(--color-at500) 0%, var(--color-wa800) 44%, var(--color-wa900) 63%, var(--color-dark-grey-1) 100%);

    --gradient-activity-hub-calendar-grid-everyday-on: linear-gradient(180deg, var(--color-in400) 0%, var(--color-in600) 40%, var(--color-in700) 66%, var(--color-in800) 100%);

    --gradient-activity-hub-calendar-grid-special-off: linear-gradient(180deg, var(--color-at800) 0%, var(--color-wa900) 100%);

    --gradient-activity-hub-calendar-grid-special-on: linear-gradient(180deg, var(--color-at400) 0%, var(--color-wa700) 85%, var(--color-wa800) 100%);

    --gradient-activity-hub-today-card-everyday: linear-gradient(248deg, var(--color-in300) 0%, var(--color-in400) 32%, var(--color-in600) 72%, var(--color-in800) 100%);

    --gradient-activity-hub-today-card-special-day: linear-gradient(248deg, var(--color-at100) 0%, var(--color-at400) 24%, var(--color-wa700) 92%, var(--color-wa800) 100%);

    --gradient-black-bottom: linear-gradient(180deg, #00000000 0%, #000000e6 100%);

    --gradient-black-left: linear-gradient(270deg, #00000000 0%, #000000e6 100%);

    --gradient-black-right: linear-gradient(90deg, #00000000 0%, #000000e6 100%);

    --gradient-black-top: linear-gradient(180deg, #000000e6 0%, #00000000 100%);

    --gradient-bonus-selector: linear-gradient(180deg, var(--color-gradient-bonus-selector-step-1) 0%, var(--color-gradient-bonus-selector-step-2) 32%, var(--color-gradient-bonus-selector-step-3) 60%, var(--color-gradient-bonus-selector-step-4) 100%);

    --gradient-bonus-selector-hover: linear-gradient(180deg, var(--color-gradient-bonus-selector-hover-step-1) 0%, var(--color-gradient-bonus-selector-hover-step-2) 30%, var(--color-gradient-bonus-selector-hover-step-3) 56.00000000000001%, var(--color-gradient-bonus-selector-hover-step-4) 100%);

    --gradient-danger-accent: transparent;

    --gradient-dark-grey-0-bottom: linear-gradient(360deg, #000000ff 0%, #00000000 100%);

    --gradient-dark-grey-0-left: linear-gradient(90deg, #000000ff 0%, #00000000 100%);

    --gradient-dark-grey-0-right: transparent;

    --gradient-dark-grey-0-top: linear-gradient(180deg, #000000ff 0%, #00000000 100%);

    --gradient-dark-grey-1-bottom: linear-gradient(360deg, #23013aff 0%, #23013a00 100%);

    --gradient-dark-grey-1-left: linear-gradient(90deg, #23013aff 0%, #23013a00 100%);

    --gradient-dark-grey-1-right: linear-gradient(270deg, #23013aff 0%, #23013a00 100%);

    --gradient-dark-grey-1-top: linear-gradient(180deg, #23013aff 0%, #23013a00 100%);

    --gradient-dark-grey-2-bottom: linear-gradient(360deg, #2f054bff 0%, #2f054b00 100%);

    --gradient-dark-grey-2-left: linear-gradient(90deg, #2f054bff 0%, #2f054b00 100%);

    --gradient-dark-grey-2-right: linear-gradient(270deg, #2f054bff 0%, #2f054b00 100%);

    --gradient-dark-grey-2-top: linear-gradient(180deg, #2f054bff 0%, #2f054b00 100%);

    --gradient-dark-grey-3-bottom: linear-gradient(360deg, #3c0f5bff 0%, #3c0f5b00 100%);

    --gradient-dark-grey-3-left: linear-gradient(90deg, #3c0f5bff 0%, #3c0f5b00 100%);

    --gradient-dark-grey-3-right: linear-gradient(270deg, #3c0f5bff 0%, #3c0f5b00 100%);

    --gradient-dark-grey-3-top: linear-gradient(180deg, #3c0f5bff 0%, #3c0f5b00 100%);

    --gradient-default-top: transparent;

    --gradient-gr-1: linear-gradient(92deg, var(--color-gradient-gr-1-step-1) 0%, var(--color-gradient-gr-1-step-2) 50%, var(--color-gradient-gr-1-step-3) 100%);

    --gradient-gr-2: linear-gradient(93deg, var(--color-gradient-gr-2-step-1) 0%, var(--color-gradient-gr-2-step-2) 23%, var(--color-gradient-gr-2-step-3) 46%, var(--color-gradient-gr-2-step-4) 75%, var(--color-gradient-gr-2-step-5) 99%);

    --gradient-gr-3: linear-gradient(93deg, var(--color-gradient-gr-3-step-1) 0%, var(--color-gradient-gr-3-step-2) 23%, var(--color-gradient-gr-3-step-3) 46%, var(--color-gradient-gr-3-step-4) 75%, var(--color-gradient-gr-3-step-5) 99%);

    --gradient-primary-accent: transparent;

    --gradient-primary-bottom: linear-gradient(360deg, #9ee933ff 0%, #9ee93300 100%);

    --gradient-primary-left: linear-gradient(90deg, #9ee933ff 0%, #9ee93300 100%);

    --gradient-primary-right: linear-gradient(270deg, #9ee933ff 0%, #9ee93300 100%);

    --gradient-primary-top: linear-gradient(180deg, #9ee933ff 0%, #9ee93300 100%);

    --gradient-rose-accent: transparent;

    --gradient-secondary-accent: transparent;

    --gradient-success-accent: transparent;

    --gradient-vip-1: linear-gradient(180deg, var(--color-at100) 0%, var(--color-dgz000) 100%);

    --gradient-vip-2: linear-gradient(90deg, var(--color-at100) 0%, var(--color-dgz000) 40%);

    --gradient-vip-3: linear-gradient(152deg, var(--color-wa400) 0%, var(--color-gradient-vip-3-step-2) 42%, var(--color-gradient-vip-3-step-3) 57.99999999999999%, var(--color-at300) 71%, var(--color-wa500) 100%);

    --header-black-weight: 900;

    --header-bold-weight: 700;

    --header-semi-bold-weight: 600;

    --header-text-transform: ;

    --icon-size: 22px;

    --illumination-1: 0px 1px 2px 0px #9ee93352, 0px 0px 1px 0px #9ee933ff;

    --illumination-2: 0px 4px 8px 0px #9ee93352, 0px 0px 1px 0px #9ee93352;

    --illumination-3: 0px 8px 16px 0px #9ee9333d, 0px 0px 1px 0px #9ee93352;

    --illumination-4: 0px 12px 24px 0px #9ee9333d, 0px 0px 1px 0px #9ee93352;

    --illumination-5: 0px 24px 32px 0px #9ee9333d, 0px 0px 1px 0px #9ee93352;

    --illumination-6: 0px 40px 64px 0px #9ee9333d, 0px 0px 1px 0px #9ee93352;

    --info-icon-radius: 50%;

    --info-icon-scale: 50%;

    --info-l-font: var(--font-header-semi-bold-l);

    --info-l-icon-gap: var(--num-spacing-m24);

    --info-l-icon-size: 60px;

    --info-l-mobile-font: var(--font-header-semi-bold-s);

    --info-l-mobile-title-gap: var(--num-spacing-m8);

    --info-l-title-gap: var(--num-spacing-m16);

    --input-border-radius-l: 8px;

    --input-border-radius-m: 8px;

    --input-border-radius-s: 6px;

    --input-border-size-l: 1px;

    --input-border-size-m: 1px;

    --input-border-size-s: 1px;

    --input-button-icon-border-radius-l: 1000px;

    --input-button-icon-border-radius-m: 1000px;

    --input-button-icon-border-radius-s: 1000px;

    --input-button-icon-border-size-l: 1px;

    --input-button-icon-border-size-m: 1px;

    --input-button-icon-border-size-s: 1px;

    --input-button-icon-icon-size-l: 24px;

    --input-button-icon-icon-size-m: 20px;

    --input-button-icon-icon-size-s: 16px;

    --input-content-spacing-l: 6px;

    --input-content-spacing-m: 6px;

    --input-content-spacing-s: 4px;

    --input-expand-l: 0 12px;

    --input-expand-m: 0 10px;

    --input-expand-s: 0 8px;

    --input-height-l: 56px;

    --input-height-m: 44px;

    --input-height-s: 32px;

    --input-icon-container-border-radius-l: 1000px;

    --input-icon-container-border-radius-m: 1000px;

    --input-icon-container-border-radius-s: 1000px;

    --input-icon-container-border-size-l: 1px;

    --input-icon-container-border-size-m: 1px;

    --input-icon-container-border-size-s: 1px;

    --input-icon-container-icon-size-l: 28px;

    --input-icon-container-icon-size-m: 24px;

    --input-icon-container-icon-size-s: 20px;

    --input-multy-spacing: 8px;

    --input-outside-border-size-l: 2px;

    --input-outside-border-size-m: 2px;

    --input-outside-border-size-s: 2px;

    --input-text-container-expand-l: 0 4px;

    --input-text-container-expand-m: 0 4px;

    --input-text-container-expand-s: 0 4px;

    --input-text-container-vertical-spacing-l: 2px;

    --line-size-m: 2px;

    --line-size-s: 1px;

    --margin-2xl: 32px;

    --margin-2xs: 6px;

    --margin-3xl: 40px;

    --margin-3xs: 4px;

    --margin-4xl: 48px;

    --margin-4xs: 2px;

    --margin-5xl: 56px;

    --margin-l: 20px;

    --margin-m: 16px;

    --margin-s: 12px;

    --margin-xl: 24px;

    --margin-xs: 8px;

    --menu-amount-button-top-expand: 4px 6px;

    --menu-amount-text-container-expand: 0 6px;

    --menu-amount-top-expand: 4px;

    --menu-bottom-border-size: 1px;

    --menu-bottom-buttons-container-expand: 16px;

    --menu-bottom-buttons-container-spacing: 8px;

    --menu-expand: 8px 16px;

    --menu-expand-desktop: 16px;

    --menu-expand-mobile: 12px 16px;

    --menu-top-amount-border-radius: 16px;

    --menu-top-amount-border-size: 2px;

    --menu-top-amount-outside-border-size: 2px;

    --menu-top-border-size: 2px;

    --menu-top-icon-size: 24px;

    --menu-top-spacing-desktop: 16px;

    --menu-top-spacing-mobile: 8px;

    --menu-top-user-bar-spacing-desktop: 8px;

    --menu-top-user-bar-spacing-mobile: 4px;

    --message-border-radius-l: 8px;

    --message-border-radius-m: 8px;

    --message-border-radius-s: 8px;

    --message-border-size-l: 2px;

    --message-border-size-m: 2px;

    --message-border-size-s: 2px;

    --message-buttons-group-expand-l: 0 32px;

    --message-buttons-group-expand-m: 0 30px;

    --message-buttons-group-expand-s: 0 28px;

    --message-content-min-height-l: 24px;

    --message-content-min-height-m: 22px;

    --message-content-min-height-s: 20px;

    --message-expand-l: 12px;

    --message-expand-m: 10px;

    --message-expand-s: 8px;

    --message-horizontal-spacing-l: 8px;

    --message-horizontal-spacing-m: 8px;

    --message-horizontal-spacing-s: 8px;

    --message-icon-container-border-radius-l: 1000px;

    --message-icon-container-border-radius-m: 1000px;

    --message-icon-container-border-radius-s: 1000px;

    --message-icon-container-border-size-l: 1px;

    --message-icon-container-border-size-m: 1px;

    --message-icon-container-border-size-s: 1px;

    --message-icon-container-icon-size-l: 24px;

    --message-icon-container-icon-size-m: 22px;

    --message-icon-container-icon-size-s: 20px;

    --message-line-border-size-desktop: 2px;

    --message-line-border-size-mobile: 2px;

    --message-line-button-container-expand-mobile: 0 28px;

    --message-line-content-min-height-desktop: 20px;

    --message-line-content-min-height-mobile: 20px;

    --message-line-cookies-expand-desktop: 12px 16px;

    --message-line-cookies-expand-mobile: 8px 16px;

    --message-line-cookies-spacing-desktop: 16px;

    --message-line-cookies-spacing-mobile: 8px;

    --message-line-expand-desktop: 8px 16px;

    --message-line-expand-mobile: 8px;

    --message-line-icon-container-border-radius-desktop: 1000px;

    --message-line-icon-container-border-radius-mobile: 1000px;

    --message-line-icon-container-border-size-desktop: 1px;

    --message-line-icon-container-border-size-mobile: 1px;

    --message-line-icon-container-icon-size-desktop: 20px;

    --message-line-icon-container-icon-size-mobile: 20px;

    --message-line-spacing-desktop: 8px;

    --message-line-spacing-mobile: 8px;

    --message-line-text-container-spacing-desktop: 6px;

    --message-text-container-expand-m: 1px 0 0 0;

    --message-text-container-spacing-l: 4px;

    --message-text-container-spacing-m: 2px;

    --message-vertical-spacing-l: 12px;

    --message-vertical-spacing-m: 10px;

    --message-vertical-spacing-s: 8px;

    --modal-backdrop-filter: unset;

    --modal-body-button-close-top-expand-desktop: 16px;

    --modal-body-button-close-top-expand-mobile: 10px;

    --modal-body-content-expand-desktop: 8px 0 24px 0;

    --modal-body-content-expand-mobile: 8px 0 16px 0;

    --modal-body-content-spacing-desktop: 24px;

    --modal-body-content-spacing-mobile: 24px;

    --modal-body-expand-desktop: 0 24px;

    --modal-body-expand-mobile: 0 16px;

    --modal-body-form-spacing-desktop: 16px;

    --modal-body-form-spacing-mobile: 16px;

    --modal-body-status-border-radius-desktop: 32px;

    --modal-body-status-border-radius-mobile: 32px;

    --modal-body-status-border-size-desktop: 1px;

    --modal-body-status-border-size-mobile: 1px;

    --modal-body-status-icon-size-desktop: 32px;

    --modal-body-status-icon-size-mobile: 32px;

    --modal-body-status-size-desktop: 64px;

    --modal-body-status-size-mobile: 64px;

    --modal-body-text-container-spacing-desktop: 8px;

    --modal-body-text-container-spacing-mobile: 8px;

    --modal-border-radius-desktop: 16px;

    --modal-border-radius-mobile: 16px;

    --modal-border-size-desktop: 2px;

    --modal-border-size-mobile: 2px;

    --modal-bottom-expand-desktop: 24px;

    --modal-bottom-expand-mobile: 16px;

    --modal-footer-horizontal-spacing-desktop: 8px;

    --modal-footer-horizontal-spacing-mobile: 8px;

    --modal-footer-vertical-spacing-desktop: 8px;

    --modal-footer-vertical-spacing-mobile: 8px;

    --modal-header-border-width: 1px;

    --modal-header-horizontal-spacing-desktop: 12px;

    --modal-header-horizontal-spacing-mobile: 8px;

    --modal-header-min-height-desktop: 64px;

    --modal-header-min-height-mobile: 52px;

    --modal-header-text-container-expand-desktop: 12px 0;

    --modal-header-text-container-expand-mobile: 8px 0;

    --modal-left-expand-desktop: 24px;

    --modal-left-expand-mobile: 16px;

    --modal-right-expand-desktop: 24px;

    --modal-right-expand-mobile: 16px;

    --modal-system-body-button-close-expand-desktop: 16px 0 0 0;

    --modal-system-body-button-close-expand-mobile: 10px 0 0 0;

    --modal-system-body-content-expand-desktop: 8px 0 24px 0;

    --modal-system-body-content-expand-mobile: 8px 0 16px 0;

    --modal-system-body-content-spacing-desktop: 24px;

    --modal-system-body-content-spacing-mobile: 24px;

    --modal-system-body-expand-desktop: 0 24px;

    --modal-system-body-expand-mobile: 0 16px;

    --modal-system-body-status-border-radius-desktop: 32px;

    --modal-system-body-status-border-radius-mobile: 32px;

    --modal-system-body-status-border-size-desktop: 1px;

    --modal-system-body-status-border-size-mobile: 1px;

    --modal-system-body-status-icon-size-desktop: 32px;

    --modal-system-body-status-icon-size-mobile: 32px;

    --modal-system-body-status-size-desktop: 64px;

    --modal-system-body-status-size-mobile: 64px;

    --modal-system-body-text-container-spacing-desktop: 16px;

    --modal-system-body-text-container-spacing-mobile: 8px;

    --modal-system-border-radius-desktop: 16px;

    --modal-system-border-radius-mobile: 16px;

    --modal-system-border-size-desktop: 1px;

    --modal-system-border-size-mobile: 1px;

    --modal-system-expand-desktop: 24px;

    --modal-system-expand-mobile: 16px;

    --modal-system-footer-horizontal-spacing-desktop: 8px;

    --modal-system-footer-horizontal-spacing-mobile: 8px;

    --modal-system-footer-vertical-spacing-desktop: 8px;

    --modal-system-footer-vertical-spacing-mobile: 8px;

    --modal-top-expand-desktop: 24px;

    --modal-top-expand-mobile: 16px;

    --navbar-content-height-desktop: 20px;

    --navbar-dropdown-width-desktop: 200px;

    --navbar-expand-desktop: 2px 4px;

    --navbar-icon-container-border-radius-desktop: 8px;

    --navbar-icon-container-border-radius-mobile: 12px;

    --navbar-icon-container-border-size-desktop: 1px;

    --navbar-icon-container-border-size-mobile: 1px;

    --navbar-icon-container-icon-size-desktop: 16px;

    --navbar-icon-container-icon-size-mobile: 24px;

    --navbar-menu-spacing: 8px;

    --navbar-spacing-desktop: 4px;

    --navbar-width-mobile: 48px;

    --notification-border-radius-desktop: 12px;

    --notification-border-radius-mobile: 8px;

    --notification-border-size-desktop: 2px;

    --notification-border-size-mobile: 2px;

    --notification-button-icon-size-desktop: 24px;

    --notification-button-icon-size-mobile: 24px;

    --notification-content-min-height-desktop: 32px;

    --notification-content-min-height-mobile: 28px;

    --notification-expand-desktop: 12px;

    --notification-expand-mobile: 10px;

    --notification-horizontal-spacing-desktop: 8px;

    --notification-horizontal-spacing-mobile: 8px;

    --notification-icon-container-border-radius-desktop: 1000px;

    --notification-icon-container-border-radius-mobile: 1000px;

    --notification-icon-container-border-size-desktop: 1px;

    --notification-icon-container-border-size-mobile: 1px;

    --notification-icon-container-expand-desktop: 2px;

    --notification-icon-container-expand-mobile: 2px;

    --notification-icon-container-icon-size-desktop: 28px;

    --notification-icon-container-icon-size-mobile: 24px;

    --notification-image-size-desktop: 52px;

    --notification-image-size-mobile: 48px;

    --notification-long-expand-desktop: 0 0 4px 0;

    --notification-long-expand-mobile: 0 0 4px 0;

    --notification-text-container-spacing-desktop: 2px;

    --notification-text-container-spacing-mobile: 2px;

    --notification-timer-expand-desktop: 8px 12px;

    --notification-timer-expand-mobile: 8px 10px;

    --notification-timer-spacing-desktop: 8px;

    --notification-timer-spacing-mobile: 8px;

    --notification-vertical-spacing-desktop: 12px;

    --notification-vertical-spacing-mobile: 10px;

    --num-radius-pill: 1000px;

    --num-radius-r10: 10px;

    --num-radius-r12: 12px;

    --num-radius-r14: 14px;

    --num-radius-r16: 16px;

    --num-radius-r18: 18px;

    --num-radius-r2: 2px;

    --num-radius-r20: 20px;

    --num-radius-r22: 22px;

    --num-radius-r24: 24px;

    --num-radius-r26: 26px;

    --num-radius-r28: 28px;

    --num-radius-r30: 30px;

    --num-radius-r32: 32px;

    --num-radius-r4: 4px;

    --num-radius-r6: 6px;

    --num-radius-r8: 8px;

    --num-spacing-m1: 1px;

    --num-spacing-m10: 10px;

    --num-spacing-m12: 12px;

    --num-spacing-m14: 14px;

    --num-spacing-m16: 16px;

    --num-spacing-m18: 18px;

    --num-spacing-m2: 2px;

    --num-spacing-m20: 20px;

    --num-spacing-m22: 22px;

    --num-spacing-m24: 24px;

    --num-spacing-m26: 26px;

    --num-spacing-m28: 28px;

    --num-spacing-m30: 30px;

    --num-spacing-m32: 32px;

    --num-spacing-m34: 34px;

    --num-spacing-m36: 36px;

    --num-spacing-m38: 38px;

    --num-spacing-m4: 4px;

    --num-spacing-m40: 40px;

    --num-spacing-m42: 42px;

    --num-spacing-m44: 44px;

    --num-spacing-m46: 46px;

    --num-spacing-m48: 48px;

    --num-spacing-m50: 50px;

    --num-spacing-m52: 52px;

    --num-spacing-m54: 54px;

    --num-spacing-m56: 56px;

    --num-spacing-m58: 58px;

    --num-spacing-m6: 6px;

    --num-spacing-m60: 60px;

    --num-spacing-m62: 62px;

    --num-spacing-m64: 64px;

    --num-spacing-m8: 8px;

    --num-stroke-border: 2px;

    --num-stroke-hr: 1px;

    --numbers-n1: 1px;

    --numbers-n10: 10px;

    --numbers-n12: 12px;

    --numbers-n14: 14px;

    --numbers-n16: 16px;

    --numbers-n18: 18px;

    --numbers-n2: 2px;

    --numbers-n20: 20px;

    --numbers-n22: 22px;

    --numbers-n24: 24px;

    --numbers-n26: 26px;

    --numbers-n28: 28px;

    --numbers-n30: 30px;

    --numbers-n32: 32px;

    --numbers-n34: 34px;

    --numbers-n36: 36px;

    --numbers-n38: 38px;

    --numbers-n4: 4px;

    --numbers-n40: 40px;

    --numbers-n42: 42px;

    --numbers-n44: 44px;

    --numbers-n46: 46px;

    --numbers-n48: 48px;

    --numbers-n50: 50px;

    --numbers-n52: 52px;

    --numbers-n54: 54px;

    --numbers-n56: 56px;

    --numbers-n58: 58px;

    --numbers-n6: 6px;

    --numbers-n60: 60px;

    --numbers-n62: 62px;

    --numbers-n64: 64px;

    --numbers-n8: 8px;

    --numbers-pill: 1000px;

    --pagination-border-pill: 1000px;

    --pagination-button-border-radius-m: 8px;

    --pagination-button-border-radius-s: 8px;

    --pagination-button-border-size-m: 2px;

    --pagination-button-border-size-s: 2px;

    --pagination-button-content-size-m: 24px;

    --pagination-button-content-size-s: 20px;

    --pagination-button-expand-m: 8px;

    --pagination-button-expand-s: 6px;

    --pagination-l-border-radius: 8px;

    --pagination-m-border-radius: 8px;

    --pagination-m-expand: 0 8px;

    --pagination-s-border-radius: 8px;

    --pagination-s-expand: 0 6px;

    --pagination-spacing-m: 4px;

    --pagination-spacing-s: 4px;

    --pagination-xs-border-radius: 6px;

    --pagination-xs-expand: 0 4px;

    --preloader-icon-size-l: 56px;

    --preloader-icon-size-m: 40px;

    --preloader-icon-size-s: 24px;

    --progress-bar-border-radius-l: 12px;

    --progress-bar-border-radius-m: 8px;

    --progress-bar-border-radius-s: 4px;

    --progress-bar-border-radius-xs: 2px;

    --progress-bar-border-size-l: 2px;

    --progress-bar-border-size-m: 2px;

    --progress-bar-border-size-s: 2px;

    --progress-bar-border-size-xs: 1px;

    --progress-bar-divider-border-radius: 1px;

    --progress-bar-divider-height-l: 16px;

    --progress-bar-divider-height-m: 8px;

    --progress-bar-divider-height-s: 2px;

    --progress-bar-divider-vertical-spacing-l: 20px;

    --progress-bar-divider-vertical-spacing-m: 20px;

    --progress-bar-divider-vertical-spacing-s: 20px;

    --progress-bar-divider-width: 1px;

    --progress-bar-progress-border-radius-l: 12px;

    --progress-bar-progress-border-radius-m: 8px;

    --progress-bar-progress-border-radius-s: 4px;

    --progress-bar-progress-border-radius-xs: 2px;

    --progress-bar-progress-height-l: 24px;

    --progress-bar-progress-height-m: 16px;

    --progress-bar-progress-height-s: 8px;

    --progress-bar-progress-height-xs: 2px;

    --progress-bar-text-container-expand-l: 0 8px;

    --progress-bar-text-container-expand-m: 0 6px;

    --progress-bar-text-container-expand-s: 0 2px;

    --progress-border-radius-lined-outer: 1000px;

    --progress-border-radius-m: 1000px;

    --progress-border-radius-s: 1000px;

    --progress-l-background-border-radius: 1000px;

    --progress-l-height: 24px;

    --progress-l-progress-border-radius: 1000px;

    --progress-m-background-border-radius: 1000px;

    --progress-m-height: 16px;

    --progress-m-progress-border-radius: 1000px;

    --progress-round-border-size: 12px;

    --progress-s-background-border-radius: 1000px;

    --progress-s-height: 8px;

    --progress-s-progress-border-radius: 1000px;

    --scrollbar-border-radius: 1000px;

    --scrollbar-container-size: 8px;

    --scrollbar-size: 4px;

    --section-padding-l: 16px;

    --section-padding-m: 16px;

    --section-width: 1400px;

    --segment-border-color-outline: var(--color-dark-grey-4);

    --segment-border-offset: -2px;

    --segment-border-width: 2px;

    --segment-l-line-height: 150%;

    --segment-m-line-height: 150%;

    --segment-radius-l: 1000px;

    --segment-radius-m: 1000px;

    --segment-radius-outline: 1002px;

    --segment-radius-s: 1000px;

    --segment-s-line-height: 160%;

    --select-empty-display: none;

    --selector-border-size-m: 2px;

    --selector-border-size-s: 2px;

    --selector-checkbox-border-radius-m: 6px;

    --selector-checkbox-border-radius-s: 4px;

    --selector-checkbox-expand-m: 2px;

    --selector-checkbox-expand-s: 2px;

    --selector-checkbox-icon-size-m: 16px;

    --selector-checkbox-icon-size-s: 12px;

    --selector-outside-border-size-m: 2px;

    --selector-outside-border-size-s: 2px;

    --selector-radiobutton-border-radius-m: 1000px;

    --selector-radiobutton-border-radius-s: 1000px;

    --selector-radiobutton-expand-m: 4px;

    --selector-radiobutton-expand-s: 4px;

    --selector-radiobutton-radio-border-radius-m: 1000px;

    --selector-radiobutton-radio-border-radius-s: 1000px;

    --selector-radiobutton-radio-size-m: 12px;

    --selector-radiobutton-radio-size-s: 8px;

    --selector-switcher-border-radius-m: 12px;

    --selector-switcher-border-radius-s: 8px;

    --selector-switcher-expand-m: 2px;

    --selector-switcher-expand-s: 2px;

    --selector-switcher-tumbler-border-radius-m: 1000px;

    --selector-switcher-tumbler-border-radius-s: 1000px;

    --selector-switcher-tumbler-size-m: 16px;

    --selector-switcher-tumbler-size-s: 12px;

    --selector-switcher-width-m: 34px;

    --selector-switcher-width-s: 26px;

    --shadow-1: 0px 1px 2px 0px #00000052, 0px 0px 1px 0px #00000052;

    --shadow-2: 0px 4px 8px 0px #0000003d, 0px 0px 1px 0px #00000052;

    --shadow-3: 0px 8px 16px 0px #0000003d, 0px 0px 1px 0px #00000052;

    --shadow-4: 0px 12px 24px 0px #0000003d, 0px 0px 1px 0px #00000052;

    --shadow-5: 0px 24px 32px 0px #0000003d, 0px 0px 1px 0px #00000052;

    --shadow-6: 0px 40px 64px 0px #0000003d, 0px 0px 1px 0px #00000052;

    --shadow-blur-b1: 1px;

    --shadow-blur-b2: 2px;

    --shadow-blur-b3: 8px;

    --shadow-blur-b4: 16px;

    --shadow-blur-b5: 24px;

    --shadow-blur-b6: 32px;

    --shadow-blur-b7: 64px;

    --shadow-color-s1: 0px 40px 64px 0px #e458093d, 0px 0px 1px 0px #e4580952;

    --shadow-color-s2: 0px 24px 32px 0px #e458093d, 0px 0px 1px 0px #e4580952;

    --shadow-color-s3: 0px 12px 24px 0px #e458093d, 0px 0px 1px 0px #e4580952;

    --shadow-color-s4: 0px 8px 16px 0px #e458093d, 0px 0px 1px 0px #e4580952;

    --shadow-color-s5: 0px 4px 8px 0px #e4580952, 0px 0px 1px 0px #e4580952;

    --shadow-color-s6: 0px 1px 2px 0px #e4580952, 0px 0px 1px 0px #e4580952;

    --shadow-position-y1: 1px;

    --shadow-position-y2: 4px;

    --shadow-position-y3: 8px;

    --shadow-position-y4: 12px;

    --shadow-position-y5: 24px;

    --shadow-position-y6: 40px;

    --shadow-s1: 0 0 var(--shadow-blur-b1) 0 var(--color-c3), 0 var(--shadow-position-y6) var(--shadow-blur-b7) 0 var(--color-c2);

    --shadow-s2: 0 0 var(--shadow-blur-b1) 0 var(--color-c3), 0 var(--shadow-position-y5) var(--shadow-blur-b6) 0 var(--color-c2);

    --shadow-s3: 0 var(--shadow-position-y4) var(--shadow-blur-b5) 0 var(--color-c2), 0 0 var(--shadow-blur-b1) 0 var(--color-c3);

    --shadow-s4: 0 var(--shadow-position-y3) var(--shadow-blur-b4) 0 var(--color-c2), 0 0 var(--shadow-blur-b1) 0 var(--color-c3);

    --shadow-s5: 0 var(--shadow-position-y2) var(--shadow-blur-b3) 0 var(--color-c2), 0 0 var(--shadow-blur-b1) 0 var(--color-c3);

    --shadow-s6: 0 var(--shadow-position-y1) var(--shadow-blur-b2) 0 var(--color-c3), 0 0 var(--shadow-blur-b1) 0 var(--color-c3);

    --sidebar-body-expand: 8px;

    --sidebar-body-opened-container-spacing: 8px;

    --sidebar-body-opened-expand: 16px 0;

    --sidebar-body-opened-expand-desktop: 0 8px;

    --sidebar-body-opened-expand-mobile: 0 16px;

    --sidebar-body-opened-grid-spacing: 4px;

    --sidebar-body-opened-menu-spacing: 4px;

    --sidebar-body-opened-spacing: 16px;

    --sidebar-body-spacing: 8px;

    --sidebar-border-size: 2px;

    --sidebar-card-border-radius: 8px;

    --sidebar-card-border-size: 2px;

    --sidebar-card-content-height: 48px;

    --sidebar-card-lock-icon-size: 12px;

    --sidebar-card-mini-icon-container-expand: 12px;

    --sidebar-card-mini-icon-container-icon-size: 24px;

    --sidebar-card-mini-image-container-expand: 4px;

    --sidebar-card-mini-image-container-image-size: 40px;

    --sidebar-card-referal-content-spacing: 4px;

    --sidebar-card-referal-expand: 10px 8px 10px 12px;

    --sidebar-card-referal-icon-container-border-radius: 10px;

    --sidebar-card-referal-icon-container-border-size: 1px;

    --sidebar-card-referal-icon-container-icon-size: 20px;

    --sidebar-card-referal-spacing: 8px;

    --sidebar-card-text-container-expand: 0 4px;

    --sidebar-card-text-container-spacing-l: 6px;

    --sidebar-card-text-container-spacing-m: 6px;

    --sidebar-card-text-container-spacing-s: 4px;

    --sidebar-card-widget-expand: 4px;

    --sidebar-card-widget-image-container-expand: 4px;

    --sidebar-card-widget-image-size: 40px;

    --sidebar-card-widget-micro-expand: 2px 8px 2px 2px;

    --sidebar-card-widget-micro-image-container-expand: 2px;

    --sidebar-card-widget-micro-image-size: 28px;

    --sidebar-card-widget-micro-spacing: 2px;

    --sidebar-card-widget-spacing: 8px;

    --sidebar-header-border-size: 2px;

    --sidebar-header-content-expand: 0 24px 0 0;

    --sidebar-header-content-height: 64px;

    --sidebar-header-expand: 0 20px;

    --sidebar-header-icon-size: 24px;

    --sidebar-list-item-action-container-spacing: 4px;

    --sidebar-list-item-border-radius: 8px;

    --sidebar-list-item-border-size: 2px;

    --sidebar-list-item-content-height: 20px;

    --sidebar-list-item-expand: 8px;

    --sidebar-list-item-icon-container-border-radius: 10px;

    --sidebar-list-item-icon-container-border-size: 1px;

    --sidebar-list-item-icon-container-icon-size: 20px;

    --sidebar-list-item-spacing: 8px;

    --sidebar-multiscreen-arrow-icon-size: 12px;

    --sidebar-multiscreen-border-radius: 0 8px 8px 0;

    --sidebar-multiscreen-border-size: 2px;

    --sidebar-multiscreen-content-border-right-size: 1px;

    --sidebar-multiscreen-content-expand: 20px;

    --sidebar-multiscreen-content-spacing: 24px;

    --sidebar-multiscreen-icon-size: 24px;

    --size-2xl: 32px;

    --size-2xs: 16px;

    --size-3xl: 40px;

    --size-3xs: 14px;

    --size-4xl: 44px;

    --size-4xs: 12px;

    --size-5xl: 48px;

    --size-5xs: 10px;

    --size-6xl: 52px;

    --size-6xs: 8px;

    --size-7xl: 56px;

    --size-8xl: 64px;

    --size-l: 28px;

    --size-m: 24px;

    --size-s: 20px;

    --size-xl: 30px;

    --size-xs: 18px;

    --spacing-2xl: 32px;

    --spacing-2xs: 6px;

    --spacing-3xl: 44px;

    --spacing-3xs: 4px;

    --spacing-4xl: 56px;

    --spacing-4xs: 2px;

    --spacing-5xl: 64px;

    --spacing-5xs: 1px;

    --spacing-l: 20px;

    --spacing-m: 16px;

    --spacing-s: 12px;

    --spacing-xl: 24px;

    --spacing-xs: 8px;

    --step-horizontal-point-container-expand-l: 0 4px 0 0;

    --step-horizontal-point-container-expand-m: 0 4px 0 0;

    --step-horizontal-point-container-spacing-l: 4px;

    --step-horizontal-point-container-spacing-m: 4px;

    --step-horizontal-spacing-l: 8px;

    --step-horizontal-spacing-m: 10px;

    --step-horizontal-text-container-expand-l: 0 4px 0 2px;

    --step-horizontal-text-container-expand-m: 0 4px 0 1px;

    --step-horizontal-text-container-spacing-m: 4px;

    --step-line-border-radius-l: 1000px;

    --step-line-border-radius-m: 1000px;

    --step-point-border-radius-l: 12px;

    --step-point-border-radius-m: 4px;

    --step-point-border-size-l: 2px;

    --step-point-border-size-m: 1px;

    --step-point-size-l: 20px;

    --step-point-size-m: 8px;

    --step-vertical-point-container-expand-l: 0 0 4px 0;

    --step-vertical-point-container-expand-m: 0 0 4px 0;

    --step-vertical-point-container-spacing-l: 4px;

    --step-vertical-point-container-spacing-m: 4px;

    --step-vertical-spacing-l: 10px;

    --step-vertical-spacing-m: 8px;

    --step-vertical-text-container-expand-l: 0 0 12px 0;

    --step-vertical-text-container-expand-m: 0 0 12px 0;

    --step-vertical-text-container-spacing-m: 4px;

    --switch-checked-text: var(--color-button-primary);

    --switch-knob-radius-l: 50%;

    --switch-knob-radius-m: 50%;

    --switch-knob-radius-s: 50%;

    --tab-border-radius-l: 28px;

    --tab-border-radius-m: 24px;

    --tab-border-radius-s: 16px;

    --tab-border-size-l: 2px;

    --tab-border-size-m: 2px;

    --tab-border-size-s: 2px;

    --tab-content-height-l: 24px;

    --tab-content-height-m: 20px;

    --tab-content-height-s: 16px;

    --tab-expand-l: 16px;

    --tab-expand-m: 12px;

    --tab-expand-s: 8px;

    --tab-icon-container-border-radius-l: 1000px;

    --tab-icon-container-border-radius-m: 1000px;

    --tab-icon-container-border-radius-s: 1000px;

    --tab-icon-container-border-size-l: 1px;

    --tab-icon-container-border-size-m: 1px;

    --tab-icon-container-border-size-s: 1px;

    --tab-icon-container-icon-size-l: 24px;

    --tab-icon-container-icon-size-m: 20px;

    --tab-icon-container-icon-size-s: 16px;

    --tab-text-container-expand-l: 0 8px;

    --tab-text-container-expand-m: 0 8px;

    --tab-text-container-expand-s: 0 4px;

    --tab-underline-expand-l: 16px;

    --tab-underline-expand-m: 12px;

    --tab-underline-expand-s: 8px;

    --tab-underline-line-border-radius: 2px 2px 0 0;

    --tab-underline-spacing-l: 8px;

    --tab-underline-spacing-m: 8px;

    --tab-underline-spacing-s: 4px;

    --table-body-expand: 12px 16px;

    --table-body-icon-size: 20px;

    --table-header-border-bottom-size: 1px;

    --table-header-content-height: 16px;

    --table-header-expand: 12px 16px;

    --table-header-icon-container-border-radius: 1000px;

    --table-header-icon-container-border-size: 1px;

    --table-header-icon-container-icon-size: 16px;

    --table-header-icon-size: 16px;

    --table-header-spacing: 8px;

    --table-modal-border-radius: 6px;

    --table-modal-border-size: 2px;

    --table-modal-content-min-height: 20px;

    --table-modal-expand: 8px 12px;

    --table-modal-horizontal-spacing: 8px;

    --table-modal-icon-container-border-radius: 1000px;

    --table-modal-icon-container-border-size: 1px;

    --table-modal-icon-container-icon-size: 20px;

    --table-modal-text-container-horizontal-spacing: 8px;

    --table-modal-text-container-vertical-spacing: 4px;

    --table-row-border-bottom-size: 1px;

    --table-row-content-height: 20px;

    --table-row-expand: 12px 16px;

    --table-row-icon-container-border-radius: 1000px;

    --table-row-icon-container-border-size: 1px;

    --table-row-icon-container-icon-size: 20px;

    --table-row-spacing: 8px;

    --tabs-active-line-height-l: 2px;

    --tabs-active-line-height-m: 2px;

    --tabs-active-line-height-s: 2px;

    --tabs-active-line-radius: 100px 100px 0 0;

    --tabs-border-bottom: 1px solid var(--color-dark-grey-2);

    --tabs-content-padding-l: 15px 0;

    --tabs-content-padding-m: 11px 0;

    --tabs-content-padding-s: 5px 0;

    --tabs-group-border-radius-l: 28px;

    --tabs-group-border-radius-m: 24px;

    --tabs-group-border-radius-s: 16px;

    --tabs-group-border-size-l: 2px;

    --tabs-group-border-size-m: 2px;

    --tabs-group-border-size-s: 2px;

    --tabs-group-underline-border-size-l: 1px;

    --tabs-group-underline-border-size-m: 1px;

    --tabs-group-underline-border-size-s: 1px;

    --tag-background-default: var(--color-tag-background);

    --tag-border-radius-m: 16px;

    --tag-border-radius-s: 12px;

    --tag-border-size-m: 2px;

    --tag-border-size-s: 2px;

    --tag-content-height-m: 16px;

    --tag-content-height-s: 16px;

    --tag-expand-m: 6px;

    --tag-expand-s: 4px;

    --tag-icon-color-primary: var(--color-pr050);

    --tag-icon-color-secondary: var(--color-mid-grey-2);

    --tag-icon-container-border-radius-m: 1000px;

    --tag-icon-container-border-radius-s: 1000px;

    --tag-icon-container-border-size-m: 1px;

    --tag-icon-container-border-size-s: 1px;

    --tag-icon-container-icon-size-m: 16px;

    --tag-icon-container-icon-size-s: 16px;

    --tag-icon-opacity: 1;

    --tag-icon-opacity-hover: 1;

    --tag-m-icon-size: 20px;

    --tag-s-icon-size: 16px;

    --tag-text-container-expand-m: 0 4px;

    --tag-text-container-expand-s: 0 2px;

    --text-s10: 10px;

    --text-s12: 12px;

    --text-s14: 14px;

    --text-s16: 16px;

    --text-s18: 18px;

    --text-s20: 20px;

    --text-s24: 24px;

    --text-s28: 28px;

    --text-s32: 32px;

    --text-s36: 36px;

    --text-s40: 40px;

    --text-s44: 44px;

    --text-s48: 48px;

    --text-s52: 52px;

    --text-s56: 56px;

    --text-s64: 64px;

    --text-s8: 8px;

    --title-block-border-size-desktop: 2px;

    --title-block-border-size-mobile: 2px;

    --title-block-content-spacing-desktop: 8px;

    --title-block-content-spacing-mobile: 6px;

    --title-block-horizontal-spacing-desktop: 12px;

    --title-block-horizontal-spacing-mobile: 8px;

    --title-block-icon-container-border-radius-desktop: 16px;

    --title-block-icon-container-border-radius-mobile: 16px;

    --title-block-icon-container-border-size-desktop: 1px;

    --title-block-icon-container-border-size-mobile: 1px;

    --title-block-icon-container-icon-size-desktop: 32px;

    --title-block-icon-container-icon-size-mobile: 28px;

    --title-block-text-container-horizontal-spacing-desktop: 8px;

    --title-block-text-container-horizontal-spacing-mobile: 6px;

    --title-block-text-container-spacing-desktop: 4px;

    --title-block-text-container-spacing-mobile: 4px;

    --title-block-vertical-spacing-mobile: 8px;

    --title-card-border-size-desktop: 2px;

    --title-card-border-size-mobile: 2px;

    --title-card-content-spacing-desktop: 6px;

    --title-card-content-spacing-mobile: 4px;

    --title-card-horizontal-spacing-desktop: 12px;

    --title-card-horizontal-spacing-mobile: 8px;

    --title-card-icon-container-border-radius-desktop: 12px;

    --title-card-icon-container-border-radius-mobile: 12px;

    --title-card-icon-container-border-size-desktop: 1px;

    --title-card-icon-container-border-size-mobile: 1px;

    --title-card-icon-container-icon-size-desktop: 24px;

    --title-card-icon-container-icon-size-mobile: 22px;

    --title-card-text-container-horizontal-spacing-desktop: 6px;

    --title-card-text-container-horizontal-spacing-mobile: 4px;

    --title-card-vertical-spacing-mobile: 8px;

    --tooltip-border-radius: 8px;

    --tooltip-expand: 8px;

    --tooltip-radius: 8px;

    --tooltip-tail-width: 10px;

    --user-menu-body-expand: 8px 12px 12px 12px;

    --user-menu-body-progress-container-border-radius: 8px;

    --user-menu-body-progress-container-border-size: 2px;

    --user-menu-body-progress-container-expand: 6px 8px 8px 8px;

    --user-menu-body-progress-container-icon-size: 12px;

    --user-menu-body-progress-container-spacing: 12px;

    --user-menu-body-progress-container-text-spacing: 4px;

    --user-menu-body-spacing: 8px;

    --user-menu-border-radius-desktop: 8px;

    --user-menu-border-radius-mobile: 0 0 8px 8px;

    --user-menu-border-size: 2px;

    --user-menu-content-border-radius: 8px;

    --user-menu-content-border-size: 2px;

    --user-menu-expand-desktop: 16px;

    --user-menu-expand-mobile: 16px;

    --user-menu-header-avatar-size: 56px;

    --user-menu-header-bottom-border-size: 1px;

    --user-menu-header-expand: 12px;

    --user-menu-header-icon-size: 20px;

    --user-menu-header-spacing: 12px;

    --user-menu-spacing: 8px;

    --withdrawal-limit-radius: 6px;

    --сountdown-border-radius-l: 8px;

    --сountdown-border-radius-m: 6px;

    --sectionPadding: 16px;

    --nav-banner-height: 0px;

    --border-radius-1000: 1000px;

    --border-radius-default: 8px;

    --nav-sidebar-width: 0;

    --gap-xs: 6px;

    --gap-s: 12px;

    --gap-m: 24px;

    --gap-l: 36px;

    --nav-height: 64px;

    --color-text-faded: #7a918b;

    --color-border: #585c834d;

    --color-background-missions: #1a799f;

    --color-text-ghost: #52586f;

    --point-size: 34px;

    --point-inner-size: 24px;

    --point-background-color: #105266;

    --point-border-color: #252c45;

    --m-app-height: 911px;

    --scrollbar-width: 10px;

    --app-height: 911px

}



body {

    font-family: var(--font-family-base), Verdana, sans-serif;

    font-style: var(--font-style-base);

    scrollbar-color: var(--color-scrollbar-background) transparent;

    font-variant-numeric: var(--font-variant-numeric)

}



button {

    margin: 0;

    padding: 0;

    font-size: inherit;

    font-family: inherit;

    font-style: inherit;

    background: 0 0;

    border: none

}



.Header-Black-2XS {

    font: var(--font-header-black-2xs);

    text-transform: var(--header-text-transform)

}



.Header-Black-XS {

    font: var(--font-header-black-xs);

    text-transform: var(--header-text-transform)

}



.Header-Black-S {

    font: var(--font-header-black-s);

    text-transform: var(--header-text-transform)

}



.Header-Black-M {

    font: var(--font-header-black-m);

    text-transform: var(--header-text-transform)

}



.Header-Black-L {

    font: var(--font-header-black-l);

    text-transform: var(--header-text-transform)

}



.Header-Black-XL {

    font: var(--font-header-black-xl);

    text-transform: var(--header-text-transform)

}



.Header-Bold-2XS {

    font: var(--font-header-bold-2xs);

    text-transform: var(--header-text-transform)

}



.Header-Bold-XS {

    font: var(--font-header-bold-xs);

    text-transform: var(--header-text-transform)

}



.Header-Bold-S {

    font: var(--font-header-bold-s);

    text-transform: var(--header-text-transform)

}



.Header-Bold-M {

    font: var(--font-header-bold-m);

    text-transform: var(--header-text-transform)

}



.Header-Bold-L {

    font: var(--font-header-bold-l);

    text-transform: var(--header-text-transform)

}



.Header-Bold-XL {

    font: var(--font-header-bold-xl);

    text-transform: var(--header-text-transform)

}



.Header-Semi-Bold-2XS {

    font: var(--font-header-semi-bold-2xs);

    text-transform: var(--header-text-transform)

}



.Header-Semi-Bold-XS {

    font: var(--font-header-semi-bold-xs);

    text-transform: var(--header-text-transform)

}



.Header-Semi-Bold-S {

    font: var(--font-header-semi-bold-s);

    text-transform: var(--header-text-transform)

}



.Header-Semi-Bold-M {

    font: var(--font-header-semi-bold-m);

    text-transform: var(--header-text-transform)

}



.Header-Semi-Bold-L {

    font: var(--font-header-semi-bold-l);

    text-transform: var(--header-text-transform)

}



.Header-Semi-Bold-XL {

    font: var(--font-header-semi-bold-xl);

    text-transform: var(--header-text-transform)

}



.Body-Bold-2XS {

    font: var(--font-body-bold-2xs)

}



.Body-Bold-XS {

    font: var(--font-body-bold-xs)

}



.Body-Bold-S {

    font: var(--font-body-bold-s)

}



.Body-Bold-M {

    font: var(--font-body-bold-m)

}



.Body-Bold-L {

    font: var(--font-body-bold-l)

}



.Body-Bold-XL {

    font: var(--font-body-bold-xl)

}



.Body-Semi-Bold-2XS {

    font: var(--font-body-semi-bold-2xs)

}



.Body-Semi-Bold-XS {

    font: var(--font-body-semi-bold-xs)

}



.Body-Semi-Bold-S {

    font: var(--font-body-semi-bold-s)

}



.Body-Semi-Bold-M {

    font: var(--font-body-semi-bold-m)

}



.Body-Semi-Bold-L {

    font: var(--font-body-semi-bold-l)

}



.Body-Semi-Bold-XL {

    font: var(--font-body-semi-bold-xl)

}



.Body-Regular-2XS {

    font: var(--font-body-regular-2xs)

}



.Body-Regular-XS {

    font: var(--font-body-regular-xs)

}



.Body-Regular-S {

    font: var(--font-body-regular-s)

}



.Body-Regular-M {

    font: var(--font-body-regular-m)

}



.Body-Regular-L {

    font: var(--font-body-regular-l)

}



.Body-Regular-XL {

    font: var(--font-body-regular-xl)

}



.nav-sidebar-expanded {

    z-index: 1500 !important;

    display: none !important;

    background: var(--color-dark-grey-1);

    min-height: 100vh

}



.nav-sidebar-expanded.show {

    display: flex !important

}



@media (min-width: 1280px) {

    .nav-sidebar-expanded {

        position: relative !important

    }



    .nav-sidebar-wrapped-content {

        display: block !important

    }



    .nav-sidebar-header {

        background: var(--color-sidebar-header-background) !important

    }

}



.nav-sidebar-header {

    background: transparent !important

}



.main-nav-content-toggle {

    opacity: 0

}



.nav-sidebar-wrapped-content,

.nav-sidebar.hide {

    display: none

}



.nav-sidebar-cards-grid {

    border-radius: 8px;

    display: grid;

    gap: var(--sidebar-body-opened-grid-spacing, 4px);

    grid-template-columns: repeat(2, 1fr)

}



.nav-sidebar-card:last-child:nth-child(odd) {

    grid-column: span 2

}



.nav-sidebar-items-children {

    display: none

}



.nav-sidebar-items-children.show {

    display: block

}



.nav-sidebar-socials {

    display: flex;

    gap: var(--buttons-group-spacing-m, 8px)

}



.nav-sidebar-items.nav-sidebar-expanded-items {

    flex: 1

}



.m-button-store {

    font-family: var(--font-family-base), Verdana, sans-serif;

    font-style: var(--font-style-base);

    scrollbar-color: var(--color-scrollbar-background) transparent;

    font-variant-numeric: var(--font-variant-numeric);

    -webkit-text-size-adjust: none;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

    font-weight: 600;

    box-sizing: border-box;

    width: 100%;

    --ic-size: var(--m-button-store-icon-size);

    --ic-color: var(--m-button-store-icon-color);

    align-items: center;

    background: var(--m-button-store-background);

    border: none;

    border-radius: var(--m-button-store-border-radius);

    box-shadow: inset 0 0 0 2px var(--color-button-store-basic-border);

    cursor: pointer;

    display: flex;

    justify-content: center;

    padding: var(--m-button-store-padding);

    text-decoration: none;

    transition: all .15s ease-in-out;

    --m-button-store-content-min-height: var(--button-store-content-height-m, 30px);

    --m-button-store-padding: var(--button-store-expand-m, 4px 12px);

    --m-button-store-icon-size: var(--button-store-icon-size-m, 20px);

    --m-button-store-border-radius: var(--button-store-border-radius-m, 8px);

    --m-button-store-content-padding: var(--button-store-text-container-expand-m, 0 8px);

    --m-button-store-content-min-width: var(--button-store-text-container-min-width-m, 104px);

    --m-button-store-text-font: var(--font-button-store-text-m);

    --m-button-store-description-font: var(--font-button-store-description-m);

    --m-button-store-background: var(--color-button-store-basic-background);

    --m-button-store-background-hover: var(--color-button-store-basic-background-hover);

    --m-button-store-background-pressed: var(--color-button-store-basic-background-active);

    --m-button-store-icon-color: var(--color-button-store-basic-icon);

    --m-button-store-icon-color-hover: var(--color-button-store-basic-icon-hover);

    --m-button-store-icon-color-pressed: var(--color-button-store-basic-icon-active);

    --m-button-store-border-color: var(--color-button-store-basic-border);

    --m-button-store-border-color-hover: var(--color-button-store-basic-border-hover);

    --m-button-store-border-color-pressed: var(--color-button-store-basic-border-active);

    --m-button-store-description-color: var(--color-button-store-basic-description);

    --m-button-store-description-color-hover: var(--color-button-store-basic-description-hover);

    --m-button-store-description-color-pressed: var(--color-button-store-basic-description-active);

    --m-button-store-text-color: var(--color-button-store-basic-text);

    --m-button-store-text-color-hover: var(--color-button-store-basic-text-hover);

    --m-button-store-text-color-pressed: var(--color-button-store-basic-text-active)

}



.pwa-banner div,

.pwa-banner a {

    z-index: 1

}



@media (max-width: 1280px) {

    .footer-nav__content {

        display: flex;

        flex-direction: row;

        flex-wrap: wrap;

        gap: 1.5rem

    }



    .recent-big-wins-header__title,

    h2.m-text {

        font-size: 16px !important

    }



    .m-button-content {

        font-size: 14px !important

    }



    .pwa-banner .m-button {

        padding: .5rem

    }



    .lobby-show-all {

        padding: .4em !important

    }

}



@media (max-width: 768px) {

    .footer-nav__content {

        flex-direction: column;

        align-items: center;

        justify-content: center

    }



    .pwa-banner {

        flex-direction: column;

        justify-content: start !important;

        align-items: start !important;

        padding: 16px 100px 16px 16px !important;

        gap: 4px !important

    }



    .pwa-banner .m-button {

        padding: .25rem;

        font-size: 12px

    }



    .pwa-banner h2 {

        font-size: 16px

    }



    .pwa-banner p {

        font-size: 12px

    }



    .pwa-banner__image {

        right: 0;

        left: initial !important

    }



    .screenbox img {

        max-width: 95%

    }

}



.screenbox {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    margin: 0 auto 1rem;

    border-radius: 16px

}



.screenbox img {

    margin-bottom: .75rem;

    max-width: 90%;

    max-height: 400px

}



.screenbox figcaption {

    font-size: .875rem;

    text-align: center

}



.screenbox,

picture {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column

}



ul.list:not(.breadcrumb-list) {

    list-style-type: none;

    display: flex;

    flex-direction: column;

    gap: .75rem

}



ul.list:not(.breadcrumb-list) li {

    position: relative;

    padding-left: 1.25rem

}



ul.list:not(.breadcrumb-list) li:before {

    content: "";

    position: absolute;

    left: 0;

    top: 50%;

    transform: translateY(-50%);

    width: 8px;

    height: 8px;

    background-color: #19ffac;

    border-radius: 50%

}



.info-page-content {

    line-height: 1.5

}



.mobile-nav {

    background-color: var(--color-dark-grey-1);

    border-radius: 16px 16px 0 0;

    width: 100%;

    display: none

}



.mobile-nav--old {

    border-radius: 0

}



.mobile-nav-wrap {

    display: flex;

    height: 100%;

    justify-content: space-around;

    padding: 7px 0 calc(env(safe-area-inset-bottom) + 7px);

    width: 100%

}



.mobile-nav-item {

    align-items: center;

    color: var(--color-mid-grey-3);

    display: flex;

    flex: 0 0 auto;

    flex-direction: column;

    height: 100%;

    justify-content: flex-start;

    width: 48px

}



.mobile-nav-item--active,

.mobile-nav-item--active .mobile-nav-item__icon {

    color: var(--color-pr500)

}



.mobile-nav-item--wrapped .mobile-nav-item__text {

    font-size: 8px;

    font-weight: 500

}



.mobile-nav-item__icon-wrap {

    align-items: center;

    display: flex;

    justify-content: center;

    position: relative

}



.mobile-nav-item__icon-wrap.m-button {

    box-shadow: 0 0 0 0 var(--color-pr500), 0 2px 7px -1px var(--color-pr500);

    height: 44px;

    margin-top: -20px;

    width: 44px

}



.mobile-nav-item__icon-wrap.m-button .mobile-nav-item__icon {

    color: var(--color-button-primary)

}



.mobile-nav-item__icon-wrap .m-counter {

    left: calc(100% + 4px);

    position: absolute;

    top: -4px

}



.mobile-nav-item__icon {

    fill: currentColor;

    color: var(--color-mid-grey-5);

    display: block;

    font-size: 24px;

    height: 1em;

    width: 1em

}



.mobile-nav-item__text {

    margin-top: 1px;

    min-width: 79px

}



.mobile-nav-item__egg.m-icon {

    color: var(--color-at400);

    height: 12px;

    position: absolute;

    right: -7px;

    top: -1px;

    width: 12px

}



.mobile-nav-item__badge {

    position: absolute;

    right: -6px;

    top: -4px

}



@media (max-width: 600px) {

    .mobile-nav {

        display: block

    }



    .app #container {

        padding-bottom: 100px

    }

}



.responsive-table {

    border-radius: .75rem;

    overflow: hidden;

    border: .0625rem solid #7a918b;

    overflow-x: auto;

    background: #1e1f23;

    margin-bottom: 1.5rem

}



.responsive-table table {

    border: none !important;

    border-collapse: collapse;

    width: 100%;

    background: #1e1f23;

    min-width: 980px

}



.responsive-table table tr {

    border-bottom: .0625rem solid #7a918b

}



.responsive-table table th {

    text-align: left

}



.responsive-table table td,

.responsive-table table th {

    border: none;

    vertical-align: middle

}



@media (max-width: 991.98px) {



    .responsive-table table td,

    .responsive-table table th {

        min-width: 10rem

    }

}



.responsive-table table td:first-child,

.responsive-table table th:first-child {

    border-radius: .5rem 0 0 .5rem

}



.responsive-table table td:last-child,

.responsive-table table th:last-child {

    border-radius: 0 .5rem .5rem 0

}



.responsive-table__payment tr {

    display: grid;

    grid-template-columns: repeat(2, 1fr)

}



.responsive-table__payment table {

    min-width: 500px

}



.info-page-content h1 {

    font-size: 2em !important

}



@media (max-width: 768px) {

    .info-page-content h1 {

        font-size: 1.5em !important

    }



    .cookies-popup {

        margin: 1rem;

        border-radius: 12px

    }



    .m-prev-next-arrows .m-button {

        padding: .5rem !important

    }

}



.LangSwitcherModal-Title {

    color: var(--color-white);

    display: block;

    font-size: 18px;

    font-weight: 700;

    line-height: 140%;

    margin: 19px 24px

}



.LangSwitcherModal-Countries {

    border-radius: 8px;

    display: flex;

    flex-wrap: wrap;

    gap: 2px;

    overflow: hidden

}



.LangSwitcherModal-Country {

    align-items: center;

    background: var(--color-dark-grey-2);

    display: inline-flex;

    padding: 8px;

    position: relative;

    width: calc(50% - 2px)

}



.LangSwitcherModal-Country:not(.active):hover {

    background: var(--color-dark-grey-3);

    cursor: pointer

}



.LangSwitcherModal-Country:not(.active):hover:after {

    border-radius: 0

}



.LangSwitcherModal-Country:after {

    border-bottom-right-radius: 8px;

    border-top-right-radius: 8px;

    content: "";

    height: 100%;

    overflow: hidden;

    position: absolute;

    right: 0;

    top: 0;

    width: 40px;

    z-index: 1

}



.LangSwitcherModal-Country.active {

    border: 2px solid var(--color-pr500);

    border-radius: 8px

}



.LangSwitcherModal-Country-Checkmark {

    background: var(--color-pr500);

    border-radius: 50%;

    color: var(--color-text-primary);

    height: 20px;

    margin-right: 8px;

    min-width: 20px;

    padding: 2px;

    width: 20px

}



.LangSwitcherModal-Country-Text {

    color: var(--color-white);

    font-size: 14px;

    line-height: 160%;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap

}



.LangSwitcherModal .m-modal-header {

    justify-content: left;

    padding-left: 23px

}



.LangSwitcherModal .m-modal-content {

    border-top: 1px solid var(--color-dark-grey-2);

    max-height: calc(100vh - 104px);

    overflow-y: auto;

    padding: 23px

}



@media (max-width: 960px) {

    .LangSwitcherModal .m-modal-content {

        -ms-overflow-style: none;

        scrollbar-width: none

    }



    .LangSwitcherModal .m-modal-content::-webkit-scrollbar {

        display: none;

        height: 0;

        width: 0

    }

}



.LangSwitcherModal .m-modal-header {

    padding-bottom: 10px

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 400;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format("woff2");

    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 400;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format("woff2");

    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 400;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format("woff2");

    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 400;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format("woff2");

    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 400;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format("woff2");

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 500;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format("woff2");

    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 500;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format("woff2");

    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 500;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format("woff2");

    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 500;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format("woff2");

    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 500;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format("woff2");

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 600;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format("woff2");

    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 600;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format("woff2");

    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 600;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format("woff2");

    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 600;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format("woff2");

    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 600;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format("woff2");

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 700;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format("woff2");

    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 700;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format("woff2");

    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 700;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format("woff2");

    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 700;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format("woff2");

    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 700;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format("woff2");

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 800;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format("woff2");

    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 800;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format("woff2");

    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 800;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format("woff2");

    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 800;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format("woff2");

    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 800;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format("woff2");

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 900;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format("woff2");

    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 900;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format("woff2");

    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 900;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format("woff2");

    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 900;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format("woff2");

    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF

}



@font-face {

    font-family: Montserrat;

    font-style: normal;

    font-weight: 900;

    font-display: swap;

    src: url(https://fonts.gstatic.com/s/montserrat/v29/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format("woff2");

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD

}



:root {

    --sectionPadding: 16px;

    --gap-xs: 4px;

    --gap-s: 8px;

    --gap-m: 16px;

    --gap-l: 24px;

    --nav-height: 54px;

    --nav-banner-height: 0px;

    --nav-sidebar-width: 64px;

    --border-radius-1000: 1000px;

    --border-radius-default: 8px

}



@media (max-width: 1280px) {

    :root {

        --nav-sidebar-width: 0

    }

}



@media (min-width: 768px) {

    :root {

        --gap-xs: 6px;

        --gap-s: 12px;

        --gap-m: 24px;

        --gap-l: 36px;

        --nav-height: 64px

    }

}



@media (min-width: 960px) {

    :root {

        --gap-xs: 8px;

        --gap-s: 16px;

        --gap-m: 32px;

        --gap-l: 48px

    }

}



@media (min-width: 1248px) {

    :root {

        --gap-xs: 10px;

        --gap-s: 20px;

        --gap-m: 40px;

        --gap-l: 60px

    }

}



body,

html {

    height: 100vh;

    overscroll-behavior: none;

    width: 100%

}



body {

    -webkit-text-size-adjust: none;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

    -webkit-overflow-scrolling: auto;

    background-color: var(--color-background-page);

    color: var(--color-light-grey-5);

    font-weight: 600;

    margin: 0;

    overflow: hidden

}



body #app {

    max-width: 100%;

    overflow-y: visible;

    position: fixed;

    width: 100vw

}



#container {

    padding-bottom: env(safe-area-inset-bottom);

    padding-right: var(--imitated-scrollbar-width, 0)

}



section {

    margin: 0 auto;

    max-width: var(--section-width);

    min-width: 320px;

    padding: 0 var(--section-padding-m);

    width: 100%

}



.desktop section {

    padding: 0 var(--section-padding-l)

}



.scrollContainer {

    -webkit-overflow-scrolling: touch;

    overflow-x: scroll

}



.scrollSection {

    display: flex;

    margin: 0 -16px;

    overflow-x: auto;

    padding: 2px 18px;

    scroll-padding: 0 16px;

    scroll-padding-inline-end: 16px;

    scroll-padding-inline-start: 16px

}



ul {

    list-style: none;

    padding: 0

}



form,

ul {

    margin: 0

}



a {

    text-decoration: none

}



#m-modal-wrapper {

    left: 0;

    top: 0

}



*,

:after,

:before {

    box-sizing: border-box

}



:focus {

    outline: none

}



:focus-visible {

    outline: 2px solid var(--color-pr500)

}



input:-internal-autofill-selected,

input:-internal-autofill-selected:active,

input:-internal-autofill-selected:focus,

input:-internal-autofill-selected:hover,

input:-webkit-autofill,

input:-webkit-autofill:active,

input:-webkit-autofill:focus,

input:-webkit-autofill:hover {

    transition: all 9999s ease-in-out 0s;

    transition-property: background-color, color

}



.fade-enter-active,

.fade-leave-active {

    transition: opacity .2s

}



.fade-enter,

.fade-leave-to {

    opacity: 0

}



.slide-left--leave-active,

.slide-left-enter-active {

    transition: all .5s ease

}



.slide-left-enter,

.slide-left-leave-to {

    opacity: 0;

    transform: translate(-100%)

}



.roll-up-enter-active,

.roll-up-leave-active {

    transition: all .2s ease-out

}



.roll-up-enter {

    opacity: 0;

    transform: translateY(-30px)

}



.roll-up-leave-to {

    opacity: 0;

    transform: translateY(30px)

}



.roll-down-enter-active,

.roll-down-leave-active {

    transition: all .2s ease-out

}



.roll-down-enter {

    opacity: 0;

    transform: translateY(30px)

}



.roll-down-leave-to {

    opacity: 0;

    transform: translateY(-30px)

}



@keyframes slide-up-opacity {

    0% {

        opacity: 0;

        transform: translateY(3%)

    }



    to {

        opacity: 1;

        transform: translateY(0)

    }

}



@keyframes fade {

    0% {

        opacity: 0

    }



    to {

        opacity: 1

    }

}



@keyframes wave-left {

    0% {

        transform: translate(0)

    }



    50% {

        transform: translate(-1px)

    }



    to {

        transform: translate(0)

    }

}



@keyframes wave-right {

    0% {

        transform: translate(0)

    }



    50% {

        transform: translate(1px)

    }



    to {

        transform: translate(0)

    }

}



@keyframes trambling-animation {



    0%,

    50%,

    to {

        transform: rotate(0)

    }



    10%,

    30% {

        transform: rotate(-10deg)

    }



    20%,

    40% {

        transform: rotate(10deg)

    }

}



@keyframes rotate {

    to {

        transform: rotate(-1turn)

    }

}



:root {

    --color-text-faded: #7a918b;

    --color-border: #585c834d;

    --color-background-missions: #1a799f;

    --color-text-ghost: #52586f

}



.m-icon {

    width: 16px

}



.TextOverflow {

    overflow: hidden;

    position: relative

}



.TextOverflow:after {

    background: var(--gradient-dark-grey-1-right);

    content: "";

    height: 100%;

    position: absolute;

    right: 0;

    top: 0;

    width: 24px

}



.TextOverflow--light:after {

    background: var(--gradient-dark-grey-2-right)

}



.hideScrollbar {

    -ms-overflow-style: none;

    scrollbar-width: none

}



.hideScrollbar::-webkit-scrollbar {

    display: none

}



.lowercase {

    text-transform: lowercase

}



body.sensitiveModalOpen #gist-embed-message,

body.sensitiveModalOpen .__btgPromoHolder,

body:has(.m-modal-container.email-verification, .maintenance-page, .not-allowed) #gist-embed-message,

body:has(.m-modal-container.email-verification, .maintenance-page, .not-allowed) .__btgPromoHolder {

    display: none !important

}



.m-fs8 {

    font-size: 8px

}



.m-fs10 {

    font-size: 10px

}



.m-fs12 {

    font-size: 12px

}



.m-fs14 {

    font-size: 14px

}



.m-fs16 {

    font-size: 16px

}



.m-fs18 {

    font-size: 18px

}



.m-fs20 {

    font-size: 20px

}



.m-fs24 {

    font-size: 24px

}



.m-fs28 {

    font-size: 28px

}



.m-fs32 {

    font-size: 32px

}



.m-fw500 {

    font-weight: 500

}



.m-fw600 {

    font-weight: 600

}



.m-fw700 {

    font-weight: 700

}



.m-lh140 {

    line-height: 140%

}



.m-lh150 {

    line-height: 150%

}



.m-lh160 {

    line-height: 160%

}



.m-text-center {

    text-align: center

}



.m-capitalize {

    text-transform: capitalize

}



.m-thin-scrollbar {

    scrollbar-color: var(--color-scrollbar-background) rgba(0, 0, 0, 0);

    scrollbar-width: thin

}



.m-thin-scrollbar::-webkit-scrollbar {

    background: var(--color-dark-grey-1);

    height: 5px;

    width: 5px

}



.m-thin-scrollbar::-webkit-scrollbar-thumb {

    background-color: var(--color-dark-grey-5);

    border-radius: 3px

}



.m-slider-dots_wrap {

    align-items: center;

    display: flex;

    justify-content: center;

    margin-top: 8px;

    width: 100%

}



.m-slider-dots {

    display: flex;

    padding: 0

}



.m-slider-dots--small .m-slider-dots__point {

    height: 8px;

    margin: 0 2px;

    width: 8px

}



.m-slider-dots__point {

    background: var(--color-mid-grey-1);

    border-radius: 5px;

    cursor: pointer;

    height: 4px;

    margin: 0 4px;

    overflow: hidden;

    position: relative;

    width: 30px

}



.m-slider-dots__point:before {

    background: var(--color-light-grey-5);

    border-radius: 5px;

    content: "";

    height: 100%;

    left: 0;

    opacity: 0;

    position: absolute;

    top: 0;

    transform: scale(.8);

    transition: all .4s ease-in-out;

    width: 100%

}



.m-slider-dots__point.activeDot:before {

    opacity: 1;

    transform: scale(1)

}



.m-slider-dots__point span {

    display: none

}



.m-slider {

    --default-slides-to-show: 1;

    --default-slide-width: 100%;

    --slides-to-show: var(--default-slides-to-show);

    --slide-width: var(--default-slide-width);

    width: 100%

}



@media (min-width: 1921px) {

    .m-slider {

        --slide-width: var(--bp-xxxl-plus, var(--default-slide-width));

        --slides-to-show: var(--slides-xxxl-plus, var(--default-slides-to-show))

    }

}



@media (max-width: 1920px) {

    .m-slider {

        --slide-width: var(--bp-xxxl, var(--default-slide-width));

        --slides-to-show: var(--slides-xxxl, var(--default-slides-to-show))

    }

}



@media (max-width: 1600px) {

    .m-slider {

        --slide-width: var(--bp-xxl, var(--default-slide-width));

        --slides-to-show: var(--slides-xxl, var(--default-slides-to-show))

    }

}



@media (max-width: 1366px) {

    .m-slider {

        --slide-width: var(--bp-xl-2, var(--default-slide-width));

        --slides-to-show: var(--slides-xl-2, var(--default-slides-to-show))

    }

}



@media (max-width: 1248px) {

    .m-slider {

        --slide-width: var(--bp-xl, var(--default-slide-width));

        --slides-to-show: var(--slides-xl, var(--default-slides-to-show))

    }

}



@media (max-width: 960px) {

    .m-slider {

        --slide-width: var(--bp-l, var(--default-slide-width));

        --slides-to-show: var(--slides-l, var(--default-slides-to-show))

    }

}



@media (max-width: 768px) {

    .m-slider {

        --slide-width: var(--bp-m, var(--default-slide-width));

        --slides-to-show: var(--slides-m, var(--default-slides-to-show))

    }

}



@media (max-width: 590px) {

    .m-slider {

        --slide-width: var(--bp-s, var(--default-slide-width));

        --slides-to-show: var(--slides-s, var(--default-slides-to-show))

    }

}



@media (max-width: 460px) {

    .m-slider {

        --slide-width: var(--bp-xs, var(--default-slide-width));

        --slides-to-show: var(--slides-xs, var(--default-slides-to-show))

    }

}



@media (max-width: 320px) {

    .m-slider {

        --slide-width: var(--bp-xxs, var(--default-slide-width));

        --slides-to-show: var(--slides-xxs, var(--default-slides-to-show))

    }

}



.m-slider.m-slider--fixed-slide-width .m-slider__slide {

    flex-basis: var(--max-slide-width);

    flex-grow: 0;

    max-width: 100%

}



.m-slider .m-slider__scroll-wrap {

    position: relative

}



.m-slider .m-slider__scroll-wrap:hover .m-slider__arrow {

    opacity: 1

}



.m-slider .m-slider__scroll-wrap:hover .m-slider__arrow-left {

    left: -18px

}



.m-slider .m-slider__scroll-wrap:hover .m-slider__arrow-right {

    right: -18px

}



.m-slider .m-slider__scroll-box {

    -ms-overflow-style: none;

    display: flex;

    overflow-x: auto;

    scroll-behavior: smooth;

    scroll-snap-type: x mandatory;

    scrollbar-width: none;

    width: 100%

}



.m-slider .m-slider__scroll-box::-webkit-scrollbar {

    display: none

}



.m-slider .m-slider__slide {

    flex: 0 0 var(--slide-width);

    scroll-snap-align: start;

    scroll-snap-stop: always

}



.m-slider .m-slider__slide,

.m-slider .m-slider__slide-content {

    max-width: var(--max-slide-width)

}



.m-slider .m-slider__arrow.m-button {

    height: 40px;

    opacity: 0;

    overflow: hidden;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    transition: all .3s ease-in-out;

    width: 40px;

    z-index: 10

}



.m-slider .m-slider__arrow-left {

    left: 0

}



.m-slider .m-slider__arrow-right {

    right: 0

}



.m-form-field {

    --m-form-field-description-font: var(--font-field-vertical-description);

    display: flex;

    flex-direction: column;

    gap: var(--field-vertical-text-spaсing)

}



.m-form-field-horizontal {

    --m-form-field-description-font: var(--font-field-horizontal-description);

    align-items: center;

    flex-direction: row;

    font-weight: 500;

    gap: 12px

}



.m-form-field-invert {

    flex-direction: row-reverse

}



.m-form-field--apply {

    --m-form-validation-outline: var(--lighten);

    --m-form-validation-border: var(--base)

}



.m-form-field--error {

    --base: var(--color-input-basic-error-border);

    --lighten: var(--color-input-basic-error-outside-border-focus)

}



.m-form-field--error .m-textarea-counter {

    --label: var(--base)

}



.m-form-field--success {

    --base: var(--color-input-basic-success-border);

    --lighten: var(--color-input-basic-success-outside-border-focus)

}



.m-form-field-description,

.m-form-field-message {

    color: var(--color-field-basic-description);

    font: var(--m-form-field-description-font);

    padding: var(--field-vertical-text-expand)

}



.m-dropdown-content {

    opacity: 0;

    position: absolute;

    transition: opacity .15s ease-in-out;

    z-index: 3000

}



.m-dropdown-content ul {

    list-style: none;

    margin: 0

}



.m-slide-fade-enter-active {

    transition: all .2s cubic-bezier(1, 0, 1, 0)

}



.m-slide-fade-leave-active {

    transition: all .15s cubic-bezier(1, .5, .8, 1)

}



.m-slide-fade-enter-from,

.m-slide-fade-leave-to {

    opacity: 0;

    transform: translateY(10px)

}



.m-button-link {

    align-items: center;

    background: #0000;

    border: none;

    color: var(--m-button-link-text-color);

    cursor: pointer;

    display: inline-flex;

    font: var(--m-button-link-font);

    gap: var(--m-button-link-gap);

    justify-content: center;

    min-height: var(--m-button-link-content-height);

    padding: 0;

    position: relative;

    text-decoration: none;

    transition: all .15s ease-in-out

}



.m-button-link--primary {

    --m-button-link-text-color: var(--color-button-link-primary-text);

    --m-button-link-text-color-hover: var(--color-button-link-primary-text-hover);

    --m-button-link-text-color-pressed: var(--color-button-link-primary-text-active);

    --m-button-link-text-color-disabled: var(--color-button-link-primary-text-disabled)

}



.m-button-link--secondary {

    --m-button-link-text-color: var(--color-button-link-secondary-text);

    --m-button-link-text-color-hover: var(--color-button-link-secondary-text-hover);

    --m-button-link-text-color-pressed: var(--color-button-link-secondary-text-active);

    --m-button-link-text-color-disabled: var(--color-button-link-secondary-text-disabled)

}



.m-button-link--info {

    --m-button-link-text-color: var(--color-button-link-info-text);

    --m-button-link-text-color-hover: var(--color-button-link-info-text-hover);

    --m-button-link-text-color-pressed: var(--color-button-link-info-text-active);

    --m-button-link-text-color-disabled: var(--color-button-link-info-text-disabled)

}



.m-button-link--dark {

    --m-button-link-text-color: var(--color-button-link-dark-text);

    --m-button-link-text-color-hover: var(--color-button-link-dark-text-hover);

    --m-button-link-text-color-pressed: var(--color-button-link-dark-text-active);

    --m-button-link-text-color-disabled: var(--color-button-link-dark-text-disabled)

}



.m-button-link--light {

    --m-button-link-text-color: var(--color-button-link-light-text);

    --m-button-link-text-color-hover: var(--color-button-link-light-text-hover);

    --m-button-link-text-color-pressed: var(--color-button-link-light-text-active);

    --m-button-link-text-color-disabled: var(--color-button-link-light-text-disabled)

}



.m-button-link--s {

    --m-button-link-content-height: var(--button-link-content-height-s, 20px);

    --m-button-link-gap: var(--button-text-container-expand-s, 0 8px);

    --m-button-link-font: var(--font-button-text-s);

    letter-spacing: var(--font-button-text-s-ls, 0);

    text-transform: var(--font-button-text-s-transform, unset)

}



.m-button-link--m {

    --m-button-link-content-height: var(--button-link-content-height-m, 20px);

    --m-button-link-gap: var(--button-text-container-expand-m, 0 8px);

    --m-button-link-font: var(--font-button-text-m);

    letter-spacing: var(--font-button-text-m-ls, 0);

    text-transform: var(--font-button-text-m-transform, unset)

}



.m-button-link--l {

    --m-button-link-content-height: var(--button-link-content-height-l, 20px);

    --m-button-link-gap: var(--button-text-container-expand-l, 0 8px);

    --m-button-link-font: var(--font-button-text-l);

    letter-spacing: var(--font-button-text-l-ls, 0);

    text-transform: var(--font-button-text-l-transform, unset)

}



.m-button-link:focus-visible,

.m-button-link:hover {

    --m-button-link-text-color: var(--m-button-link-text-color-hover)

}



.m-button-link:active {

    --m-button-link-text-color: var(--m-button-link-text-color-pressed)

}



.m-button-link:disabled {

    --m-button-link-text-color: var(--m-button-link-text-color-disabled);

    cursor: not-allowed

}



.m-tooltip-arrow {

    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) var(--color-tooltip-background);

    border-style: solid;

    border-width: 0 8px 8px;

    position: absolute

}



.m-tooltip-content {

    background: var(--color-tooltip-background);

    border-radius: var(--tooltip-border-radius);

    box-shadow: var(--shadow-2);

    color: var(--color-tooltip-text);

    font: var(--font-tooltip-text);

    padding: var(--tooltip-expand)

}



.m-tooltip-content-text {

    max-width: var(--breakpoints-expand)

}



.m-select-modal .m-modal-content {

    display: flex;

    flex-direction: column;

    gap: var(--spacing-3xs);

    padding: 0

}



.m-select-modal .m-modal-container {

    overflow-y: hidden

}



.m-select-modal-input-container {

    padding: 0 var(--modal-right-expand-mobile)

}



.m-select-modal-input-container .m-input-prepend>.m-icon {

    color: var(--color-white);

    opacity: .8

}



.m-select-modal-list {

    height: 320px;

    margin: 0;

    overflow-y: auto;

    padding: 0

}



.m-select-modal-empty {

    align-items: center;

    display: flex;

    font: var(--font-body-semi-bold-m);

    height: 320px;

    justify-content: center

}



@keyframes autofill {

    to {

        background: #0000 !important;

        color: inherit

    }

}



.m-input {

    --m-input-outline-color: #0000;

    --m-input-outline-color--hover: #0000;

    --ic-color: var(--m-input-icon-color);

    --ic-background: var(--m-input-icon-background);

    --ic-border-color: var(--m-input-icon-border-color);

    --ic-size: var(--m-input-icon-size);

    --placeholder-opacity: 1;

    align-items: center;

    background: var(--m-input-background);

    border-color: var(--m-form-validation-border, var(--m-input-border-color));

    border-radius: var(--m-input-border-radius);

    border-style: solid;

    border-width: var(--input-border-fixed-width, var(--m-input-border-width));

    box-shadow: 0 0 0 var(--m-input-outline-width) var(--m-input-outline-color);

    color: var(--m-input-text-color);

    cursor: pointer;

    display: flex;

    gap: var(--m-input-content-gap);

    height: var(--m-input-height);

    padding: var(--m-input-padding);

    position: relative;

    transition: all .15s ease-in-out

}



.m-input.m-gradient-border {

    --gradient-width: var(--m-input-border-width);

    --gradient-color: var(--m-input-border-color);

    --gradient-fixed-border-color: var(--m-input-border-color)

}



.m-input--s {

    --m-input-border-width: var(--input-border-size-s);

    --m-input-border-radius: var(--input-border-radius-s);

    --m-input-outline-width: var(--input-outside-border-size-s);

    --m-input-padding: var(--input-expand-s);

    --m-input-label-font: var(--font-input-label-s);

    --m-input-label-font--focus: var(--font-input-label-focus-s);

    --m-input-label-line-height--focus: var(--font-line-height-input-label-focus-s);

    --m-input-text-line-height: var(--font-line-height-input-placeholder-s);

    --m-input-text-font: var(--font-input-value-s);

    --m-input-text-padding: var(--input-text-container-expand-s);

    --m-input-height: var(--input-height-s);

    --m-input-content-gap: var(--input-content-spacing-s);

    --m-input-row-gap: var(--input-text-container-vertical-spacing-s, 0px);

    --m-input-icon-size: var(--input-icon-container-icon-size-s);

    --ic-padding: var(--input-icon-container-expand-s, 0);

    --ic-border-width: var(--input-icon-container-border-size-s, 0);

    --ic-border-radius: var(--input-icon-container-border-radius-s, 0)

}



.m-input--m {

    --m-input-border-width: var(--input-border-size-m);

    --m-input-border-radius: var(--input-border-radius-m);

    --m-input-outline-width: var(--input-outside-border-size-m);

    --m-input-padding: var(--input-expand-m);

    --m-input-label-font: var(--font-input-label-m);

    --m-input-label-font--focus: var(--font-input-label-focus-m);

    --m-input-label-line-height--focus: var(--font-line-height-input-label-focus-m);

    --m-input-text-line-height: var(--font-line-height-input-placeholder-m);

    --m-input-text-font: var(--font-input-value-m);

    --m-input-text-padding: var(--input-text-container-expand-m);

    --m-input-height: var(--input-height-m);

    --m-input-content-gap: var(--input-content-spacing-m);

    --m-input-row-gap: var(--input-text-container-vertical-spacing-m, 0px);

    --m-input-icon-size: var(--input-icon-container-icon-size-m);

    --ic-padding: var(--input-icon-container-expand-m, 0);

    --ic-border-width: var(--input-icon-container-border-size-m, 0);

    --ic-border-radius: var(--input-icon-container-border-radius-m, 0)

}



.m-input--l {

    --m-input-border-width: var(--input-border-size-l);

    --m-input-border-radius: var(--input-border-radius-l);

    --m-input-outline-width: var(--input-outside-border-size-l);

    --m-input-padding: var(--input-expand-l);

    --m-input-label-font: var(--font-input-label-l);

    --m-input-label-font--focus: var(--font-input-label-focus-l);

    --m-input-label-line-height--focus: var(--font-line-height-input-label-focus-l);

    --m-input-text-line-height: var(--font-line-height-input-placeholder-l);

    --m-input-text-font: var(--font-input-value-l);

    --m-input-text-padding: var(--input-text-container-expand-l);

    --m-input-height: var(--input-height-l);

    --m-input-content-gap: var(--input-content-spacing-l);

    --m-input-row-gap: var(--input-text-container-vertical-spacing-l, 0px);

    --m-input-icon-size: var(--input-icon-container-icon-size-l);

    --ic-padding: var(--input-icon-container-expand-l, 0);

    --ic-border-width: var(--input-icon-container-border-size-l, 0);

    --ic-border-radius: var(--input-icon-container-border-radius-l, 0)

}



.m-input--basic {

    --m-input-outline-color--focus: var(--color-input-basic-outside-border-focus);

    --m-input-border-color: var(--color-input-basic-border);

    --m-input-border-color--hover: var(--color-input-basic-border-hover);

    --m-input-border-color--focus: var(--color-input-basic-border-focus);

    --m-input-border-color--disabled: var(--color-input-basic-border-disabled);

    --m-input-background: var(--color-input-basic-background);

    --m-input-background--hover: var(--color-input-basic-background-hover);

    --m-input-background--focus: var(--color-input-basic-background-focus);

    --m-input-background--disabled: var(--color-input-basic-background-disabled);

    --m-input-label-color: var(--color-input-basic-label);

    --m-input-label-color--hover: var(--color-input-basic-label-hover);

    --m-input-label-color--focus: var(--color-input-basic-label-focus);

    --m-input-label-color--disabled: var(--color-input-basic-label-disabled);

    --m-input-text-color: var(--color-input-basic-value);

    --m-input-text-color--hover: var(--color-input-basic-value-hover);

    --m-input-text-color--focus: var(--color-input-basic-value-hover);

    --m-input-text-color--disabled: var(--color-input-basic-value-disabled);

    --m-input-icon-color: var(--color-input-basic-icon-container-icon);

    --m-input-icon-color--hover: var(--color-input-basic-icon-container-icon-hover);

    --m-input-icon-color--focus: var(--color-input-basic-icon-container-icon-focus);

    --m-input-icon-color--disabled: var(--color-input-basic-icon-container-icon-disabled);

    --m-input-icon-background: var(--color-input-basic-icon-container-background);

    --m-input-icon-background--hover: var(--color-input-basic-icon-container-background-hover);

    --m-input-icon-background--focus: var(--color-input-basic-icon-container-background-focus);

    --m-input-icon-background--disabled: var(--color-input-basic-icon-container-background-disabled);

    --m-input-icon-border-color: var(--color-input-basic-icon-container-border);

    --m-input-icon-border-color--hover: var(--color-input-basic-icon-container-border-hover);

    --m-input-icon-border-color--focus: var(--color-input-basic-icon-container-border-focus);

    --m-input-icon-border-color--disabled: var(--color-input-basic-icon-container-border-disabled)

}



.m-input--inverse {

    --m-input-outline-color--focus: var(--color-input-inverse-outside-border-focus);

    --m-input-border-color: var(--color-input-inverse-border);

    --m-input-border-color--hover: var(--color-input-inverse-border-hover);

    --m-input-border-color--focus: var(--color-input-inverse-border-focus);

    --m-input-border-color--disabled: var(--color-input-inverse-border-disabled);

    --m-input-background: var(--color-input-inverse-background);

    --m-input-background--hover: var(--color-input-inverse-background-hover);

    --m-input-background--focus: var(--color-input-inverse-background-focus);

    --m-input-background--disabled: var(--color-input-inverse-background-disabled);

    --m-input-label-color: var(--color-input-inverse-label);

    --m-input-label-color--hover: var(--color-input-inverse-label-hover);

    --m-input-label-color--focus: var(--color-input-inverse-label-focus);

    --m-input-label-color--disabled: var(--color-input-inverse-label-disabled);

    --m-input-text-color: var(--color-input-inverse-value);

    --m-input-text-color--hover: var(--color-input-inverse-value-hover);

    --m-input-text-color--focus: var(--color-input-inverse-value-hover);

    --m-input-text-color--disabled: var(--color-input-inverse-value-disabled);

    --m-input-icon-color: var(--color-input-inverse-icon-container-icon);

    --m-input-icon-color--hover: var(--color-input-inverse-icon-container-icon-hover);

    --m-input-icon-color--focus: var(--color-input-inverse-icon-container-icon-focus);

    --m-input-icon-color--disabled: var(--color-input-inverse-icon-container-icon-disabled);

    --m-input-icon-background: var(--color-input-inverse-icon-container-background);

    --m-input-icon-background--hover: var(--color-input-inverse-icon-container-background-hover);

    --m-input-icon-background--focus: var(--color-input-inverse-icon-container-background-focus);

    --m-input-icon-background--disabled: var(--color-input-inverse-icon-container-background-disabled);

    --m-input-icon-border-color: var(--color-input-inverse-icon-container-border);

    --m-input-icon-border-color--hover: var(--color-input-inverse-icon-container-border-hover);

    --m-input-icon-border-color--focus: var(--color-input-inverse-icon-container-border-focus);

    --m-input-icon-border-color--disabled: var(--color-input-inverse-icon-container-border-disabled)

}



.m-input--dark {

    --m-input-outline-color--focus: var(--color-input-dark-outside-border-focus);

    --m-input-border-color: var(--color-input-dark-border);

    --m-input-border-color--hover: var(--color-input-dark-border-hover);

    --m-input-border-color--focus: var(--color-input-dark-border-focus);

    --m-input-border-color--disabled: var(--color-input-dark-border-disabled);

    --m-input-background: var(--color-input-dark-background);

    --m-input-background--hover: var(--color-input-dark-background-hover);

    --m-input-background--focus: var(--color-input-dark-background-focus);

    --m-input-background--disabled: var(--color-input-dark-background-disabled);

    --m-input-label-color: var(--color-input-dark-label);

    --m-input-label-color--hover: var(--color-input-dark-label-hover);

    --m-input-label-color--focus: var(--color-input-dark-label-focus);

    --m-input-label-color--disabled: var(--color-input-dark-label-disabled);

    --m-input-text-color: var(--color-input-dark-value);

    --m-input-text-color--hover: var(--color-input-dark-value-hover);

    --m-input-text-color--focus: var(--color-input-dark-value-hover);

    --m-input-text-color--disabled: var(--color-input-dark-value-disabled);

    --m-input-icon-color: var(--color-input-dark-icon-container-icon);

    --m-input-icon-color--hover: var(--color-input-dark-icon-container-icon-hover);

    --m-input-icon-color--focus: var(--color-input-dark-icon-container-icon-focus);

    --m-input-icon-color--disabled: var(--color-input-dark-icon-container-icon-disabled);

    --m-input-icon-background: var(--color-input-dark-icon-container-background);

    --m-input-icon-background--hover: var(--color-input-dark-icon-container-background-hover);

    --m-input-icon-background--focus: var(--color-input-dark-icon-container-background-focus);

    --m-input-icon-background--disabled: var(--color-input-dark-icon-container-background-disabled);

    --m-input-icon-border-color: var(--color-input-dark-icon-container-border);

    --m-input-icon-border-color--hover: var(--color-input-dark-icon-container-border-hover);

    --m-input-icon-border-color--focus: var(--color-input-dark-icon-container-border-focus);

    --m-input-icon-border-color--disabled: var(--color-input-dark-icon-container-border-disabled)

}



@media not (any-pointer: coarse) {

    .m-input:hover:not(.m-input--focused) {

        --m-input-outline-color: var(--m-input-outline-color--hover);

        --m-input-border-color: var(--m-input-border-color--hover);

        --m-input-text-color: var(--m-input-text-color--hover);

        --m-input-label-color: var(--m-input-label-color--hover);

        --m-input-background: var(--m-input-background--hover);

        --m-input-icon-color: var(--m-input-icon-color--hover);

        --ic-background: var(--m-input-icon-background--hover);

        --ic-border-color: var(--m-input-icon-border-color--hover)

    }

}



.m-input--focused {

    --m-input-outline-color: var(--m-form-validation-outline, var(--m-input-outline-color--focus));

    --m-input-border-color: var(--m-input-border-color--focus);

    --m-input-text-color: var(--m-input-text-color--focus);

    --m-input-label-color: var(--m-input-label-color--focus);

    --m-input-background: var(--m-input-background--focus);

    --m-input-icon-color: var(--m-input-icon-color--focus);

    --ic-background: var(--m-input-icon-background--focus);

    --ic-border-color: var(--m-input-icon-border-color--focus)

}



.m-input--disabled,

.m-input--disabled input {

    cursor: not-allowed

}



.m-input--disabled:not(#i#i#i),

.m-input--readonly:not(#i#i#i) {

    --m-input-text-color: var(--m-input-text-color--disabled);

    --m-input-background: var(--m-input-background--disabled);

    --m-input-outline-color: #0000;

    --m-input-border-color: var(--m-input-border-color--disabled);

    --m-input-label-color: var(--m-input-label-color--disabled);

    --m-input-icon-color: var(--m-input-icon-color--disabled);

    --ic-background: var(--m-input-icon-background--disabled);

    --ic-border-color: var(--m-input-icon-border-color--disabled)

}



.m-input-content {

    align-items: flex-start;

    display: flex;

    flex-direction: column;

    flex-grow: 1;

    height: 100%;

    justify-content: center;

    overflow: hidden;

    position: relative

}



.m-input-content-label {

    color: var(--m-input-label-color);

    font: var(--m-input-label-font);

    overflow: hidden;

    padding: var(--m-input-text-padding);

    pointer-events: none;

    position: absolute;

    text-overflow: ellipsis;

    transform-origin: 0 0;

    transition: all .15s;

    white-space: nowrap;

    width: 100%

}



.m-input-content input,

.m-input-content textarea {

    background-color: #0000;

    border: none;

    box-shadow: none;

    color: var(--m-input-text-color);

    font: var(--m-input-text-font);

    height: 100%;

    outline: none;

    padding: var(--m-input-text-padding);

    text-overflow: ellipsis;

    width: 100%

}



.m-input-content input::placeholder,

.m-input-content textarea::placeholder {

    color: var(--color-mid-grey-3);

    opacity: var(--placeholder-opacity);

    transition: opacity .2s

}



.m-input-content input:placeholder-shown,

.m-input-content textarea:placeholder-shown {

    text-overflow: ellipsis

}



.m-input-content input:focus::placeholder,

.m-input-content textarea:focus::placeholder {

    --placeholder-opacity: 1

}



.m-input-content input:-webkit-autofill,

.m-input-content input:focus,

.m-input-content input:not(:placeholder-shown),

.m-input-content textarea:-webkit-autofill,

.m-input-content textarea:focus,

.m-input-content textarea:not(:placeholder-shown) {

    -moz-appearance: none;

    appearance: none;

    -webkit-appearance: none !important

}



.m-input-content input:-webkit-autofill+.m-input-content-label,

.m-input-content input:focus+.m-input-content-label,

.m-input-content input:not(:placeholder-shown)+.m-input-content-label,

.m-input-content textarea:-webkit-autofill+.m-input-content-label,

.m-input-content textarea:focus+.m-input-content-label,

.m-input-content textarea:not(:placeholder-shown)+.m-input-content-label {

    --m-input-label-font: var(--m-input-label-font--focus);

    transform: translateY(calc(var(--m-input-text-line-height) / -2))

}



.m-input-content input:has(+.m-input-content-label),

.m-input-content textarea:has(+.m-input-content-label) {

    --placeholder-opacity: 0;

    margin-top: calc(var(--m-input-label-line-height--focus) + var(--m-input-row-gap))

}



.m-input-content input[disabled-without-style=true],

.m-input-content textarea[disabled-without-style=true] {

    pointer-events: none

}



.m-input-content input:-webkit-autofill,

.m-input-content input:-webkit-autofill:active,

.m-input-content input:-webkit-autofill:focus,

.m-input-content input:-webkit-autofill:hover,

.m-input-content textarea:-webkit-autofill,

.m-input-content textarea:-webkit-autofill:active,

.m-input-content textarea:-webkit-autofill:focus,

.m-input-content textarea:-webkit-autofill:hover {

    -webkit-text-fill-color: var(--m-input-text-color) !important;

    -webkit-animation-fill-mode: both;

    animation-name: autofill;

    -webkit-background-clip: text

}



.m-input-append,

.m-input-prepend {

    align-items: center;

    display: flex;

    gap: var(--m-input-content-gap)

}



.m-input-append img,

.m-input-append svg,

.m-input-prepend img,

.m-input-prepend svg {

    height: var(--ic-size);

    width: var(--ic-size)

}



.m-radio {

    --m-radio-ripple-opacity: 0;

    align-items: center;

    background: var(--m-radio-background-color);

    box-shadow: inset 0 0 0 var(--m-radio-border-size) var(--m-radio-border-color, rgba(0, 0, 0, 0));

    cursor: pointer;

    display: inline-flex;

    justify-content: flex-end;

    padding: var(--m-radio-padding);

    position: relative;

    transition: all .15s ease-in-out

}



.m-radio,

.m-radio:before {

    border-radius: var(--m-radio-border-radius)

}



.m-radio:before {

    border-color: var(--m-radio-outline-color, rgba(0, 0, 0, 0));

    border-style: solid;

    border-width: var(--m-radio-border-size);

    content: "";

    inset: calc(var(--m-radio-border-size) * -1);

    position: absolute;

    transition: border-color .2s

}



.m-radio input {

    bottom: 0;

    left: 0;

    opacity: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: -1

}



.m-radio-ripple {

    background: var(--m-radio-ripple-color);

    border-radius: var(--m-radio-border-radius);

    height: var(--m-radio-ripple-size);

    opacity: var(--m-radio-ripple-opacity);

    transition: opacity .2s;

    width: var(--m-radio-ripple-size)

}



.m-radio--checked:not(.m-radio--unset) {

    --m-radio-ripple-opacity: 1;

    --m-radio-background-color: var(--m-radio-checked-background-color);

    --m-radio-background-color-hover: var(--m-radio-checked-background-color-hover);

    --m-radio-background-color-focus: var(--m-radio-checked-background-color-focus);

    --m-radio-background-color-disabled: var(--m-radio-checked-background-color-disabled);

    --m-radio-border-color: var(--m-radio-checked-border-color);

    --m-radio-border-color-hover: var(--m-radio-checked-border-color-hover);

    --m-radio-border-color-focus: var(--m-radio-checked-border-color-focus);

    --m-radio-border-color-disabled: var(--m-radio-checked-border-color-disabled);

    --m-radio-outline-color-focus: var(--m-radio-outline-checked-color-focus)

}



@media not (any-pointer: coarse) {

    .m-radio:hover {

        --m-radio-background-color: var(--m-radio-background-color-hover);

        --m-radio-ripple-color: var(--m-radio-ripple-color-hover);

        --m-radio-border-color: var(--m-radio-border-color-hover)

    }

}



.m-radio:has(input:focus) {

    --m-radio-background-color: var(--m-radio-background-color-focus);

    --m-radio-ripple-color: var(--m-radio-ripple-color-focus);

    --m-radio-border-color: var(--m-radio-border-color-focus);

    --m-radio-outline-color: var(--m-radio-outline-color-focus)

}



.m-radio--disabled:not(#i#i#i) {

    --m-radio-background-color: var(--m-radio-background-color-disabled);

    --m-radio-ripple-color: var(--m-radio-ripple-color-disabled);

    --m-radio-border-color: var(--m-radio-border-color-disabled);

    --m-radio-outline-color: #0000;

    cursor: not-allowed

}



.m-radio--s {

    --m-radio-border-radius: var(--selector-radiobutton-border-radius-s, 100%);

    --m-radio-border-size: var(--selector-border-size-s, 2px);

    --m-radio-padding: var(--selector-radiobutton-expand-s, 4px);

    --m-radio-ripple-size: var(--selector-radiobutton-radio-size-s, 8px);

    --m-radio-outline-border-size: var(--selector-outside-border-size-s, 2px)

}



.m-radio--m {

    --m-radio-border-radius: var(--selector-radiobutton-border-radius-m, 100%);

    --m-radio-border-size: var(--selector-border-size-m, 2px);

    --m-radio-padding: var(--selector-radiobutton-expand-m, 4px);

    --m-radio-ripple-size: var(--selector-radiobutton-radio-size-m, 8px);

    --m-radio-outline-border-size: var(--selector-outside-border-size-m, 2px)

}



.m-radio--primary {

    --m-radio-border-color: var(--color-selector-primary-border);

    --m-radio-border-color-hover: var(--color-selector-primary-border-hover);

    --m-radio-border-color-focus: var(--color-selector-primary-border-focus);

    --m-radio-border-color-disabled: var(--color-selector-primary-border-disabled);

    --m-radio-checked-background-color: var(--color-selector-primary-checked-background);

    --m-radio-checked-background-color-focus: var(--color-selector-primary-checked-background-focus);

    --m-radio-checked-background-color-hover: var(--color-selector-primary-checked-background-hover);

    --m-radio-checked-background-color-disabled: var(--color-selector-primary-checked-background-disabled);

    --m-radio-checked-border-color: var(--color-selector-primary-checked-border);

    --m-radio-checked-border-color-hover: var(--color-selector-primary-checked-border-hover);

    --m-radio-checked-border-color-focus: var(--color-selector-primary-checked-border-focus);

    --m-radio-checked-border-color-disabled: var(--color-selector-primary-checked-border-disabled);

    --m-radio-ripple-color: var(--color-selector-primary-checked-element);

    --m-radio-ripple-color-hover: var(--color-selector-primary-checked-element-hover);

    --m-radio-ripple-color-focus: var(--color-selector-primary-checked-element-focus);

    --m-radio-ripple-color-disabled: var(--color-selector-primary-checked-element-disabled);

    --m-radio-outline-color-focus: var(--color-selector-primary-outside-border-focus);

    --m-radio-outline-checked-color-focus: var(--color-selector-primary-checked-outside-border-focus)

}



.m-radio--basic {

    --m-radio-border-color: var(--color-selector-basic-border);

    --m-radio-border-color-hover: var(--color-selector-basic-border-hover);

    --m-radio-border-color-focus: var(--color-selector-basic-border-focus);

    --m-radio-border-color-disabled: var(--color-selector-basic-border-disabled);

    --m-radio-checked-background-color: var(--color-selector-basic-checked-background);

    --m-radio-checked-background-color-focus: var(--color-selector-basic-checked-background-focus);

    --m-radio-checked-background-color-hover: var(--color-selector-basic-checked-background-hover);

    --m-radio-checked-background-color-disabled: var(--color-selector-basic-checked-background-disabled);

    --m-radio-checked-border-color: var(--color-selector-basic-checked-border);

    --m-radio-checked-border-color-hover: var(--color-selector-basic-checked-border-hover);

    --m-radio-checked-border-color-focus: var(--color-selector-basic-checked-border-focus);

    --m-radio-checked-border-color-disabled: var(--color-selector-basic-checked-border-disabled);

    --m-radio-ripple-color: var(--color-selector-basic-checked-element);

    --m-radio-ripple-color-hover: var(--color-selector-basic-checked-element-hover);

    --m-radio-ripple-color-focus: var(--color-selector-basic-checked-element-focus);

    --m-radio-ripple-color-disabled: var(--color-selector-basic-checked-element-disabled);

    --m-radio-outline-color-focus: var(--color-selector-basic-outside-border-focus);

    --m-radio-outline-checked-color-focus: var(--color-selector-basic-checked-outside-border-focus)

}



.m-button {

    --m-button-transition-duration: .15s;

    align-items: center;

    background: var(--m-button-background);

    border: none;

    border-radius: var(--m-button-border-radius);

    box-shadow: inset 0 0 0 var(--m-button-border-width) var(--m-button-border-color);

    color: var(--m-button-text-color);

    cursor: pointer;

    display: flex;

    font: var(--m-button-font);

    justify-content: center;

    padding: var(--m-button-padding);

    position: relative;

    text-decoration: none;

    transition: all var(--m-button-transition-duration) ease-in-out

}



.m-button>* {

    transition-duration: var(--m-button-transition-duration);

    transition-property: opacity, scale;

    transition-timing-function: ease-in-out

}



.m-button.m-gradient-border {

    --gradient-width: var(--m-button-border-width);

    --gradient-color: var(--m-button-border-color)

}



.m-button-content {

    align-items: center;

    display: flex;

    gap: var(--m-button-text-margin);

    justify-content: center;

    min-height: var(--m-button-content-height);

    padding: var(--m-button-text-margin)

}



.m-button-content img,

.m-button-content svg {

    height: var(--ic-size);

    width: var(--ic-size)

}



.m-button--primary {

    --m-button-background: var(--color-button-fill-primary-background);

    --m-button-text-color: var(--color-button-fill-primary-text);

    --m-button-border-color: var(--color-button-fill-primary-border);

    --m-button-border-color-hover: var(--color-button-fill-primary-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-primary-border-active);

    --m-button-background-disabled: var(--color-button-fill-primary-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-primary-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-primary-text-disabled);

    --m-button-background-hover: var(--color-button-fill-primary-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-primary-text-hover);

    --m-button-background-pressed: var(--color-button-fill-primary-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-primary-text-active);

    --ic-color: var(--color-button-fill-primary-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-primary-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-primary-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-primary-icon-container-icon-active);

    --ic-background: var(--color-button-fill-primary-icon-container-background);

    --ic-background-hover: var(--color-button-fill-primary-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-primary-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-primary-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-primary-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-primary-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-primary-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-primary-icon-container-border-disabled);

    background-color: #40e6b1;

    color: #10221a

}



.m-button--primary:hover {

    background-color: #67f2c7

}



.m-button--primary.m-button--outline {

    --m-button-background: var(--color-button-outline-primary-background);

    --m-button-text-color: var(--color-button-outline-primary-text);

    --m-button-border-color: var(--color-button-outline-primary-border);

    --m-button-border-color-hover: var(--color-button-outline-primary-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-primary-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-primary-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-primary-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-primary-text-disabled);

    --m-button-background-hover: var(--color-button-outline-primary-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-primary-text-hover);

    --m-button-background-pressed: var(--color-button-outline-primary-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-primary-text-active);

    --ic-color: var(--color-button-outline-primary-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-primary-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-primary-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-primary-icon-container-icon-active);

    --ic-background: var(--color-button-outline-primary-icon-container-background);

    --ic-background-hover: var(--color-button-outline-primary-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-primary-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-primary-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-primary-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-primary-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-primary-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-primary-icon-container-border-disabled)

}



.m-button--secondary {

    --m-button-background: var(--color-button-fill-secondary-background);

    --m-button-text-color: var(--color-button-fill-secondary-text);

    --m-button-border-color: var(--color-button-fill-secondary-border);

    --m-button-border-color-hover: var(--color-button-fill-secondary-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-secondary-border-active);

    --m-button-background-disabled: var(--color-button-fill-secondary-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-secondary-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-secondary-text-disabled);

    --m-button-background-hover: var(--color-button-fill-secondary-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-secondary-text-hover);

    --m-button-background-pressed: var(--color-button-fill-secondary-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-secondary-text-active);

    --ic-color: var(--color-button-fill-secondary-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-secondary-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-secondary-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-secondary-icon-container-icon-active);

    --ic-background: var(--color-button-fill-secondary-icon-container-background);

    --ic-background-hover: var(--color-button-fill-secondary-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-secondary-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-secondary-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-secondary-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-secondary-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-secondary-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-secondary-icon-container-border-disabled);

    background-color: #2e3c36

}



.m-button--secondary:hover {

    background-color: #3d594e

}



.m-button--secondary.m-button--outline {

    --m-button-background: var(--color-button-outline-secondary-background);

    --m-button-text-color: var(--color-button-outline-secondary-text);

    --m-button-border-color: var(--color-button-outline-secondary-border);

    --m-button-border-color-hover: var(--color-button-outline-secondary-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-secondary-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-secondary-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-secondary-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-secondary-text-disabled);

    --m-button-background-hover: var(--color-button-outline-secondary-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-secondary-text-hover);

    --m-button-background-pressed: var(--color-button-outline-secondary-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-secondary-text-active);

    --ic-color: var(--color-button-outline-secondary-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-secondary-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-secondary-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-secondary-icon-container-icon-active);

    --ic-background: var(--color-button-outline-secondary-icon-container-background);

    --ic-background-hover: var(--color-button-outline-secondary-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-secondary-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-secondary-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-secondary-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-secondary-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-secondary-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-secondary-icon-container-border-disabled)

}



.m-button--info {

    --m-button-background: var(--color-button-fill-info-background);

    --m-button-text-color: var(--color-button-fill-info-text);

    --m-button-border-color: var(--color-button-fill-info-border);

    --m-button-border-color-hover: var(--color-button-fill-info-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-info-border-active);

    --m-button-background-disabled: var(--color-button-fill-info-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-info-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-info-text-disabled);

    --m-button-background-hover: var(--color-button-fill-info-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-info-text-hover);

    --m-button-background-pressed: var(--color-button-fill-info-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-info-text-active);

    --ic-color: var(--color-button-fill-info-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-info-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-info-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-info-icon-container-icon-active);

    --ic-background: var(--color-button-fill-info-icon-container-background);

    --ic-background-hover: var(--color-button-fill-info-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-info-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-info-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-info-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-info-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-info-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-info-icon-container-border-disabled);

    background-color: #40e6b1

}



.m-button--info:hover {

    background-color: #67f2c7

}



.m-button--info.m-button--outline {

    --m-button-background: var(--color-button-outline-info-background);

    --m-button-text-color: var(--color-button-outline-info-text);

    --m-button-border-color: var(--color-button-outline-info-border);

    --m-button-border-color-hover: var(--color-button-outline-info-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-info-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-info-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-info-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-info-text-disabled);

    --m-button-background-hover: var(--color-button-outline-info-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-info-text-hover);

    --m-button-background-pressed: var(--color-button-outline-info-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-info-text-active);

    --ic-color: var(--color-button-outline-info-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-info-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-info-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-info-icon-container-icon-active);

    --ic-background: var(--color-button-outline-info-icon-container-background);

    --ic-background-hover: var(--color-button-outline-info-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-info-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-info-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-info-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-info-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-info-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-info-icon-container-border-disabled)

}



.m-button--minor {

    --m-button-background: var(--color-button-fill-minor-background);

    --m-button-text-color: var(--color-button-fill-minor-text);

    --m-button-border-color: var(--color-button-fill-minor-border);

    --m-button-border-color-hover: var(--color-button-fill-minor-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-minor-border-active);

    --m-button-background-disabled: var(--color-button-fill-minor-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-minor-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-minor-text-disabled);

    --m-button-background-hover: var(--color-button-fill-minor-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-minor-text-hover);

    --m-button-background-pressed: var(--color-button-fill-minor-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-minor-text-active);

    --ic-color: var(--color-button-fill-minor-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-minor-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-minor-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-minor-icon-container-icon-active);

    --ic-background: var(--color-button-fill-minor-icon-container-background);

    --ic-background-hover: var(--color-button-fill-minor-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-minor-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-minor-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-minor-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-minor-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-minor-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-minor-icon-container-border-disabled)

}



.m-button--minor.m-button--outline {

    --m-button-background: var(--color-button-outline-minor-background);

    --m-button-text-color: var(--color-button-outline-minor-text);

    --m-button-border-color: var(--color-button-outline-minor-border);

    --m-button-border-color-hover: var(--color-button-outline-minor-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-minor-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-minor-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-minor-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-minor-text-disabled);

    --m-button-background-hover: var(--color-button-outline-minor-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-minor-text-hover);

    --m-button-background-pressed: var(--color-button-outline-minor-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-minor-text-active);

    --ic-color: var(--color-button-outline-minor-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-minor-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-minor-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-minor-icon-container-icon-active);

    --ic-background: var(--color-button-outline-minor-icon-container-background);

    --ic-background-hover: var(--color-button-outline-minor-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-minor-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-minor-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-minor-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-minor-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-minor-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-minor-icon-container-border-disabled)

}



.m-button--success {

    --m-button-background: var(--color-button-fill-success-background);

    --m-button-text-color: var(--color-button-fill-success-text);

    --m-button-border-color: var(--color-button-fill-success-border);

    --m-button-border-color-hover: var(--color-button-fill-success-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-success-border-active);

    --m-button-background-disabled: var(--color-button-fill-success-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-success-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-success-text-disabled);

    --m-button-background-hover: var(--color-button-fill-success-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-success-text-hover);

    --m-button-background-pressed: var(--color-button-fill-success-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-success-text-active);

    --ic-color: var(--color-button-fill-success-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-success-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-success-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-success-icon-container-icon-active);

    --ic-background: var(--color-button-fill-success-icon-container-background);

    --ic-background-hover: var(--color-button-fill-success-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-success-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-success-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-success-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-success-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-success-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-success-icon-container-border-disabled);

    background-color: #40e6b1;

    color: #10221a

}



.m-button--success.m-button--outline {

    --m-button-background: var(--color-button-outline-success-background);

    --m-button-text-color: var(--color-button-outline-success-text);

    --m-button-border-color: var(--color-button-outline-success-border);

    --m-button-border-color-hover: var(--color-button-outline-success-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-success-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-success-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-success-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-success-text-disabled);

    --m-button-background-hover: var(--color-button-outline-success-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-success-text-hover);

    --m-button-background-pressed: var(--color-button-outline-success-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-success-text-active);

    --ic-color: var(--color-button-outline-success-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-success-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-success-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-success-icon-container-icon-active);

    --ic-background: var(--color-button-outline-success-icon-container-background);

    --ic-background-hover: var(--color-button-outline-success-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-success-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-success-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-success-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-success-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-success-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-success-icon-container-border-disabled)

}



.m-button--attention {

    --m-button-background: var(--color-button-fill-attention-background);

    --m-button-text-color: var(--color-button-fill-attention-text);

    --m-button-border-color: var(--color-button-fill-attention-border);

    --m-button-border-color-hover: var(--color-button-fill-attention-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-attention-border-active);

    --m-button-background-disabled: var(--color-button-fill-attention-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-attention-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-attention-text-disabled);

    --m-button-background-hover: var(--color-button-fill-attention-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-attention-text-hover);

    --m-button-background-pressed: var(--color-button-fill-attention-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-attention-text-active);

    --ic-color: var(--color-button-fill-attention-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-attention-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-attention-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-attention-icon-container-icon-active);

    --ic-background: var(--color-button-fill-attention-icon-container-background);

    --ic-background-hover: var(--color-button-fill-attention-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-attention-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-attention-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-attention-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-attention-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-attention-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-attention-icon-container-border-disabled)

}



.m-button--attention.m-button--outline {

    --m-button-background: var(--color-button-outline-attention-background);

    --m-button-text-color: var(--color-button-outline-attention-text);

    --m-button-border-color: var(--color-button-outline-attention-border);

    --m-button-border-color-hover: var(--color-button-outline-attention-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-attention-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-attention-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-attention-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-attention-text-disabled);

    --m-button-background-hover: var(--color-button-outline-attention-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-attention-text-hover);

    --m-button-background-pressed: var(--color-button-outline-attention-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-attention-text-active);

    --ic-color: var(--color-button-outline-attention-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-attention-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-attention-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-attention-icon-container-icon-active);

    --ic-background: var(--color-button-outline-attention-icon-container-background);

    --ic-background-hover: var(--color-button-outline-attention-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-attention-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-attention-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-attention-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-attention-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-attention-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-attention-icon-container-border-disabled)

}



.m-button--warning {

    --m-button-background: var(--color-button-fill-warning-background);

    --m-button-text-color: var(--color-button-fill-warning-text);

    --m-button-border-color: var(--color-button-fill-warning-border);

    --m-button-border-color-hover: var(--color-button-fill-warning-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-warning-border-active);

    --m-button-background-disabled: var(--color-button-fill-warning-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-warning-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-warning-text-disabled);

    --m-button-background-hover: var(--color-button-fill-warning-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-warning-text-hover);

    --m-button-background-pressed: var(--color-button-fill-warning-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-warning-text-active);

    --ic-color: var(--color-button-fill-warning-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-warning-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-warning-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-warning-icon-container-icon-active);

    --ic-background: var(--color-button-fill-warning-icon-container-background);

    --ic-background-hover: var(--color-button-fill-warning-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-warning-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-warning-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-warning-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-warning-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-warning-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-warning-icon-container-border-disabled)

}



.m-button--warning.m-button--outline {

    --m-button-background: var(--color-button-outline-warning-background);

    --m-button-text-color: var(--color-button-outline-warning-text);

    --m-button-border-color: var(--color-button-outline-warning-border);

    --m-button-border-color-hover: var(--color-button-outline-warning-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-warning-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-warning-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-warning-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-warning-text-disabled);

    --m-button-background-hover: var(--color-button-outline-warning-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-warning-text-hover);

    --m-button-background-pressed: var(--color-button-outline-warning-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-warning-text-active);

    --ic-color: var(--color-button-outline-warning-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-warning-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-warning-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-warning-icon-container-icon-active);

    --ic-background: var(--color-button-outline-warning-icon-container-background);

    --ic-background-hover: var(--color-button-outline-warning-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-warning-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-warning-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-warning-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-warning-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-warning-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-warning-icon-container-border-disabled)

}



.m-button--danger {

    --m-button-background: var(--color-button-fill-danger-background);

    --m-button-text-color: var(--color-button-fill-danger-text);

    --m-button-border-color: var(--color-button-fill-danger-border);

    --m-button-border-color-hover: var(--color-button-fill-danger-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-danger-border-active);

    --m-button-background-disabled: var(--color-button-fill-danger-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-danger-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-danger-text-disabled);

    --m-button-background-hover: var(--color-button-fill-danger-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-danger-text-hover);

    --m-button-background-pressed: var(--color-button-fill-danger-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-danger-text-active);

    --ic-color: var(--color-button-fill-danger-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-danger-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-danger-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-danger-icon-container-icon-active);

    --ic-background: var(--color-button-fill-danger-icon-container-background);

    --ic-background-hover: var(--color-button-fill-danger-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-danger-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-danger-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-danger-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-danger-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-danger-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-danger-icon-container-border-disabled)

}



.m-button--danger.m-button--outline {

    --m-button-background: var(--color-button-outline-danger-background);

    --m-button-text-color: var(--color-button-outline-danger-text);

    --m-button-border-color: var(--color-button-outline-danger-border);

    --m-button-border-color-hover: var(--color-button-outline-danger-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-danger-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-danger-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-danger-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-danger-text-disabled);

    --m-button-background-hover: var(--color-button-outline-danger-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-danger-text-hover);

    --m-button-background-pressed: var(--color-button-outline-danger-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-danger-text-active);

    --ic-color: var(--color-button-outline-danger-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-danger-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-danger-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-danger-icon-container-icon-active);

    --ic-background: var(--color-button-outline-danger-icon-container-background);

    --ic-background-hover: var(--color-button-outline-danger-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-danger-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-danger-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-danger-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-danger-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-danger-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-danger-icon-container-border-disabled)

}



.m-button--light {

    --m-button-background: var(--color-button-fill-light-background);

    --m-button-text-color: var(--color-button-fill-light-text);

    --m-button-border-color: var(--color-button-fill-light-border);

    --m-button-border-color-hover: var(--color-button-fill-light-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-light-border-active);

    --m-button-background-disabled: var(--color-button-fill-light-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-light-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-light-text-disabled);

    --m-button-background-hover: var(--color-button-fill-light-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-light-text-hover);

    --m-button-background-pressed: var(--color-button-fill-light-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-light-text-active);

    --ic-color: var(--color-button-fill-light-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-light-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-light-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-light-icon-container-icon-active);

    --ic-background: var(--color-button-fill-light-icon-container-background);

    --ic-background-hover: var(--color-button-fill-light-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-light-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-light-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-light-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-light-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-light-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-light-icon-container-border-disabled)

}



.m-button--light.m-button--outline {

    --m-button-background: var(--color-button-outline-light-background);

    --m-button-text-color: var(--color-button-outline-light-text);

    --m-button-border-color: var(--color-button-outline-light-border);

    --m-button-border-color-hover: var(--color-button-outline-light-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-light-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-light-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-light-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-light-text-disabled);

    --m-button-background-hover: var(--color-button-outline-light-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-light-text-hover);

    --m-button-background-pressed: var(--color-button-outline-light-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-light-text-active);

    --ic-color: var(--color-button-outline-light-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-light-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-light-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-light-icon-container-icon-active);

    --ic-background: var(--color-button-outline-light-icon-container-background);

    --ic-background-hover: var(--color-button-outline-light-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-light-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-light-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-light-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-light-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-light-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-light-icon-container-border-disabled)

}



.m-button--dark {

    --m-button-background: var(--color-button-fill-dark-background);

    --m-button-text-color: var(--color-button-fill-dark-text);

    --m-button-border-color: var(--color-button-fill-dark-border);

    --m-button-border-color-hover: var(--color-button-fill-dark-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-dark-border-active);

    --m-button-background-disabled: var(--color-button-fill-dark-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-dark-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-dark-text-disabled);

    --m-button-background-hover: var(--color-button-fill-dark-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-dark-text-hover);

    --m-button-background-pressed: var(--color-button-fill-dark-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-dark-text-active);

    --ic-color: var(--color-button-fill-dark-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-dark-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-dark-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-dark-icon-container-icon-active);

    --ic-background: var(--color-button-fill-dark-icon-container-background);

    --ic-background-hover: var(--color-button-fill-dark-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-dark-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-dark-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-dark-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-dark-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-dark-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-dark-icon-container-border-disabled)

}



.m-button--dark.m-button--outline {

    --m-button-background: var(--color-button-outline-dark-background);

    --m-button-text-color: var(--color-button-outline-dark-text);

    --m-button-border-color: var(--color-button-outline-dark-border);

    --m-button-border-color-hover: var(--color-button-outline-dark-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-dark-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-dark-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-dark-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-dark-text-disabled);

    --m-button-background-hover: var(--color-button-outline-dark-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-dark-text-hover);

    --m-button-background-pressed: var(--color-button-outline-dark-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-dark-text-active);

    --ic-color: var(--color-button-outline-dark-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-dark-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-dark-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-dark-icon-container-icon-active);

    --ic-background: var(--color-button-outline-dark-icon-container-background);

    --ic-background-hover: var(--color-button-outline-dark-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-dark-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-dark-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-dark-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-dark-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-dark-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-dark-icon-container-border-disabled)

}



.m-button--vip {

    --m-button-background: var(--color-button-fill-vip-background);

    --m-button-text-color: var(--color-button-fill-vip-text);

    --m-button-border-color: var(--color-button-fill-vip-border);

    --m-button-border-color-hover: var(--color-button-fill-vip-border-hover);

    --m-button-border-color-pressed: var(--color-button-fill-vip-border-active);

    --m-button-background-disabled: var(--color-button-fill-vip-background-disabled);

    --m-button-border-color-disabled: var(--color-button-fill-vip-border-disabled);

    --m-button-text-color-disabled: var(--color-button-fill-vip-text-disabled);

    --m-button-background-hover: var(--color-button-fill-vip-background-hover);

    --m-button-text-color-hover: var(--color-button-fill-vip-text-hover);

    --m-button-background-pressed: var(--color-button-fill-vip-background-active);

    --m-button-text-color-pressed: var(--color-button-fill-vip-text-active);

    --ic-color: var(--color-button-fill-vip-icon-container-icon);

    --ic-color-disabled: var(--color-button-fill-vip-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-fill-vip-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-fill-vip-icon-container-icon-active);

    --ic-background: var(--color-button-fill-vip-icon-container-background);

    --ic-background-hover: var(--color-button-fill-vip-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-fill-vip-icon-container-background-active);

    --ic-background-disabled: var(--color-button-fill-vip-icon-container-background-disabled);

    --ic-border-color: var(--color-button-fill-vip-icon-container-border);

    --ic-border-color-hover: var(--color-button-fill-vip-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-fill-vip-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-fill-vip-icon-container-border-disabled)

}



.m-button--vip.m-button--outline {

    --m-button-background: var(--color-button-outline-vip-background);

    --m-button-text-color: var(--color-button-outline-vip-text);

    --m-button-border-color: var(--color-button-outline-vip-border);

    --m-button-border-color-hover: var(--color-button-outline-vip-border-hover);

    --m-button-border-color-pressed: var(--color-button-outline-vip-border-active);

    --m-button-border-color-disabled: var(--color-button-outline-vip-border-disabled);

    --m-button-background-disabled: var(--color-button-outline-vip-background-disabled);

    --m-button-text-color-disabled: var(--color-button-outline-vip-text-disabled);

    --m-button-background-hover: var(--color-button-outline-vip-background-hover);

    --m-button-text-color-hover: var(--color-button-outline-vip-text-hover);

    --m-button-background-pressed: var(--color-button-outline-vip-background-active);

    --m-button-text-color-pressed: var(--color-button-outline-vip-text-active);

    --ic-color: var(--color-button-outline-vip-icon-container-icon);

    --ic-color-disabled: var(--color-button-outline-vip-icon-container-icon-disabled);

    --ic-color-hover: var(--color-button-outline-vip-icon-container-icon-hover);

    --ic-color-pressed: var(--color-button-outline-vip-icon-container-icon-active);

    --ic-background: var(--color-button-outline-vip-icon-container-background);

    --ic-background-hover: var(--color-button-outline-vip-icon-container-background-hover);

    --ic-background-pressed: var(--color-button-outline-vip-icon-container-background-active);

    --ic-background-disabled: var(--color-button-outline-vip-icon-container-background-disabled);

    --ic-border-color: var(--color-button-outline-vip-icon-container-border);

    --ic-border-color-hover: var(--color-button-outline-vip-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-button-outline-vip-icon-container-border-active);

    --ic-border-color-disabled: var(--color-button-outline-vip-icon-container-border-disabled)

}



.m-button--s {

    --m-button-padding: var(--button-expand-s, 12px);

    --m-button-border-radius: var(--button-border-radius-s, 22px);

    --m-button-border-width: var(--button-border-size-s, 2px);

    --m-button-content-height: var(--button-content-height-s, 20px);

    --m-button-font: var(--font-button-text-s);

    --m-button-text-margin: var(--button-text-container-expand-s, 0 8px);

    --ic-padding: var(--button-icon-container-expand-s, 0);

    --ic-size: var(--button-icon-container-icon-size-s, 20px);

    --ic-border-width: var(--button-icon-container-border-size-s, 0);

    --ic-border-radius: var(--button-icon-container-border-radius-s, 0);

    letter-spacing: var(--font-button-text-s-ls, 0);

    text-transform: var(--font-button-text-s-transform, unset)

}



.m-button--m {

    --m-button-padding: var(--button-expand-m, 12px);

    --m-button-border-radius: var(--button-border-radius-m, 22px);

    --m-button-border-width: var(--button-border-size-m, 2px);

    --m-button-content-height: var(--button-content-height-m, 20px);

    --m-button-font: var(--font-button-text-m);

    --m-button-text-margin: var(--button-text-container-expand-m, 0 8px);

    --ic-padding: var(--button-icon-container-expand-m, 0);

    --ic-size: var(--button-icon-container-icon-size-m, 20px);

    --ic-border-width: var(--button-icon-container-border-size-m, 0);

    --ic-border-radius: var(--button-icon-container-border-radius-m, 0);

    letter-spacing: var(--font-button-text-m-ls, 0);

    text-transform: var(--font-button-text-m-transform, unset)

}



.m-button--l {

    --m-button-padding: var(--button-expand-l, 12px);

    --m-button-border-radius: var(--button-border-radius-l, 22px);

    --m-button-border-width: var(--button-border-size-l, 2px);

    --m-button-content-height: var(--button-content-height-l, 20px);

    --m-button-font: var(--font-button-text-l);

    --m-button-text-margin: var(--button-text-container-expand-l, 0 8px);

    --ic-padding: var(--button-icon-container-expand-l, 0);

    --ic-size: var(--button-icon-container-icon-size-l, 20px);

    --ic-border-width: var(--button-icon-container-border-size-l, 0);

    --ic-border-radius: var(--button-icon-container-border-radius-l, 0);

    letter-spacing: var(--font-button-text-l-ls, 0);

    text-transform: var(--font-button-text-l-transform, unset)

}



@media not (any-pointer: coarse) {



    .m-button:focus-visible,

    .m-button:hover {

        --m-button-background: #40e6b1;

        --m-button-border-color: var(--m-button-border-color-hover);

        --m-button-text-color: var(--m-button-text-color-hover);

        --ic-color: var(--ic-color-hover);

        --ic-border-color: var(--ic-border-color-hover);

        --ic-background: var(--ic-background-hover)

    }

}



.m-button:active {

    --m-button-background: var(--m-button-background-pressed);

    --m-button-border-color: var(--m-button-border-color-pressed);

    --m-button-text-color: var(--m-button-text-color-pressed);

    --ic-color: var(--ic-color-pressed);

    --ic-border-color: var(--ic-border-color-pressed);

    --ic-background: var(--ic-background-pressed)

}



.m-button:disabled,

.m-button[disabled=true] {

    --m-button-text-color: var(--m-button-text-color-disabled);

    --m-button-background: var(--m-button-background-disabled);

    --m-button-border-color: var(--m-button-border-color-disabled);

    --ic-color: var(--ic-color-disabled);

    --ic-border-color: var(--ic-border-color-disabled);

    --ic-background: var(--ic-background-disabled);

    cursor: not-allowed

}



.m-button .m-preloader {

    position: absolute

}



.m-button--loading {

    pointer-events: none

}



.m-button--loading .m-preloader {

    color: var(--ic-color)

}



.m-button--loading .m-preloader~* {

    opacity: 0;

    transform: scale(.5)

}



.m-button--swap {

    flex-direction: row-reverse

}



.m-button .m-loader-fade-enter-active,

.m-button .m-loader-fade-leave-active {

    transition: opacity .2s ease-in-out

}



.m-button .m-loader-fade-enter-from,

.m-button .m-loader-fade-leave-to {

    opacity: 0

}



.m-button .m-countdown {

    --m-countdown-text-color: var(--m-button-text-color)

}



.m-segment-control {

    border-radius: var(--m-segment-border-radius);

    box-shadow: inset 0 0 0 var(--m-segment-border-width) var(--m-segment-border-color);

    display: grid;

    grid-template-columns: repeat(var(--items-num), 1fr);

    padding: var(--m-segment-padding);

    position: relative

}



.m-segment-control.m-gradient-border {

    --gradient-width: var(--m-segment-border-width);

    --gradient-color: var(--m-segment-border-color)

}



.m-segment-control-item {

    align-items: center;

    border-radius: var(--m-segment-tab-border-radius);

    color: var(--m-segment-tab-text-color);

    cursor: pointer;

    display: flex;

    font: var(--m-segment-font);

    justify-content: center;

    min-height: var(--m-segment-tab-content-height);

    padding: var(--m-segment-tab-padding);

    transition: all .15s ease-in-out;

    z-index: 1

}



.m-segment-control-item span {

    padding: var(--m-segment-text-padding)

}



.m-segment-control-item:hover:not(.m-segment-control-item--active) {

    --m-segment-tab-text-color: var(--m-segment-tab-text-color-hover);

    --ic-color: var(--ic-color-hover)

}



.m-segment-control-item--active {

    --m-segment-tab-text-color: var(--m-segment-tab-text-color-active);

    --ic-color: var(--ic-color-active);

    background: var(--m-segment-tab-background-active)

}



.m-segment-control-item--active.m-gradient-border {

    --gradient-color: var(--m-segment-tab-border-color-active)

}



.m-segment-control--filled {

    background: var(--m-segment-filled-background)

}



.m-segment-control--outline:not(#i#i#i) {

    --m-segment-border-color: var(--m-segment-outline-border-color);

    --segment-gradient-color: #0000;

    background: #0000

}



.m-segment-control--shrink {

    max-width: max-content

}



.m-segment-control--fit-content {

    grid-template-columns: repeat(var(--items-num), auto)

}



.m-segment-control--s {

    --m-segment-border-radius: var(--tabs-group-border-radius-s, 22px);

    --m-segment-border-width: var(--tabs-group-border-size-s, 2px);

    --m-segment-padding: var(--tabs-group-expand-s, 0);

    --m-segment-tab-border-radius: var(--tab-border-radius-s, 22px);

    --m-segment-tab-border-width: var(--tab-border-size-s, 2px);

    --m-segment-tab-padding: var(--tab-expand-s, 12px);

    --m-segment-tab-content-height: var(--tab-content-height-s, 20px);

    --m-segment-font: var(--font-tab-text-s);

    --m-segment-text-padding: var(--tab-text-container-expand-s, 0 8px);

    --ic-size: var(--tab-icon-container-icon-size-s, 20px);

    --ic-border-width: var(--tab-icon-container-icon-size-s, 1px);

    --ic-padding: var(--tab-icon-container-expand-s, 0);

    --ic-border-radius: var(--tab-icon-container-border-radius-s, 10px)

}



.m-segment-control--m {

    --m-segment-border-radius: var(--tabs-group-border-radius-m, 22px);

    --m-segment-border-width: var(--tabs-group-border-size-m, 2px);

    --m-segment-padding: var(--tabs-group-expand-m, 0);

    --m-segment-tab-border-radius: var(--tab-border-radius-m, 22px);

    --m-segment-tab-border-width: var(--tab-border-size-m, 2px);

    --m-segment-tab-padding: var(--tab-expand-m, 12px);

    --m-segment-tab-content-height: var(--tab-content-height-m, 20px);

    --m-segment-font: var(--font-tab-text-m);

    --m-segment-text-padding: var(--tab-text-container-expand-m, 0 8px);

    --ic-size: var(--tab-icon-container-icon-size-m, 20px);

    --ic-border-width: var(--tab-icon-container-icon-size-m, 1px);

    --ic-padding: var(--tab-icon-container-expand-m, 0);

    --ic-border-radius: var(--tab-icon-container-border-radius-m, 10px)

}



.m-segment-control--l {

    --m-segment-border-radius: var(--tabs-group-border-radius-l, 22px);

    --m-segment-border-width: var(--tabs-group-border-size-l, 2px);

    --m-segment-padding: var(--tabs-group-expand-l, 0);

    --m-segment-tab-border-radius: var(--tab-border-radius-l, 22px);

    --m-segment-tab-border-width: var(--tab-border-size-l, 2px);

    --m-segment-tab-padding: var(--tab-expand-l, 12px);

    --m-segment-tab-content-height: var(--tab-content-height-l, 20px);

    --m-segment-font: var(--font-tab-text-l);

    --m-segment-text-padding: var(--tab-text-container-expand-l, 0 8px);

    --ic-size: var(--tab-icon-container-icon-size-l, 20px);

    --ic-border-width: var(--tab-icon-container-icon-size-l, 1px);

    --ic-padding: var(--tab-icon-container-expand-l, 0);

    --ic-border-radius: var(--tab-icon-container-border-radius-l, 10px)

}



.m-segment-control--primary {

    --m-segment-tab-background-active: var(--color-tab-primary-background-active);

    --m-segment-tab-background-hover: var(--color-tab-primary-background-active);

    --m-segment-tab-text-color: var(--color-tab-primary-text);

    --m-segment-tab-text-color-active: var(--color-tab-primary-text-active);

    --m-segment-tab-text-color-hover: var(--color-tab-primary-text-hover);

    --m-segment-filled-background: var(--color-tabs-group-fill-primary-background);

    --m-segment-border-color: var(--color-tabs-group-fill-primary-border);

    --m-segment-outline-border-color: var(--color-tabs-group-outline-primary-border);

    --m-segment-tab-border-color-active: var(--color-tab-primary-border-active);

    --ic-color: var(--color-tab-primary-icon-container-icon);

    --ic-color-hover: var(--color-tab-primary-icon-container-icon-hover);

    --ic-color-active: var(--color-tab-primary-icon-container-icon-active)

}



.m-segment-control--secondary {

    --m-segment-tab-background-active: var(--color-tab-secondary-background-active);

    --m-segment-tab-background-hover: var(--color-tab-secondary-background-active);

    --m-segment-tab-text-color: var(--color-tab-secondary-text);

    --m-segment-tab-text-color-active: var(--color-tab-secondary-text-active);

    --m-segment-tab-text-color-hover: var(--color-tab-secondary-text-hover);

    --m-segment-filled-background: var(--color-tabs-group-fill-secondary-background);

    --m-segment-border-color: var(--color-tabs-group-fill-secondary-border);

    --m-segment-outline-border-color: var(--color-tabs-group-outline-secondary-border);

    --m-segment-tab-border-color-active: var(--color-tab-primary-border-active);

    --ic-color: var(--color-tab-secondary-icon-container-icon);

    --ic-color-hover: var(--color-tab-secondary-icon-container-icon-hover);

    --ic-color-active: var(--color-tab-secondary-icon-container-icon-active)

}



.m-segment-control--info {

    --m-segment-tab-background-active: var(--color-tab-info-background-active);

    --m-segment-tab-background-hover: var(--color-tab-info-background-active);

    --m-segment-tab-text-color: var(--color-tab-info-text);

    --m-segment-tab-text-color-active: var(--color-tab-info-text-active);

    --m-segment-tab-text-color-hover: var(--color-tab-info-text-hover);

    --m-segment-filled-background: var(--color-tabs-group-fill-info-background);

    --m-segment-border-color: var(--color-tabs-group-fill-info-border);

    --m-segment-outline-border-color: var(--color-tabs-group-outline-info-border);

    --m-segment-tab-border-color-active: var(--color-tab-primary-border-active);

    --ic-color: var(--color-tab-info-icon-container-icon);

    --ic-color-hover: var(--color-tab-info-icon-container-icon-hover);

    --ic-color-active: var(--color-tab-info-icon-container-icon-active)

}



.m-segment-control--inverse {

    --m-segment-tab-background-active: var(--color-tab-inverse-background-active);

    --m-segment-tab-background-hover: var(--color-tab-inverse-background-active);

    --m-segment-tab-text-color: var(--color-tab-inverse-text);

    --m-segment-tab-text-color-active: var(--color-tab-inverse-text-active);

    --m-segment-tab-text-color-hover: var(--color-tab-inverse-text-hover);

    --m-segment-filled-background: var(--color-tabs-group-fill-inverse-background);

    --m-segment-border-color: var(--color-tabs-group-fill-inverse-border);

    --m-segment-outline-border-color: var(--color-tabs-group-outline-inverse-border);

    --m-segment-tab-border-color-active: var(--color-tab-primary-border-active);

    --ic-color: var(--color-tab-inverse-icon-container-icon);

    --ic-color-hover: var(--color-tab-inverse-icon-container-icon-hover);

    --ic-color-active: var(--color-tab-inverse-icon-container-icon-active)

}



.m-select .m-input input {

    cursor: pointer

}



.m-select .m-input input:disabled {

    opacity: 1

}



.m-select .m-input--focused:not(.has-value):not(.filterable) .m-input-content-label {

    transform: none !important

}



.m-select-list-empty {

    align-items: center;

    color: var(--color-text-muted);

    display: var(--select-empty-display);

    font: var(--font-body-semi-bold-m);

    height: 100%;

    justify-content: center;

    padding: var(--spacing-xs) var(--spacing-m)

}



#m-modal-wrapper {

    position: fixed;

    z-index: 3000

}



.m-modal {

    --m-modal-header-height: var(--modal-header-min-height-mobile);

    --m-modal-header-spacing: var(--modal-header-horizontal-spacing-mobile);

    --m-modal-header-padding: 0 var(--modal-right-expand-mobile);

    --m-modal-title-padding: var(--modal-header-text-container-expand-mobile);

    --m-modal-content-padding: var(--modal-top-expand-mobile) var(--modal-right-expand-mobile) var(--modal-bottom-expand-mobile) var(--modal-left-expand-mobile);

    --m-modal-footer-horizontal-spacing: var(--modal-footer-horizontal-spacing-mobile);

    --m-modal-footer-vertical-spacing: var(--modal-footer-vertical-spacing-mobile);

    --m-modal-close-top-offset: var(--modal-body-button-close-top-expand-mobile);

    --m-modal-close-right-offset: var(--modal-right-expand-mobile);

    --m-modal-header-font: var(--font-modal-header-mobile);

    --m-modal-title-font: var(--font-modal-body-text-mobile);

    --m-modal-description-font: var(--font-modal-description-mobile);

    --m-modal-info-padding: var(--modal-body-expand-mobile);

    --m-modal-content-spacing: var(--modal-body-content-spacing-mobile);

    --m-modal-info-text-spacing: var(--modal-body-text-container-spacing-mobile);

    --m-modal-info-icon-radius: var(--modal-body-status-border-radius-mobile);

    --m-modal-info-icon-size: var(--modal-body-status-size-mobile);

    --m-modal-form-spacing: var(--modal-body-form-spacing-mobile);

    --m-modal-border-radius: var(--modal-border-radius-mobile);

    --m-modal-border-size: var(--modal-border-size-mobile);

    align-items: center;

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    position: fixed !important;

    right: 0;

    top: 0;

    z-index: 3000

}



@media (min-width: 1248px) {

    .m-modal {

        --m-modal-header-height: var(--modal-header-min-height-desktop);

        --m-modal-header-spacing: var(--modal-header-horizontal-spacing-desktop);

        --m-modal-header-padding: 0 var(--modal-right-expand-desktop);

        --m-modal-title-padding: var(--modal-header-text-container-expand-desktop);

        --m-modal-content-padding: var(--modal-top-expand-desktop) var(--modal-right-expand-desktop) var(--modal-bottom-expand-desktop) var(--modal-left-expand-desktop);

        --m-modal-footer-horizontal-spacing: var(--modal-footer-horizontal-spacing-desktop);

        --m-modal-footer-vertical-spacing: var(--modal-footer-vertical-spacing-desktop);

        --m-modal-close-top-offset: var(--modal-body-button-close-top-expand-desktop);

        --m-modal-close-right-offset: var(--modal-right-expand-desktop);

        --m-modal-header-font: var(--font-modal-header-desktop);

        --m-modal-title-font: var(--font-modal-body-text-desktop);

        --m-modal-description-font: var(--font-modal-description-desktop);

        --m-modal-info-padding: var(--modal-body-expand-desktop);

        --m-modal-content-spacing: var(--modal-body-content-spacing-desktop);

        --m-modal-info-text-spacing: var(--modal-body-text-container-spacing-desktop);

        --m-modal-info-icon-radius: var(--modal-body-status-border-radius-desktop);

        --m-modal-info-icon-size: var(--modal-body-status-size-desktop);

        --m-modal-form-spacing: var(--modal-body-form-spacing-desktop);

        --m-modal-border-radius: var(--modal-border-radius-desktop);

        --m-modal-border-size: var(--modal-border-size-desktop)

    }

}



.m-modal-overlay {

    background-color: var(--color-background-overlay-1);

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0

}



.m-modal-overlay.m-modal-overlay-transparent {

    background-color: #0000

}



.m-modal:before {

    -webkit-backdrop-filter: var(--modal-backdrop-filter);

    backdrop-filter: var(--modal-backdrop-filter);

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0

}



.m-modal-container {

    background: var(--color-modal-background);

    border: var(--m-modal-border-size) solid var(--modal-border-color, rgba(0, 0, 0, 0));

    border-radius: var(--m-modal-border-radius);

    box-shadow: 0 0 1px #00000052, 0 12px 24px #0000003d;

    display: flex;

    flex-direction: column;

    max-height: calc(var(--m-app-height, 100vh) - 32px);

    max-width: 100%;

    overflow: auto;

    position: absolute;

    transition: max-width .1s ease-in-out

}



.m-modal-content {

    padding: var(--m-modal-content-padding)

}



.m-modal-content .m-info-block {

    --info-icon-size: var(--m-modal-info-icon-size);

    --info-icon-gap: var(--m-modal-content-spacing);

    --info-title-gap: var(--m-modal-info-text-spacing);

    --info-title-font: var(--m-modal-title-font);

    --info-message-font: var(--m-modal-description-font);

    --info-icon-radius: var(--m-modal-info-icon-radius);

    --info-title-color: var(--color-modal-text);

    padding: var(--m-modal-info-padding)

}



.m-modal-content .m-info-block--secondary {

    --info-icon-background: var(--color-modal-status-background);

    --info-icon-color: var(--color-light-grey-5)

}



.m-modal-content form {

    gap: var(--m-modal-form-spacing)

}



.m-modal-scrollable {

    flex: 1;

    overflow: auto;

    z-index: 1

}



.m-modal-header {

    align-items: center;

    border-bottom: var(--modal-header-border-width) solid var(--color-modal-divider-background);

    color: var(--color-modal-text);

    display: flex;

    font: var(--m-modal-header-font);

    gap: var(--m-modal-header-spacing);

    justify-content: space-between;

    min-height: var(--m-modal-header-height);

    overflow: hidden;

    padding: var(--m-modal-header-padding);

    text-transform: var(--header-text-transform)

}



.m-modal-header>:has(.m-tabs) {

    align-self: flex-end;

    padding: 0

}



.m-modal-header--sticky {

    background: var(--color-modal-background);

    position: sticky;

    top: 0;

    z-index: 1

}



.m-modal-header-content {

    align-self: center;

    display: flex;

    flex: 1;

    gap: var(--m-modal-header-spacing)

}



.m-modal-header-content--centered,

.m-modal-header-content--centered .m-modal-header-title {

    flex: unset

}



.m-modal-header-title {

    flex: 1;

    padding: var(--m-modal-title-padding)

}



.m-modal-header-left {

    min-width: calc((var(--button-navigation-expand-s)) * 2 + var(--button-navigation-icon-size-s))

}



.m-modal-header>* {

    border-bottom: none !important

}



.m-modal-footer {

    display: flex;

    gap: var(--m-modal-footer-horizontal-spacing);

    justify-content: center;

    padding: var(--m-modal-content-padding);

    z-index: 1

}



.m-modal-footer>button {

    flex: 1

}



.m-modal-footer--stacked {

    flex-wrap: wrap

}



.m-modal-footer--stacked>button {

    flex: 1 0 100%;

    width: 100%

}



.m-modal-close.m-button-nav {

    position: absolute;

    right: var(--m-modal-close-right-offset);

    top: var(--m-modal-close-top-offset);

    z-index: 1

}



.m-modal-active-enter-active,

.m-modal-active-leave-active {

    transition: opacity .2s ease-in-out

}



.m-modal-active-enter-from,

.m-modal-active-leave-to {

    opacity: 0

}



@media (max-width: 1248px) {

    .m-modal-fill .m-modal-container {

        border: none;

        border-radius: 0;

        height: var(--m-app-height, 100%);

        max-height: var(--m-app-height, 100%);

        position: fixed;

        width: 100vw !important

    }

}



.m-switch {

    background: var(--m-switch-background-color);

    border: var(--m-switch-border-size) solid var(--m-switch-border-color);

    border-radius: var(--m-switch-border-radius);

    cursor: pointer;

    display: inline-flex;

    height: fit-content;

    min-width: var(--m-switch-width);

    outline: var(--m-switch-outline-border-size) solid var(--m-switch-outline-color);

    position: relative;

    transition: all .15s ease-in-out;

    width: var(--m-switch-width)

}



.m-switch input {

    bottom: 0;

    left: 0;

    opacity: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: -1

}



.m-switch .m-switch-ripple {

    background: var(--m-switch-ripple-color);

    border-radius: var(--m-switch-ripple-border-radius);

    height: var(--m-switch-ripple-size);

    transition: .15s;

    width: var(--m-switch-ripple-size)

}



.m-switch--checked:not(.m-switch--unset) {

    --m-switch-background-color: var(--m-switch-checked-background-color);

    --m-switch-background-color-hover: var(--m-switch-checked-background-color-hover);

    --m-switch-background-color-focus: var(--m-switch-checked-background-color-focus);

    --m-switch-background-color-disabled: var(--m-switch-checked-background-color-disabled);

    --m-switch-border-color: var(--m-switch-checked-border-color);

    --m-switch-border-color-hover: var(--m-switch-checked-border-color-hover);

    --m-switch-border-color-focus: var(--m-switch-checked-border-color-focus);

    --m-switch-border-color-disabled: var(--m-switch-checked-border-color-disabled);

    --m-switch-outline-color-focus: var(--m-switch-outline-checked-color-focus);

    --m-switch-ripple-color: var(--m-switch-checked-ripple-color);

    --m-switch-ripple-color-hover: var(--m-switch-checked-ripple-color-hover);

    --m-switch-ripple-color-focus: var(--m-switch-checked-ripple-color-focus);

    --m-switch-ripple-color-disabled: var(--m-switch-checked-ripple-color-disabled)

}



.m-switch--checked:not(.m-switch--unset) .m-switch-ripple {

    transform: translate(calc(var(--m-switch-width) - var(--m-switch-ripple-size) - var(--m-switch-border-size) * 2))

}



@media not (any-pointer: coarse) {

    .m-switch:hover {

        --m-switch-background-color: var(--m-switch-background-color-hover);

        --m-switch-ripple-color: var(--m-switch-ripple-color-hover);

        --m-switch-border-color: var(--m-switch-border-color-hover)

    }

}



.m-switch:has(input:focus) {

    --m-switch-background-color: var(--m-switch-background-color-focus);

    --m-switch-ripple-color: var(--m-switch-ripple-color-focus);

    --m-switch-border-color: var(--m-switch-border-color-focus);

    --m-switch-outline-color: var(--m-switch-outline-color-focus)

}



.m-switch--disabled:not(#i#i#i) {

    --m-switch-background-color: var(--m-switch-background-color-disabled);

    --m-switch-ripple-color: var(--m-switch-ripple-color-disabled);

    --m-switch-border-color: var(--m-switch-border-color-disabled);

    --m-switch-outline-color: #0000;

    cursor: not-allowed

}



.m-switch--s {

    --m-switch-border-radius: var(--selector-switcher-border-radius-s, 8px);

    --m-switch-border-size: var(--selector-border-size-s, 2px);

    --m-switch-padding: var(--selector-switcher-expand-s, 2px);

    --m-switch-width: var(--selector-switcher-width-s, 26px);

    --m-switch-ripple-size: var(--selector-switcher-tumbler-size-s, 12px);

    --m-switch-ripple-border-radius: var(--selector-switcher-tumbler-border-radius-s, 1000px);

    --m-switch-outline-border-size: var(--selector-outside-border-size-s, 2px)

}



.m-switch--m {

    --m-switch-border-radius: var(--selector-switcher-border-radius-m, 8px);

    --m-switch-border-size: var(--selector-border-size-m, 2px);

    --m-switch-padding: var(--selector-switcher-expand-m, 2px);

    --m-switch-width: var(--selector-switcher-width-m, 26px);

    --m-switch-ripple-size: var(--selector-switcher-tumbler-size-m, 12px);

    --m-switch-ripple-border-radius: var(--selector-switcher-tumbler-border-radius-m, 1000px);

    --m-switch-outline-border-size: var(--selector-outside-border-size-m, 2px)

}



.m-switch--primary {

    --m-switch-background-color: var(--color-selector-primary-background);

    --m-switch-background-color-hover: var(--color-selector-primary-background-hover);

    --m-switch-background-color-focus: var(--color-selector-primary-background-focus);

    --m-switch-background-color-disabled: var(--color-selector-primary-background-disabled);

    --m-switch-border-color: var(--color-selector-primary-border);

    --m-switch-border-color-hover: var(--color-selector-primary-border-hover);

    --m-switch-border-color-focus: var(--color-selector-primary-border-focus);

    --m-switch-border-color-disabled: var(--color-selector-primary-border-disabled);

    --m-switch-checked-background-color: var(--color-selector-primary-checked-background);

    --m-switch-checked-background-color-focus: var(--color-selector-primary-checked-background-focus);

    --m-switch-checked-background-color-hover: var(--color-selector-primary-checked-background-hover);

    --m-switch-checked-background-color-disabled: var(--color-selector-primary-checked-background-disabled);

    --m-switch-checked-border-color: var(--color-selector-primary-checked-border);

    --m-switch-checked-border-color-hover: var(--color-selector-primary-checked-border-hover);

    --m-switch-checked-border-color-focus: var(--color-selector-primary-checked-border-focus);

    --m-switch-checked-border-color-disabled: var(--color-selector-primary-checked-border-disabled);

    --m-switch-ripple-color: var(--color-selector-primary-element);

    --m-switch-ripple-color-hover: var(--color-selector-primary-element-hover);

    --m-switch-ripple-color-focus: var(--color-selector-primary-element-focus);

    --m-switch-ripple-color-disabled: var(--color-selector-primary-element-disabled);

    --m-switch-checked-ripple-color: var(--color-selector-primary-checked-element);

    --m-switch-checked-ripple-color-hover: var(--color-selector-primary-checked-element-hover);

    --m-switch-checked-ripple-color-focus: var(--color-selector-primary-checked-element-focus);

    --m-switch-checked-ripple-color-disabled: var(--color-selector-primary-checked-element-disabled);

    --m-switch-outline-color-focus: var(--color-selector-primary-outside-border-focus);

    --m-switch-outline-checked-color-focus: var(--color-selector-primary-checked-outside-border-focus)

}



.m-switch--basic {

    --m-switch-background-color: var(--color-selector-basic-background);

    --m-switch-background-color-hover: var(--color-selector-basic-background-hover);

    --m-switch-background-color-focus: var(--color-selector-basic-background-focus);

    --m-switch-background-color-disabled: var(--color-selector-basic-background-disabled);

    --m-switch-border-color: var(--color-selector-basic-border);

    --m-switch-border-color-hover: var(--color-selector-basic-border-hover);

    --m-switch-border-color-focus: var(--color-selector-basic-border-focus);

    --m-switch-border-color-disabled: var(--color-selector-basic-border-disabled);

    --m-switch-checked-background-color: var(--color-selector-basic-checked-background);

    --m-switch-checked-background-color-focus: var(--color-selector-basic-checked-background-focus);

    --m-switch-checked-background-color-hover: var(--color-selector-basic-checked-background-hover);

    --m-switch-checked-background-color-disabled: var(--color-selector-basic-checked-background-disabled);

    --m-switch-checked-border-color: var(--color-selector-basic-checked-border);

    --m-switch-checked-border-color-hover: var(--color-selector-basic-checked-border-hover);

    --m-switch-checked-border-color-focus: var(--color-selector-basic-checked-border-focus);

    --m-switch-checked-border-color-disabled: var(--color-selector-basic-checked-border-disabled);

    --m-switch-ripple-color: var(--color-selector-basic-element);

    --m-switch-ripple-color-hover: var(--color-selector-basic-element-hover);

    --m-switch-ripple-color-focus: var(--color-selector-basic-element-focus);

    --m-switch-ripple-color-disabled: var(--color-selector-basic-element-disabled);

    --m-switch-checked-ripple-color: var(--color-selector-basic-checked-element);

    --m-switch-checked-ripple-color-hover: var(--color-selector-basic-checked-element-hover);

    --m-switch-checked-ripple-color-focus: var(--color-selector-basic-checked-element-focus);

    --m-switch-checked-ripple-color-disabled: var(--color-selector-basic-checked-element-disabled);

    --m-switch-outline-color-focus: var(--color-selector-basic-outside-border-focus);

    --m-switch-outline-checked-color-focus: var(--color-selector-basic-checked-outside-border-focus)

}



.m-preloader {

    animation: preloader 1s linear infinite;

    color: var(--color-mid-grey-5)

}



.m-preloader-primary {

    color: var(--color-pr500)

}



@keyframes preloader {

    0% {

        transform: rotate(0)

    }



    to {

        transform: rotate(1turn)

    }

}



.m-checkbox {

    background-color: var(--m-checkbox-background-color, rgba(0, 0, 0, 0));

    border: var(--m-checkbox-border-size) solid var(--m-checkbox-border-color);

    border-radius: var(--m-checkbox-border-radius);

    cursor: pointer;

    display: inline-flex;

    outline: var(--m-checkbox-outline-border-size) solid var(--m-checkbox-outline-color);

    position: relative;

    transition: all .15s ease-in-out

}



.m-checkbox input {

    bottom: 0;

    left: 0;

    opacity: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: -1

}



.m-checkbox-checkmark {

    border-radius: var(--m-checkbox-border-radius);

    color: var(--m-checkbox-icon-color);

    display: flex;

    height: var(--m-checkbox-icon-size);

    width: var(--m-checkbox-icon-size)

}



.m-checkbox--checked:not(.m-checkbox--unset),

.m-checkbox--indeterminate:not(.m-checkbox--unset) {

    --m-checkbox-background-color: var(--m-checkbox-checked-background-color);

    --m-checkbox-background-color-hover: var(--m-checkbox-checked-background-color-hover);

    --m-checkbox-background-color-focus: var(--m-checkbox-checked-background-color-focus);

    --m-checkbox-background-color-disabled: var(--m-checkbox-checked-background-color-disabled);

    --m-checkbox-border-color: var(--m-checkbox-checked-border-color);

    --m-checkbox-border-color-hover: var(--m-checkbox-checked-border-color-hover);

    --m-checkbox-border-color-focus: var(--m-checkbox-checked-border-color-focus);

    --m-checkbox-border-color-disabled: var(--m-checkbox-checked-border-color-disabled);

    --m-checkbox-outline-color-focus: var(--m-checkbox-outline-checked-color-focus)

}



@media not (any-pointer: coarse) {

    .m-checkbox:hover {

        --m-checkbox-checked-background-color: var(--m-checkbox-background-color-hover);

        --m-checkbox-border-color: var(--m-checkbox-border-color-hover);

        --m-checkbox-icon-color: var(--m-checkbox-icon-color-hover)

    }

}



.m-checkbox:has(input:focus) {

    --m-checkbox-checked-background-color: var(--m-checkbox-background-color-focus);

    --m-checkbox-border-color: var(--m-checkbox-border-color-focus);

    --m-checkbox-outline-color: var(--m-checkbox-outline-color-focus);

    --m-checkbox-icon-color: var(--m-checkbox-icon-color-focus)

}



.m-checkbox--disabled:not(#i#i#i) {

    --m-checkbox-checked-background-color: var(--m-checkbox-background-color-disabled);

    --m-checkbox-border-color: var(--m-checkbox-border-color-disabled);

    --m-checkbox-outline-color: #0000;

    --m-checkbox-icon-color: var(--m-checkbox-icon-color-disabled);

    cursor: not-allowed

}



.m-checkbox--s {

    --m-checkbox-icon-size: var(--selector-checkbox-icon-size-s, 12px);

    --m-checkbox-border-radius: var(--selector-checkbox-border-radius-s, 4px);

    --m-checkbox-border-size: var(--selector-border-size-s, 2px);

    --m-checkbox-padding: var(--selector-checkbox-expand-s, 2px);

    --m-checkbox-outline-border-size: var(--selector-border-size-s, 2px)

}



.m-checkbox--m {

    --m-checkbox-icon-size: var(--selector-checkbox-icon-size-m, 12px);

    --m-checkbox-border-radius: var(--selector-checkbox-border-radius-m, 4px);

    --m-checkbox-border-size: var(--selector-border-size-m, 2px);

    --m-checkbox-padding: var(--selector-checkbox-expand-m, 2px);

    --m-checkbox-outline-border-size: var(--selector-border-size-m, 2px)

}



.m-checkbox--primary {

    --m-checkbox-checked-background-color: var(--color-selector-primary-checked-background);

    --m-checkbox-checked-background-color-hover: var(--color-selector-primary-checked-background-hover);

    --m-checkbox-checked-background-color-focus: var(--color-selector-primary-checked-background-focus);

    --m-checkbox-checked-background-color-disabled: var(--color-selector-primary-checked-background-disabled);

    --m-checkbox-border-color: var(--color-selector-primary-background);

    --m-checkbox-border-color-hover: var(--color-selector-primary-background-hover);

    --m-checkbox-border-color-focus: var(--color-selector-primary-background-focus);

    --m-checkbox-border-color-disabled: var(--color-selector-primary-background-disabled);

    --m-checkbox-checked-border-color: var(--color-selector-primary-checked-background);

    --m-checkbox-checked-border-color-hover: var(--color-selector-primary-checked-background-hover);

    --m-checkbox-checked-border-color-focus: var(--color-selector-primary-checked-background-focus);

    --m-checkbox-checked-border-color-disabled: var(--color-selector-primary-checked-background-disabled);

    --m-checkbox-icon-color: var(--color-selector-primary-checked-element);

    --m-checkbox-icon-color-hover: var(--color-selector-primary-checked-element-hover);

    --m-checkbox-icon-color-focus: var(--color-selector-primary-checked-element-focus);

    --m-checkbox-icon-color-disabled: var(--color-selector-primary-checked-element-disabled);

    --m-checkbox-outline-color-focus: var(--color-selector-primary-outside-border-focus);

    --m-checkbox-outline-checked-color-focus: var(--color-selector-primary-checked-outside-border-focus)

}



.m-checkbox--basic {

    --m-checkbox-checked-background-color: var(--color-selector-basic-checked-background);

    --m-checkbox-checked-background-color-hover: var(--color-selector-basic-checked-background-hover);

    --m-checkbox-checked-background-color-focus: var(--color-selector-basic-checked-background-focus);

    --m-checkbox-checked-background-color-disabled: var(--color-selector-basic-checked-background-disabled);

    --m-checkbox-border-color: var(--color-selector-basic-background);

    --m-checkbox-border-color-hover: var(--color-selector-basic-background-hover);

    --m-checkbox-border-color-focus: var(--color-selector-basic-background-focus);

    --m-checkbox-border-color-disabled: var(--color-selector-basic-background-disabled);

    --m-checkbox-checked-border-color: var(--color-selector-basic-checked-background);

    --m-checkbox-checked-border-color-hover: var(--color-selector-basic-checked-background-hover);

    --m-checkbox-checked-border-color-focus: var(--color-selector-basic-checked-background-focus);

    --m-checkbox-checked-border-color-disabled: var(--color-selector-basic-checked-background-disabled);

    --m-checkbox-icon-color: var(--color-selector-basic-checked-element);

    --m-checkbox-icon-color-hover: var(--color-selector-basic-checked-element-hover);

    --m-checkbox-icon-color-focus: var(--color-selector-basic-checked-element-focus);

    --m-checkbox-icon-color-disabled: var(--color-selector-basic-checked-element-disabled);

    --m-checkbox-outline-color-focus: var(--color-selector-basic-outside-border-focus);

    --m-checkbox-outline-checked-color-focus: var(--color-selector-basic-checked-outside-border-focus)

}



.m-tabs {

    --m-tabs-underline-border-radius: var(--tab-underline-line-border-radius);

    align-self: flex-start;

    border-bottom: var(--m-tabs-border-bottom-size) solid var(--m-tabs-border-bottom-color);

    display: flex;

    padding: var(--m-tabs-padding)

}



.m-tabs-item {

    color: var(--m-tabs-tab-text-color);

    cursor: pointer;

    display: flex;

    font: var(--m-tabs-font);

    justify-content: center;

    transition: all .15s ease-in-out

}



.m-tabs-item:hover:not(.m-tabs-item.active) {

    --m-tabs-tab-text-color: var(--m-tabs-tab-text-color-hover);

    --ic-color: var(--ic-color-hover)

}



.m-tabs-item--active {

    --m-tabs-tab-text-color: var(--m-tabs-tab-text-color-active);

    --ic-color: var(--ic-color-active)

}



.m-tabs-item--active .m-tabs-item-content:after {

    background: var(--m-tabs-underline-color);

    border-radius: var(--m-tabs-underline-border-radius);

    bottom: calc(var(--m-tabs-border-bottom-size) * -1);

    content: "";

    height: var(--m-tabs-underline-size);

    left: 0;

    position: absolute;

    right: 0

}



.m-tabs-item-content {

    align-items: center;

    display: flex;

    padding: var(--m-tabs-tab-padding);

    position: relative

}



.m-tabs-item-content span {

    padding: var(--m-tabs-tab-text-padding)

}



.m-tabs--fill {

    width: 100%

}



.m-tabs--fill .m-tabs-item {

    flex: 1;

    text-align: center

}



.m-tabs--centered {

    justify-content: center

}



.m-tabs--centered .m-tabs-item {

    flex: initial

}



.m-tabs--disabled:not(#i#i#i) {

    --m-tabs-tab-text-color: var(--color-mid-grey-1);

    --m-tabs-tab-text-color-hover: var(--color-mid-grey-1);

    --ic-color: var(--color-mid-grey-1);

    --m-tabs-tab-text-color-active: var(--color-mid-grey-3);

    --m-tabs-underline-color: var(--color-pr900)

}



.m-tabs--disabled:not(#i#i#i) .m-tabs-item {

    cursor: not-allowed

}



.m-tabs--s {

    --m-tabs-padding: var(--tabs-group-underline-expand-m, 0);

    --m-tabs-tab-padding: var(--tab-underline-expand-s, 12px);

    --m-tabs-tab-text-padding: var(--tab-text-container-expand-s, 0 8px);

    --m-tabs-font: var(--font-tab-text-s);

    --m-tabs-underline-size: var(--line-size-s, var(--line-size-m));

    --m-tabs-border-bottom-size: var(--tabs-group-underline-border-size-s, 1px);

    --ic-size: var(--tab-icon-container-icon-size-s, 20px);

    --ic-border-width: var(--tab-icon-container-icon-size-s, 1px);

    --ic-padding: var(--tab-icon-container-expand-s, 0);

    --ic-border-radius: var(--tab-icon-container-border-radius-s, 10px)

}



.m-tabs--m {

    --m-tabs-padding: var(--tabs-group-underline-expand-m, 0);

    --m-tabs-tab-padding: var(--tab-underline-expand-m, 12px);

    --m-tabs-tab-text-padding: var(--tab-text-container-expand-m, 0 8px);

    --m-tabs-font: var(--font-tab-text-m);

    --m-tabs-underline-size: var(--line-size-m, var(--line-size-m));

    --m-tabs-border-bottom-size: var(--tabs-group-underline-border-size-m, 1px);

    --ic-size: var(--tab-icon-container-icon-size-m, 20px);

    --ic-border-width: var(--tab-icon-container-icon-size-m, 1px);

    --ic-padding: var(--tab-icon-container-expand-m, 0);

    --ic-border-radius: var(--tab-icon-container-border-radius-m, 10px)

}



.m-tabs--l {

    --m-tabs-padding: var(--tabs-group-underline-expand-m, 0);

    --m-tabs-tab-padding: var(--tab-underline-expand-l, 12px);

    --m-tabs-tab-text-padding: var(--tab-text-container-expand-l, 0 8px);

    --m-tabs-font: var(--font-tab-text-l);

    --m-tabs-underline-size: var(--line-size-l, var(--line-size-m));

    --m-tabs-border-bottom-size: var(--tabs-group-underline-border-size-l, 1px);

    --ic-size: var(--tab-icon-container-icon-size-l, 20px);

    --ic-border-width: var(--tab-icon-container-icon-size-l, 1px);

    --ic-padding: var(--tab-icon-container-expand-l, 0);

    --ic-border-radius: var(--tab-icon-container-border-radius-l, 10px)

}



.m-tabs--primary {

    --m-tabs-tab-text-color: var(--color-tab-underline-primary-text);

    --m-tabs-tab-text-color-hover: var(--color-tab-underline-primary-text-hover);

    --m-tabs-tab-text-color-active: var(--color-tab-underline-primary-text-active);

    --m-tabs-border-bottom-color: var(--color-tabs-group-underline-primary-border-bottom);

    --m-tabs-underline-color: var(--color-tab-underline-primary-underline-background);

    --ic-color: var(--color-tab-underline-primary-icon-container-icon);

    --ic-color-hover: var(--color-tab-underline-primary-icon-container-icon-hover);

    --ic-color-active: var(--color-tab-underline-primary-icon-container-icon-active)

}



.m-tabs--inverse {

    --m-tabs-tab-text-color: var(--color-tab-underline-inverse-text);

    --m-tabs-tab-text-color-hover: var(--color-tab-underline-inverse-text-hover);

    --m-tabs-tab-text-color-active: var(--color-tab-underline-inverse-text-active);

    --m-tabs-border-bottom-color: var(--color-tabs-group-underline-inverse-border-bottom);

    --m-tabs-underline-color: var(--color-tab-underline-inverse-underline-background);

    --ic-color: var(--color-tab-underline-inverse-icon-container-icon);

    --ic-color-hover: var(--color-tab-underline-inverse-icon-container-icon-hover);

    --ic-color-active: var(--color-tab-underline-inverse-icon-container-icon-active)

}



.m-button-nav {

    align-items: center;

    background: var(--m-button-nav-background);

    border: none;

    border-radius: var(--m-button-nav-border-radius);

    box-shadow: inset 0 0 0 var(--m-button-nav-border-width) var(--m-button-nav-border-color);

    cursor: pointer;

    display: flex;

    justify-content: center;

    padding: var(--m-button-nav-padding);

    text-decoration: none;

    transition: all .15s ease-in-out

}



.m-button-nav.m-gradient-border {

    --gradient-width: var(--m-button-nav-border-width);

    --gradient-color: var(--m-button-nav-border-color)

}



.m-button-nav .m-icon {

    color: var(--m-button-nav-icon-color);

    flex: 1;

    height: var(--m-button-nav-icon-size);

    transition: color .15s ease-in-out;

    width: var(--m-button-nav-icon-size)

}



.m-button-nav--3xs {

    --m-button-nav-padding: var(--button-navigation-expand-3xs, 12px);

    --m-button-nav-icon-size: var(--button-navigation-icon-size-3xs, 20px);

    --m-button-nav-border-radius: var(--button-navigation-border-radius-3xs, 22px);

    --m-button-nav-border-width: var(--button-navigation-border-size-3xs, 0)

}



.m-button-nav--2xs {

    --m-button-nav-padding: var(--button-navigation-expand-2xs, 12px);

    --m-button-nav-icon-size: var(--button-navigation-icon-size-2xs, 20px);

    --m-button-nav-border-radius: var(--button-navigation-border-radius-2xs, 22px);

    --m-button-nav-border-width: var(--button-navigation-border-size-2xs, 0)

}



.m-button-nav--xs {

    --m-button-nav-padding: var(--button-navigation-expand-xs, 12px);

    --m-button-nav-icon-size: var(--button-navigation-icon-size-xs, 20px);

    --m-button-nav-border-radius: var(--button-navigation-border-radius-xs, 22px);

    --m-button-nav-border-width: var(--button-navigation-border-size-xs, 0)

}



.m-button-nav--s {

    --m-button-nav-padding: var(--button-navigation-expand-s, 12px);

    --m-button-nav-icon-size: var(--button-navigation-icon-size-s, 20px);

    --m-button-nav-border-radius: var(--button-navigation-border-radius-s, 22px);

    --m-button-nav-border-width: var(--button-navigation-border-size-s, 0)

}



.m-button-nav--m {

    --m-button-nav-padding: var(--button-navigation-expand-m, 12px);

    --m-button-nav-icon-size: var(--button-navigation-icon-size-m, 20px);

    --m-button-nav-border-radius: var(--button-navigation-border-radius-m, 22px);

    --m-button-nav-border-width: var(--button-navigation-border-size-m, 0)

}



.m-button-nav--transparent {

    --m-button-nav-background: var(--color-button-navigation-transparent-background);

    --m-button-nav-background-hover: var(--color-button-navigation-transparent-background-hover);

    --m-button-nav-background-pressed: var(--color-button-navigation-transparent-background-active);

    --m-button-nav-background-disabled: var(--color-button-navigation-transparent-background-disabled);

    --m-button-nav-icon-color: var(--color-button-navigation-transparent-icon);

    --m-button-nav-icon-color-hover: var(--color-button-navigation-transparent-icon-hover);

    --m-button-nav-icon-color-pressed: var(--color-button-navigation-transparent-icon-active);

    --m-button-nav-icon-color-disabled: var(--color-button-navigation-transparent-icon-disabled);

    --m-button-nav-border-color: var(--color-button-navigation-transparent-border);

    --m-button-nav-border-color-hover: var(--color-button-navigation-transparent-border-hover);

    --m-button-nav-border-color-pressed: var(--color-button-navigation-transparent-border-active);

    --m-button-nav-border-color-disabled: var(--color-button-navigation-transparent-border-disabled)

}



.m-button-nav--secondary {

    --m-button-nav-background: var(--color-button-navigation-secondary-background);

    --m-button-nav-background-hover: var(--color-button-navigation-secondary-background-hover);

    --m-button-nav-background-pressed: var(--color-button-navigation-secondary-background-active);

    --m-button-nav-background-disabled: var(--color-button-navigation-secondary-background-disabled);

    --m-button-nav-icon-color: var(--color-button-navigation-secondary-icon);

    --m-button-nav-icon-color-hover: var(--color-button-navigation-secondary-icon-hover);

    --m-button-nav-icon-color-pressed: var(--color-button-navigation-secondary-icon-active);

    --m-button-nav-icon-color-disabled: var(--color-button-navigation-secondary-icon-disabled);

    --m-button-nav-border-color: var(--color-button-navigation-secondary-border);

    --m-button-nav-border-color-hover: var(--color-button-navigation-secondary-border-hover);

    --m-button-nav-border-color-pressed: var(--color-button-navigation-secondary-border-active);

    --m-button-nav-border-color-disabled: var(--color-button-navigation-secondary-border-disabled)

}



.m-button-nav--inverse {

    --m-button-nav-background: var(--color-button-navigation-inverse-background);

    --m-button-nav-background-hover: var(--color-button-navigation-inverse-background-hover);

    --m-button-nav-background-pressed: var(--color-button-navigation-inverse-background-active);

    --m-button-nav-background-disabled: var(--color-button-navigation-inverse-background-disabled);

    --m-button-nav-icon-color: var(--color-button-navigation-inverse-icon);

    --m-button-nav-icon-color-hover: var(--color-button-navigation-inverse-icon-hover);

    --m-button-nav-icon-color-pressed: var(--color-button-navigation-inverse-icon-active);

    --m-button-nav-icon-color-disabled: var(--color-button-navigation-inverse-icon-disabled);

    --m-button-nav-border-color: var(--color-button-navigation-inverse-border);

    --m-button-nav-border-color-hover: var(--color-button-navigation-inverse-border-hover);

    --m-button-nav-border-color-pressed: var(--color-button-navigation-inverse-border-active);

    --m-button-nav-border-color-disabled: var(--color-button-navigation-inverse-border-disabled)

}



.m-button-nav:focus-visible,

.m-button-nav:hover {

    --m-button-nav-background: var(--m-button-nav-background-hover);

    --m-button-nav-icon-color: var(--m-button-nav-icon-color-hover);

    --m-button-nav-border-color: var(--m-button-nav-border-color-hover)

}



.m-button-nav:active {

    --m-button-nav-background: var(--m-button-nav-background-pressed);

    --m-button-nav-icon-color: var(--m-button-nav-icon-color-pressed);

    --m-button-nav-border-color: var(--m-button-nav-border-color-pressed)

}



.m-button-nav:disabled {

    --m-button-nav-background: var(--m-button-nav-background-disabled);

    --m-button-nav-icon-color: var(--m-button-nav-icon-color-disabled);

    --m-button-nav-border-color: var(--m-button-nav-border-color-disabled);

    cursor: not-allowed

}



.m-badge {

    background: var(--m-badge-background);

    border-radius: var(--m-badge-border-radius);

    box-shadow: inset 0 0 0 var(--m-badge-border-width, 2px) var(--m-badge-border-color);

    color: #e2fff5;

    display: inline-flex;

    font: var(--m-badge-font);

    padding: var(--m-badge-padding)

}



.m-badge-content {

    align-items: center;

    display: flex;

    justify-content: center;

    min-height: var(--m-badge-content-height)

}



.m-badge.m-gradient-border {

    --gradient-color: var(--m-badge-border-color);

    --gradient-width: var(--m-badge-border-width)

}



.m-badge-text {

    align-items: center;

    display: flex;

    gap: var(--m-badge-text-margin);

    padding: var(--m-badge-text-margin)

}



.m-badge--swap .m-badge-content {

    flex-direction: row-reverse

}



.m-badge img,

.m-badge svg {

    height: var(--m-badge-icon-size);

    width: var(--m-badge-icon-size)

}



.m-badge--primary {

    --m-badge-background: var(--color-badge-primary-background);

    --m-badge-border-color: var(--color-badge-primary-border, #0000);

    --m-badge-text-color: var(--color-badge-primary-text);

    --ic-color: var(--color-badge-primary-icon-container-icon);

    --ic-background: var(--color-badge-primary-icon-container-background);

    --ic-border-color: var(--color-badge-primary-icon-container-border)

}



.m-badge--secondary {

    --m-badge-background: var(--color-badge-secondary-background);

    --m-badge-border-color: var(--color-badge-secondary-border, #0000);

    --m-badge-text-color: var(--color-badge-secondary-text);

    --ic-color: var(--color-badge-secondary-icon-container-icon);

    --ic-background: var(--color-badge-secondary-icon-container-background);

    --ic-border-color: var(--color-badge-secondary-icon-container-border)

}



.m-badge--info {

    --m-badge-background: var(--color-badge-info-background);

    --m-badge-border-color: var(--color-badge-info-border, #0000);

    --m-badge-text-color: var(--color-badge-info-text);

    --ic-color: var(--color-badge-info-icon-container-icon);

    --ic-background: var(--color-badge-info-icon-container-background);

    --ic-border-color: var(--color-badge-info-icon-container-border)

}



.m-badge--minor {

    --m-badge-background: var(--color-badge-minor-background);

    --m-badge-border-color: var(--color-badge-minor-border, #0000);

    --m-badge-text-color: var(--color-badge-minor-text);

    --ic-color: var(--color-badge-minor-icon-container-icon);

    --ic-background: var(--color-badge-minor-icon-container-background);

    --ic-border-color: var(--color-badge-minor-icon-container-border)

}



.m-badge--success {

    --m-badge-background: var(--color-badge-success-background);

    --m-badge-border-color: var(--color-badge-success-border, #0000);

    --m-badge-text-color: var(--color-badge-success-text);

    --ic-color: var(--color-badge-success-icon-container-icon);

    --ic-background: var(--color-badge-success-icon-container-background);

    --ic-border-color: var(--color-badge-success-icon-container-border)

}



.m-badge--attention {

    --m-badge-background: var(--color-badge-attention-background);

    --m-badge-border-color: var(--color-badge-attention-border, #0000);

    --m-badge-text-color: var(--color-badge-attention-text);

    --ic-color: var(--color-badge-attention-icon-container-icon);

    --ic-background: var(--color-badge-attention-icon-container-background);

    --ic-border-color: var(--color-badge-attention-icon-container-border)

}



.m-badge--warning {

    --m-badge-background: var(--color-badge-warning-background);

    --m-badge-border-color: var(--color-badge-warning-border, #0000);

    --m-badge-text-color: var(--color-badge-warning-text);

    --ic-color: var(--color-badge-warning-icon-container-icon);

    --ic-background: var(--color-badge-warning-icon-container-background);

    --ic-border-color: var(--color-badge-warning-icon-container-border)

}



.m-badge--danger {

    --m-badge-background: var(--color-badge-danger-background);

    --m-badge-border-color: var(--color-badge-danger-border, #0000);

    --m-badge-text-color: var(--color-badge-danger-text);

    --ic-color: var(--color-badge-danger-icon-container-icon);

    --ic-background: var(--color-badge-danger-icon-container-background);

    --ic-border-color: var(--color-badge-danger-icon-container-border)

}



.m-badge--light {

    --m-badge-background: var(--color-badge-light-background);

    --m-badge-border-color: var(--color-badge-light-border, #0000);

    --m-badge-text-color: var(--color-badge-light-text);

    --ic-color: var(--color-badge-light-icon-container-icon);

    --ic-background: var(--color-badge-light-icon-container-background);

    --ic-border-color: var(--color-badge-light-icon-container-border)

}



.m-badge--dark {

    --m-badge-background: var(--color-badge-dark-background);

    --m-badge-border-color: var(--color-badge-dark-border, #0000);

    --m-badge-text-color: var(--color-badge-dark-text);

    --ic-color: var(--color-badge-dark-icon-container-icon);

    --ic-background: var(--color-badge-dark-icon-container-background);

    --ic-border-color: var(--color-badge-dark-icon-container-border)

}



.m-badge--transparent {

    --m-badge-background: var(--color-badge-transparent-background);

    --m-badge-border-color: var(--color-badge-transparent-border, #0000);

    --m-badge-text-color: var(--color-badge-transparent-text);

    --ic-color: var(--color-badge-transparent-icon-container-icon);

    --ic-background: var(--color-badge-transparent-icon-container-background);

    --ic-border-color: var(--color-badge-transparent-icon-container-border)

}



.m-badge--jackpot {

    --m-badge-background: var(--color-badge-jackpot-background);

    --m-badge-border-color: var(--color-badge-jackpot-border, #0000);

    --m-badge-text-color: var(--color-badge-jackpot-text);

    --ic-color: var(--color-badge-jackpot-icon-container-icon);

    --ic-background: var(--color-badge-jackpot-icon-container-background);

    --ic-border-color: var(--color-badge-jackpot-icon-container-border)

}



.m-badge--vip {

    --m-badge-background: var(--color-badge-vip-background);

    --m-badge-border-color: var(--color-badge-vip-border, #0000);

    --m-badge-text-color: var(--color-badge-vip-text);

    --ic-color: var(--color-badge-vip-icon-container-icon);

    --ic-background: var(--color-badge-vip-icon-container-background);

    --ic-border-color: var(--color-badge-vip-icon-container-border)

}



.m-badge--xs {

    --m-badge-padding: var(--badge-expand-xs);

    --m-badge-border-width: var(--badge-border-size-xs, 2px);

    --m-badge-content-height: var(--badge-content-height-xs);

    --m-badge-icon-size: var(--badge-icon-container-icon-size-xs);

    --ic-padding: var(--badge-icon-container-expand-xs);

    --ic-size: var(--m-badge-icon-size);

    --ic-border-width: var(--badge-icon-container-border-size-xs);

    --ic-border-radius: var(--badge-icon-container-border-radius-xs);

    --m-badge-font: var(--font-badge-text-xs);

    --m-badge-text-margin: var(--badge-text-container-expand-xs);

    --m-badge-border-radius: var(--badge-border-radius-xs);

    letter-spacing: var(--font-badge-text-xs-ls)

}



.m-badge--s {

    --m-badge-padding: var(--badge-expand-s);

    --m-badge-border-width: var(--badge-border-size-s, 2px);

    --m-badge-content-height: var(--badge-content-height-s);

    --m-badge-icon-size: var(--badge-icon-container-icon-size-s);

    --ic-padding: var(--badge-icon-container-expand-s);

    --ic-size: var(--m-badge-icon-size);

    --ic-border-width: var(--badge-icon-container-border-size-s);

    --ic-border-radius: var(--badge-icon-container-border-radius-s);

    --m-badge-font: var(--font-badge-text-s);

    --m-badge-text-margin: var(--badge-text-container-expand-s);

    --m-badge-border-radius: var(--badge-border-radius-s);

    letter-spacing: var(--font-badge-text-s-ls)

}



.m-badge--m {

    --m-badge-padding: var(--badge-expand-m);

    --m-badge-border-width: var(--badge-border-size-m, 2px);

    --m-badge-content-height: var(--badge-content-height-m);

    --m-badge-icon-size: var(--badge-icon-container-icon-size-m);

    --ic-padding: var(--badge-icon-container-expand-m);

    --ic-size: var(--m-badge-icon-size);

    --ic-border-width: var(--badge-icon-container-border-size-m);

    --ic-border-radius: var(--badge-icon-container-border-radius-m);

    --m-badge-font: var(--font-badge-text-m);

    --m-badge-text-margin: var(--badge-text-container-expand-m);

    --m-badge-border-radius: var(--badge-border-radius-m);

    letter-spacing: var(--font-badge-text-m-ls)

}



.m-badge--l {

    --m-badge-padding: var(--badge-expand-l);

    --m-badge-border-width: var(--badge-border-size-l, 2px);

    --m-badge-content-height: var(--badge-content-height-l);

    --m-badge-icon-size: var(--badge-icon-container-icon-size-l);

    --ic-padding: var(--badge-icon-container-expand-l);

    --ic-size: var(--m-badge-icon-size);

    --ic-border-width: var(--badge-icon-container-border-size-l);

    --ic-border-radius: var(--badge-icon-container-border-radius-l);

    --m-badge-font: var(--font-badge-text-l);

    --m-badge-text-margin: var(--badge-text-container-expand-l);

    --m-badge-border-radius: var(--badge-border-radius-l);

    letter-spacing: var(--font-badge-text-l-ls)

}



.m-badge .m-countdown {

    --m-countdown-gap: var(--m-badge-text-margin);

    --m-countdown-unit-font: var(--m-badge-font);

    --m-countdown-text-color: var(--m-badge-text-color);

    --m-countdown-unit-line-height: var(--m-badge-content-height)

}



.m-currency-converted {

    flex-shrink: 0;

    position: relative

}



.m-currency-converted-enabled {

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

    cursor: pointer;

    -webkit-user-select: none;

    user-select: none

}



.m-currency-converted-hidden {

    bottom: 0;

    left: 0;

    opacity: 0 !important;

    position: absolute;

    top: 0

}



.m-currency-converted span,

.m-currency-converted>div {

    opacity: 1;

    transition: opacity .15s ease-in-out;

    white-space: nowrap

}



.m-currency-converted-primary {

    align-items: center;

    display: flex;

    gap: 6px

}



.m-currency-converted-inverted .m-currency-converted-primary {

    flex-direction: row-reverse;

    text-align: right

}



.m-input.m-textarea {

    display: inherit;

    height: auto

}



.m-input.m-textarea .m-input-content {

    display: inherit

}



.m-input.m-textarea .m-input-content-label {

    top: var(--m-input-label-line-height--focus)

}



.m-input.m-textarea .m-input-content textarea {

    background-color: #0000;

    border: none;

    box-shadow: none;

    color: var(--text);

    height: 100%;

    margin-bottom: 10px;

    margin-top: calc(var(--m-input-label-line-height--focus) + var(--m-input-row-gap));

    outline: none;

    resize: none;

    width: 100%

}



.m-input.m-textarea .m-input-content textarea:-webkit-autofill,

.m-input.m-textarea .m-input-content textarea:focus,

.m-input.m-textarea .m-input-content textarea:not(:placeholder-shown) {

    -moz-appearance: none;

    appearance: none;

    -webkit-appearance: none !important

}



.m-textarea-counter {

    color: var(--color-field-basic-description);

    font: var(--font-field-vertical-description);

    margin-top: var(--field-vertical-spaсing);

    text-align: right

}



.m-counter {

    background: var(--m-counter-background);

    border-radius: var(--m-counter-border-radius);

    box-shadow: inset 0 0 0 var(--m-counter-border-width, 2px) var(--m-counter-border-color);

    color: var(--m-counter-text-color);

    height: var(--m-counter-size);

    min-width: var(--m-counter-size);

    padding: var(--m-counter-padding)

}



.m-counter,

.m-counter-content {

    align-items: center;

    display: inline-flex;

    justify-content: center

}



.m-counter--primary {

    --m-counter-background: var(--color-counter-primary-background);

    --m-counter-border-color: var(--color-counter-primary-border, #0000);

    --m-counter-text-color: var(--color-counter-primary-text)

}



.m-counter--secondary {

    --m-counter-background: var(--color-counter-secondary-background);

    --m-counter-border-color: var(--color-counter-secondary-border, #0000);

    --m-counter-text-color: var(--color-counter-secondary-text)

}



.m-counter--info {

    --m-counter-background: var(--color-counter-info-background);

    --m-counter-border-color: var(--color-counter-info-border, #0000);

    --m-counter-text-color: var(--color-counter-info-text)

}



.m-counter--minor {

    --m-counter-background: var(--color-counter-minor-background);

    --m-counter-border-color: var(--color-counter-minor-border, #0000);

    --m-counter-text-color: var(--color-counter-minor-text)

}



.m-counter--success {

    --m-counter-background: var(--color-counter-success-background);

    --m-counter-border-color: var(--color-counter-success-border, #0000);

    --m-counter-text-color: var(--color-counter-success-text)

}



.m-counter--attention {

    --m-counter-background: var(--color-counter-attention-background);

    --m-counter-border-color: var(--color-counter-attention-border, #0000);

    --m-counter-text-color: var(--color-counter-attention-text)

}



.m-counter--warning {

    --m-counter-background: var(--color-counter-warning-background);

    --m-counter-border-color: var(--color-counter-warning-border, #0000);

    --m-counter-text-color: var(--color-counter-warning-text)

}



.m-counter--danger {

    --m-counter-background: var(--color-counter-danger-background);

    --m-counter-border-color: var(--color-counter-danger-border, #0000);

    --m-counter-text-color: var(--color-counter-danger-text)

}



.m-counter--light {

    --m-counter-background: var(--color-counter-light-background);

    --m-counter-border-color: var(--color-counter-light-border, #0000);

    --m-counter-text-color: var(--color-counter-light-text)

}



.m-counter--dark {

    --m-counter-background: var(--color-counter-dark-background);

    --m-counter-border-color: var(--color-counter-dark-border, #0000);

    --m-counter-text-color: var(--color-counter-dark-text)

}



.m-counter--transparent {

    --m-counter-background: var(--color-counter-transparent-background);

    --m-counter-border-color: var(--color-counter-transparent-border, #0000);

    --m-counter-text-color: var(--color-counter-transparent-text)

}



.m-counter--vip {

    --m-counter-background: var(--color-counter-vip-background);

    --m-counter-border-color: var(--color-counter-vip-border, #0000);

    --m-counter-text-color: var(--color-counter-vip-text)

}



.m-counter--xs {

    --m-counter-padding: var(--counter-expand-xs);

    --m-counter-border-width: var(--counter-border-size-xs, 2px);

    --m-counter-size: var(--counter-size-xs);

    --m-counter-border-radius: var(--counter-border-radius-xs);

    font: var(--font-counter-text-xs);

    letter-spacing: var(--font-counter-text-xs-ls)

}



.m-counter--s {

    --m-counter-padding: var(--counter-expand-s);

    --m-counter-border-width: var(--counter-border-size-s, 2px);

    --m-counter-size: var(--counter-size-s);

    --m-counter-border-radius: var(--counter-border-radius-s);

    font: var(--font-counter-text-s);

    letter-spacing: var(--font-counter-text-s-ls)

}



.m-counter--m {

    --m-counter-padding: var(--counter-expand-m);

    --m-counter-border-width: var(--counter-border-size-m, 2px);

    --m-counter-size: var(--counter-size-m);

    --m-counter-border-radius: var(--counter-border-radius-m);

    font: var(--font-counter-text-m);

    letter-spacing: var(--font-counter-text-m-ls)

}



.m-counter--l {

    --m-counter-padding: var(--counter-expand-l);

    --m-counter-border-width: var(--counter-border-size-l, 2px);

    --m-counter-size: var(--counter-size-l);

    --m-counter-border-radius: var(--counter-border-radius-l);

    font: var(--font-counter-text-l);

    letter-spacing: var(--font-counter-text-l-ls)

}



.m-counter--xl {

    --m-counter-padding: var(--counter-expand-xl);

    --m-counter-border-width: var(--counter-border-size-xl, 2px);

    --m-counter-size: var(--counter-size-xl);

    --m-counter-border-radius: var(--counter-border-radius-xl);

    font: var(--font-counter-text-xl);

    letter-spacing: var(--font-counter-text-xl-ls)

}



.m-text {

    margin: 0;

    padding: 0

}



.m-prev-next-arrows {

    align-items: center;

    display: inline-flex;

    gap: 4px

}



.m-category-slider {

    width: 100%

}



.m-category-slider__header {

    align-items: center;

    display: flex;

    flex-wrap: nowrap;

    gap: 16px;

    justify-content: space-between;

    margin-bottom: 16px

}



.m-category-slider__header>:nth-child(2) {

    margin-left: auto

}



.m-category-slider__header--sticky {

    background: var(--color-dark-grey-0);

    margin-top: 50px;

    padding: 9px 0;

    position: sticky;

    top: 50px;

    z-index: 100

}



@media (min-width: 768px) {

    .m-category-slider__header--sticky {

        top: 62px

    }

}



@media (min-width: 1248px) {

    .m-category-slider__header--sticky {

        top: 79px

    }

}



.m-category-slider__wrapper {

    overflow: hidden;

    position: relative

}



.m-category-slider__content {

    grid-gap: 16px;

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr))

}



@media (min-width: 768px) {

    .m-category-slider__content--cols1 {

        grid-template-columns: repeat(1, minmax(0, 1fr))

    }



    .m-category-slider__content--cols2 {

        grid-template-columns: repeat(2, minmax(0, 1fr))

    }



    .m-category-slider__content--cols3 {

        grid-template-columns: repeat(3, minmax(0, 1fr))

    }



    .m-category-slider__content--cols4 {

        grid-template-columns: repeat(4, minmax(0, 1fr))

    }



    .m-category-slider__content--cols5 {

        grid-template-columns: repeat(5, minmax(0, 1fr))

    }



    .m-category-slider__content--cols6 {

        grid-template-columns: repeat(6, minmax(0, 1fr))

    }



    .m-category-slider__content--cols7 {

        grid-template-columns: repeat(7, minmax(0, 1fr))

    }



    .m-category-slider__content--cols8 {

        grid-template-columns: repeat(8, minmax(0, 1fr))

    }



    .m-category-slider__content--cols9 {

        grid-template-columns: repeat(9, minmax(0, 1fr))

    }

}



.m-category-slider .slide-left-leave-active,

.m-category-slider .slide-right-leave-active {

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1

}



.m-category-slider .slide-left-enter-active,

.m-category-slider .slide-left-leave-active,

.m-category-slider .slide-right-enter-active,

.m-category-slider .slide-right-leave-active {

    transition: all .25s ease-in-out

}



.m-category-slider .slide-left-enter,

.m-category-slider .slide-left-leave-to,

.m-category-slider .slide-right-enter,

.m-category-slider .slide-right-leave-to {

    opacity: 0;

    transform: translate(-50%)

}



.m-category-slider .slide-left-leave-to,

.m-category-slider .slide-right-leave-to {

    opacity: 0;

    transform: translate(50%)

}



.m-category-slider .slide-right-enter {

    transform: translate(50%)

}



.m-category-slider .slide-right-leave-to {

    transform: translate(-50%)

}



.m-category-scroll {

    --sectionPadding: 16px;

    --gap-games: 8px;

    --item-width-default: 288px;

    --item-width-cols5: 172px;

    --item-width-cols6: 124px;

    --item-width-cols7: 130px;

    --item-width-cols9: 104px;

    width: 100%

}



.m-category-scroll__header {

    align-items: center;

    display: flex;

    flex-wrap: nowrap;

    justify-content: space-between;

    margin: 0 0 16px

}



.m-category-scroll__wrapper {

    overflow: hidden;

    position: relative

}



.m-category-scroll__item {

    scroll-snap-align: start

}



.m-category-scroll__item:not(:last-child) {

    margin-right: var(--gap-games)

}



.m-category-scroll__content {

    -ms-overflow-style: none;

    display: flex;

    flex-wrap: nowrap;

    margin: 0 calc(var(--sectionPadding) * -1);

    overflow-x: scroll;

    padding: 0 var(--sectionPadding);

    scroll-padding: 0 var(--gap-games);

    scroll-padding-inline-end: var(--sectionPadding);

    scroll-padding-inline-start: var(--sectionPadding);

    scrollbar-width: none;

    width: 100%

}



.m-category-scroll__content::-webkit-scrollbar {

    display: none

}



.ios .m-category-scroll__content {

    scroll-snap-type: x mandatory

}



.m-category-scroll__content .m-category-scroll__item {

    flex: 0 0 var(--item-width-default);

    max-width: var(--item-width-default)

}



.m-category-scroll__content--cols5 .m-category-scroll__item {

    flex: 0 0 var(--item-width-cols5);

    max-width: var(--item-width-cols5)

}



.m-category-scroll__content--cols6 .m-category-scroll__item {

    flex: 0 0 var(--item-width-cols6);

    max-width: var(--item-width-cols6)

}



.m-category-scroll__content--cols6 .Card-HeartWrapper {

    align-items: center;

    display: flex;

    height: 40px;

    justify-content: center;

    position: absolute;

    right: 0;

    top: -40px;

    width: 40px

}



@media (min-width: 960px) {

    .m-category-scroll__content--cols6 .Card-HeartWrapper {

        height: auto;

        position: relative;

        right: auto;

        top: auto;

        width: auto

    }

}



.m-category-scroll__content--cols7 .m-category-scroll__item {

    flex: 0 0 var(--item-width-cols7);

    max-width: var(--item-width-cols7)

}



.m-category-scroll__content--cols9 .m-category-scroll__item {

    flex: 0 0 var(--item-width-cols9);

    max-width: var(--item-width-cols9)

}



.m-tag {

    align-items: center;

    background: var(--m-tag-background);

    border: none;

    border-radius: var(--m-tag-border-radius);

    box-shadow: inset 0 0 0 var(--m-tag-border-width) var(--m-tag-border-color);

    color: var(--m-tag-text-color);

    cursor: pointer;

    display: inline-flex;

    font: var(--m-tag-font);

    padding: var(--m-tag-padding);

    transition: all .15s ease-in-out

}



.m-tag.m-gradient-border {

    --gradient-width: var(--m-tag-border-width);

    --gradient-color: var(--m-tag-border-color)

}



.m-tag--fill {

    --m-tag-background: var(--color-tag-fill-background);

    --m-tag-background-hover: var(--color-tag-fill-background-hover);

    --m-tag-background-active: var(--color-tag-fill-background-active);

    --m-tag-background-active-hover: var(--color-tag-fill-background-active-hover);

    --m-tag-border-color: var(--color-tag-fill-border);

    --m-tag-text-color: var(--color-tag-fill-text);

    --m-tag-text-color-hover: var(--color-tag-fill-text-hover);

    --m-tag-text-color-active: var(--color-tag-fill-text-active);

    --m-tag-text-color-active-hover: var(--color-tag-fill-text-active-hover);

    --ic-color: var(--color-tag-fill-icon-container-icon);

    --ic-color-hover: var(--color-tag-fill-icon-container-icon-hover);

    --ic-color-active: var(--color-tag-fill-icon-container-icon-active);

    --ic-color-active-hover: var(--color-tag-fill-icon-container-icon-active-hover);

    --ic-border-color: var(--color-tag-fill-icon-container-border);

    --ic-border-color-hover: var(--color-tag-fill-icon-container-border-hover);

    --ic-border-color-active: var(--color-tag-fill-icon-container-border-active);

    --ic-border-color-active-hover: var(--color-tag-fill-icon-container-border-active-hover);

    --ic-background: var(--color-tag-fill-icon-container-background);

    --ic-background-hover: var(--color-tag-fill-icon-container-background-hover);

    --ic-background-active: var(--color-tag-fill-icon-container-background-active);

    --ic-background-active-hover: var(--color-tag-fill-icon-container-background-active-hover)

}



.m-tag--outline {

    --m-tag-background: var(--color-tag-outline-background);

    --m-tag-background-hover: var(--color-tag-outline-background-hover);

    --m-tag-background-active: var(--color-tag-outline-background-active);

    --m-tag-background-active-hover: var(--color-tag-outline-background-active-hover);

    --m-tag-border-color: var(--color-tag-outline-border);

    --m-tag-text-color: var(--color-tag-outline-text);

    --m-tag-text-color-hover: var(--color-tag-outline-text-hover);

    --m-tag-text-color-active: var(--color-tag-outline-text-active);

    --m-tag-text-color-active-hover: var(--color-tag-outline-text-active-hover);

    --ic-color: var(--color-tag-outline-icon-container-icon);

    --ic-color-hover: var(--color-tag-outline-icon-container-icon-hover);

    --ic-color-active: var(--color-tag-outline-icon-container-icon-active);

    --ic-color-active-hover: var(--color-tag-outline-icon-container-icon-active-hover);

    --ic-border-color: var(--color-tag-outline-icon-container-border);

    --ic-border-color-hover: var(--color-tag-outline-icon-container-border-hover);

    --ic-border-color-active: var(--color-tag-outline-icon-container-border-active);

    --ic-border-color-active-hover: var(--color-tag-outline-icon-container-border-active-hover);

    --ic-background: var(--color-tag-outline-icon-container-background);

    --ic-background-hover: var(--color-tag-outline-icon-container-background-hover);

    --ic-background-active: var(--color-tag-outline-icon-container-background-active);

    --ic-background-active-hover: var(--color-tag-outline-icon-container-background-active-hover)

}



.m-tag--ghost {

    --m-tag-background: var(--color-tag-ghost-background);

    --m-tag-background-hover: var(--color-tag-ghost-background-hover);

    --m-tag-background-active: var(--color-tag-ghost-background-active);

    --m-tag-background-active-hover: var(--color-tag-ghost-background-active-hover);

    --m-tag-border-color: var(--color-tag-ghost-border);

    --m-tag-text-color: var(--color-tag-ghost-text);

    --m-tag-text-color-hover: var(--color-tag-ghost-text-hover);

    --m-tag-text-color-active: var(--color-tag-ghost-text-active);

    --m-tag-text-color-active-hover: var(--color-tag-ghost-text-active-hover);

    --ic-color: var(--color-tag-ghost-icon-container-icon);

    --ic-color-hover: var(--color-tag-ghost-icon-container-icon-hover);

    --ic-color-active: var(--color-tag-ghost-icon-container-icon-active);

    --ic-color-active-hover: var(--color-tag-ghost-icon-container-icon-active-hover);

    --ic-border-color: var(--color-tag-ghost-icon-container-border);

    --ic-border-color-hover: var(--color-tag-ghost-icon-container-border-hover);

    --ic-border-color-active: var(--color-tag-ghost-icon-container-border-active);

    --ic-border-color-active-hover: var(--color-tag-ghost-icon-container-border-active-hover);

    --ic-background: var(--color-tag-ghost-icon-container-background);

    --ic-background-hover: var(--color-tag-ghost-icon-container-background-hover);

    --ic-background-active: var(--color-tag-ghost-icon-container-background-active);

    --ic-background-active-hover: var(--color-tag-ghost-icon-container-background-active-hover)

}



.m-tag--ghost-secondary {

    --m-tag-background: var(--color-tag-ghost-secondary-background);

    --m-tag-background-hover: var(--color-tag-ghost-secondary-background-hover);

    --m-tag-background-active: var(--color-tag-ghost-secondary-background-active);

    --m-tag-background-active-hover: var(--color-tag-ghost-secondary-background-active-hover);

    --m-tag-border-color: var(--color-tag-ghost-secondary-border);

    --m-tag-text-color: var(--color-tag-ghost-secondary-text);

    --m-tag-text-color-hover: var(--color-tag-ghost-secondary-text-hover);

    --m-tag-text-color-active: var(--color-tag-ghost-secondary-text-active);

    --m-tag-text-color-active-hover: var(--color-tag-ghost-secondary-text-active-hover);

    --ic-color: var(--color-tag-ghost-secondary-icon-container-icon);

    --ic-color-hover: var(--color-tag-ghost-secondary-icon-container-icon-hover);

    --ic-color-active: var(--color-tag-ghost-secondary-icon-container-icon-active);

    --ic-color-active-hover: var(--color-tag-ghost-secondary-icon-container-icon-active-hover);

    --ic-border-color: var(--color-tag-ghost-secondary-icon-container-border);

    --ic-border-color-hover: var(--color-tag-ghost-secondary-icon-container-border-hover);

    --ic-border-color-active: var(--color-tag-ghost-secondary-icon-container-border-active);

    --ic-border-color-active-hover: var(--color-tag-ghost-secondary-icon-container-border-active-hover);

    --ic-background: var(--color-tag-ghost-secondary-icon-container-background);

    --ic-background-hover: var(--color-tag-ghost-secondary-icon-container-background-hover);

    --ic-background-active: var(--color-tag-ghost-secondary-icon-container-background-active);

    --ic-background-active-hover: var(--color-tag-ghost-secondary-icon-container-background-active-hover)

}



.m-tag--s {

    --m-tag-border-width: var(--tag-border-size-s, 0);

    --m-tag-border-radius: var(--tag-border-radius-s, 12px);

    --m-tag-padding: var(--tag-expand-s, 4px);

    --m-tag-content-padding: var(--tag-text-container-expand-s, 2px);

    --m-tag-content-height: var(--tag-content-height-s, 16px);

    --m-tag-font: var(--font-tag-text-s);

    --ic-size: var(--tag-icon-container-icon-size-s, 16px);

    --ic-padding: var(--tag-icon-container-expand-s, 0);

    --ic-border-width: var(--tag-icon-container-border-size-s, 0)

}



.m-tag--m {

    --m-tag-border-width: var(--tag-border-size-m, 0);

    --m-tag-border-radius: var(--tag-border-radius-m, 12px);

    --m-tag-padding: var(--tag-expand-m, 4px);

    --m-tag-content-padding: var(--tag-text-container-expand-m, 2px);

    --m-tag-content-height: var(--tag-content-height-m, 16px);

    --m-tag-font: var(--font-tag-text-m);

    --ic-size: var(--tag-icon-container-icon-size-m, 16px);

    --ic-padding: var(--tag-icon-container-expand-m, 0);

    --ic-border-width: var(--tag-icon-container-border-size-m, 0)

}



.m-tag-content {

    align-items: center;

    display: flex;

    min-height: var(--m-tag-content-height);

    padding: var(--m-tag-content-padding);

    white-space: nowrap

}



.m-tag-append,

.m-tag-prepend {

    transition: all .15s ease-in-out;

    -webkit-user-select: none;

    user-select: none

}



.m-tag--active {

    --m-tag-background: var(--m-tag-background-active);

    --m-tag-background-hover: var(--m-tag-background-active-hover);

    --m-tag-text-color: var(--m-tag-text-color-active);

    --m-tag-text-color-hover: var(--m-tag-text-color-active-hover);

    --ic-color: var(--ic-color-active);

    --ic-color-hover: var(--ic-color-active-hover);

    --ic-border-color: var(--ic-border-color-active);

    --ic-border-color-hover: var(--ic-border-color-active-hover);

    --ic-background: var(--ic-background-active);

    --ic-background-hover: var(--ic-background-active-hover)

}



@media not (any-pointer: coarse) {



    .m-tag:active,

    .m-tag:focus-visible,

    .m-tag:hover {

        --m-tag-background: var(--m-tag-background-hover);

        --m-tag-text-color: var(--m-tag-text-color-hover);

        --ic-color: var(--ic-color-hover);

        --ic-border-color: var(--ic-border-color-hover);

        --ic-background: var(--ic-background-hover)

    }

}



.m-info-block {

    --info-icon-size: 52px;

    --info-icon-background: var(--color-dark-grey-2);

    --info-icon-color: var(--color-mid-grey-5);

    --info-icon-gap: 12px;

    --info-title-gap: 0;

    --info-title-font: var(--font-body-semi-bold-l);

    --info-title-color: var(--color-white);

    --info-message-font: var(--font-body-regular-s);

    --info-message-color: var(--color-modal-description);

    flex: 1;

    flex-direction: column;

    height: 100%;

    padding: 16px;

    text-align: center;

    width: 100%

}



.m-info-block,

.m-info-block-icon {

    align-items: center;

    display: flex;

    justify-content: center

}



.m-info-block-icon {

    background: var(--info-icon-background-placeholder, var(--info-icon-background));

    border-radius: var(--info-icon-radius);

    height: var(--info-icon-size);

    margin-bottom: var(--info-icon-gap);

    width: var(--info-icon-size)

}



.m-info-block-icon img,

.m-info-block-icon svg {

    color: var(--info-icon-color);

    height: var(--info-icon-scale);

    width: var(--info-icon-scale)

}



.m-info-block-title {

    color: var(--info-title-color);

    font: var(--info-title-font);

    margin-bottom: var(--info-title-gap);

    text-transform: var(--header-text-transform)

}



.m-info-block-message {

    color: var(--color-modal-description);

    font: var(--info-message-font);

    text-align: center

}



.m-info-block--large {

    --info-title-font: var(--info-l-font);

    --info-message-font: var(--font-body-regular-l);

    --info-icon-size: var(--info-l-icon-size);

    --info-icon-gap: var(--info-l-icon-gap);

    --info-title-gap: var(--info-l-title-gap)

}



@media (any-pointer: coarse) {

    .m-info-block--large {

        --info-title-font: var(--info-l-mobile-font);

        --info-title-gap: var(--info-l-mobile-title-gap)

    }

}



.m-info-block--small {

    --info-title-font: var(--font-body-semi-bold-m);

    --info-icon-size: 40px;

    --info-icon-gap: 8px

}



.m-info-block--primary {

    --info-icon-background: var(--color-pr400);

    --info-icon-color: var(--color-button-primary)

}



.m-info-block--indigo {

    --info-icon-background: var(--color-in500);

    --info-icon-color: var(--color-button-fill-info-text)

}



.m-info-block--violet {

    --info-icon-background: var(--color-vi400);

    --info-icon-color: var(--color-button-fill-minor-text)

}



.m-info-block--success {

    --info-icon-background: var(--color-su500);

    --info-icon-color: var(--color-button-fill-success-text)

}



.m-info-block--attention {

    --info-icon-background: var(--color-at300);

    --info-icon-color: var(--color-button-fill-attention-text)

}



.m-info-block--warning {

    --info-icon-background: var(--color-wa400);

    --info-icon-color: var(--color-button-fill-warning-text)

}



.m-info-block--danger {

    --info-icon-background: var(--color-da500);

    --info-icon-color: var(--color-button-fill-danger-text)

}



.m-dropdown-row {

    align-items: center;

    background: var(--m-dropdown-background);

    color: var(--m-dropdown-text-color);

    cursor: pointer;

    display: flex;

    flex-direction: row;

    font: var(--m-dropdown-row-font);

    gap: var(--m-dropdown-row-content-spacing);

    justify-content: space-between;

    list-style: none;

    margin: 0;

    outline: none;

    padding: var(--m-dropdown-row-padding);

    transition: all .15s ease-in-out

}



.m-dropdown-row-content {

    display: flex;

    flex: 1;

    flex-direction: column;

    gap: var(--m-dropdown-row-text-spacing);

    justify-content: center;

    min-height: var(--m-dropdown-content-height)

}



.m-dropdown-row-content-text {

    align-items: center;

    display: flex;

    gap: var(--m-dropdown-row-content-spacing)

}



.m-dropdown-row-content-text:empty {

    display: none

}



.m-dropdown-row-content-description {

    color: var(--m-dropdown-description-color);

    font: var(--m-dropdown-row-font-description)

}



.m-dropdown-row-content-description:empty {

    display: none

}



.m-dropdown-row--s {

    --m-dropdown-content-height: var(--dropdown-row-content-height-s, 32px);

    --m-dropdown-row-padding: var(--dropdown-row-expand-s, 8px 16px);

    --m-dropdown-row-content-spacing: var(--dropdown-row-content-spacing-s, 8px);

    --m-dropdown-row-text-spacing: var(--dropdown-row-text-container-spacing-s, 4px);

    --m-dropdown-row-font: var(--font-dropdown-text-s, var(--font-body-semi-bold-s));

    --m-dropdown-row-font-description: var(--font-dropdown-description-s, var(--font-body-semi-bold-xs));

    --ic-size: var(--dropdown-row-icon-container-icon-size-s, 22px);

    --ic-padding: var(--dropdown-row-icon-container-expand-s, 0);

    --ic-border-width: var(--dropdown-row-icon-container-border-size-s, 0);

    --ic-border-radius: var(--dropdown-row-icon-container-border-radius-s, 0)

}



.m-dropdown-row--m,

.m-dropdown-row--s {

    letter-spacing: var(--font-dropdown-text-ls, 0);

    text-transform: var(--font-dropdown-text-transform, unset)

}



.m-dropdown-row--m {

    --m-dropdown-content-height: var(--dropdown-row-content-height-m, 32px);

    --m-dropdown-row-padding: var(--dropdown-row-expand-m, 8px 16px);

    --m-dropdown-row-content-spacing: var(--dropdown-row-content-spacing-m, 8px);

    --m-dropdown-row-text-spacing: var(--dropdown-row-text-container-spacing-m, 4px);

    --m-dropdown-row-font: var(--font-dropdown-text-m, var(--font-body-semi-bold-s));

    --m-dropdown-row-font-description: var(--font-dropdown-description-m, var(--font-body-semi-bold-xs));

    --ic-size: var(--dropdown-row-icon-container-icon-size-m, 22px);

    --ic-padding: var(--dropdown-row-icon-container-expand-m, 0);

    --ic-border-width: var(--dropdown-row-icon-container-border-size-m, 0);

    --ic-border-radius: var(--dropdown-row-icon-container-border-radius-m, 0)

}



.m-dropdown-row--basic {

    --m-dropdown-background: #0000;

    --m-dropdown-background-hover: var(--color-dropdown-basic-row-background-hover);

    --m-dropdown-background-pressed: var(--color-dropdown-basic-row-background-active);

    --m-dropdown-background-selected: var(--color-dropdown-basic-row-background-primary);

    --m-dropdown-text-color: var(--color-dropdown-basic-row-text);

    --m-dropdown-text-color-hover: var(--color-dropdown-basic-row-text-hover);

    --m-dropdown-text-color-pressed: var(--color-dropdown-basic-row-text-active);

    --m-dropdown-text-color-selected: var(--color-dropdown-basic-row-text-primary);

    --m-dropdown-description-color: var(--color-dropdown-basic-row-description);

    --m-dropdown-description-color-hover: var(--color-dropdown-basic-row-description-hover);

    --m-dropdown-description-color-pressed: var(--color-dropdown-basic-row-description-active);

    --m-dropdown-description-color-selected: var(--color-dropdown-basic-row-description-primary);

    --ic-color: var(--color-dropdown-basic-row-icon-container-icon);

    --ic-color-hover: var(--color-dropdown-basic-row-icon-container-icon-hover);

    --ic-color-pressed: var(--color-dropdown-basic-row-icon-container-icon-active);

    --ic-color-selected: var(--color-dropdown-basic-row-icon-container-icon-primary);

    --ic-background: var(--color-dropdown-basic-row-icon-container-background);

    --ic-background-hover: var(--color-dropdown-basic-row-icon-container-background-hover);

    --ic-background-pressed: var(--color-dropdown-basic-row-icon-container-background-active);

    --ic-background-selected: var(--color-dropdown-basic-row-icon-container-background-primary);

    --ic-border-color: var(--color-dropdown-basic-row-icon-container-border);

    --ic-border-color-hover: var(--color-dropdown-basic-row-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-dropdown-basic-row-icon-container-border-active);

    --ic-border-color-selected: var(--color-dropdown-basic-row-icon-container-border-primary)

}



.m-dropdown-row--inverse {

    --m-dropdown-background: #0000;

    --m-dropdown-background-hover: var(--color-dropdown-inverse-row-background-hover);

    --m-dropdown-background-pressed: var(--color-dropdown-inverse-row-background-active);

    --m-dropdown-background-selected: var(--color-dropdown-inverse-row-background-primary);

    --m-dropdown-text-color: var(--color-dropdown-inverse-row-text);

    --m-dropdown-text-color-hover: var(--color-dropdown-inverse-row-text-hover);

    --m-dropdown-text-color-pressed: var(--color-dropdown-inverse-row-text-active);

    --m-dropdown-text-color-selected: var(--color-dropdown-inverse-row-text-primary);

    --m-dropdown-description-color: var(--color-dropdown-inverse-row-description);

    --m-dropdown-description-color-hover: var(--color-dropdown-inverse-row-description-hover);

    --m-dropdown-description-color-pressed: var(--color-dropdown-inverse-row-description-active);

    --m-dropdown-description-color-selected: var(--color-dropdown-inverse-row-description-primary);

    --ic-color: var(--color-dropdown-inverse-row-icon-container-icon);

    --ic-color-hover: var(--color-dropdown-inverse-row-icon-container-icon-hover);

    --ic-color-pressed: var(--color-dropdown-inverse-row-icon-container-icon-active);

    --ic-color-selected: var(--color-dropdown-inverse-row-icon-container-icon-primary);

    --ic-background: var(--color-dropdown-inverse-row-icon-container-background);

    --ic-background-hover: var(--color-dropdown-inverse-row-icon-container-background-hover);

    --ic-background-pressed: var(--color-dropdown-inverse-row-icon-container-background-active);

    --ic-background-selected: var(--color-dropdown-inverse-row-icon-container-background-primary);

    --ic-border-color: var(--color-dropdown-inverse-row-icon-container-border);

    --ic-border-color-hover: var(--color-dropdown-inverse-row-icon-container-border-hover);

    --ic-border-color-pressed: var(--color-dropdown-inverse-row-icon-container-border-active);

    --ic-border-color-selected: var(--color-dropdown-inverse-row-icon-container-border-primary)

}



.m-dropdown-row--focused,

.m-dropdown-row:focus-visible,

.m-dropdown-row:hover {

    --m-dropdown-background: var(--m-dropdown-background-hover);

    --m-dropdown-text-color: var(--m-dropdown-text-color-hover);

    --m-dropdown-description-color: var(--m-dropdown-description-color-hover);

    --ic-color: var(--ic-color-hover);

    --ic-border-color: var(--ic-border-color-hover);

    --ic-background: var(--ic-background-hover)

}



.m-dropdown-row:active {

    --m-dropdown-background: var(--m-dropdown-background-pressed);

    --m-dropdown-text-color: var(--m-dropdown-text-color-pressed);

    --m-dropdown-description-color: var(--m-dropdown-description-color-pressed);

    --ic-color: var(--ic-color-pressed);

    --ic-border-color: var(--ic-border-color-pressed);

    --ic-background: var(--ic-background-pressed)

}



.m-dropdown-row--selected {

    --m-dropdown-background: var(--m-dropdown-background-selected);

    --m-dropdown-text-color: var(--m-dropdown-text-color-selected);

    --m-dropdown-description-color: var(--m-dropdown-description-color-selected);

    --ic-color: var(--ic-color-selected);

    --ic-border-color: var(--ic-border-color-selected);

    --ic-background: var(--ic-background-selected)

}



.m-dropdown-row .m-icon-container:empty,

.m-dropdown-row-content-description:empty,

.m-dropdown-row-content-text:empty {

    display: none

}



.m-avatar {

    --m-avatar-rank-icon-size: var(--avatar-rakeback-icon-size);

    --m-avatar-rank-icon-offset-x: -6%;

    --m-avatar-rank-icon-offset-y: -6%;

    --m-avatar-size: var(--avatar-size);

    height: var(--m-avatar-size);

    width: var(--m-avatar-size)

}



.m-avatar,

.m-avatar--vip {

    position: relative

}



.m-avatar--vip:after {

    background-image: var(--vip-image);

    background-repeat: no-repeat;

    background-size: contain;

    height: 108.5%;

    width: 108.5%;

    z-index: 2

}



.m-avatar--vip:after,

.m-avatar--vip:before {

    content: "";

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%)

}



.m-avatar--vip:before {

    border-radius: 100%;

    box-shadow: inset 0 0 0 calc(var(--m-avatar-size) / 15) var(--color-dark-grey-0);

    height: 100%;

    width: 100%;

    z-index: 1

}



.m-avatar__image {

    align-items: center;

    background: var(--color-avatar-background);

    border-radius: var(--avatar-border-radius);

    display: flex;

    height: inherit;

    justify-content: center;

    position: relative;

    width: inherit

}



.m-avatar__image-empty {

    color: var(--color-avatar-icon);

    height: 55%;

    width: 55%

}



.m-avatar__image>img {

    width: 100%

}



.m-avatar__rank {

    z-index: 3

}



.m-avatar__rank.m-badge {

    bottom: -4.5%;

    left: 50%;

    position: absolute;

    transform: translate(-50%);

    white-space: nowrap

}



.m-avatar__rank-icon {

    background: var(--color-avatar-rakeback-background);

    border-radius: var(--avatar-rakeback-border-radius);

    bottom: var(--m-avatar-rank-icon-offset-y);

    box-shadow: inset 0 0 0 var(--avatar-rakeback-border-size) var(--color-avatar-rakeback-border);

    display: flex;

    padding: var(--avatar-rakeback-expand);

    position: absolute;

    right: var(--m-avatar-rank-icon-offset-x)

}



.m-avatar__rank-icon>img {

    display: block;

    height: var(--m-avatar-rank-icon-size);

    width: var(--m-avatar-rank-icon-size)

}



.m-dropdown-menu {

    background: var(--m-dropdown-menu-background);

    border-radius: var(--m-dropdown-menu-border-radius);

    outline: var(--m-dropdown-menu-border-width) solid var(--m-dropdown-menu-border-color);

    overflow: auto;

    overscroll-behavior: contain;

    scrollbar-color: var(--color-scrollbar-background) rgba(0, 0, 0, 0);

    scrollbar-width: thin

}



.m-dropdown-menu-list {

    height: 100%;

    list-style: none;

    margin: 0;

    padding: var(--m-dropdown-menu-padding)

}



.m-dropdown-menu::-webkit-scrollbar {

    height: 0;

    width: 0

}



.m-dropdown-menu--s {

    --m-dropdown-menu-border-radius: var(--dropdown-border-radius-s, 6px);

    --m-dropdown-menu-border-width: var(--dropdown-border-size-s, 2px);

    --m-dropdown-menu-padding: var(--dropdown-expand-s, 6px 0)

}



.m-dropdown-menu--m {

    --m-dropdown-menu-border-radius: var(--dropdown-border-radius-m, 6px);

    --m-dropdown-menu-border-width: var(--dropdown-border-size-m, 2px);

    --m-dropdown-menu-padding: var(--dropdown-expand-m, 6px 0)

}



.m-dropdown-menu--basic {

    --m-dropdown-menu-background: var(--color-dropdown-basic-background);

    --m-dropdown-menu-border-color: var(--color-dropdown-basic-border)

}



.m-dropdown-menu--inverse {

    --m-dropdown-menu-background: var(--color-dropdown-inverse-background);

    --m-dropdown-menu-border-color: var(--color-dropdown-inverse-border)

}



.m-form-field-label {

    color: var(--color-field-basic-label, var(--color-light-grey-5));

    font: var(--font-field-vertical-label)

}



.m-form-field-label--horizontal {

    font: var(--font-field-horizontal-label)

}



.m-form-field-label.asterix:after {

    color: var(--color-field-basic-description-error);

    content: "*";

    margin-left: var(--field-vertical-text-spaсing, 4px)

}



.nav-card--loading .nav-card__button {

    cursor: not-allowed

}



.nav-card--loading .nav-card__img {

    filter: grayscale(1)

}



.nav-card__button {

    align-items: center;

    background: var(--color-dark-grey-2);

    border-radius: var(--sidebar-card-border-radius);

    color: var(--color-sidebar-card-widget-text);

    cursor: pointer;

    display: flex;

    gap: var(--sidebar-card-widget-spacing);

    -webkit-mask-image: -webkit-radial-gradient(#fff, #000);

    overflow: hidden;

    padding: var(--sidebar-card-widget-expand);

    position: relative;

    text-align: initial;

    transition: background .3s ease-in-out;

    width: 100%

}



.nav-card__button:before {

    background: var(--color-background-missions);

    content: "";

    filter: blur(40px);

    height: 120px;

    left: -60px;

    opacity: .6;

    position: absolute;

    top: -100px;

    transition: opacity .3s ease-in-out;

    width: 120px

}



.nav-card__button:hover {

    background: var(--color-dark-grey-3);

    color: #0f1b17

}



.nav-card__button:hover:before {

    opacity: 1

}



.nav-card__img {

    height: 40px;

    pointer-events: none;

    width: 40px;

    z-index: 1

}



.nav-card__title {

    flex: 1;

    font: var(--font-sidebar-card-text-s);

    overflow: hidden;

    position: relative

}



.nav-card__title:after {

    bottom: 0;

    content: "";

    height: 100%;

    position: absolute;

    right: 0;

    width: 8px

}



.nav-sidebar-card--wrapped .nav-card__img {

    margin: 0 auto

}



.nav-sidebar-card--wrapped .nav-card__button {

    background: #0000

}



.nav-sidebar-card--wrapped .nav-card__button:before {

    display: none

}



.nav-sidebar-card--wrapped .nav-card__button:hover {

    background: var(--color-dark-grey-2)

}



.nav-card .m-preloader {

    position: absolute;

    right: 4px;

    top: 4px

}



.social-icon {

    border-radius: 50%;

    height: 32px;

    width: 32px

}



.social-icon .m-button-content svg {

    color: var(--color-mid-grey-4);

    height: 20px;

    width: 20px

}



.footer-disclaimer__button {

    color: var(--color-in200);

    cursor: pointer;

    display: inline-flex;

    font-size: 14px;

    gap: 4px

}



.footer-disclaimer__button--expanded svg {

    transform: rotate(180deg)

}



.footer-disclaimer__text {

    display: flex;

    flex-flow: column;

    gap: 17px;

    margin-top: 17px;

    user-select: none;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none

}



.footer-disclaimer__text a {

    color: var(--color-light-grey-5)

}



.footer-disclaimer__text a:hover {

    color: var(--color-pr500)

}



.footer-disclaimer__text p {

    margin: 0

}



.footer-icons {

    align-items: center;

    display: flex

}



.footer-icons__image--link {

    cursor: pointer

}



.footer-icons>:not(:last-child) {

    margin-right: 16px

}



.footer-app-button {

    align-items: center;

    background: var(--color-dark-grey-2);

    border-radius: 4px;

    cursor: pointer;

    display: flex;

    gap: 4px;

    overflow: hidden;

    padding: 4px 8px 4px 0;

    position: relative;

    width: 100%

}



.footer-app-button:before {

    background: var(--color-background-missions);

    content: "";

    filter: blur(30px);

    height: 45px;

    left: -15px;

    opacity: 1;

    position: absolute;

    top: -15px;

    width: 45px

}



.footer-app-button-text {

    display: flex;

    flex-direction: column

}



.footer-app-button-description {

    opacity: .6

}



.footer-app-button-image {

    margin: 4px;

    width: 40px;

    z-index: 1

}



.footer-app-button--squeezed {

    padding: 0 8px 0 0

}



.footer-app-button--squeezed .footer-app-button-image {

    margin: 2px;

    width: 28px

}



.footer-dropdown {

    display: flex;

    flex-direction: column;

    gap: 12px;

    margin-top: 30px

}



.footer-dropdown__title {

    color: #fff;

    font-size: 18px;

    font-weight: 500;

    margin: 0

}



.footer-dropdown__item-title {

    margin-bottom: 8px

}



.footer-dropdown__item-title strong {

    font-weight: 500

}



.footer-support {

    align-items: flex-start;

    display: flex;

    flex-direction: column

}



.mobile .footer-support {

    border-bottom: 1px solid var(--color-border);

    margin: 0 0 32px;

    padding: 0 0 32px;

    width: 100%

}



.footer-support__description {

    margin-bottom: 18px

}



.footer-support>a {

    align-items: center;

    color: var(--color-light-grey-5);

    display: inline-flex;

    flex-shrink: 1

}



.footer-support>a:hover {

    color: var(--color-pr500)

}



.footer-support>a:not(:last-child) {

    margin-bottom: 8px

}



.footer-support>a>svg {

    color: var(--color-pr500);

    height: 18px;

    margin-right: 8px;

    width: 18px

}



.FooterLinks {

    grid-gap: 14px;

    align-items: start;

    display: grid;

    flex: 0 0 55%;

    grid-auto-flow: column;

    grid-template-rows: repeat(var(--rowsCount), auto)

}



.landscape .FooterLinks,

.mobile .FooterLinks,

.tablet .FooterLinks {

    flex: 0 0 100%

}



.FooterLinks>a {

    align-self: flex-start;

    break-inside: avoid;

    color: #dce0e6;

    display: block;

    text-decoration: none

}



.desktop .FooterLinks>a {

    transition: color .3s ease

}



.desktop .FooterLinks>a:hover {

    color: var(--color-white)

}



.footer-socials {

    display: flex;

    flex-direction: column

}



.mobile .footer-socials {

    align-items: center;

    flex-direction: row;

    justify-content: space-between;

    margin: 0 0 37px

}



.mobile .footer-socials--hidden {

    justify-content: flex-end

}



.footer-socials-follow {

    margin-bottom: 8px

}



.footer-nav {

    border-bottom: 1px solid var(--color-border);

    margin-bottom: 40px;

    padding: 30px 0 40px

}



.mobile .footer-nav {

    padding: 10px 0 40px

}



.footer-nav__content {

    align-items: flex-start;

    display: flex

}



.desktop .footer-nav__content {

    justify-content: space-between

}



.mobile .footer-nav__content {

    flex-direction: column

}



.tablet .footer-nav__content {

    flex-wrap: wrap

}



.footer-nav .nav-logo {

    display: block;

    margin-bottom: 33px

}



.footer-nav .nav-logo img {

    max-width: 152px

}



.mobile .footer-nav__socials {

    order: 1;

    width: 100%

}



.tablet .footer-nav__socials {

    margin-right: 173px;

    order: 0

}



.mobile .footer-nav__links,

.tablet .footer-nav__links {

    order: 2;

    width: 100%

}



.mobile .footer-nav__links {

    margin: 0

}



.tablet .footer-nav__links {

    margin: 32px 0 0;

    padding: 37px 0 0

}



.footer-nav__app {

    margin-bottom: 32px

}



.footer {

    padding-bottom: 70px

}



@media (min-width: 460px) {

    .footer {

        padding-bottom: 54px;

        padding-top: 24px

    }

}



.footer-row {

    margin-bottom: 17px

}



.footer-col,

.footer-row {

    align-items: center;

    display: flex

}



.footer-col {

    gap: 24px;

    margin-left: auto

}



.footer-copyright {

    margin: 16px 0 0

}



.auth-section-badge {

    position: absolute;

    right: -13px;

    top: -13px

}



.nav-logo {

    cursor: pointer

}



.desktop .nav-logo,

.nav-sidebar-header .nav-logo {

    max-width: 150px

}



.nav-logo--thin {

    max-width: 110px

}



.nav-logo--without-text {

    max-height: 25.96px

}



.nav-logo img {

    max-width: 100%;

    max-height: 60px;

    padding: 6px 0

}



.breadcrumb-list {

    align-items: center;

    background-color: var(--color-dark-grey-1);

    color: var(--color-white);

    display: flex;

    margin-bottom: 16px;

    margin-top: 16px;

    padding: 7px 16px

}



.mobile .breadcrumb-list {

    -ms-overflow-style: none;

    overflow-x: scroll;

    scrollbar-width: none

}



.mobile .breadcrumb-list::-webkit-scrollbar {

    display: none

}



.breadcrumb-list-item {

    margin-right: 16px;

    position: relative

}



.breadcrumb-list-item-link {

    align-items: center;

    color: var(--color-white);

    display: flex;

    gap: 16px

}



.mobile .breadcrumb-list-item-link {

    text-wrap: nowrap

}



.breadcrumb-list-item .m-icon {

    color: var(--color-pr400);

    height: 10px;

    width: 10px

}



.breadcrumb-list-item:last-child {

    color: var(--color-text-faded)

}



.breadcrumb-list-item .active {

    color: var(--color-text-faded);

    cursor: default

}



.main-nav-content {

    gap: var(--menu-top-spacing-mobile, 8px);

    padding: var(--menu-expand-mobile, 12px 16px)

}



.main-nav-content .auth-section-balance {

    --text-color: var(--color-menu-top-amount-text, var(--color-white));

    --outline-color: var(--color-menu-top-amount-outside-border, #0000);

    align-items: center;

    background: var(--color-menu-top-amount-background, var(--color-dark-grey-1));

    border-radius: var(--menu-top-amount-border-radius, 16px);

    color: var(--text-color);

    cursor: pointer;

    display: flex;

    font: var(--font-menu-top-amount-text, var(--font-body-bold-s));

    height: 100%;

    outline: var(--menu-top-amount-border-size, 2px) solid var(--outline-color);

    padding: var(--menu-amount-top-expand, 4px);

    position: relative;

    transition: all .15s ease-in

}



.main-nav-content .auth-section-balance-content {

    overflow: hidden;

    text-overflow: ellipsis

}



.main-nav-content .auth-section-balance-text {

    padding: var(--menu-amount-text-container-expand, 0 6px)

}



.main-nav-content .auth-section-balance-inside {

    min-width: 58px

}



.main-nav-content .auth-section-balance[active=true] {

    --outline-color: var(--color-menu-top-amount-outside-border-focus, var(--color-dark-grey-2));

    --text-color: var(--color-menu-top-amount-text-focus, var(--color-white))

}



.main-nav-content .auth-section-balance:hover {

    --text-color: var(--color-menu-top-amount-text-hover, var(--color-white))

}



.main-nav-content .auth-section-balance .auth-section-balance-arrow {

    color: var(--color-mid-grey-4);

    height: 12px;

    position: absolute;

    right: 8px;

    width: 12px

}



@media (min-width: 1280px) {

    .main-nav-content {

        box-shadow: var(--shadow-s5);

        gap: var(--menu-top-spacing-desktop, 16px);

        padding: var(--menu-expand-desktop, 16px)

    }

}



.main-nav-content__wrapper {

    align-items: center;

    display: flex;

    gap: 4px

}



.main-nav-content-left {

    align-items: center;

    display: flex;

    flex-shrink: 0;

    gap: 8px

}



.main-nav-content-auth {

    align-items: center;

    display: flex;

    flex-grow: 1;

    gap: var(--menu-top-user-bar-spacing-mobile, 4px);

    justify-content: flex-end;

    min-width: 0

}



.desktop .main-nav-content-auth {

    gap: var(--menu-top-user-bar-spacing-desktop, 8px)

}



.main-nav-content .header-search {

    color: var(--color-menu-top-icon, var(--color-mid-grey-5));

    cursor: pointer;

    height: var(--menu-top-icon-size, 24px);

    transition: color .2s ease-in-out

}



.main-nav-content .header-search-icon {

    height: var(--menu-top-icon-size, 24px);

    min-width: var(--menu-top-icon-size, 24px)

}



.main-nav-content .header-search:hover {

    color: var(--color-menu-top-icon-hover, var(--color-light-grey-3))

}



.main-nav-content-toggle {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: var(--nav-height, 64px)

}



.main-nav-content-toggle svg {

    color: var(--color-menu-top-icon, var(--color-mid-grey-5));

    width: var(--menu-top-icon-size, 24px)

}



.main-nav-content-toggle svg:hover {

    color: var(--color-menu-top-icon-hover, var(--color-light-grey-3))

}



.main-nav-content .auth-section__chat.chat-button {

    margin-left: 4px

}



.mobile .main-nav-content .auth-section__chat.chat-button {

    margin-left: 0;

    order: 1

}



.mobile .main-nav-content .auth-section__avatar {

    order: 1

}



.main-nav-content .auth-section .m-button-content {

    position: relative

}



.main-nav-content .auth-section-avatar {

    align-items: center;

    background: var(--color-dark-grey-2);

    border-radius: 50%;

    display: flex;

    height: 32px;

    justify-content: center;

    width: 32px

}



.NavSidebar .main-nav-content .auth-section-avatar {

    height: 56px;

    margin: 0 14px 0 0;

    width: 56px

}



.nav-sidebar-header {

    animation: fade .6s ease-in-out;

    background: var(--color-sidebar-header-background);

    padding: var(--sidebar-header-expand);

    position: relative;

    z-index: 104

}



.nav-sidebar-header,

.nav-sidebar-header-toggle {

    align-items: center;

    display: flex;

    height: var(--sidebar-header-content-height, 64px);

    justify-content: center

}



.nav-sidebar-header-toggle {

    bottom: 0;

    cursor: pointer;

    left: 0;

    position: absolute;

    top: 0;

    width: var(--sidebar-header-content-height, 64px)

}



.nav-sidebar-header-toggle svg {

    color: var(--color-menu-top-icon);

    height: var(--menu-top-icon-size, 24px);

    transform: scale(1);

    transition: all .3s ease-in-out;

    width: var(--menu-top-icon-size, 24px)

}



.opened .nav-sidebar-header-toggle svg {

    transform: scaleX(-1)

}



.nav-sidebar-header-toggle svg:hover {

    color: var(--color-menu-top-icon-hover)

}



.nav-sidebar-header-logo {

    align-items: center;

    animation: fade .5s ease-in-out;

    display: flex;

    margin: 0 auto

}



.nav-sidebar-header-wrap {

    position: absolute

}



.nav-sidebar-header-egg.m-icon {

    color: var(--color-at400);

    height: 12px;

    left: -6px;

    position: absolute;

    top: -1px;

    width: 12px

}



.mobile .nav-sidebar-header-egg,

.opened .nav-sidebar-header-egg {

    display: none

}



.nav-sidebar-icon {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: 48px;

    justify-content: center;

    width: 48px

}



.nav-sidebar-icon.active,

.nav-sidebar-icon:hover {

    background: var(--color-dark-grey-3);

    border-radius: 8px;

    color: #0f1b17

}



.nav-sidebar-icon.active svg,

.nav-sidebar-icon:hover svg {

    color: inherit

}



.nav-sidebar-icon svg {

    color: var(--color-mid-grey-5);

    height: 24px;

    pointer-events: none;

    width: 24px

}



.nav-sidebar-support {

    width: 100%

}



.nav-sidebar-support-wrapped svg {

    color: var(--color-su400)

}



.nav-sidebar-wrapped {

    background: var(--color-sidebar-background)

}



.nav-sidebar-wrapped-content {

    animation: slide-up-opacity .6s cubic-bezier(.4, 0, .2, 1) .3s forwards;

    height: calc(var(--app-height, 100vh) - var(--nav-height, 64px));

    opacity: 0;

    overflow-y: scroll;

    padding: var(--sidebar-body-expand, 8px);

    width: 64px;

    z-index: 103

}



.nav-sidebar-wrapped-content--screen-controls {

    padding-bottom: 72px

}



.nav-sidebar-wrapped-item:not(:last-child) {

    margin-bottom: 4px

}



.nav-sidebar-wrapped .divider-top {

    margin-top: 16px;

    position: relative

}



.nav-sidebar-wrapped .divider-top:before {

    background: var(--color-sidebar-divider-background);

    content: "";

    height: var(--line-size-s, 1px);

    position: absolute;

    top: calc(var(--sidebar-body-spacing, 8px) * -1);

    width: 100%

}



.nav-sidebar-wrapped .divider-bottom {

    margin-bottom: 16px;

    position: relative

}



.nav-sidebar-wrapped .divider-bottom:after {

    background: var(--color-sidebar-divider-background);

    bottom: calc(var(--sidebar-body-spacing, 8px) * -1);

    content: "";

    height: var(--line-size-s, 1px);

    position: absolute;

    width: 100%

}



.nav-sidebar {

    background: var(--color-dark-grey-1);

    position: relative;

    z-index: 105

}



.nav-sidebar-content {

    transition: all .5s ease;

    width: var(--nav-sidebar-width)

}



.opened .nav-sidebar-content {

    width: 320px

}



@media (max-width: 1280px) {

    .nav-sidebar-content {

        left: 0;

        position: fixed;

        top: 0;

        z-index: 103

    }



    .opened .nav-sidebar-content {

        max-width: 430px;

        width: 100%

    }

}



.nav-sidebar-overlay {

    background-color: var(--color-b070);

    bottom: 0;

    content: "";

    display: none;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

    z-index: 102

}



@media (max-width: 1280px) {

    .nav-sidebar-overlay {

        display: block

    }

}



table {

    border: none;

    border-collapse: collapse;

    width: 100%

}



th {

    color: #fff;

    font-size: 1rem;

    font-weight: 700;

    padding: 8px 16px

}



td,

th {

    line-height: 1.6

}



td {

    background: var(--color-dark-grey-0);

    border: none;

    border-bottom: 1px solid var(--color-dark-grey-2);

    color: var(--color-white);

    font-size: 14px;

    font-weight: 600;

    padding: 11px 16px;

    -webkit-user-select: text;

    -moz-user-select: text;

    -ms-user-select: text;

    user-select: text;

    vertical-align: middle

}



.auth-section-avatar {

    cursor: pointer;

    flex-shrink: 0;

    position: relative

}



.auth-section-avatar-icon {

    height: 18px;

    width: 18px

}



@media (max-width: 1248px) {

    .auth-section-avatar-dropdown {

        left: 0 !important

    }

}



.main-nav {

    background: var(--color-menu-top-background, var(--color-background-page));

    position: sticky;

    top: 0;

    z-index: 104

}



.main-nav-content {

    align-items: center;

    display: flex;

    flex-flow: row nowrap;

    gap: 8px;

    height: var(--nav-height, 64px);

    justify-content: space-between;

    max-width: none

}



.main-nav-logo {

    align-items: center;

    animation: fade .5s ease-in-out;

    cursor: pointer;

    display: flex;

    flex: none

}



.main-nav-logo--hidden {

    display: none;

    margin-right: 0

}



@media (min-width: 1280px) {

    .main-nav-logo {

        margin-right: 12px

    }

}



.main-nav-auth {

    align-items: center;

    display: flex;

    flex-grow: 1;

    justify-content: flex-end;

    min-width: 0

}



@media (max-width: 1280px) {

    .main-nav-menu {

        display: none

    }

}



.main-nav__telegram-btn {

    background-color: #26a4e3

}



.desktop .main-nav__telegram-btn {

    margin-left: 8px

}



.main-nav__telegram-btn:hover {

    background-color: #51b6e9

}



.main-nav__telegram-btn:active {

    background-color: #2086be

}



.app {

    display: flex;

    flex-flow: row;

    max-width: 100%;

    overflow: hidden;

    width: 100vw

}



.app #container {

    display: flex;

    flex: 1;

    flex-direction: column;

    height: var(--app-height, 100vh);

    overflow-x: hidden;

    overflow-y: auto

}



.app #container .Footer {

    margin-top: auto

}



.jackpot-smartico-button {

    align-items: center;

    background: var(--jackpot-smartico-button-color);

    border-radius: 50%;

    cursor: pointer;

    display: flex;

    flex-shrink: 0;

    height: 32px;

    justify-content: center;

    width: 32px

}



.jackpot-smartico-button,

.jackpot-smartico-button--cold {

    --jackpot-smartico-button-color: var(--color-su500)

}



.jackpot-smartico-button--warm {

    --jackpot-smartico-button-color: var(--color-at400)

}



.jackpot-smartico-button--hot {

    --jackpot-smartico-button-color: var(--color-da600)

}



.lobby {

    display: flex;

    flex-direction: column;

    gap: 32px;

    padding-top: 16px

}



.mobile .lobby {

    gap: 16px;

    padding-top: 6px

}



.hot-cold-games .m-category-scroll__header {

    flex-wrap: wrap

}



.mobile .hot-cold-games__tabs {

    order: 2;

    width: 100%;

    margin-top: 4px;

    margin-right: 16px

}



.recent-big-wins-section {

    overflow: hidden

}



.recent-big-wins-section--no-wrapper {

    margin-bottom: var(--gap-m)

}



.mobile .recent-big-wins-section--no-wrapper {

    padding: 0 var(--section-padding-m)

}



.recent-big-wins-card {

    display: flex;

    border-radius: 12px;

    height: 84px;

    background-color: var(--color-dark-grey-1);

    min-width: 200px;

    cursor: pointer

}



.recent-big-wins-card__info {

    padding: 6px 8px 6px 12px;

    display: flex;

    flex-direction: column;

    overflow: hidden;

    position: relative;

    width: 100%

}



.recent-big-wins-card__info:after {

    content: "";

    position: absolute;

    top: 8px;

    right: 8px;

    width: 16px;

    height: 60px;

    background: linear-gradient(to right, rgba(255, 255, 255, 0) 10%, var(--color-dark-grey-1))

}



.recent-big-wins-card__game-icon,

.recent-big-wins-card__game-video {

    width: 84px;

    height: 84px;

    border-radius: 12px;

    overflow: hidden;

    flex-shrink: 0;

    display: flex;

    align-items: center

}



.recent-big-wins-card__game-icon img,

.recent-big-wins-card__game-video img {

    width: 100%

}



.recent-big-wins-card__game-name {

    font-size: 14px;

    line-height: 1.6;

    color: var(--color-white);

    white-space: nowrap;

    overflow: hidden

}



.recent-big-wins-card__player-info {

    margin-top: 1px;

    display: flex;

    white-space: nowrap;

    align-items: center;

    gap: 8px

}



.recent-big-wins-card__player-avatar {

    --m-avatar-rank-icon-offset-x: -20% !important;

    --m-avatar-rank-icon-offset-y: -20% !important;

    z-index: 0

}



.recent-big-wins-card__player-nickname {

    font-size: 10px;

    font-weight: 600;

    line-height: 1.6;

    color: var(--color-mid-grey-4);

    overflow: hidden

}



.recent-big-wins-card__win-amount {

    font-size: 16px;

    font-weight: 700;

    line-height: 1.5;

    color: var(--color-su400);

    margin-top: auto;

    overflow: hidden;

    white-space: nowrap

}



.recent-big-wins-card__win-amount .m-currency-converted {

    pointer-events: none

}



.recent-big-wins-scroller {

    position: relative

}



.recent-big-wins-scroller__cards {

    display: flex;

    scroll-snap-type: x mandatory

}



.recent-big-wins-scroller__card {

    min-width: var(--card-width) !important;

    scroll-snap-align: start

}



.recent-big-wins-scroller__card:not(:last-child) {

    margin-right: var(--card-gap)

}



.item-slide-leave-active {

    position: absolute;

    bottom: 0;

    right: 0;

    left: 0;

    z-index: 1

}



.item-slide-leave-active {

    transition: all var(--duration) ease

}



.item-slide-enter-active {

    transition: opacity var(--duration) ease-in;

    opacity: 1

}



.item-slide-enter-from {

    opacity: 0

}



.item-slide-leave-to {

    transform: translate(calc(var(--card-width) + var(--card-gap)))

}



.item-slide-enter-active>div:not(:first-child) {

    visibility: hidden

}



.recent-big-wins-header {

    display: flex;

    flex-wrap: nowrap;

    justify-content: space-between;

    align-items: center;

    margin-bottom: var(--gap-s)

}



.recent-big-wins-header__control {

    display: flex;

    align-items: center

}



.recent-big-wins-header__title {

    display: flex;

    align-items: center;

    font-size: 28px;

    font-weight: 700;

    line-height: 1.4;

    color: var(--color-light-grey-5)

}



.mobile .recent-big-wins-header__title {

    line-height: 1.9

}



.recent-big-wins-header__title>svg {

    width: 32px;

    margin-right: 8px;

    color: var(--color-mid-grey-5)

}



.mobile .recent-big-wins-header__title {

    font-size: 16px

}



.recent-big-wins-slider {

    position: relative;

    overflow: hidden

}



.recent-big-wins-slider__cards {

    display: grid;

    grid-template-columns: repeat(var(--perRowDefault), 1fr);

    grid-gap: 16px;

    margin-top: 0;

    overflow: hidden

}



@media (max-width: 1100px) {

    .recent-big-wins-slider__cards {

        grid-template-columns: repeat(var(--perRowMiddle), 1fr)

    }

}



@media (max-width: 960px) {

    .recent-big-wins-slider__cards {

        grid-template-columns: repeat(var(--perRowMin), 1fr)

    }

}



.item-slide-left-leave-active,

.item-slide-right-leave-active {

    position: absolute;

    bottom: 0;

    right: 0;

    left: 0;

    z-index: 1

}



.item-slide-left-leave-active,

.item-slide-right-leave-active {

    transition: all var(--duration) ease

}



.item-slide-left-enter-active,

.item-slide-right-enter-active {

    transition: opacity var(--duration) ease-in;

    opacity: 1

}



.item-slide-left-enter-from,

.item-slide-right-enter-from {

    opacity: 0

}



.item-slide-left-enter-active>div:not(:first-child) {

    visibility: hidden

}



.item-slide-left-leave-to {

    transform: translate(calc(100% / var(--perRow) + 16px / var(--perRow)))

}



.item-slide-right-enter-active>div:not(:last-child) {

    visibility: hidden

}



.item-slide-right-leave-to {

    transform: translate(calc(-100% / var(--perRow) - 16px / var(--perRow)))

}



.mini-banner {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 12px 24px;

    border-radius: 16px;

    position: relative;

    cursor: pointer;

    overflow: hidden

}



.mini-banner__image {

    position: absolute;

    left: 0;

    right: 0

}



.mobile .mini-banner {

    padding: 12px 16px

}



.mini-banner--without-text {

    flex-flow: row-reverse

}



.mini-banner__text {

    z-index: 2;

    color: var(--color-white)

}



.mobile .mini-banner__text-subtitle {

    margin-top: -1px

}



.mini-banner__button {

    z-index: 2

}



.pwa-banner {

    border-radius: 16px;

    background: linear-gradient(97deg, #0a5566, #501875 94.17%);

    display: flex;

    position: relative;

    align-items: center;

    justify-content: space-between;

    padding: 32px 32px 32px 195px;

    gap: 32px;

    overflow: hidden

}



.mobile .pwa-banner {

    padding: 16px 100px 16px 16px;

    gap: 12px;

    flex-direction: column;

    align-items: flex-start

}



.pwa-banner__image {

    position: absolute;

    height: 100%;

    bottom: 0;

    top: 0;

    left: 0

}



.mobile .pwa-banner__image {

    right: 0;

    left: unset

}



.lobby-top-menu {

    display: flex;

    gap: 8px

}



.lobby-top-menu__switcher {

    width: 100%

}



.lobby-banner {

    --gradient-color: #80462d;

    --gradient-color-2: #ffea81;

    position: relative;

    width: 100%;

    height: 100%;

    overflow: hidden;

    border-radius: 16px;

    aspect-ratio: 21/9

}



.lobby-banner--vip {

    border: 2px solid rgba(0, 0, 0, 0);

    background: linear-gradient(var(--color-background-page), var(--color-background-page)) padding-box, linear-gradient(260.92deg, var(--gradient-color) 15.61%, var(--gradient-color-2) 73.28%, var(--gradient-color) 94.48%) border-box

}



.lobby-banner--vip .lobby-banner__text>* {

    background: linear-gradient(260.15deg, var(--gradient-color-2) 22.88%, var(--gradient-color) 122.42%);

    -webkit-background-clip: text;

    background-clip: text;

    -webkit-text-fill-color: rgba(0, 0, 0, 0)

}



.lobby-banner__image {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%

}



.lobby-banner__content {

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    justify-content: space-between;

    padding: 12px;

    height: 100%;

    position: relative;

    z-index: 1

}



.lobby-banner__text {

    max-width: 50%

}



.lobby-banner__text>* {

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical

}



.mobile .lobby-banners {

    padding: 0

}



.desktop .lobby-banners__banner {

    padding: 0 4px

}



.lobby-banners .m-slider__scroll-box {

    --scroll-padding: var(--section-padding-l);

    scroll-padding: var(--scroll-padding);

    padding: 0 var(--scroll-padding);

    gap: calc(var(--scroll-padding) / 2)

}



.desktop .lobby-banners .m-slider__scroll-box {

    --scroll-padding: 0

}



.m-game-list .m-category-scroll__content {

    padding: 0;

    margin: 0

}



.mobile .games-section {

    padding: 0

}



.mobile .games-section .m-category-scroll__content {

    margin: 0

}



.mobile .games-section .m-category-scroll__header {

    padding: 0 0 0 var(--sectionPadding)

}



.mobile .games-section .m-counter {

    display: none

}



.games-section .m-category-scroll__content {

    padding: 0 16px !important

}



.m-game-list-header img.category-vip-icon {

    width: 54px;

    height: 24px

}



.mobile .m-game-list-header img.category-vip-icon {

    width: 40px;

    height: 18px

}



.m-share-button {

    display: flex;

    justify-content: center;

    align-items: center;

    padding: 4px;

    height: 28px;

    width: 28px;

    background: var(--color-dark-grey-2);

    border-radius: 100%;

    cursor: pointer;

    transition: all ease-in-out .2s

}



.mobile .m-share-button {

    height: 24px;

    width: 24px;

    opacity: 1

}



.m-share-button:hover {

    background-color: var(--color-dark-grey-3)

}



.m-share-button__icon {

    width: max-content

}



.mobile .my-top-wins .m-segment-control {

    margin-right: var(--sectionPadding)

}



.my-top-wins .Card-Tags__one {

    white-space: nowrap

}



.lobby-banner-picture {

    width: 100%;

    height: 100%

}



.lobby-banner-picture img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    aspect-ratio: var(--aspect-ratio)

}



.m-game-list-header {

    display: flex;

    align-items: center;

    gap: 8px;

    color: var(--color-light-grey-5)

}



.m-game-list-header svg,

.m-game-list-header img {

    width: 32px;

    height: 32px;

    color: var(--color-mid-grey-5)

}



.mobile .providers-section .m-counter {

    display: none

}



.view-all {

    display: flex

}



.payment-card {

    display: flex;

    justify-content: center;

    align-items: center;

    background: var(--color-dark-grey-1);

    border-radius: var(--border-radius-l);

    height: 95px;

    cursor: pointer

}



.payment-card--mobile {

    height: 70px

}



.payment-card__img {

    max-width: 65%;

    max-height: 60px;

    height: 100%

}



.mobile .payments-section,

.tablet .payments-section {

    padding: 0

}



.mobile .payments-section .m-category-scroll__header,

.tablet .payments-section .m-category-scroll__header {

    padding: 0 0 0 var(--sectionPadding)

}



.payments-section .m-category-slider__content {

    grid-gap: 8px;

    margin: 0

}



.payments-section .m-category-scroll__content {

    margin: 0

}



.payments-section .m-category-scroll__item {

    max-width: 100%;

    flex: 0 0 109px;

    margin-right: 8px

}



.payments-section .m-category-scroll__header {

    justify-content: flex-end

}



.payments-section .m-category-slider__header {

    justify-content: flex-end;

    margin-top: 0

}



.payments-section .m-category-slider__header .m-prev-next-arrows {

    margin-left: unset

}



.mobile .payments-section .m-counter {

    display: none

}



.mobile .payments-section .lobby-show-all-arrow {

    margin-right: 0

}



.payments-block__header {

    flex: 1;

    color: var(--color-text-title);

    display: flex;

    align-items: center;

    gap: 8px

}



.payments-block__header-icon {

    border-radius: var(--border-radius-s);

    height: 32px;

    width: 32px;

    background: radial-gradient(107.5% 107.5% at 100.35% 50.02%, #f303f9, #672cd5);

    display: flex;

    align-items: center;

    justify-content: center

}



.m-game-card {

    position: relative;

    display: flex;

    flex-direction: column;

    width: 100%;

    height: 100%

}



.m-game-card__top-right {

    position: absolute;

    z-index: 9;

    top: 6px;

    right: 8px;

    opacity: 0

}



.m-game-card__top-right--mobile {

    opacity: 1

}



.m-game-main {

    position: relative;

    width: 100%;

    height: 100%;

    transition: all .3s;

    flex-grow: 1;

    overflow: hidden;

    border-radius: 14px;

    cursor: pointer

}



.m-game-main--shallow {

    border-radius: 14px;

    -webkit-mask-image: -webkit-radial-gradient(white, black);

    flex-grow: initial

}



.m-game-main--grayscale img {

    filter: grayscale(100%)

}



.m-card-thumb {

    position: relative;

    width: 100%;

    height: 100%;

    max-width: 100%;

    max-height: 100%;

    overflow: hidden;

    background-size: cover;

    background-position: center;

    background-color: var(--color-dark-grey-2);

    border-radius: 14px;

    display: flex;

    flex-direction: column;

    transition: transform .25s ease-in-out

}



.m-card-thumb:before {

    content: "";

    display: block;

    padding-top: 100%

}



.m-game-list--mobile .m-card-thumb:after {

    content: "";

    width: 100%;

    height: 40px;

    position: absolute;

    bottom: 0;

    background: var(--gradient-dark-grey-1-bottom)

}



.m-card-thumb-video,

.m-card-thumb-image,

.m-card-thumb-preview {

    object-fit: cover;

    display: block;

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%

}



.m-card-thumb-image {

    opacity: 0;

    transition: opacity .6s ease-in-out

}



.m-card-thumb-image.fadeIn {

    opacity: 1

}



.m-card-thumb-image--bottom {

    object-position: bottom

}



.m-cdn-image {

    width: 100%;

    height: 100%

}



.m-game-footer {

    position: relative;

    display: flex;

    flex-shrink: 0;

    justify-content: space-between;

    align-items: center;

    max-width: 100%;

    padding: 8px 0 0;

    border-radius: 0 0 14px 14px

}



.m-game-list--mobile .m-game-footer {

    padding: 2px 0 0

}



.m-game-footer-left {

    position: relative;

    flex-grow: 1;

    min-width: 0;

    overflow: hidden;

    white-space: nowrap

}



.m-game-footer-left:after {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    z-index: 1;

    width: 20px;

    height: 100%;

    background: var(--gradient-dark-grey-0-right)

}



.m-game-footer-left--large:after {

    background: var(--gradient-dark-grey-0-right)

}



.m-game-footer-provider {

    overflow: hidden;

    color: var(--color-mid-grey-2);

    text-overflow: ellipsis

}



.m-game-footer-name {

    display: block;

    min-width: 0;

    max-width: 100%;

    overflow: hidden;

    color: var(--color-light-grey-5);

    text-overflow: ellipsis;

    cursor: pointer

}



.m-button.lobby-show-all .m-button.m-counter {

    --background: var(--color-dark-grey-5);

    --outline: var(--color-dark-grey-5)

}



.m-button.lobby-show-all-shallow {

    color: var(--color-in100);

    --m-button-border-color: transparent;

    font-size: 16px;

    padding-top: 0;

    padding-bottom: 0

}



.pull-to-refresh {

    align-items: center;

    border-radius: 50%;

    display: flex;

    flex-direction: column;

    justify-content: center;

    overflow: hidden;

    position: fixed;

    top: -60px;

    transition: transform .2s;

    width: 100%;

    z-index: 9999

}



.pull-to-refresh-bg {

    border-radius: 50%;

    display: flex;

    padding: 10px

}



.android .pull-to-refresh-bg {

    background: var(--color-button-fill-secondary-background)

}



body.ios #container {

    margin: 0;

    transition: margin .4s

}



body.ios #container .profile-wrapper {

    min-height: 100vh

}



body.ios.reloading {

    pointer-events: none

}



body.ios.reloading #container {

    margin: 50px 0 0;

    pointer-events: none

}



.email-verification-banner {

    position: relative;

    width: 100%

}



.email-verification-banner__content {

    --padding-bottom-top: 8px;

    align-items: center;

    cursor: pointer;

    display: flex;

    gap: 6px;

    padding: var(--padding-bottom-top) 30px var(--padding-bottom-top) 8px

}



.email-verification-banner__content img,

.email-verification-banner__content svg {

    --main-icon-size: 16px;

    height: var(--main-icon-size);

    min-width: var(--main-icon-size);

    width: var(--main-icon-size)

}



.mobile .email-verification-banner__content img,

.mobile .email-verification-banner__content svg {

    --main-icon-size: 24px

}



.desktop .email-verification-banner__content,

.tablet .email-verification-banner__content {

    --padding-bottom-top: 4px;

    justify-content: center

}



.email-verification-banner__content span {

    font-weight: 700

}



.email-verification-banner__close-icon {

    --close-icon-size: 16px;

    align-items: center;

    color: var(--color-w060);

    cursor: pointer;

    display: flex;

    height: 100%;

    position: absolute;

    right: 16px;

    top: 0

}



.email-verification-banner__close-icon svg {

    height: var(--close-icon-size);

    width: var(--close-icon-size)

}



.bottom-overlays {

    bottom: 0;

    display: flex;

    flex-direction: column;

    left: 0;

    pointer-events: none;

    position: fixed;

    right: 0;

    z-index: 900

}



.bottom-overlays>* {

    pointer-events: auto

}



.bottom-overlays__action-buttons {

    align-self: flex-end;

    margin: 0 16px 16px

}



.bottom-overlays__action-buttons--margin {

    margin-bottom: calc(env(safe-area-inset-bottom) + 16px)

}



.preload-game-aviator {

    display: none !important

}



.nav-sidebar-expanded-app-links {

    display: flex;

    flex-direction: column;

    gap: var(--sidebar-body-opened-container-spacing, 8px)

}



.nav-sidebar-expanded-app-links-app.footer-app-button {

    flex-shrink: 0;

    padding-bottom: 0;

    padding-top: 0

}



.nav-sidebar-expanded-app-links-app .footer-app-button-title {

    margin-top: -2px

}



.nav-sidebar-expanded-cards {

    display: flex;

    flex-direction: column;

    gap: var(--sidebar-body-opened-container-spacing, 8px)

}



.nav-sidebar-expanded-cards-referral {

    flex-shrink: 0;

    grid-column: 1/span 2

}



.nav-sidebar-expanded-support {

    flex-direction: column

}



.nav-sidebar-expanded-support,

.nav-sidebar-expanded-support-help {

    display: flex;

    gap: var(--buttons-group-spacing-m, 8px)

}



.nav-sidebar-expanded-support-help>* {

    flex-basis: 148px;

    flex-grow: 1

}



.nav-sidebar-item-icon {

    --ic-color: var(--icon-color, var(--color-sidebar-list-row-text));

    --ic-background: var(--color-sidebar-list-header-icon-container-background);

    --ic-border-color: var(--color-sidebar-list-header-icon-container-border);

    --ic-border-width: var(--sidebar-list-item-icon-container-border-size);

    --ic-size: var(--sidebar-list-item-icon-container-icon-size);

    --ic-padding: var(--sidebar-list-item-icon-container-expand)

}



.nav-sidebar-item {

    --text-color--nested: var(--color-sidebar-list-row-text);

    --icon-color--nested: var(--color-sidebar-list-row-text);

    --text-color: var(--color-sidebar-list-header-text);

    --icon-color: var(--color-sidebar-list-header-text);

    align-items: center;

    color: var(--text-color);

    cursor: pointer;

    display: flex;

    font: var(--font-sidebar-list-text);

    width: 100%

}



.nav-sidebar-item__content {

    align-items: center;

    display: flex;

    gap: var(--sidebar-list-item-spacing, 8px);

    padding: var(--sidebar-list-item-expand, 8px);

    width: 100%

}



.nav-sidebar-item--main {

    background: var(--color-dark-grey-2);

    border-radius: 8px;

    transition: background .3s ease-in-out, margin .3s ease-in-out

}



.nav-sidebar-item--nested {

    --icon-color: var(--icon-color--nested);

    color: var(--text-color--nested);

    transition: all .3s ease-in-out

}



@media (hover) {

    .nav-sidebar-item--main:hover {

        --text-color: var(--color-sidebar-list-header-text-hover);

        --icon-color: var(--color-sidebar-list-header-text-hover)

    }



    .nav-sidebar-item--nested:hover {

        --text-color--nested: var(--color-sidebar-list-row-text);

        --icon-color--nested: var(--color-sidebar-list-row-text);

        margin-left: 4px

    }

}



.nav-sidebar-items {

    --text-color: var(--color-sidebar-list-header-text);

    --icon-color: var(--text-color);

    display: flex;

    flex-direction: column;

    gap: var(--sidebar-body-opened-menu-spacing, 4px)

}



.nav-sidebar-items-title {

    align-items: center;

    border-radius: var(--sidebar-list-item-border-radius, 8px);

    color: var(--text-color);

    cursor: pointer;

    display: flex;

    font: var(--font-sidebar-list-header);

    gap: var(--sidebar-list-item-spacing, 8px);

    padding: var(--sidebar-list-item-expand, 8px);

    position: relative;

    transition: background .3s ease-in-out, margin .3s ease-in-out;

    -webkit-user-select: none;

    user-select: none

}



.nav-sidebar-items-title span {

    flex: 1

}



@media (hover) {

    .nav-sidebar-items-title:hover {

        margin-left: 4px

    }

}



.nav-sidebar-items-title--light {

    background: var(--color-sidebar-list-header-background)

}



@media (hover) {

    .nav-sidebar-items-title--light:hover {

        --text-color: var(--color-sidebar-list-header-text-hover);

        --icon-color: var(--text-color);

        background: var(--color-sidebar-list-header-background-hover);

        margin-left: 0

    }

}



.nav-sidebar-items-toggle-arrow svg {

    transform: scaleY(-1);

    transition: transform .2s ease-in-out

}



.active .nav-sidebar-items-toggle-arrow svg {

    transform: scale(1)

}



.nav-sidebar-expanded {

    bottom: 0;

    display: flex;

    flex-direction: column;

    height: 100%;

    left: 0;

    position: fixed;

    top: 0;

    width: 320px

}



@media (max-width: 1280px) {

    .nav-sidebar-expanded {

        background: var(--color-dark-grey-1);

        max-width: 430px;

        width: 100%

    }

}



.nav-sidebar-expanded-items {

    margin-bottom: auto

}



.nav-sidebar-expanded-auth {

    margin-bottom: 16px

}



.nav-sidebar-expanded-content {

    animation: slide-up-opacity .6s cubic-bezier(.4, 0, .2, 1) .3s forwards;

    display: flex;

    flex: 1;

    flex-direction: column;

    opacity: 0;

    overflow: hidden;

    width: 100%

}



.nav-sidebar-expanded-scrollY {

    flex: 1;

    min-height: 0;

    overflow-x: hidden;

    overflow-y: auto;

    padding: 16px 8px

}



.nav-sidebar-expanded--gap {

    display: flex;

    flex-flow: column;

    gap: var(--sidebar-body-opened-spacing);

    padding: 16px 8px

}



.mobile .nav-sidebar-expanded--gap {

    padding: 16px

}



.nav-sidebar-expanded--screen-controls .nav-sidebar-expanded-scrollY {

    padding-bottom: 72px

}



.jackpot-banner {

    --border-radius: 16px;

    --padding: 24px;

    --padding-bottom: 16px;

    --title-font-size: 64px;

    background-color: var(--background-color);

    padding: var(--padding);

    padding-bottom: var(--padding-bottom);

    position: relative;

    width: 100%

}



.jackpot-banner,

.jackpot-banner--cold {

    --background-color: #105266;

    --payout-color: #7cfa88;

    --button-text-color: #fff;

    --button-color: #e45809;

    --overlay-background-color: #09e41f

}



.jackpot-banner--warm {

    --background-color: #e45809;

    --payout-color: #f6da24;

    --button-text-color: #161d37;

    --button-color: #f6da24;

    --overlay-background-color: #f6da24

}



.jackpot-banner--hot {

    --background-color: #421565;

    --payout-color: #f44;

    --button-text-color: #fff;

    --button-color: #f44;

    --overlay-background-color: #f44

}



.jackpot-banner--hot .jackpot-banner__overlay {

    animation: flash-overlay-opacity 1.2s ease-in-out infinite alternate, bounce-overlay 2.4s ease-in-out infinite alternate

}



.jackpot-banner--medium {

    --border-radius: 12px;

    --padding: 16px;

    --padding-bottom: 10px;

    --title-font-size: 28px

}



.jackpot-banner--small {

    --border-radius: 8px;

    --padding: 8px;

    --padding-bottom: 12px;

    --title-font-size: 12px;

    cursor: pointer

}



.jackpot-banner,

.jackpot-banner__overlay {

    border-radius: var(--border-radius)

}



.jackpot-banner__overlay {

    animation: flash-overlay-opacity 1.2s ease-in-out infinite alternate;

    background: radial-gradient(circle at 50% 160%, var(--overlay-background-color) 0, rgba(0, 0, 0, 0) 70%);

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3

}



.jackpot-banner--medium .jackpot-banner__overlay {

    background: radial-gradient(circle at 50% 160%, var(--overlay-background-color) 0, rgba(0, 0, 0, 0) 100%)

}



.jackpot-banner--small .jackpot-banner__overlay {

    background: linear-gradient(rgba(0, 0, 0, 0) 0, var(--overlay-background-color) 150%)

}



.jackpot-banner__title {

    align-items: center;

    display: flex;

    font-size: var(--title-font-size);

    gap: 20px;

    line-height: 1;

    margin-bottom: 12px

}



.jackpot-banner__title-text {

    color: #fff;

    font-weight: 800;

    text-transform: uppercase

}



.jackpot-banner__title-amount {

    color: var(--payout-color)

}



.jackpot-banner--medium .jackpot-banner__title {

    flex-direction: column;

    gap: 0;

    margin-top: 4px;

    text-align: center

}



.jackpot-banner--medium .jackpot-banner__title .jackpot-banner__title-amount-wrapper {

    min-height: 32px

}



.jackpot-banner--medium .jackpot-banner__title .jackpot-banner__title-amount {

    font-size: 32px

}



.jackpot-banner--small .jackpot-banner__title {

    gap: 6px

}



.jackpot-banner--small.jackpot-banner--hot .jackpot-banner__title .jackpot-banner__title-amount {

    color: #f6da24

}



.jackpot-banner__info {

    align-items: center;

    color: #fff;

    display: flex;

    gap: 16px

}



.jackpot-banner--medium .jackpot-banner__info {

    justify-content: center;

    opacity: .4;

    text-align: center

}



.jackpot-banner--medium.jackpot-banner--warm .jackpot-banner__info {

    color: #000

}



.jackpot-banner__info,

.jackpot-banner__title {

    position: relative;

    z-index: 4

}



.jackpot-banner__button {

    background-color: var(--button-color);

    border: none;

    color: var(--button-text-color)

}



.jackpot-banner--medium .jackpot-banner__button {

    display: none

}



@keyframes flash-overlay-opacity {

    0% {

        opacity: .6

    }



    to {

        opacity: 1

    }

}



@keyframes bounce-overlay {

    0% {

        background: radial-gradient(circle at 50% 160%, var(--overlay-background-color) 0, rgba(0, 0, 0, 0) 70%)

    }



    to {

        background: radial-gradient(circle at 60% 160%, var(--overlay-background-color) 0, rgba(0, 0, 0, 0) 70%)

    }

}



.jackpot-amount {

    --animation-duration: .5s;

    --animation-function: ease-in-out;

    display: inline-flex;

    font-weight: 700;

    line-height: 1;

    overflow: hidden

}



.jackpot-amount__currency--right {

    order: 1

}



.jackpot-amount__column {

    display: flex

}



.jackpot-amount__digit-wrapper {

    display: flex;

    overflow: hidden;

    position: relative

}



.jackpot-amount__hidden-digit {

    opacity: 0

}



.jackpot-amount__drum {

    align-items: center;

    bottom: 0;

    display: flex;

    flex-direction: column;

    left: 0;

    position: absolute;

    width: 100%

}



@keyframes rotate-down {

    to {

        bottom: -100%

    }

}



.jackpot-amount__drum--animated {

    animation: var(--animation-duration) var(--animation-function) rotate-down both

}



.jackpot-amount__drum-digit--hidden {

    opacity: 0

}



.jackpot-amount__comma {

    align-items: flex-end;

    display: flex;

    font-size: 0;

    overflow: hidden

}



.jackpot-amount__comma--visible {

    font-size: inherit

}



.jackpot-amount__comma--animated {

    transition: font-size var(--animation-duration) var(--animation-function)

}



.jackpot-progress {

    --progress-height: 12px;

    --progress-color: #252c45;

    --progress-text-color: #fff9;

    --point-border-width: 2px;

    --point-size: 34px;

    --point-inner-size: 24px;

    display: flex;

    justify-content: center;

    padding: 65px 0 24px;

    position: relative;

    width: 100%

}



.jackpot-progress--cold {

    --progress-text-color-active: #7cfa88;

    --point-background-color: #105266

}



.jackpot-progress--cold .jackpot-progress__hero {

    animation: progress-hero-run-1 1.2s ease-in-out forwards, bounce-hero .8s ease-in-out 1.2s infinite alternate

}



.jackpot-progress--cold.jackpot-progress--medium .jackpot-progress__hero {

    animation: progress-hero-run-small-1 1.2s ease-in-out forwards, bounce-hero .8s ease-in-out 1.2s infinite alternate

}



.jackpot-progress--cold .jackpot-progress__segment--1 {

    --progress-text-color: var(--progress-text-color-active);

    --segment-line-color: linear-gradient(90deg, #e5ff9a, #7cfa88);

    --point-border-color: #7cfa88

}



.jackpot-progress--cold .jackpot-progress__segment--1 .jackpot-progress__line {

    animation: progress-line-finished 1.2s ease-in-out forwards

}



.jackpot-progress--warm {

    --progress-color: #983b06;

    --progress-text-color-active: #fae97c;

    --point-background-color: #e45809;

    --point-border-color: #983b06

}



.jackpot-progress--warm .jackpot-progress__hero {

    animation: progress-hero-run-2 1.2s ease-in-out forwards, bounce-hero .8s ease-in-out 1.2s infinite alternate

}



.jackpot-progress--warm .jackpot-progress__segment--1 {

    --segment-line-color: linear-gradient(90deg, #ff9b25, #f7de20);

    --progress-text-color: var(--progress-text-color-active);

    --point-border-color: #f7de20

}



.jackpot-progress--warm .jackpot-progress__segment--1 .jackpot-progress__line {

    transform: scaleX(1)

}



.jackpot-progress--warm .jackpot-progress__segment--1 .jackpot-progress-point,

.jackpot-progress--warm .jackpot-progress__segment--1 .jackpot-progress-point__inner,

.jackpot-progress--warm .jackpot-progress__segment--1 .jackpot-progress-point__inner svg path {

    transition: none

}



.jackpot-progress--warm .jackpot-progress__segment--2 {

    --segment-line-color: linear-gradient(90deg, #f7de20, #fbed93);

    --progress-text-color: var(--progress-text-color-active);

    --point-border-color: #fbed93

}



.jackpot-progress--warm .jackpot-progress__segment--2 .jackpot-progress__line {

    animation: progress-line-finished 1.2s ease-in-out forwards

}



.jackpot-progress--hot {

    --progress-color: #751d5d;

    --progress-text-color-active: #fae97c;

    --point-background-color: #421565;

    --point-border-color: #751d5d

}



.jackpot-progress--hot.jackpot-progress--medium .jackpot-progress__prize:before {

    height: 42px;

    transform: translate(-49%, -59%);

    width: 48px

}



.jackpot-progress--hot.jackpot-progress--large .jackpot-progress__prize:before {

    animation: flash-track 1.2s ease-in-out 1.2s infinite alternate;

    border-radius: 15%;

    content: "";

    height: 65px;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-38%, -57%);

    width: 70px;

    z-index: -1

}



.jackpot-progress--hot .jackpot-progress__hero {

    animation: progress-hero-run-3 1.2s ease-in-out forwards, bounce-hero .8s ease-in-out 1.2s infinite alternate

}



.jackpot-progress--hot .jackpot-progress__track {

    animation: flash-track .8s ease-in-out 1.2s infinite alternate

}



.jackpot-progress--hot .jackpot-progress__segment--1 {

    --segment-line-color: linear-gradient(90deg, #ff9b25, #f7de20);

    --progress-text-color: var(--progress-text-color-active);

    --point-border-color: #f7de20

}



.jackpot-progress--hot .jackpot-progress__segment--1 .jackpot-progress__line {

    transform: scaleX(1)

}



.jackpot-progress--hot .jackpot-progress__segment--1 .jackpot-progress-point,

.jackpot-progress--hot .jackpot-progress__segment--1 .jackpot-progress-point__inner,

.jackpot-progress--hot .jackpot-progress__segment--1 .jackpot-progress-point__inner svg path {

    transition: none

}



.jackpot-progress--hot .jackpot-progress__segment--2 {

    --segment-line-color: linear-gradient(90deg, #f7de20, #f44);

    --progress-text-color: var(--progress-text-color-active);

    --point-border-color: #f44

}



.jackpot-progress--hot .jackpot-progress__segment--2 .jackpot-progress__line {

    transform: scaleX(1)

}



.jackpot-progress--hot .jackpot-progress__segment--2 .jackpot-progress-point,

.jackpot-progress--hot .jackpot-progress__segment--2 .jackpot-progress-point__inner,

.jackpot-progress--hot .jackpot-progress__segment--2 .jackpot-progress-point__inner svg path {

    transition: none

}



.jackpot-progress--hot .jackpot-progress__segment--3 {

    --segment-line-color: linear-gradient(90deg, #f44, #ff0e0e);

    --progress-text-color: var(--progress-text-color-active);

    --point-border-color: #ff0e0e

}



.jackpot-progress--hot .jackpot-progress__segment--3 .jackpot-progress__line {

    animation: progress-line-finished 1.2s ease-in-out forwards

}



.jackpot-progress--hot .jackpot-progress__segment--4 {

    --segment-line-color: linear-gradient(90deg, #ff0e0e, #f44)

}



.jackpot-progress--hot .jackpot-progress__segment--4 .jackpot-progress__line {

    animation: bounce-width .8s ease-in-out infinite alternate;

    animation-delay: 1.2s;

    transform: scaleX(1);

    width: 0;

    will-change: width

}



@keyframes bounce-width {

    0% {

        width: 5%

    }



    to {

        width: 25%

    }

}



.jackpot-progress--hot .jackpot-progress__segment--4 .jackpot-progress__label {

    animation: flash-color .8s ease-in-out infinite alternate;

    animation-delay: 1.2s

}



@keyframes flash-color {

    0% {

        color: var(--progress-text-color)

    }



    to {

        color: var(--progress-text-color-active)

    }

}



.jackpot-progress--small {

    --progress-height: 8px;

    padding: 0

}



.jackpot-progress__track {

    background-color: var(--progress-color);

    border-radius: 8px;

    display: flex;

    height: var(--progress-height);

    justify-content: space-between;

    position: relative;

    transition: background-color .8s ease;

    width: 100%

}



.jackpot-progress__segment {

    padding: 0 calc(var(--point-size) / 2 - var(--point-border-width));

    position: relative

}



.jackpot-progress__segment--1,

.jackpot-progress__segment--4 {

    width: 16%

}



.jackpot-progress__segment--2,

.jackpot-progress__segment--3 {

    width: 34%

}



.jackpot-progress__segment--1 {

    padding-left: 0

}



.jackpot-progress__segment--1 .jackpot-progress__line,

.jackpot-progress__segment--1 .jackpot-progress__line-wrapper {

    border-radius: 8px 0 0 8px

}



.jackpot-progress__segment--4 {

    padding-right: 0

}



.jackpot-progress__segment--4 .jackpot-progress__line,

.jackpot-progress__segment--4 .jackpot-progress__line-wrapper {

    border-radius: 0 8px 8px 0

}



.jackpot-progress__segment--4 .jackpot-progress-point {

    display: none

}



.jackpot-progress--small .jackpot-progress__segment {

    --point-size: 20px;

    --point-inner-size: 12px;

    width: 25%

}



.jackpot-progress__line,

.jackpot-progress__line-wrapper {

    height: var(--progress-height);

    overflow: hidden;

    position: relative

}



.jackpot-progress__line {

    backface-visibility: hidden;

    background: var(--segment-line-color);

    transform: scaleX(0);

    transform-origin: left;

    width: 100%;

    will-change: transform

}



.jackpot-progress__label {

    color: var(--progress-text-color);

    font-size: 12px;

    font-weight: 600;

    margin: 8px 0 0;

    padding: 0 12px;

    text-align: center;

    text-transform: uppercase;

    transition: color .8s ease

}



.jackpot-progress--medium .jackpot-progress__label {

    font-size: 8px;

    line-height: 8px;

    padding: 0

}



.jackpot-progress--small .jackpot-progress__label {

    display: none

}



.jackpot-progress__hero {

    backface-visibility: hidden;

    height: 67px;

    left: 15%;

    position: absolute;

    top: -58px;

    transform: translate(-50%) translateZ(0);

    transition: left 1.2s ease-in-out;

    will-change: transform, left;

    z-index: 3

}



.jackpot-progress__prize {

    position: absolute;

    transform: translate(-50%);

    z-index: 1

}



.jackpot-progress--small .jackpot-progress__prize {

    height: var(--point-size);

    right: 0;

    top: 50%;

    transform: translateY(-50%);

    width: var(--point-size)

}



.jackpot-progress--small .jackpot-progress__prize img {

    height: 18px;

    width: 18px

}



.jackpot-progress--small .jackpot-progress__prize:after {

    background-color: var(--progress-color);

    border-radius: 50%;

    content: "";

    display: block;

    height: var(--point-size);

    position: absolute;

    right: -1px;

    top: -1px;

    width: var(--point-size);

    z-index: -1

}



.jackpot-progress--medium .jackpot-progress__prize {

    left: 65%;

    top: -45px

}



.jackpot-progress--medium .jackpot-progress__prize img {

    height: 52px

}



.jackpot-progress--large .jackpot-progress__prize {

    left: 50%;

    padding-left: calc(var(--point-size) / 2 - var(--point-border-width));

    top: -65px

}



.jackpot-progress--large .jackpot-progress__prize img {

    height: 76px

}



@keyframes progress-line-finished {

    to {

        transform: scaleX(1)

    }

}



@keyframes progress-hero-run-1 {

    0% {

        left: -15%;

        opacity: 0

    }



    to {

        left: 60%;

        opacity: 1

    }

}



@keyframes progress-hero-run-small-1 {

    0% {

        left: -15%;

        opacity: 0

    }



    to {

        left: 45%;

        opacity: 1

    }

}



@keyframes progress-hero-run-2 {

    0% {

        left: -15%

    }



    to {

        left: 50%

    }

}



@keyframes progress-hero-run-3 {

    0% {

        left: -15%

    }



    to {

        left: 70%

    }

}



@keyframes bounce-hero {

    0% {

        transform: translate(-50%)

    }



    to {

        transform: translate(-35%)

    }

}



@keyframes flash-track {

    0% {

        box-shadow: inset 0 0 4px #771b701a, 0 0 8px #ff44440d, 0 0 32px #ff44441a

    }



    to {

        box-shadow: inset 0 0 4px #771b70a3, 0 0 8px #ff44447a, 0 0 32px #ff4444a3

    }

}



:root {

    --point-size: 34px;

    --point-inner-size: 24px;

    --point-background-color: #105266;

    --point-border-color: #252c45

}



.jackpot-progress-point {

    align-items: center;

    background-color: var(--point-background-color);

    border: 2px solid var(--point-border-color);

    border-radius: 50%;

    color: var(--point-border-color);

    display: flex;

    height: var(--point-size);

    justify-content: center;

    position: absolute;

    right: calc(var(--point-size) / 2 * -1);

    top: 50%;

    transform: translateY(-50%);

    transition: color .3s ease-in-out, border .3s ease-in-out, background-color .3s ease-in-out;

    width: var(--point-size);

    z-index: 2

}



.jackpot-progress-point__inner {

    align-items: center;

    border: 1px solid var(--point-border-color);

    border-radius: 50%;

    display: flex;

    height: var(--point-inner-size);

    justify-content: center;

    transition: border .3s ease-in-out;

    width: var(--point-inner-size)

}



.jackpot-progress-point__inner svg path {

    fill: var(--point-border-color);

    transition: fill .3s ease-in-out

}



.jackpot-progress-point img {

    height: 100%;

    width: 100%

}



.jackpot-progress-point--small {

    --point-size: 20px;

    --point-inner-size: 12px

}



.jackpot-progress-point--small svg {

    height: 8px;

    width: 5px

}



.bonus-badge {

    align-items: center;

    background: #1fb47a;

    border-radius: 20px;

    color: #fff;

    display: flex;

    font-size: 8px;

    gap: 2px;

    justify-content: center;

    line-height: 1;

    padding: 2px 3px

}



.bonus-badge img {

    height: 10px;

    width: 10px

}



.bonus-badge--medium img {

    height: 16px;

    width: 16px

}



.bonus-badge--tooltip {

    filter: drop-shadow(0 0 1px rgba(0, 0, 0, .32)) drop-shadow(0 4px 8px rgba(0, 0, 0, .24));

    font-size: 10px;

    gap: 4px;

    height: 24px;

    padding: 4px 8px;

    position: relative;

    width: 62px

}



.bonus-badge--tooltip:after {

    background-color: inherit;

    border: inherit;

    border-radius: 0 0 0 .25em;

    clip-path: polygon(0 0, 100% 100%, 0 100%);

    content: "";

    height: 12px;

    left: calc(50% - 6px);

    position: absolute;

    top: calc(100% - 7px);

    transform: rotate(-45deg);

    width: 12px

}



.bonus-badge--tooltip img {

    height: 19px;

    width: 19px

}



.notifications {

    max-width: 408px;

    padding: 24px;

    position: fixed;

    right: 0;

    top: 0;

    transform: translateZ(0);

    -webkit-transform: translateZ(0);

    width: 100%;

    z-index: 1000000000

}



.notifications .m-message {

    overflow: hidden;

    position: relative;

    transform-origin: right center

}



@media (max-width: 460px) {

    .notifications {

        padding: 8px

    }

}



.notifications:empty {

    pointer-events: none

}



.notifications>* .m-message {

    margin-bottom: 8px

}



.notifications-enter-active,

.notifications-leave-active {

    transition: max-height .3s, opacity .2s

}



.notifications-enter-active .m-message,

.notifications-leave-active .m-message {

    transition: transform .25s

}



.notifications-enter-from,

.notifications-leave-to {

    max-height: 0;

    opacity: 0

}



.notifications-enter-from .m-message,

.notifications-leave-to .m-message {

    transform: scale(.5)

}



.bottom-action-buttons {

    --action-button-size: 60px;

    align-items: flex-end;

    display: inline-flex;

    flex-direction: column;

    gap: 12px;

    transition: bottom .3s

}



.bottom-communication-button .m-button,

.bottom-communication-button.m-button {

    border-radius: calc(var(--action-button-size) / 2);

    box-shadow: 0 4px 12px #0000004d;

    color: var(--color-white);

    height: var(--action-button-size);

    overflow: hidden;

    padding: 16px;

    position: relative;

    transition: all .5s cubic-bezier(.18, .89, .32, 1.28) 50ms;

    width: var(--action-button-size)

}



.mobile .bottom-communication-button .m-button,

.mobile .bottom-communication-button.m-button {

    --action-button-size: 48px;

    padding: 11px

}



.bottom-communication-button .m-button .m-icon,

.bottom-communication-button.m-button .m-icon {

    fill: currentcolor;

    color: var(--color-white);

    display: inline-block;

    flex-shrink: 0;

    font-size: 2rem;

    height: 1em;

    -webkit-user-select: none;

    user-select: none;

    width: 1em

}



.mobile .bottom-communication-button .m-button .m-icon,

.mobile .bottom-communication-button.m-button .m-icon {

    height: 26px;

    width: 26px

}



.chat-widget {

    opacity: 1;

    transform: scale(1);

    transition: all .2s

}



.chat-widget-opened {

    opacity: 0;

    transform: scale(.5)

}



#chat-widget-minimized {

    display: none !important

}



.cookies-popup {

    align-items: center;

    background: var(--color-dark-grey-2);

    display: flex;

    gap: 16px;

    justify-content: center;

    padding: 12px 16px calc(12px + env(safe-area-inset-bottom))

}



.cookies-popup a {

    color: var(--color-pr500)

}



.cookies-popup .m-button {

    white-space: nowrap

}



.cookies-popup--mobile-tabbar {

    padding: 8px 16px

}



.cookies-popup--mobile-redesign {

    border-radius: 12px;

    box-shadow: 0 0 1px #00000052, 0 12px 24px #0000003d;

    justify-content: space-between;

    margin: 8px 8px calc(8px + env(safe-area-inset-bottom));

    padding: 8px 16px

}



.cookies-popup--mobile-redesign.cookies-popup--mobile-tabbar {

    margin: 0 8px 20px

}



.cookies-popup .m-button-content {

    color: #10221a

}



.play-demo-modal .m-modal-content {

    align-items: center;

    display: flex;

    flex-direction: column;

    justify-content: center;

    position: relative

}



.play-demo-modal .m-modal-footer {

    flex-direction: column;

    gap: 8px

}



.recent-big-wins-modal .m-modal-content {

    padding: 0

}



.bets-filters.m-tabs {

    border-bottom: none

}



.bets-filters.m-tabs .m-tabs-item {

    flex: none

}



.bets-type-switch {

    min-width: 288px

}



.bets-type-switch-small {

    width: 100%

}



.bets-header {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 4px;

    border-bottom: 1px solid var(--color-dark-grey-2);

    margin-bottom: 12px

}



@media (min-width: 768px) {

    .bets-header {

        margin-bottom: 16px

    }

}



.bets-header-small {

    flex-direction: column-reverse

}



.bets-table-live {

    min-height: 300px

}



.bets-table {

    animation: fade .6s ease-in;

    min-height: 400px

}



.bets-table .m-currency-converted {

    min-width: initial !important

}



.bets-table__no-data {

    font-weight: 400;

    font-size: 14px;

    line-height: 145%;

    color: var(--color-mid-grey-5);

    padding: 8px 16px

}



.bets-body {

    min-width: 100%;

    overflow-x: auto;

    background-color: var(--base-background)

}



.bets-body--shown {

    min-height: 400px

}



.bets-spinner-box {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

    min-height: 422px

}



.mobile .bets-spinner-box {

    min-height: 540px

}



.provider-card {

    display: flex;

    justify-content: center;

    align-items: center;

    background: var(--color-dark-grey-1);

    box-shadow: 0 0 1px #00000052, 0 40px 64px #0000003d;

    border-radius: 12px;

    height: 68px;

    cursor: pointer

}



@media (min-width: 960px) {

    .provider-card {

        height: 88px

    }

}



.provider-card__img {

    max-width: 80%;

    max-height: 36px

}



@media (min-width: 960px) {

    .provider-card__img {

        max-width: 156px;

        max-height: 56px

    }

}



.providers-section-header {

    flex: 1

}



.feedback-section {

    padding: 16px;

    background: var(--color-dark-grey-1);

    border-radius: 16px;

    display: flex;

    flex-direction: column;

    gap: 16px

}



.desktop .feedback-section {

    min-height: 190px;

    padding: 24px;

    gap: 32px;

    flex-direction: row;

    justify-content: space-between

}



.feedback-section-column {

    width: 100%

}



.feedback-header {

    text-align: left;

    display: flex;

    gap: 10px;

    flex-direction: column

}



.feedback-header--centered {

    text-align: center

}



.desktop .feedback-header--centered {

    text-align: left

}



.feedback-form-submit {

    display: flex;

    align-items: center;

    gap: 1rem

}



.feedback-form-submit--small {

    flex-direction: column;

    gap: .5rem

}



.feedback-form-submit--small .m-button {

    width: 100%

}



.feedback-form-submit span {

    font-size: 12px;

    font-weight: 500;

    color: var(--color-mid-grey-3)

}



.feedback-form .m-form-field {

    margin-bottom: 8px

}



.feedback-form .m-form-field--success {

    --base: none !important;

    --lighten: none !important

}



.feedback-form-textarea-wrapper {

    position: relative

}



.feedback-form-textarea-wrapper .m-form-field-description {

    position: absolute;

    bottom: 0

}



.feedback-form-textarea .m-input-content {

    height: 100px

}



.feedback-form-textarea textarea {

    font-family: Montserrat, Verdana, sans-serif;

    line-height: 1.6;

    height: 108px

}



.feedback-captcha {

    margin: 8px 0

}



.lobby-payments {

    width: 100%;

    height: 46px;

    display: flex;

    gap: 44px;

    overflow-y: hidden

}



.lobby-payments-item {

    display: flex;

    justify-content: space-between;

    align-items: center;

    height: 100%;

    flex-grow: 1

}



.lobby-payments-shallow {

    height: 46px;

    gap: 18px;

    padding-top: 0;

    padding-bottom: 0

}



.m-icon.m-game-heart {

    flex-shrink: 0;

    width: 24px;

    height: 24px;

    transform-origin: center;

    cursor: pointer;

    color: var(--color-light-grey-3);

    transition: color .25s ease-in-out;

    -webkit-user-select: none;

    user-select: none

}



.m-icon.m-game-heart:hover {

    color: var(--color-light-grey-5)

}



.m-icon.m-game-heart--favorite {

    color: var(--color-white)

}



.m-icon.m-game-heart--absolute {

    position: absolute;

    right: 0;

    padding: 8px 4px;

    top: -38px;

    height: 40px;

    width: 32px

}



.m-card-badges {

    position: absolute;

    z-index: 9;

    top: 8px;

    left: 8px;

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    gap: 4px

}



.m-card-badges--mobile {

    left: 6px

}



.m-card-badges--mobile>.m-badge {

    max-width: 76px;

    white-space: nowrap;

    overflow: hidden;

    justify-content: flex-start;

    position: relative

}



.m-card-badges--mobile>.m-badge:after {

    content: "";

    position: absolute;

    top: 0;

    right: -1px;

    width: 8px;

    height: 100%;

    border-radius: 100%;

    background: linear-gradient(270deg, var(--background) 0%, rgba(53, 91, 226, 0) 100%)

}



@media (min-width: 768px) {



    .bets-table-wrapper .bets-table-row,

    .bets-table-wrapper .bets-table-header {

        grid-template-columns: 150px 98px repeat(auto-fit, minmax(98px, 1fr))

    }

}



@media (min-width: 960px) {



    .bets-table-wrapper .bets-table-row,

    .bets-table-wrapper .bets-table-header {

        grid-template-columns: 280px 200px repeat(auto-fit, minmax(90px, 1fr))

    }

}



.bets-table-wrapper__small .bets-table-row,

.bets-table-wrapper__small .bets-table-header {

    grid-template-columns: minmax(60%, 1fr) minmax(110px, max-content)

}



.bets-table-header {

    background: #0000;

    display: grid;

    grid-auto-flow: column;

    padding: 6px 16px 7px

}



.bets-table-header .bets-table-cell {

    color: var(--color-mid-grey-1);

    font: var(--font-body-regular-s)

}



.bets-table-header .bets-table-cell-payout {

    text-align: right

}



.bets-game {

    cursor: pointer;

    display: inline-grid;

    grid-template-columns: max-content auto;

    align-items: center;

    gap: 8px;

    font-weight: 600;

    overflow: hidden;

    position: relative

}



.bets-game:hover {

    color: var(--color-pr500)

}



.bets-game-name {

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

    font: var(--font-body-bold-s);

    margin-bottom: -2px

}



.bets-game-player {

    color: var(--color-light-grey-1);

    font: var(--font-body-regular-xs)

}



.bets-game-media {

    position: relative;

    width: 20px;

    height: 20px;

    border-radius: 4px

}



.mobile .bets-game-media {

    width: 32px;

    height: 32px

}



.bets-game-media img,

.bets-game-media video {

    object-fit: cover;

    width: 100%;

    height: 100%;

    transition: opacity .2s

}



.bets-game-media img[preloading=true],

.bets-game-media video[preloading=true] {

    opacity: .25

}



.bets-game-loader {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    right: 0;

    left: 0;

    bottom: 0;

    display: flex;

    align-items: center;

    justify-content: center

}



.bets-payout {

    font-weight: 700;

    font-size: 12px;

    text-align: right;

    width: 100%

}



.bets-payout-green {

    font-weight: 700;

    color: var(--color-su500)

}



.bets-payout .m-currency-converted {

    text-align: right

}



.bets-payout .m-currency-converted-hidden {

    right: 0;

    left: unset

}



.bets-payout .m-currency-converted-primary {

    justify-content: flex-end

}



.bets-player {

    display: flex;

    align-items: center;

    gap: 6px;

    padding-left: 1px;

    color: var(--color-light-grey-1)

}



.bets-player--clickable {

    cursor: pointer

}



.bets-player-name {

    font: var(--font-body-regular-s);

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis

}



.bets-small-payout {

    display: flex;

    align-items: flex-end;

    flex-direction: column;

    width: 100%;

    gap: 4px;

    position: relative

}



.bets-small-payout-top {

    display: flex;

    gap: 4px

}



.bets-small-payout .m-currency-converted {

    text-align: right

}



.bet-time {

    font-weight: 500;

    font-size: 12px;

    color: var(--color-mid-grey-3)

}



.bets-table-row {

    --bet-row-background: var(--color-dark-grey-0);

    display: grid;

    grid-auto-flow: column;

    border-radius: 4px;

    height: 40px;

    padding: 0 16px;

    background: var(--bet-row-background);

    gap: 4px;

    cursor: pointer;

    width: 100%

}



.bets-table-row--small {

    height: 48px;

    margin-bottom: 6px;

    padding: 0 8px

}



.bets-table-row--odd {

    --bet-row-background: var(--color-dark-grey-1);

    --bet-row-gradient: var(--gradient-dark-grey-1-right);

    border-radius: 8px

}



.bets-table-cell {

    display: flex;

    align-items: center;

    color: var(--color-white);

    font-weight: 400;

    font-size: 14px;

    line-height: 1;

    white-space: nowrap

}



.bets-table-cell:not(:last-child) {

    overflow: hidden

}



.bets-table-cell:last-child {

    justify-content: flex-end

}



.bets-table-cell:not(:last-child):not(.bets-table-cell-bet) {

    position: relative

}



.bets-table-cell:not(:last-child):not(.bets-table-cell-bet):after {

    content: "";

    position: absolute;

    width: 20px;

    right: 0;

    top: 0;

    bottom: 0;

    background: var(--bet-row-gradient)

}



.bets-table-cell .m-currency-converted {

    pointer-events: none

}



.bets-table-live {

    --row-height: 40px;

    position: relative;

    width: 100%;

    overflow: hidden

}



.mobile .bets-table-live {

    --row-height: 48px

}



.bets-table-live__container {

    width: 100%;

    margin-top: calc(0px - var(--row-height));

    position: relative;

    overflow-anchor: none

}



.slide-list-move,

.slide-list-enter-active,

.slide-list-leave-active {

    transition: all .4s ease-out

}



.slide-list-leave-active {

    position: absolute

}



.footer-socials-icon-list {

    align-items: center;

    display: flex;

    gap: 8px

}



.nav-sidebar-smartico-wrapped {

    align-items: center;

    display: flex;

    flex-flow: column

}



.m-game-card:not(.m-game-card--skeleton):hover .m-game-overlay,

.m-game-card:not(.m-game-card--skeleton):hover .m-game-card__top-right {

    opacity: 1

}



.m-game-card:not(.m-game-card--skeleton):hover .m-game-footer--large:after {

    background-color: var(--gradient-dark-grey-0-right)

}



.m-game-card:not(.m-game-card--skeleton):hover .m-game-footer-left--large:after {

    background: var(--gradient-dark-grey-0-right)

}



.m-game-card:not(.m-game-card--skeleton):hover .m-card-thumb {

    transform: scale(1.1)

}



.m-game-overlay {

    position: absolute;

    bottom: 0;

    left: 0;

    z-index: 2;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 8px;

    width: 100%;

    height: 100%;

    overflow: hidden;

    background-color: var(--color-b060);

    opacity: 0;

    transition: all .3s ease

}



@media (max-width: 1250px) {

    .main-nav .nav-logo {

        padding-left: .5rem;

        padding-left: 1rem

    }

}



@media (max-width: 992px) {

    .lobby-banner {

        --aspect-ratio: initial;

        aspect-ratio: initial !important;

        min-height: min(500px, 50vh);

        display: flex;

        align-items: center;

        justify-content: center

    }

}



.lobby-banner__content {

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center

}



.lobby-banner__image img {

    min-height: 400px

}



.lobby-banner__text {

    transform: translateY(15%);

    display: flex;

    flex-direction: column;

    gap: 1rem;

    text-align: center

}



@media (max-width: 992px) {

    .lobby-banner__text {

        transform: translateY(0);

        min-width: 320px

    }

}



@media (max-width: 992px) {

    .lobby-banner__text {

        min-width: 280px

    }

}



.lobby-banner__text .Header-Black-S {

    font-size: 3.125rem

}



@media (max-width: 992px) {

    .lobby-banner__text .Header-Black-S {

        font-size: 2rem

    }

}



.lobby-banner__text .Body-Semi-Bold-M {

    margin-top: .5rem;

    font-size: 1.85rem

}



@media (max-width: 992px) {

    .lobby-banner__text .Body-Semi-Bold-M {

        font-size: 1rem

    }

}



.lobby-banner__text>* {

    overflow: initial

}



.lobby-banner__text a {

    margin-top: 1.5rem;

    border-radius: 1000px

}



@media (max-width: 992px) {

    .lobby-banner__text a {

        margin-top: 0

    }

}



.lobby-banner__text a .m-button-content {

    padding: 8px 53px;

    font-size: 1.25rem;

    font-weight: 800

}



@media (max-width: 992px) {

    .lobby-banner__text a .m-button-content {

        font-size: 1rem

    }

}



.lobby-banner p {

    margin-bottom: 0

}



.common-module_wrapper_uFz8g {

    display: flex;

    flex-direction: column;

    align-items: center;

    height: 100%

}



.common-module_header_BFfLl {

    display: flex;

    align-items: center;

    position: relative;

    width: 100%

}



.common-module_headerButton_gvRXx {

    position: absolute;

    left: 24px;

    top: 50%;

    transform: translateY(-50%)

}



.common-module_headerTitle_JSZAA {

    margin: auto;

    padding: 20px 65px;

    width: 100%;

    text-align: center

}



.common-module_underlined_CAzKA {

    border-bottom: 1px solid var(--color-dark-grey-2)

}



.common-module_content_L1ngN {

    width: 100%;

    padding: 0 24px;

    display: flex;

    flex-direction: column

}



.mobile .common-module_content_L1ngN {

    padding: 0 16px

}



.common-module_contentContainer_gAgoi {

    width: 100%;

    max-width: 428px;

    margin: 0 auto

}



.common-module_statusIcon_VstNe {

    margin: 24px auto;

    padding: 16px;

    border-radius: 50%;

    background-color: var(--color-dark-grey-2);

    display: inline-block

}



.common-module_statusIcon_VstNe>svg {

    width: 32px

}



.common-module_title_YLMPS {

    text-align: center;

    margin: 0 0 8px

}



.common-module_desc_GcVej {

    text-align: center;

    font-size: 16px;

    font-weight: 500;

    line-height: 24px;

    color: var(--color-mid-grey-5);

    margin-top: 0;

    margin-bottom: 16px

}



.mobile .common-module_desc_GcVej {

    font-size: 14px;

    line-height: 22.4px

}



.common-module_form_VZZh_ {

    margin-bottom: 16px

}



.common-module_field_etXUF+.common-module_field_etXUF {

    margin-top: 16px

}



.common-module_fieldIcon_Ul99B {

    width: 28px !important

}



.common-module_button_wzP0D {

    margin: 0 0 8px

}



.common-module_info_pfb9b {

    font-size: 14px;

    font-weight: 600;

    line-height: 22.4px;

    color: var(--color-mid-grey-3);

    text-align: center;

    margin-top: 0;

    margin-bottom: 20px

}



.common-module_info_pfb9b span {

    cursor: pointer;

    color: var(--color-pr500)

}



.common-module_resetPasswordForm_EbwZX .m-icon,

.common-module_createPasswordForm_WgiKw .m-icon {

    width: 28px

}



.common-module_error_CvOwE {

    margin-top: 10px;

    font-size: 12px;

    color: var(--color-field-basic-description-error)

}



.common-module_checkbox_WdpUg {

    position: relative

}



.common-module_actionsBlock_HQxPC {

    margin-top: 24px

}



.common-module_actionsBlock_HQxPC>button {

    width: 100%

}



.common-module_modalRewrite_ncBMC.m-modal-container {

    overflow: hidden;

    max-height: 100% !important

}



.common-module_modalRewrite_ncBMC .m-modal-content {

    padding: 0;

    height: 100%

}



.common-module_modalRewrite_ncBMC .m-modal-close {

    z-index: 3

}



.common-module_authTitle_L8Tee {

    text-align: center

}



.common-module_loginTitle_rGinu {

    padding: 16px 0 23px

}



.common-module_captcha_tIj32 {

    margin: 10px 0

}



.Preloader_content_NccI9 {

    display: flex;

    justify-content: center;

    padding: 30px

}



@media (max-width: 1248px) {

    .Preloader_content_NccI9 {

        position: absolute;

        top: calc(50vh - 48px);

        right: calc(50vw - 48px)

    }

}



.TabsSection_tabsBlock_RGNmU {

    width: 100%;

    padding: 15px 65px 15px 15px;

    border-bottom: 1px solid var(--color-dark-grey-3);

    height: 64px;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 2;

    background: var(--color-modal-background)

}



.mobile .TabsSection_tabsBlock_RGNmU {

    position: fixed

}



.LoginButton_restoreAction_VI_Pw {

    text-align: center;

    padding: 4px;

    margin-top: 10px;

    font-size: 14px;

    font-weight: 600;

    color: var(--color-pr500)

}



.LoginButton_restoreAction_VI_Pw span {

    cursor: pointer

}



.LoginForm_invalid_trEkw .m-form-field .m-input {

    border-color: var(--color-input-basic-error-border) !important

}



.bonus-badge {

    font-size: 8px;

    line-height: 1;

    padding: 2px 3px;

    color: var(--color-light-grey-5);

    border-radius: 20px;

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 2px;

    background: var(--color-in400)

}



.bonus-badge--green {

    background: var(--color-su600)

}



.bonus-badge img {

    width: 10px;

    height: 10px

}



.bonus-badge--medium {

    padding: 3px

}



.bonus-badge--medium img {

    width: 16px;

    height: 16px

}



.bonus-badge--tooltip {

    font-size: 10px;

    padding: 4px 8px;

    gap: 4px;

    width: 62px;

    height: 24px;

    position: relative;

    filter: drop-shadow(0px 0px 1px rgba(0, 0, 0, .32)) drop-shadow(0px 4px 8px rgba(0, 0, 0, .24))

}



.bonus-badge--tooltip:after {

    content: "";

    height: 12px;

    width: 12px;

    background-color: inherit;

    border: inherit;

    position: absolute;

    top: calc(100% - 7px);

    left: calc(50% - 6px);

    clip-path: polygon(0% 0%, 100% 100%, 0% 100%);

    transform: rotate(-45deg);

    border-radius: 0 0 0 .25em

}



.bonus-badge--tooltip img {

    width: 19px;

    height: 19px

}



.RegistrationButton_actions_Oohu8 {

    margin-top: 46px;

    position: relative

}



.RegistrationButton_badge_KSbxa {

    position: absolute !important;

    top: -30px;

    right: 0;

    left: 0;

    margin: 0 auto

}



.RegistrationFooter_fixed_AB7Ht>div {

    padding: 28px 24px;

    gap: 8px;

    display: flex;

    flex-direction: column

}



.mobile .RegistrationFooter_fixed_AB7Ht>div {

    padding: 16px

}



.RegistrationFooter_fixed_AB7Ht>div>*:first-child {

    margin-top: 0 !important

}



.RegistrationFooter_fixed_AB7Ht>div>.registrationButton {

    margin-top: 8px

}



.RegistrationFooter_fixed_AB7Ht>div>.registrationButton.buttonWithBonus {

    margin-top: 28px

}



.RegistrationFooter_fixed_AB7Ht .RegistrationFooter_content_ofxYd {

    position: absolute;

    bottom: 0;

    left: 50%;

    transform: translate(-50%);

    width: 100%;

    max-width: 476px;

    background: var(--color-dark-grey-1);

    z-index: 1

}



.RegistrationFooter_fixed_AB7Ht .RegistrationFooter_gap_LFTvt {

    opacity: 0;

    position: relative;

    overflow: hidden

}



.RegistrationFooter_fixed_AB7Ht .RegistrationFooter_gap_LFTvt:after {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 1

}



.RegistrationPromo_promo_iqsko {

    display: flex;

    flex-direction: column;

    align-items: center;

    font-weight: 700;

    font-size: 32px;

    line-height: 39px;

    text-align: center

}



.RegistrationPromo_bonus_UGvTx {

    color: var(--color-pr500)

}



.AuthContainer_container_Yc33j {

    padding-top: 64px;

    max-height: calc(100vh - 48px)

}



.AuthContainer_container_Yc33j .m-tabs {

    height: 64px;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 2;

    background: var(--color-modal-background)

}



@media (max-width: 1248px) {

    .AuthContainer_container_Yc33j {

        max-height: 100%

    }



    .AuthContainer_container_Yc33j .m-tabs {

        position: fixed

    }

}



.AuthContainer_header_sF6Fc {

    width: 100%;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 2;

    background: var(--color-modal-background)

}



.AuthContainer_content_dDdZq {

    padding: 16px 24px

}



.mobile .AuthContainer_content_dDdZq {

    padding: 16px

}



@font-face {

    font-family: Atlassian Sans;

    font-style: normal;

    font-weight: 400 653;

    font-display: swap;

    src: local("AtlassianSans"), local("Atlassian Sans Text"), url(chrome-extension://liecbddmkiiihnedobmlmillhodjkdmb/fonts/AtlassianSans-latin.woff2) format("woff2");

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD

}



.info-page-content {

    user-select: none;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    display: flex;

    flex-direction: column

}



.info-page-content h1 {

    font-size: 32px;

    font-weight: 700;

    margin: 0 0 32px;

    color: var(--color-light-grey-5)

}



.info-page-content h3 {

    font-size: 24px;

    font-weight: 700;

    margin: 16px 0;

    color: var(--color-light-grey-5)

}



.info-page-content p {

    font-size: 16px;

    font-weight: 500;

    line-height: 1.5;

    margin: 0 0 40px;

    color: var(--color-light-grey-3)

}



.info-page-content a {

    color: #67f2c7

}



.info-page-content ul {

    margin-bottom: 0

}



.info-page-content li {

    position: initial;

    display: list-item;

    font-weight: 500;

    margin-bottom: 0;

    padding-left: 0;

    font-size: 16px;

    color: var(--color-light-grey-3)

}



@media (min-width: 320px) {

    .info-page-content li {

        padding-left: 0

    }

}



.info-page-content li:before {

    content: none

}



.m-accordion-item {

    --m-accordion-header-background: var(--color-accordion-header-background);

    --m-accordion-header-text-color: var(--color-accordion-header-text);

    --m-accordion-header-border-color: var(--color-accordion-header-border);

    --ic-padding: var(--accordion-header-icon-container-expand);

    --ic-border-radius: var(--accordion-header-icon-container-border-radius);

    --ic-background: var(--color-accordion-header-icon-container-background);

    --ic-border-width: var(--accordion-header-icon-container-border-size);

    --ic-border-color: var(--color-accordion-header-icon-container-border);

    --ic-size: var(--accordion-header-icon-container-icon-size);

    --ic-color: var(--color-accordion-header-icon-container-icon);

    background: var(--color-accordion-background);

    box-shadow: inset 0 0 0 var(--accordion-border-size) var(--color-accordion-border)

}



.m-accordion-item,

.m-accordion-item__header {

    border-radius: var(--accordion-border-radius)

}



.m-accordion-item__header {

    align-items: center;

    background: var(--m-accordion-header-background);

    box-shadow: inset 0 0 0 var(--accordion-header-border-size) var(--m-accordion-header-border-color);

    color: var(--m-accordion-header-text-color);

    cursor: pointer;

    display: flex;

    font: var(--font-accordion-header);

    gap: var(--accordion-header-spacing);

    justify-content: space-between;

    padding: var(--accordion-header-expand)

}



.m-accordion-item__header.m-gradient-border {

    --gradient-color: var(--m-accordion-header-border-color);

    --gradient-width: var(--accordion-header-border-size)

}



.m-accordion-item__header-title {

    align-items: center;

    display: flex;

    flex: 1;

    gap: var(--accordion-header-spacing);

    justify-content: space-between

}



.m-accordion-item__header-icon:empty {

    display: none

}



.m-accordion-item__header img,

.m-accordion-item__header svg {

    color: var(--ic-color);

    flex-shrink: 0;

    height: var(--ic-size);

    width: var(--ic-size)

}



.m-accordion-item--inverted .m-accordion-item__header {

    flex-direction: row-reverse

}



.m-accordion-item--inverted.m-accordion-item--label-inverted .m-accordion-item__header {

    justify-content: flex-end

}



.m-accordion-item--label-inverted .m-accordion-item__header-title {

    flex: unset;

    flex-direction: row-reverse

}



.m-accordion-item--active {

    --m-accordion-header-background: var(--color-accordion-header-background-active);

    --m-accordion-header-text-color: var(--color-accordion-header-text-active);

    --ic-color: var(--color-accordion-header-icon-container-icon-active);

    --m-accordion-header-border-color: var(--color-accordion-header-border-active)

}



.m-accordion-item:focus-visible,

.m-accordion-item:hover {

    --m-accordion-header-background: var(--color-accordion-header-background-hover);

    --m-accordion-header-text-color: var(--color-accordion-header-text-hover);

    --ic-color: var(--color-accordion-header-icon-container-icon-hover);

    --m-accordion-header-border-color: var(--color-accordion-header-border-hover)

}



.m-accordion-item--disabled {

    --m-accordion-header-background: var(--color-accordion-header-background-disabled);

    --m-accordion-header-text-color: var(--color-accordion-header-text-disabled);

    --ic-color: var(--color-accordion-header-icon-container-icon-disabled);

    cursor: not-allowed;

    pointer-events: none;

    -webkit-user-select: none;

    user-select: none

}



.m-accordion-item__content {

    border-radius: var(--accordion-border-radius);

    color: #e8fdf3;

    font: var(--font-accordion-description);

    padding: var(--accordion-description-expand)

}



.m-accordion {

    display: flex;

    flex-direction: column;

    gap: var(--spacing-xs)

}



.m-chevron {

    transition: transform .15s ease-in-out

}



.m-icon-empty {

    aspect-ratio: 1

}



.m-icon-loadable path {

    transition: opacity .2s ease-in-out

}



.m-icon-loadable[loading=true] path {

    opacity: 0

}



.m-icon-container {

    align-items: center;

    background: var(--ic-background);

    border-radius: var(--ic-border-radius);

    box-shadow: inset 0 0 0 var(--ic-border-width) var(--ic-border-color);

    color: inherit;

    display: flex;

    justify-content: center;

    padding: var(--ic-padding);

    transition: color .15s ease-in-out

}



.m-icon-container img,

.m-icon-container svg {

    height: var(--ic-size);

    width: var(--ic-size)

}



.m-accordion-item__content {

    display: none

}



.m-accordion-item.active .m-accordion-item__content {

    display: block

}



.tab__content {

    display: none

}



.m-tabs-item--active {

    display: block

}



@media (max-width: 768px) {

    .faq-page__tabs--selected.m-tabs {

        display: block

    }



    .faq-page__tabs .m-tabs-item--active>.m-tabs-item-content:after {

        display: none

    }

}



.info-page-content,

.info-page-content p {

    -webkit-user-select: auto;

    user-select: auto

}



.info-page-content p {

    margin: 0 0 20px

}



.info-page-content h3,

.info-page-content h2 {

    margin: 8px 0

}



.app #container {

    height: 100dvh

}



.nav-sidebar-header-wrap {

    rotate: 180deg

}



body {

    background: var(--color-background-page)

}



@media (max-width: 600px) {

    .info-page-content p {

        margin-bottom: 1rem

    }



    .footer {

        padding-bottom: 50px

    }

}



.nav-sidebar-expanded {

    min-height: 100dvh

}



.modal {

    display: none;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: #00000080;

    justify-content: center;

    align-items: center;

    opacity: 0;

    transition: opacity .3s ease

}



.modal .m-modal-container {

    position: static

}



.modal.show {

    display: flex;

    opacity: 1;

    z-index: 2000

}



.modal .modal-content {

    background-color: #1e1f23;

    padding: 1rem;

    border-radius: 5px;

    max-width: 500px;

    animation: slide-in .3s ease-out;

    position: relative

}



.modal .close-btn {

    position: absolute;

    top: 10px;

    right: 10px;

    font-size: 1.5rem;

    cursor: pointer

}



.modal.langs-modal .table-countries {

    display: grid;

    grid-template-columns: repeat(5, 1fr);

    gap: .75rem

}



.modal.langs-modal .table-countries .table-countries__title {

    line-height: 28px;

    text-transform: uppercase

}



.modal.langs-modal .table-countries li {

    padding: 1.25rem

}



.modal.langs-modal .table-countries li.selected a {

    position: relative

}



.modal.langs-modal .table-countries li.selected a:after {

    content: "";

    width: 20px;

    height: 20px;

    position: absolute;

    bottom: 40%;

    right: -5%;

    background-image: url(/build/assets/check-filled-BHTS-kOd.svg);

    background-position: center;

    background-size: cover

}



.modal.langs-modal .table-countries li a {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    color: inherit

}



.modal.langs-modal .table-countries li img {

    width: 30px;

    height: 30px;

    aspect-ratio: 1;

    border-radius: 6px;

    margin: 0 auto;

    border: 1px solid #7a918b

}



@keyframes slide-in {

    0% {

        transform: translateY(-50px);

        opacity: 0

    }



    to {

        transform: translateY(0);

        opacity: 1

    }

}



.cookie-modal {

    position: fixed;

    width: 80%;

    bottom: 0;

    left: 0;

    right: 0;

    background-color: #2c2d32;

    padding: 1.5rem 1.25rem;

    z-index: 2000;

    color: #fff;

    display: flex;

    flex-direction: row;

    line-height: 1.5;

    gap: 1.5rem;

    align-items: center;

    margin: 0 auto;

    border-top-left-radius: 16px;

    border-top-right-radius: 16px

}



@media (max-width: 768px) {

    .cookie-modal {

        width: 100%;

        flex-direction: column

    }

}



.cookie-modal>div {

    display: flex;

    flex-direction: column;

    gap: .5rem;

    flex: 1

}



.cookie-modal a {

    text-decoration: underline

}



.cookie-modal__title {

    font-size: 1rem;

    font-weight: 600

}



.cookie-modal p,

.cookie-modal__button {

    font-size: .875rem

}



.m-modal-container {

    box-shadow: none

}



.rating-stars {

    display: flex;

    flex-direction: row;

    gap: .25rem

}



.rating-stars__star,

.rating-stars__half,

.rating-stars__empty {

    width: 20px;

    height: 20px;

    background-size: cover;

    background-repeat: no-repeat

}



.rating-stars__star {

    background-image: url(/build/assets/star-full-Bbv8XLqn.svg)

}



.rating-stars__half {

    background-image: url(/build/assets/star-half-kVkH2Gfw.svg)

}



.rating-stars__empty {

    background-image: url(/build/assets/star-empty-De0bhzbi.svg)

}



.rating-stars__total {

    width: 20px;

    height: 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    font-weight: 600;

    font-size: .875rem

}



.platforms {

    display: flex;

    flex-direction: column;

    gap: .25rem;

    margin-bottom: .9375rem

}



.platforms .logo-wrapper {

    position: relative;

    display: inline-block

}



.platforms .logo-wrapper:after {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    width: 50px;

    height: 50px;

    border-radius: 50%;

    opacity: .8;

    filter: blur(13px);

    z-index: -1

}



.platforms .logo-wrapper .platforms__logo {

    display: block;

    max-width: 110px;

    height: 50px;

    border-radius: 1rem;

    filter: drop-shadow(2px 4px 6px black);

    width: 110px;

    object-fit: contain

}



.platforms__item {

    position: relative;

    z-index: 2;

    justify-content: space-between;

    gap: 1rem;

    background-color: #1e1f23;

    padding: 12px;

    border-radius: 8px;

    display: grid;

    grid-template-columns: repeat(1, 1fr 1fr 1fr);

    align-items: center

}



@media (max-width: 992px) {

    .platforms__item {

        display: grid;

        grid-template-columns: repeat(3, 1fr);

        width: auto

    }

}



@media (max-width: 556px) {

    .platforms__item {

        grid-template-columns: repeat(2, 1fr)

    }



    .platforms__item .platforms__actions {

        grid-column: span 2

    }

}



.platforms__item>div {

    display: flex;

    justify-content: center;

    gap: 1rem;

    width: 100%

}



@media (max-width: 992px) {

    .platforms__item>div {

        flex-direction: column;

        gap: 6px

    }

}



.platforms__header {

    display: flex;

    flex-direction: row

}



@media (max-width: 556px) {

    .platforms__header {

        justify-content: center;

        align-items: center

    }

}



.platforms__reviews {

    font-weight: 600;

    color: #03f295;

    display: flex;

    align-items: center;

    gap: .5rem;

    flex-direction: row

}



.platforms div.platforms__actions {

    display: flex;

    align-items: center;

    gap: 1rem

}



@media (max-width: 992px) {

    .platforms div.platforms__actions {

        flex-direction: column-reverse;

        gap: 6px

    }

}



.platforms div.platforms__actions a {

    font-size: .875rem;

    font-weight: 500;

    padding: .5rem .625rem;

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    line-height: 1;

    width: 100%;

    text-align: center;

    background-color: #03f295;

    color: #0f1b17

}



.platforms div.platforms__actions a.read {

    border: 1px solid #03f295;

    color: #dce0e6

}



@media (max-width: 992px) {

    .platforms div.platforms__actions a.read {

        border: none;

        text-decoration: underline

    }

}



.platforms__ratings {

    display: flex;

    flex-direction: row;

    gap: .5rem;

    align-items: center;

    font-size: .875rem;

    line-height: .5;

    color: #03f295;

    width: 100%;

    justify-content: center;

    font-weight: 600

}



@media (max-width: 992px) {

    .platforms__ratings {

        justify-content: start

    }

}



@media (max-width: 556px) {

    .platforms__ratings {

        justify-content: center

    }

}



.platforms__statistic {

    display: flex;

    align-items: center;

    gap: .5rem

}



.platforms__statistic .statistic__category {

    border-radius: 5px;

    background-color: #19ffac;

    color: #0f1b17;

    padding: 3px 5px;

    font-size: .875rem;

    font-weight: 500

}



.platforms__statistic .statistic__category.top {

    background-color: #40e6b1;

    color: #10221a

}



.platforms__statistic .statistic__category.new {

    background-color: #2e3c36;

    color: #c3f7e4

}



.platforms__statistic .statistic__total {

    font-weight: 700;

    font-size: 1.25rem;

    color: #e8fdf3

}



.visually-hidden {

    position: absolute !important;

    top: 0;

    width: .0625rem !important;

    height: .0625rem !important;

    margin: 0 !important;

    padding: 0 !important;

    overflow: hidden !important;

    -webkit-clip-path: inset(50%) !important;

    clip-path: inset(50%) !important;

    border: 0 !important;

    white-space: nowrap !important

}



.screenbox img {

    max-height: 350px

}



.error-page {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 20px;

    height: 100%

}



.nav-sidebar-socials a {

    color: #dce0e6

}



.float-image {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    margin: 1.5rem 0;

    gap: 1.25rem

}



.float-image .screenbox,

.float-image__content {

    flex: 1

}



@media (min-width: 768px) {

    .float-image {

        -webkit-box-orient: horizontal;

        -webkit-box-direction: normal;

        -ms-flex-direction: row;

        flex-direction: row;

        gap: 2.5rem;

        margin: 2rem 0;

        -webkit-box-align: center;

        -ms-flex-align: center;

        align-items: center

    }

}



.float-image figcaption {

    width: 100%

}



.float-image img {

    border-radius: 1.5rem

}



@media (min-width: 768px) {

    .float-image figcaption {

        width: 50%

    }

}



@media (min-width: 992px) {

    .float-image--inverted {

        -webkit-box-orient: horizontal;

        -webkit-box-direction: reverse;

        -ms-flex-direction: row-reverse;

        flex-direction: row-reverse

    }

}



@media (max-width: 768px) {

    .cookies-popup {

        display: flex;

        flex-direction: column;

        align-items: center;

        gap: .45rem;

        margin: 1rem .25rem

    }



    .cookies-popup .m-fs14 {

        font-size: .75rem

    }



    .cookies-popup .m-button-content {

        font-size: .75rem !important

    }



    .cookies-popup .m-button {

        padding: .35rem 1rem

    }

}



.author a {

    color: #03f295

}



.author .author__wrapper {

    background-color: #141518;

    padding: 1.5rem;

    border-radius: 24px;

    display: flex;

    flex-direction: column;

    gap: 1rem

}



.author__header {

    display: flex;

    flex-direction: row;

    gap: 1.5rem

}



@media (max-width: 768px) {

    .author__header {

        padding: 1rem

    }

}



@media (max-width: 556px) {

    .author__header {

        padding: .5rem

    }

}



.author__avatar {

    width: 50px;

    height: 50px;

    object-fit: cover;

    border-radius: 50%

}



.author__name {

    display: flex;

    flex-direction: row;

    align-items: center;

    gap: .5rem;

    line-height: 1.5em;

    font-weight: 600;

    margin-bottom: .5em

}



.author__name svg {

    width: 24px;

    height: 24px

}



.author__body {

    line-height: 1.5em;

    font-weight: 500

}



.author__body p {

    margin-bottom: 0

}



.author__footer {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: .5rem

}



@media (max-width: 768px) {

    .author__footer {

        flex-direction: column;

        align-items: start

    }

}



.author__socials {

    display: flex;

    gap: .625rem

}



.author__socials a {

    display: block

}



.author__socials img {

    width: 32px;

    height: 32px;

    aspect-ratio: 1

}



.author__link {

    text-decoration: underline;

    font-weight: 600;

    line-height: 1.5em

}



.author .paper-secondary {

    color: #98f7cf;

    margin-bottom: 0

}



.recent-big-wins-slider {

    overflow: hidden

}



.recent-big-wins-slider__cards {

    display: flex;

    gap: 12px

}



.recent-big-wins-slider__cards {

    display: flex;

    gap: 12px;

    transform: translate(0);

    transition: transform .5s ease

}

/* =========================================================
   Chicken Road Sisal Demo Hero Block
   ========================================================= */

.play-block.play-block--hero-demo {
  width: 100%;
  max-width: 1440px;
  margin: 24px auto 40px;
  padding: 0 24px;
}

.play-block--hero-demo .play-block__left {
  width: 100%;
}

.play-block--hero-demo .play-block__box {
  position: relative;
  width: 100%;
  min-height: 520px;
  border-radius: 18px;
  overflow: hidden;
  background: #07150f;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
  border: 1px solid rgba(0, 111, 47, 0.18);
}

/* background image */
.play-block--hero-demo .play-block__bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: none;
}

/* dark overlay for readability */
.play-block--hero-demo .play-block__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.62) 0%,
      rgba(0, 0, 0, 0.34) 45%,
      rgba(0, 0, 0, 0.58) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.12) 0%,
      rgba(0, 0, 0, 0.55) 100%
    );
}

/* buttons wrapper */
.play-block--hero-demo .play-block__box-inner {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(520px, calc(100% - 32px));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.play-block--hero-demo .play-block__box-inner.hide {
  display: none;
}

/* common button */
.play-block--hero-demo .play-block__button {
  width: 100%;
  min-height: 54px;
  padding: 14px 24px;
  border-radius: 999px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  font-size: 17px;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

/* real money button */
.play-block--hero-demo .play-block__button--casino {
  background: #ff8200;
  color: #ffffff;
  box-shadow: 0 12px 26px rgba(255, 130, 0, 0.32);
}

.play-block--hero-demo .play-block__button--casino svg {
  color: #ffffff;
  flex-shrink: 0;
}

.play-block--hero-demo .play-block__button--casino:hover {
  background: #f07500;
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(255, 130, 0, 0.42);
}

/* free demo button */
.play-block--hero-demo .play-btn {
  background: #00d084;
  color: #06150f;
  box-shadow: 0 12px 26px rgba(0, 208, 132, 0.28);
}

.play-block--hero-demo .play-btn:hover {
  background: #19e197;
  color: #06150f;
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(0, 208, 132, 0.36);
}

/* iframe wrapper */
.play-block--hero-demo .play-block__iframe {
  position: relative;
  z-index: 4;
  width: 100%;
  height: 100%;
  min-height: 520px;
  opacity: 0;
  pointer-events: none;
  background: #000000;
}

.play-block--hero-demo .play-block__iframe.show {
  opacity: 1;
  pointer-events: auto;
}

.play-block--hero-demo .play-block__iframe iframe {
  display: block;
  width: 100%;
  height: 520px;
  border: none;
  background: #000000;
}

/* mobile */
@media (max-width: 991px) {
  .play-block.play-block--hero-demo {
    margin: 18px auto 32px;
    padding: 0 14px;
  }

  .play-block--hero-demo .play-block__box {
    min-height: 420px;
    border-radius: 14px;
  }

  .play-block--hero-demo .play-block__iframe,
  .play-block--hero-demo .play-block__iframe iframe {
    min-height: 420px;
    height: 420px;
  }

  .play-block--hero-demo .play-block__button {
    min-height: 50px;
    font-size: 15px;
  }
}

@media (max-width: 575px) {
  .play-block--hero-demo .play-block__box {
    min-height: 340px;
  }

  .play-block--hero-demo .play-block__iframe,
  .play-block--hero-demo .play-block__iframe iframe {
    min-height: 340px;
    height: 340px;
  }

  .play-block--hero-demo .play-block__box-inner {
    width: calc(100% - 28px);
  }
}