:root{
    /* #region Collection: Color */

    /* #region     raw colors */
    /* #region         green */
    --Colors-green-100: rgba(235,255,238,1.00);
    --Colors-green-200: rgba(207,247,211,1.00);
    --Colors-green-300: rgba(170,238,181,1.00);
    --Colors-green-400: rgba(133,224,163,1.00);
    --Colors-green-500: rgba(20,174,92,1.00);
    --Colors-green-600: rgba(0,153,81,1.00);
    --Colors-green-700: rgba(0,128,67,1.00);
    --Colors-green-800: rgba(3,104,56,1.00);
    --Colors-green-900: rgba(2,70,38,1.00);
    --Colors-green-1000: rgba(2,70,38,1.00);
    /* #endregion         green */
    /* #region         black */
    --Colors-black-100: rgba(0,0,0,0.05);
    --Colors-black-200: rgba(0,0,0,0.10);
    --Colors-black-300: rgba(0,0,0,0.20);
    --Colors-black-400: rgba(0,0,0,0.30);
    --Colors-black-500: rgba(0,0,0,0.50);
    --Colors-black-600: rgba(0,0,0,0.80);
    --Colors-black-700: rgba(0,0,0,0.85);
    --Colors-black-800: rgba(0,0,0,0.90);
    --Colors-black-900: rgba(0,0,0,0.95);
    --Colors-black-1000: rgba(0,0,0,1.00);
    /* #endregion         black */
    /* #region         white */
    --Colors-white-100: rgba(255,255,255,0.05);
    --Colors-white-200: rgba(255,255,255,0.10);
    --Colors-white-300: rgba(255,255,255,0.20);
    --Colors-white-400: rgba(255,255,255,0.40);
    --Colors-white-500: rgba(255,255,255,0.70);
    --Colors-white-600: rgba(255,255,255,0.80);
    --Colors-white-700: rgba(255,255,255,0.85);
    --Colors-white-800: rgba(255,255,255,0.90);
    --Colors-white-900: rgba(255,255,255,0.95);
    --Colors-white-1000: rgba(255,255,255,1.00);
    /* #endregion         white */
    /* #region         grey */
    --Colors-grey-100: rgba(250,250,250,1.00);
    --Colors-grey-200: rgba(245,245,245,1.00);
    --Colors-grey-300: rgba(235,235,235,1.00);
    --Colors-grey-400: rgba(209,209,209,1.00);
    --Colors-grey-500: rgba(129,129,129,1.00);
    --Colors-grey-600: rgba(68,68,68,1.00);
    --Colors-grey-700: rgba(56,56,56,1.00);
    --Colors-grey-800: rgba(44,44,44,1.00);
    --Colors-grey-900: rgba(30,30,30,1.00);
    --Colors-grey-1000: rgba(20,18,24,1.00);
    /* #endregion         grey */
    /* #region         blue */
    --Colors-blue-100: rgba(237,244,252,1.00);
    --Colors-blue-200: rgba(230,240,250,1.00);
    --Colors-blue-300: rgba(200,224,248,1.00);
    --Colors-blue-400: rgba(163,204,246,1.00);
    --Colors-blue-500: rgba(110,176,242,1.00);
    --Colors-blue-600: rgba(0,128,255,1.00);
    --Colors-blue-700: rgba(0,112,224,1.00);
    --Colors-blue-800: rgba(0,94,192,1.00);
    --Colors-blue-900: rgba(31,82,201,1.00);
    --Colors-blue-1000: rgba(19,42,222,1.00);
    /* #endregion         blue */
    /* #region         pink */
    --Colors-pink-100: rgba(255,251,250,1.00);
    --Colors-pink-200: rgba(250,244,248,1.00);
    --Colors-pink-300: rgba(248,237,244,1.00);
    --Colors-pink-400: rgba(254,236,246,1.00);
    --Colors-pink-500: rgba(247,184,221,1.00);
    --Colors-pink-600: rgba(233,107,191,1.00);
    --Colors-pink-700: rgba(241,61,197,1.00);
    --Colors-pink-800: rgba(201,36,155,1.00);
    --Colors-pink-900: rgba(151,12,117,1.00);
    --Colors-pink-1000: rgba(106,8,83,1.00);
    /* #endregion         pink */
    /* #region         red */
    --Colors-red-100: rgba(255,245,245,1.00);
    --Colors-red-200: rgba(255,226,224,1.00);
    --Colors-red-300: rgba(255,199,194,1.00);
    --Colors-red-400: rgba(255,175,163,1.00);
    --Colors-red-500: rgba(244,92,67,1.00);
    --Colors-red-600: rgba(235,51,73,1.00);
    --Colors-red-700: rgba(189,41,21,1.00);
    --Colors-red-800: rgba(159,31,24,1.00);
    --Colors-red-900: rgba(119,18,8,1.00);
    --Colors-red-1000: rgba(102,14,11,1.00);
    /* #endregion         red */
    /* #region         yellow */
    --Colors-yellow-100: rgba(255,251,235,1.00);
    --Colors-yellow-200: rgba(255,241,194,1.00);
    --Colors-yellow-300: rgba(255,232,163,1.00);
    --Colors-yellow-400: rgba(255,217,102,1.00);
    --Colors-yellow-500: rgba(255,205,41,1.00);
    --Colors-yellow-600: rgba(255,194,26,1.00);
    --Colors-yellow-700: rgba(250,184,21,1.00);
    --Colors-yellow-800: rgba(235,166,17,1.00);
    --Colors-yellow-900: rgba(221,148,14,1.00);
    --Colors-yellow-1000: rgba(184,98,0,1.00);
    /* #endregion         yellow */
    /* #region         pale_green */
    --Colors-pale_green-100: rgba(241,248,242,1.00);
    --Colors-pale_green-200: rgba(218,236,223,1.00);
    --Colors-pale_green-300: rgba(195,224,204,1.00);
    --Colors-pale_green-400: rgba(159,193,170,1.00);
    --Colors-pale_green-500: rgba(103,142,121,1.00);
    --Colors-pale_green-600: rgba(92,128,109,1.00);
    --Colors-pale_green-700: rgba(81,115,97,1.00);
    --Colors-pale_green-800: rgba(71,102,86,1.00);
    --Colors-pale_green-900: rgba(47,72,60,1.00);
    --Colors-pale_green-1000: rgba(23,43,34,1.00);    
    /* #endregion         pale_green */
    /* #endregion     raw colors */

    /* #region     color aliases */
    /* #region         background */
    /* #region             brand */
    --Alias-bg-brand-default: var(--Colors-blue-600);
    --Alias-bg-brand-accent: var(--Colors-blue-1000);
    --Alias-bg-brand-hover: var(--Colors-blue-700);
    --Alias-bg-brand-pressed: var(--Colors-blue-700);
    --Alias-bg-brand-secondary: var(--Colors-blue-400);
    --Alias-bg-brand-tertiary: var(--Colors-blue-300);
    /* #endregion         brand */
    /* #region             danger */
    --Alias-bg-danger-default: var(--Colors-red-600);
    --Alias-bg-danger-hover: var(--Colors-red-700);
    --Alias-bg-danger-pressed: var(--Colors-red-700);
    --Alias-bg-danger-secondary: var(--Colors-red-200);
    /* #endregion             danger */
    /* #region             default */
    --Alias-bg-default-default: var(--Colors-grey-200);
    --Alias-bg-default-secondary: var(--Colors-white-1000);
    --Alias-bg-default-tertiary: var(--Colors-blue-300);
    --Alias-bg-default-quaternary: var(--Colors-white-1000);
    /* #endregion         default */
    /* #region             disabled */
    --Alias-bg-disabled-default: var(--Colors-grey-300);
    --Alias-bg-disabled-secondary: var(--Colors-grey-400);
    /* #endregion          disabled */
    /* #region             selected */
    --Alias-bg-selected-default: var(--Alias-bg-brand-default);
    --Alias-bg-selected-hover: var(--Alias-bg-brand-hover);
    --Alias-bg-selected-pressed: var(--Alias-bg-brand-pressed);
    --Alias-bg-selected-secondary: var(--Alias-bg-brand-secondary);
    --Alias-bg-selected-tertiary: var(--Alias-bg-brand-tertiary);
    /* #endregion        selected */
    /* #region             info */
    --Alias-bg-info-default: var(--Colors-blue-200);
    /* #endregion info */
    /* #region             success */
    --Alias-bg-success-default: var(--Colors-green-500);
    --Alias-bg-success-hover: var(--Colors-green-600);
    --Alias-bg-success-pressed: var(--Colors-green-600);
    --Alias-bg-success-secondary: var(--Colors-green-200);
    /* #endregion         success */
    /* #region             warning */
    --Alias-bg-warning-default: var(--Colors-yellow-500);
    --Alias-bg-warning-hover: var(--Colors-yellow-600);
    --Alias-bg-warning-pressed: var(--Colors-yellow-600);
    --Alias-bg-warning-secondary: var(--Colors-yellow-200);
    --Alias-bg-warning-tertiary: var(--Colors-yellow-200);
    /* #endregion         warning */
    /* #region             overlay */
    --Alias-bg-overlay-100: var(--Alias-bg-default-default);
    --Alias-bg-overlay-80: rgba(250,250,250,0.80);
    --Alias-bg-overlay-0: rgba(250,250,250,0.00);
    /* #endregion         overlay */
    /* #endregion       background */
    /* #region         border */
    --Alias-border-default-default: var(--Colors-grey-300);
    --Alias-border-brand-brand: var(--Colors-blue-700);
    --Alias-border-brand-accent: var(--Colors-blue-500);
    --Alias-border-danger-default: var(--Colors-red-300);
    --Alias-border-selected-onselected: var(--Colors-blue-400);
    --Alias-border-selected-default: var(--Colors-blue-700);
    --Alias-border-warning-onwarning: var(--Colors-yellow-700);
    --Alias-border-warning-default: var(--Colors-yellow-300);
    --Alias-border-success-primary: var(--Colors-green-600);
    --Alias-border-success-secondary: var(--Colors-green-300);
    /* #endregion        border */
    /* #region         text */
    /* #region         brand */
    --Alias-text-brand-default: var(--Colors-blue-700);
    --Alias-text-brand-accent: var(--Alias-text-brand-default);
    --Alias-text-brand-tertiary: var(--Alias-text-brand-default);
    --Alias-text-brand-onbrand: var(--Colors-white-1000);
    --Alias-text-brand-onbrand-secondary: var(--Colors-white-700);
    --Alias-text-brand-onbrand-tertiary: var(--Colors-white-500);
    /* #endregion         brand */
    /* #region         danger */
    --Alias-text-danger-default: var(--Colors-red-700);
    --Alias-text-danger-secondary: var(--Alias-text-danger-default);
    --Alias-text-danger-tertiary: var(--Alias-text-danger-default);
    --Alias-text-danger-ondanger: var(--Colors-white-1000);
    --Alias-text-danger-ondanger-secondary: var(--Colors-white-600);
    --Alias-text-danger-ondanger-tertiary: var(--Colors-white-400);
    /* #endregion         danger */
    /* #region         default */
    --Alias-text-default-default: var(--Colors-grey-900);
    --Alias-text-default-hover: var(--Colors-grey-900);
    --Alias-text-default-secondary: var(--Colors-grey-500);
    --Alias-text-default-secondary-hover: var(--Colors-grey-800);
    --Alias-text-default-tertiary: var(--Colors-grey-400);
    --Alias-text-default-tertiary-hover: var(--Colors-grey-800);
    --Alias-text-default-contrast: rgba(255,255,255,1.00);
    /* #endregion         default */
    /* #region         disabled */
    --Alias-text-disabled-default: var(--Colors-black-400);
    --Alias-text-disabled-ondisabled: var(--Colors-white-1000);
    --Alias-text-disabled-brand: var(--Colors-blue-200);
    /* #endregion         disabled */
    /* #region         success */
    --Alias-text-success-default: var(--Colors-green-500);
    --Alias-text-success-secondary: var(--Alias-text-success-default);
    --Alias-text-success-tertiary: var(--Alias-text-success-default);
    --Alias-text-success-onsuccess: var(--Colors-white-1000);
    --Alias-text-success-onsuccess-secondary: var(--Colors-green-800);
    --Alias-text-success-onsuccess-tertiary: var(--Colors-white-400);
    /* #endregion         success */
    /* #region         warning */
    --Alias-text-warning-default: var(--Colors-yellow-1000);
    --Alias-text-warning-secondary: var(--Alias-text-warning-default);
    --Alias-text-warning-tertiary: var(--Alias-text-warning-default);
    --Alias-text-warning-onwarning: var(--Colors-black-800);
    --Alias-text-warning-onwarning-secondary: var(--Colors-black-800);
    --Alias-text-warning-onwarning-tertiary: var(--Colors-black-400);
    /* #endregion         warning */
    /* #endregion     text */
    /* #region         icon */
    --Alias-icon-brand-default: var(--Colors-blue-700);
    --Alias-icon-brand-hover: var(--Colors-blue-500);
    --Alias-icon-brand-pressed: var(--Colors-blue-500);
    --Alias-icon-brand-secondary: var(--Colors-blue-500);
    --Alias-icon-brand-tertiary: var(--Colors-blue-400);
    --Alias-icon-brand-onbrand: var(--Colors-white-1000);
    --Alias-icon-brand-onbrand-secondary: var(--Colors-white-700);
    --Alias-icon-brand-onbrand-tertiary: var(--Colors-white-500);
    --Alias-icon-danger-default: var(--Colors-red-500);
    --Alias-icon-danger-hover: var(--Colors-red-700);
    --Alias-icon-danger-pressed: var(--Colors-red-700);
    --Alias-icon-danger-secondary: var(--Alias-icon-danger-default);
    --Alias-icon-danger-ondanger: var(--Colors-white-1000);
    --Alias-icon-danger-ondanger-secondary: var(--Colors-white-600);
    --Alias-icon-danger-ondanger-tertiary: var(--Colors-white-400);
    --Alias-icon-default-default: var(--Colors-grey-900);
    --Alias-icon-default-hover: var(--Colors-grey-900);
    --Alias-icon-default-pressed: var(--Colors-blue-700);
    --Alias-icon-default-secondary: var(--Colors-grey-500);
    --Alias-icon-default-secondary-hover: var(--Colors-grey-800);
    --Alias-icon-default-tertiary: var(--Colors-grey-400);
    --Alias-icon-default-tertiary-hover: var(--Colors-grey-800);
    --Alias-icon-default-onsurface: var(--Colors-blue-600);
    --Alias-icon-disabled-default: var(--Colors-black-400);
    --Alias-icon-disabled-ondisabled: var(--Colors-white-1000);
    --Alias-icon-disabled-brand: rgba(255,255,255,1.00);
    --Alias-icon-success-default: var(--Colors-green-500);
    --Alias-icon-success-hover: var(--Colors-green-600);
    --Alias-icon-success-pressed: var(--Colors-green-600);
    --Alias-icon-success-onsuccess: var(--Colors-white-1000);
    --Alias-icon-success-onsuccess-secondary: var(--Colors-white-600);
    --Alias-icon-success-onsuccess-tertiary: var(--Colors-white-400);
    --Alias-icon-warning-default: var(--Colors-yellow-500);
    --Alias-icon-warning-hover: var(--Colors-yellow-800);
    --Alias-icon-warning-pressed: var(--Colors-yellow-1000);
    --Alias-icon-warning-onwarning: var(--Colors-black-800);
    --Alias-icon-logo-primary: var(--Colors-blue-600);
    --Alias-icon-logo-secondary: rgba(255,0,128,1.00);
    --Alias-icon-logo-background: var(--Colors-white-1000);    
    /* #endregion         icon */
    /* #endregion     color aliases */

    /* #region     colors */
    /* #region         text */
    --text-text-default: var(--Alias-text-default-default);
    --text-text-secondary: var(--Alias-text-default-secondary);
    --text-text-tertiary: var(--Alias-text-default-tertiary);
    --text-text-onbrand: var(--Alias-text-brand-onbrand);
    --text-text-onbrand-secondary: var(--Alias-text-brand-onbrand-secondary);
    --text-text-onbrand-tertiary: var(--Alias-text-brand-onbrand-tertiary);
    --text-text-brand: var(--Alias-text-brand-default);
    --text-text-danger: var(--Alias-text-danger-default);
    --text-text-warning: var(--Alias-text-warning-default);
    --text-text-success: var(--Alias-text-success-default);
    --text-text-brand-accent: var(--Alias-text-brand-accent);
    --text-text-contrast: var(--Alias-text-default-contrast);
    --text-text-success-secondary: var(--Alias-text-success-onsuccess-secondary);
    --text-text-selected: var(--Alias-text-brand-default);    
    /* #endregion         text */
    /* #region         background */
    --bg-bg-default: var(--Alias-bg-default-default);
    --bg-bg-secondary: var(--Alias-bg-default-secondary);
    --bg-bg-tertiary: var(--Alias-bg-default-tertiary);
    --bg-bg-quaternary: var(--Alias-bg-default-quaternary);
    --bg-bg-brand: var(--Alias-bg-brand-default);
    --bg-bg-brand-secondary: var(--Alias-bg-brand-secondary);
    --bg-bg-selected: var(--Alias-bg-selected-default);
    --bg-bg-danger: var(--Alias-bg-danger-default);
    --bg-bg-warning: var(--Alias-bg-warning-default);
    --bg-bg-success: var(--Alias-bg-success-default);
    --bg-bg-white: var(--Colors-white-1000);
    --bg-bg-active-surface: var(--Colors-blue-100);
    --bg-bg-accent: var(--Alias-bg-brand-accent);
    --bg-bg-success-secondary: var(--Alias-bg-success-secondary);
    --bg-bg-danger-secondary: var(--Alias-bg-danger-secondary);
    --bg-bg-warning-secondary: var(--Alias-bg-warning-secondary);
    --bg-bg-selected-subtle: var(--Colors-blue-100);
    /* #endregion         background */
    /* #region         border */
    --border-border-default: var(--Alias-border-default-default);
    --border-border-brand: var(--Alias-border-brand-brand);
    --border-border-brand-accent: var(--Alias-border-brand-accent);
    --border-border-danger: var(--Alias-border-danger-default);
    --border-border-warning: var(--Alias-border-warning-default);
    --border-border-success: var(--Alias-border-success-primary);
    --border-border-selected: var(--Alias-border-selected-default);
    --border-border-success-secondary: var(--Alias-border-success-secondary);
    /* #endregion         border */
    /* #region         icon */
    --icon-icon-default: var(--Alias-text-default-default);
    --icon-icon-secondary: var(--Alias-text-default-secondary);
    --icon-icon-tertiary: var(--Alias-text-default-tertiary);
    --icon-icon-onbrand: var(--Alias-icon-brand-onbrand);
    --icon-icon-onbrand-secondary: var(--Alias-icon-brand-onbrand-secondary);
    --icon-icon-onbrand-tertiary: var(--Alias-icon-brand-onbrand-tertiary);
    --icon-icon-accent: var(--Alias-icon-brand-secondary);
    --icon-icon-brand: var(--Alias-icon-brand-default);
    --icon-icon-danger: var(--Alias-icon-danger-default);
    --icon-icon-warning: var(--Alias-icon-warning-default);
    --icon-icon-success: var(--Alias-icon-success-default);
    --icon-icon-onsurface: var(--Alias-icon-default-onsurface);
    --icon-icon-onselected-subtle: var(--Alias-icon-default-onsurface);
    --icon-icon-onselected-fill: var(--Alias-icon-brand-onbrand);    
    /* #endregion         icon */
    --Color: var(--bg-bg-brand);
    --Gradient-linear: linear-gradient(306deg, var(--bg-bg-accent) 39.24%, var(--bg-bg-brand) 89.18%);       
    /* #endregion     colors */
    /* #endregion Collection: Color */

/* #region Collection: Sizing */
    /* #region     Spacers */
    --Spacers-s4: 4px;
    --Spacers-s8: 8px;
    --Spacers-s12: 12px;
    --Spacers-s16: 16px;
    --Spacers-s20: 20px;
    --Spacers-s24: 24px;
    --Spacers-s32: 32px;
    --Spacers-s40: 40px;
    --Spacers-s0: 0px;
    /* #endregion Spacers */
    /* #region     Radius */
    --Radius-r4: 4px;
    --Radius-r8: 8px;
    --Radius-r12: 12px;
    --Radius-r16: 16px;
    --Radius-r24: 24px;
    --Radius-r0: 0px;
    --Radius-r100: 9999px;
    --Radius-small: var(--Radius-r12);
    --Radius-full: var(--Radius-r100);    
    /* #endregion Radius */

    --Page-wrapper-width: 375px;
    /* #endregion Collection: Sizing */

    /* #region Collection: Typography */
    
    /* #region     font family and weight */
    --font-family-Gilroy: Gilroy;
    --font-family-Instrument-Sans: Instrument Sans;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    /* #endregion     font family and weight */

    /* #region default font */
    --default-font-family: var(--font-family-Gilroy);
    --default-font-weight: var(--font-weight-regular);
    --default-line-height: 24px;
    --default-letter-spacing: 0px;
    /* #endregion default font */

    /* #region     Heading */
    /* #region         H1 */
    --Heading-H1-fontFamily: var(--default-font-family);
    --Heading-H1-fontSize: 24px;
    --Heading-H1-fontWeight: var(--font-weight-semibold);
    --Heading-H1-emphasis-fontWeight: var(--font-weight-bold);
    --Heading-H1-lineHeight: 31px;
    --Heading-H1-letterSpacing: 0px;
    /* #endregion         H1 */
    /* #region         H2 */
    --Heading-H2-fontFamily: var(--default-font-family);
    --Heading-H2-fontSize: 18px;
    --Heading-H2-fontWeight: var(--font-weight-semibold);
    --Heading-H2-emphasis-fontWeight: var(--font-weight-bold);
    --Heading-H2-lineHeight: 25px;
    --Heading-H2-letterSpacing: 0px;
    /* #endregion         H2 */
    /* #region         H3 */
    --Heading-H3-fontFamily: var(--default-font-family);
    --Heading-H3-fontSize: 16px;
    --Heading-H3-fontWeight: var(--font-weight-semibold);
    --Heading-H3-emphasis-fontWeight: var(--font-weight-bold);    
    --Heading-H3-lineHeight: 21px;
    --Heading-H3-letterSpacing: 0px;
    /* #endregion         H3 */
    /* #region         H4 */
    --Heading-H4-fontFamily: var(--default-font-family);
    --Heading-H4-fontSize: 14px;
    --Heading-H4-fontWeight: var(--font-weight-semibold);
    --Heading-H4-emphasis-fontWeight: var(--font-weight-bold);    
    --Heading-H4-lineHeight: 21px;
    --Heading-H4-letterSpacing: 0px;
    /* #endregion         H4 */
    /* #region         H5 */
    --Heading-H5-fontFamily: var(--default-font-family);
    --Heading-H5-fontSize: 14px;
    --Heading-H5-fontWeight: var(--font-weight-semibold);
    --Heading-H5-emphasis-fontWeight: var(--font-weight-bold); 
    --Heading-H5-lineHeight: 18px;
    --Heading-H5-letterSpacing: 0px;      
    /* #endregion         H5 */
    /* #endregion     Heading */

    /* #region     Body */
    /* #region         large bold */
    --Body-large-bold-fontFamily: var(--default-font-family);
    --Body-large-bold-fontSize: 18px;
    --Body-large-bold-fontWeight: var(--font-weight-bold);
    --Body-large-bold-letterSpacing: 0px;
    --Body-large-bold-lineHeight: 23px;
    /* #endregion         large bold */
    
    /* #region         large regular */
    --Body-large-regular-fontFamily: var(--default-font-family);
    --Body-large-regular-fontSize: 18px;
    --Body-large-regular-fontWeight: var(--font-weight-regular);
    --Body-large-regular-letterSpacing: 0px;
    --Body-large-regular-lineHeight: 23px;
    --Body-large-regular-lineHeight-2: 23px;
    /* #endregion         large regular */
    
    /* #region         large semibold */
    --Body-large-semibold-fontFamily: var(--default-font-family);
    --Body-large-semibold-fontSize: 18px;
    --Body-large-semibold-fontWeight: var(--font-weight-semibold);
    --Body-large-semibold-letterSpacing: 0px;
    --Body-large-semibold-lineHeight: 23px;
    /* #endregion         large semibold */

    /* #region         medium regular & emphasis*/
    --Body-medium-regular-fontFamily: var(--default-font-family);
    --Body-medium-regular-fontSize: 18px;
    --Body-medium-regular-fontWeight: var(--font-weight-regular);
    --Body-medium-emphasis-fontWeight: var(--font-weight-bold);     
    --Body-medium-regular-lineHeight: 23px;
    --Body-medium-regular-letterSpacing: 0px;
    /* #endregion         medium regular & emphasis*/    
    /* #region         small regular & emphasis*/
    --Body-small-regular-fontFamily: var(--default-font-family);
    --Body-small-regular-fontSize: 16px;
    --Body-small-regular-fontWeight: var(--font-weight-regular);
    --Body-small-emphasis-fontWeight: var(--font-weight-bold);     
    --Body-small-regular-lineHeight: 21px;
    --Body-small-regular-letterSpacing: 0px;
    /* #endregion         small regular & emphasis */

    /* #region         small bold */
    --Body-small-bold-fontFamily: var(--default-font-family);
    --Body-small-bold-fontSize: 16px;
    --Body-small-bold-fontWeight: var(--font-weight-bold);
    --Body-small-bold-letterSpacing: 0px;
    --Body-small-bold-lineHeight: 21px;
    /* #endregion         small bold */

    /* #region         small semibold */
    --Body-small-semibold-fontFamily: var(--default-font-family);
    --Body-small-semibold-fontSize: 16px;
    --Body-small-semibold-fontWeight: var(--font-weight-semibold);
    --Body-small-semibold-letterSpacing: 0px;
    --Body-small-semibold-lineHeight: 21px;
    /* #endregion         small semibold */
    
    /* #endregion     Body */

    /* #region     Label */
    /* #region         large */
    --Label-large-fontFamily: var(--default-font-family);
    --Label-large-fontSize: 16px;
    --Label-large-fontWeight: var(--font-weight-semibold);
    --Label-large-emphasis-fontWeight: var(--font-weight-bold);
    --Label-large-lineHeight: 20px;
    --Label-large-letterSpacing: 0px;
    /* #endregion         large */

    /* #region         large bold */
    --Label-large-bold-fontFamily: var(--font-family-Gilroy);
    --Label-large-bold-fontSize: 16px;
    --Label-large-bold-fontWeight: var(--font-weight-bold);
    --Label-large-bold-letterSpacing: 0px;
    --Label-large-bold-lineHeight: 20px;
    /* #endregion         large bold */

    /* #region         large regular */
    --Label-large-regular-fontFamily: var(--font-family-Gilroy);
    --Label-large-regular-fontSize: 16px;
    --Label-large-regular-fontWeight: var(--font-weight-regular);
    --Label-large-regular-letterSpacing: 0px;
    --Label-large-regular-lineHeight: 20px;
    /* #endregion         large regular */

    /* #region         large semibold */
    --Label-large-semibold-fontFamily: var(--font-family-Gilroy);
    --Label-large-semibold-fontSize: 16px;
    --Label-large-semibold-fontWeight: var(--font-weight-semibold);
    --Label-large-semibold-letterSpacing: 0px;
    --Label-large-semibold-lineHeight: 20px;
    /* #endregion         large semibold */

    /* #region         medium */
    --Label-medium-fontFamily: var(--default-font-family);
    --Label-medium-fontSize: 14px;
    --Label-medium-fontWeight: var(--font-weight-semibold);
    --Label-medium-emphasis-fontWeight: var(--font-weight-bold);
    --Label-medium-lineHeight: 18px;
    --Label-medium-letterSpacing: 0px;
    /* #endregion         medium */
    /* #region         small */
    --Label-small-fontFamily: var(--default-font-family);
    --Label-small-fontSize: 12px;
    --Label-small-fontWeight: var(--font-weight-regular);
    --Label-small-emphasis-fontWeight: var(--font-weight-semibold);
    --Label-small-lineHeight: 15px;
    --Label-small-letterSpacing: 0px;
    /* #endregion         small */
    /* #region         extra-small */
    --Label-extra-small-fontFamily: var(--default-font-family);
    --Label-extra-small-fontSize: 10px;
    --Label-extra-small-fontWeight: var(--font-weight-semibold);
    --Label-extra-small-emphasis-fontWeight: var(--font-weight-semibold);
    --Label-extra-small-lineHeight: 13px;
    --Label-extra-small-letterSpacing: 0px;
    /* #endregion         extra-small */
    /* #endregion     Label */
    /* #region     Caption */    
    /* #region         large */
    --Caption-large-fontFamily: var(--default-font-family);
    --Caption-large-fontSize: 12px;
    --Caption-large-fontWeight: var(--font-weight-medium);
    --Caption-large-emphasis-fontWeight: var(--font-weight-bold);
    --Caption-large-lineHeight: 14px;
    --Caption-large-letterSpacing: 0px;
    /* #endregion         large */
    /* #region         small */
    --Caption-small-fontFamily: var(--default-font-family);
    --Caption-small-fontSize: 12px;
    --Caption-small-fontWeight: var(--font-weight-semibold);
    --Caption-small-emphasis-fontWeight: var(--font-weight-bold);
    --Caption-small-lineHeight: 15px;
    --Caption-small-letterSpacing: 0px;
    /* #endregion         small */
    /* #endregion     Caption */

    /* #endregion Collection: Typography*/

    /* #region spacers    */
    --spacer-0: var(--Spacers-s0);
    --spacer-1: var(--Spacers-s4);
    --spacer-2: var(--Spacers-s8);
    --spacer-3: var(--Spacers-s12);
    --spacer-4: var(--Spacers-s24);
    /* #endregion spacers    */


}