
  

  
  

  
  
  
  
    


@layer base {
  
  body, :host {
    /* Color */
    --mp-182-white: #ebeae5;
--mp-182-yellow: #ffdb4f;
--mp-182-pink: #ed7a9e;
--mp-182-blue: #0083c8;
--mp-182-green: #008b3c;
--mp-182-black: #1f1916;
--gray-25: #FCFCFD;
--gray-50: #F8F9FC;
--gray-100: #EAECF5;
--gray-200: #D5D9EB;
--gray-300: #B3B8DB;
--gray-400: #717BBC;
--gray-500: #4E5BA6;
--gray-600: #3E4784;
--gray-700: #363F72;
--gray-800: #293056;
--gray-900: #101323;
--gray-950: #0D0F1C;
--yellow-25: #FEFDF0;
--yellow-50: #FEFBE8;
--yellow-100: #FEF7C3;
--yellow-200: #FEEE95;
--yellow-300: #FDE272;
--yellow-400: #FAC515;
--yellow-500: #EAAA08;
--yellow-600: #CA8504;
--yellow-700: #A15C07;
--yellow-800: #854A0E;
--yellow-900: #713B12;
--yellow-950: #542C0D;
--orange-25: #FEFAF5;
--orange-50: #FEF6EE;
--orange-100: #FDEAD7;
--orange-200: #F9DBAF;
--orange-300: #F7B27A;
--orange-400: #F38744;
--orange-500: #EF6820;
--orange-600: #E04F16;
--orange-700: #B93815;
--orange-800: #932F19;
--orange-900: #772917;
--orange-950: #511C10;
--orange_dark-25: #FFF9F5;
--orange_dark-50: #FFF4ED;
--orange_dark-100: #FFE6D5;
--orange_dark-200: #FFD6AE;
--orange_dark-300: #FF9C66;
--orange_dark-400: #FF692E;
--orange_dark-500: #FF4405;
--orange_dark-600: #E62E05;
--orange_dark-700: #BC1B06;
--orange_dark-800: #97180C;
--orange_dark-900: #771A0D;
--orange_dark-950: #57130A;
--rose-25: #FFF5F6;
--rose-50: #FFF1F3;
--rose-100: #FFE4E8;
--rose-200: #FECDD6;
--rose-300: #FEA3B4;
--rose-400: #FD6F8E;
--rose-500: #F63D68;
--rose-600: #E31B54;
--rose-700: #C01048;
--rose-800: #A11043;
--rose-900: #89123E;
--rose-950: #510B24;
--pink-25: #FEF6FB;
--pink-50: #FDF2FA;
--pink-100: #FCE7F6;
--pink-200: #FCCEEE;
--pink-300: #FAA7E0;
--pink-400: #F670C7;
--pink-500: #EE46BC;
--pink-600: #DD2590;
--pink-700: #C11574;
--pink-800: #9E165F;
--pink-900: #851651;
--pink-950: #4E0D30;
--fuchsia-25: #FEFAFF;
--fuchsia-50: #FDF4FF;
--fuchsia-100: #FBE8FF;
--fuchsia-200: #F6D0FE;
--fuchsia-300: #EEAAFD;
--fuchsia-400: #E478FA;
--fuchsia-500: #D444F1;
--fuchsia-600: #BA24D5;
--fuchsia-700: #9F1AB1;
--fuchsia-800: #821890;
--fuchsia-900: #6F1877;
--fuchsia-950: #47104C;
--purple-25: #FAFAFF;
--purple-50: #F4F3FF;
--purple-100: #EBE9FE;
--purple-200: #D9D6FE;
--purple-300: #BDB4FE;
--purple-400: #9B8AFB;
--purple-500: #7A5AF8;
--purple-600: #6938EF;
--purple-700: #5925DC;
--purple-800: #4A1FB8;
--purple-900: #3E1C96;
--purple-950: #27115F;
--violet-25: #FBFAFF;
--violet-50: #F5F3FF;
--violet-100: #ECE9FE;
--violet-200: #DDD6FE;
--violet-300: #C3B5FD;
--violet-400: #A48AFB;
--violet-500: #875BF7;
--violet-600: #7839EE;
--violet-700: #6927DA;
--violet-800: #5720B7;
--violet-900: #491C96;
--violet-950: #2E125E;
--indigo-25: #F5F8FF;
--indigo-50: #EEF4FF;
--indigo-100: #E0EAFF;
--indigo-200: #C7D7FE;
--indigo-300: #A4BCFD;
--indigo-400: #8098F9;
--indigo-500: #6172F3;
--indigo-600: #444CE7;
--indigo-700: #3538CD;
--indigo-800: #2D31A6;
--indigo-900: #2D3282;
--indigo-950: #1F235B;
--blue_dark-25: #F5F8FF;
--blue_dark-50: #EFF4FF;
--blue_dark-100: #D1E0FF;
--blue_dark-200: #B2CCFF;
--blue_dark-300: #84ADFF;
--blue_dark-400: #528BFF;
--blue_dark-500: #2970FF;
--blue_dark-600: #155EEF;
--blue_dark-700: #004EEB;
--blue_dark-800: #0040C1;
--blue_dark-900: #00359E;
--blue_dark-950: #002266;
--blue-25: #F5FAFF;
--blue-50: #EFF8FF;
--blue-100: #D1E9FF;
--blue-200: #B2DDFF;
--blue-300: #84CAFF;
--blue-400: #53B1FD;
--blue-500: #2E90FA;
--blue-600: #1570EF;
--blue-700: #175CD3;
--blue-800: #1849A9;
--blue-900: #194185;
--blue-950: #102A56;
--blue_light-25: #F5FBFF;
--blue_light-50: #F0F9FF;
--blue_light-100: #E0F2FE;
--blue_light-200: #B9E6FE;
--blue_light-300: #7CD4FD;
--blue_light-400: #36BFFA;
--blue_light-500: #0BA5EC;
--blue_light-600: #0086C9;
--blue_light-700: #026AA2;
--blue_light-800: #065986;
--blue_light-900: #0B4A6F;
--blue_light-950: #062C41;
--cyan-25: #F5FEFF;
--cyan-50: #ECFDFF;
--cyan-100: #CFF9FE;
--cyan-200: #A5F0FC;
--cyan-300: #67E3F9;
--cyan-400: #22CCEE;
--cyan-500: #06AED4;
--cyan-600: #088AB2;
--cyan-700: #0E7090;
--cyan-800: #155B75;
--cyan-900: #164C63;
--cyan-950: #0D2D3A;
--teal-25: #F6FEFC;
--teal-50: #F0FDF9;
--teal-100: #CCFBEF;
--teal-200: #99F6E0;
--teal-300: #5FE9D0;
--teal-400: #2ED3B7;
--teal-500: #15B79E;
--teal-600: #0E9384;
--teal-700: #107569;
--teal-800: #125D56;
--teal-900: #134E48;
--teal-950: #0A2926;
--green-25: #F6FEF9;
--green-50: #EDFCF2;
--green-100: #D3F8DF;
--green-200: #AAF0C4;
--green-300: #73E2A3;
--green-400: #3CCB7F;
--green-500: #16B364;
--green-600: #099250;
--green-700: #087443;
--green-800: #095C37;
--green-900: #084C2E;
--green-950: #052E1C;
--green_light-25: #FAFEF5;
--green_light-50: #F3FEE7;
--green_light-100: #E4FBCC;
--green_light-200: #D0F8AB;
--green_light-300: #A6EF67;
--green_light-400: #85E13A;
--green_light-500: #66C61C;
--green_light-600: #4CA30D;
--green_light-700: #3B7C0F;
--green_light-800: #326212;
--green_light-900: #2B5314;
--green_light-950: #15290A;
--moss-25: #FAFDF7;
--moss-50: #F5FBEE;
--moss-100: #E6F4D7;
--moss-200: #CEEAB0;
--moss-300: #ACDC79;
--moss-400: #86CB3C;
--moss-500: #669F2A;
--moss-600: #4F7A21;
--moss-700: #3F621A;
--moss-800: #335015;
--moss-900: #2B4212;
--moss-950: #1A280B;
--base-white: #ffffff;
--base-black: #000000;
--text-primary: var(--gray-900);
--text-secondary: var(--gray-700);
--text-tertiary: var(--gray-600);
--text-quaternary: var(--gray-500);
--text-white: var(--base-white);
--text-disabled: var(--gray-500);
--text-placeholder: var(--gray-500);
--text-error-primary: var(--error-600);
--text-secondary_hover: var(--gray-800);
--text-tertiary_hover: var(--gray-700);
--text-secondary_on-brand: var(--brand-200);
--text-tertiary_on-brand: var(--brand-200);
--text-quaternary_on-brand: var(--brand-300);
--text-brand-secondary: var(--brand-700);
--text-brand-secondary_hover: var(--brand-800);
--text-brand-tertiary: var(--brand-600);
--error-25: #FFFBFA;
--error-50: #FEF3F2;
--error-100: #FEE4E2;
--error-200: #FECDCA;
--error-300: #FDA29B;
--error-400: #F97066;
--error-500: #F04438;
--error-600: #D92D20;
--error-700: #B42318;
--error-800: #912018;
--error-900: #7A271A;
--error-950: #55160C;
--border-primary: var(--gray-300);
--border-secondary: var(--gray-200);
--border-secondary_alt: #252b3714;
--border-tertiary: var(--gray-100);
--border-error: var(--error-500);
--border-disabled: var(--gray-300);
--border-disabled_subtle: var(--gray-200);
--border-brand: var(--brand-500);
--border-brand_alt: var(--brand-600);
--bg-primary: var(--base-white);
--bg-primary_hover: var(--gray-50);
--bg-primary-solid: var(--gray-950);
--bg-secondary: var(--gray-50);
--bg-secondary_hover: var(--gray-100);
--bg-secondary_subtle: var(--gray-25);
--bg-secondary-solid: var(--gray-600);
--bg-tertiary: var(--gray-100);
--bg-quaternary: var(--gray-200);
--bg-error-primary: var(--error-50);
--bg-error-secondary: var(--error-100);
--bg-error-solid: var(--error-600);
--bg-active: var(--gray-50);
--bg-disabled: var(--gray-100);
--bg-brand-primary: var(--brand-50);
--bg-brand-secondary: var(--brand-100);
--bg-brand-solid: var(--brand-600);
--bg-brand-solid_hover: var(--brand-700);
--bg-brand-section: var(--brand-800);
--bg-brand-section_subtle: var(--brand-700);
--shadow-xs: #0a0d120d;
--shadow-xs-skeu-in-1: #0a0d122e;
--shadow-xs-skeu-in-2: #0a0d120d;
--shadow-xs-skeu-out: #0a0d120d;
--shadow-sm-out-1: #0a0d121a;
--shadow-sm-out-2: #0a0d121a;
--shadow-md-out-1: #0a0d121a;
--shadow-md-out-2: #0a0d120f;
--shadow-lg-out-1: #0a0d1214;
--shadow-lg-out-2: #0a0d1208;
--shadow-lg-out-3: #0a0d120a;
--shadow-xl-out-1: #0a0d1214;
--shadow-xl-out-2: #0a0d1208;
--shadow-xl-out-3: #0a0d120a;
--shadow-2xl-out-1: #0a0d122e;
--shadow-2xl-out-2: #0a0d120a;
--shadow-3xl-out-1: #0a0d1224;
--shadow-3xl-out-2: #0a0d120a;
--fg-quaternary: var(--gray-400);
--fg-quaternary_hover: var(--gray-500);
--fg-secondary: var(--gray-700);
--fg-primary: var(--gray-900);
--fg-secondary_hover: var(--gray-800);
--fg-tertiary: var(--gray-600);
--fg-tertiary_hover: var(--gray-700);
--fg-disabled: var(--gray-400);
--fg-disabled_subtle: var(--gray-300);
--fg-brand-primary: var(--brand-600);
--fg-brand-secondary: var(--brand-500);
--brand-25: var(--blue_light-25);
--brand-50: var(--blue_light-50);
--brand-100: var(--blue_light-100);
--brand-200: var(--blue_light-200);
--brand-300: var(--blue_light-300);
--brand-400: var(--blue_light-400);
--brand-500: var(--blue_light-500);
--brand-600: var(--blue_light-600);
--brand-700: var(--blue_light-700);
--brand-800: var(--blue_light-800);
--brand-900: var(--blue_light-900);
--brand-950: var(--blue_light-950);
    /* Fonts */
    --font-Inter: 'Inter',sans-serif;

    /* Font size */
    --text-xs: 0.75rem;
--text-sm: 0.875rem;
--text-base: 1rem;
--text-lg: 1.125rem;
--text-xl: 1.25rem;
--display-xs: 1.5rem;
--display-sm: 1.875rem;
--display-md: 2.25rem;
--display-lg: 3rem;
--display-xl: 3.75rem;
--display-2xl: 4.5rem;
--text-md: 1rem;
--softie-display-xs: 1.625rem;
--softie-display-sm: 2.063rem;
--softie-display-md: 2.5rem;
--softie-display-lg: 3.375rem;
--softie-display-xl: 4.125rem;
--softie-display-2xl: 4.938rem;
    /* Font weight */
    --font-weight-regular: 400;
--font-weight-medium: 500;
--font-weight-semi-bold: 600;
--font-weight-bold: 700;
    /* Shadows */
    --shadow-sm:  0 1px 2px 0 rgba(0, 0, 0, 0.25);
--shadow-base:  0 1px 3px 0 rgba(0, 0, 0, 0.25), 0 1px 2px 0 rgba(0, 0, 0, 0.25);
--shadow-md:  0 4px 6px -1px rgba(0, 0, 0, 0.25), 0 2px 4px -1px rgba(0, 0, 0, 0.25);
--shadow-lg:  0 10px 15px -3px rgba(0, 0, 0, 0.25), 0 4px 6px -2px rgba(0, 0, 0, 0.25);
--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.25), 0 10px 10px -5px rgba(0, 0, 0, 0.25);
--shadow-2xl:  0 25px 50px -12px rgba(0, 0, 0, 0.25);
    /* Border radius */
    
    /* Spacing */
    --spacing-none: 0rem;
--spacing-xxs: 0.125rem;
--spacing-xs: 0.25rem;
--spacing-sm: 0.375rem;
--spacing-md: 0.5rem;
--spacing-lg: 0.75rem;
--spacing-xl: 1rem;
--spacing-2xl: 1.25rem;
--spacing-3xl: 1.5rem;
--spacing-4xl: 2rem;
--spacing-5xl: 2.5rem;
--spacing-6xl: 3rem;
--spacing-7xl: 4rem;
--spacing-8xl: 5rem;
--spacing-9xl: 6rem;
--spacing-10xl: 8rem;
--spacing-11xl: 10rem;
--width-xxs: 20rem;
--width-xs: 24rem;
--width-sm: 30rem;
--width-md: 35rem;
--width-lg: 40rem;
--width-xl: 48rem;
--width-2xl: 64rem;
--width-3xl: 80rem;
--width-4xl: 90rem;
--width-5xl: 100rem;
--width-6xl: 120rem;
--container-padding-mobile: 1rem;
--container-padding-desktop: 2rem;
--container-max-width-desktop: 80rem;
--paragraph-max-width: 45rem;
--line_height-text_xs: 1.125rem;
--line_height-text_sm: 1.25rem;
--line_height-text_md: 1.5rem;
--line_height-text_lg: 1.75rem;
--line_height-text_xl: 1.875rem;
--line_height-display_xs: 2rem;
--line_height-display_sm: 2.375rem;
--line_height-display_md: 2.75rem;
--line_height-display_lg: 3.75rem;
--line_height-display_xl: 4.5rem;
--line_height-display_2xl: 5.625rem;
--radius-none: 0rem;
--radius-xxs: 0.125rem;
--radius-xs: 0.25rem;
--radius-sm: 0.375rem;
--radius-md: 0.5rem;
--radius-lg: 0.625rem;
--radius-xl: 0.75rem;
--radius-2xl: 1rem;
--radius-3xl: 1.25rem;
--radius-4xl: 1.5rem;
--radius-full: 100rem;
--shadow-xs-x: 0px;
--shadow-xs-y: 1px;
--shadow-xs-blur: 2px;
--shadow-xs-spread: 0px;
--shadow-xs-skeu-in-1-x: 0px;
--shadow-xs-skeu-in-1-y: 0px;
--shadow-xs-skeu-in-1-blur: 0px;
--shadow-xs-skeu-in-1-spread: 1px;
--shadow-xs-skeu-in-2-x: 0px;
--shadow-xs-skeu-in-2-y: -2px;
--shadow-xs-skeu-in-2-blur: 0px;
--shadow-xs-skeu-in-2-spread: 0px;
--shadow-xs-skeu-out-x: 0px;
--shadow-xs-skeu-out-y: 1px;
--shadow-xs-skeu-out-blur: 2px;
--shadow-xs-skeu-out-spread: 0px;
--shadow-sm-out-1-x: 0px;
--shadow-sm-out-1-y: 1px;
--shadow-sm-out-1-blur: 3px;
--shadow-sm-out-1-spread: 0px;
--shadow-sm-out-2-x: 0px;
--shadow-sm-out-2-y: 1px;
--shadow-sm-out-2-blur: 2px;
--shadow-sm-out-2-spread: -1px;
--shadow-md-out-1-x: 0px;
--shadow-md-out-1-y: 4px;
--shadow-md-out-1-blur: 6px;
--shadow-md-out-1-spread: -1px;
--shadow-md-out-2-x: 0px;
--shadow-md-out-2-y: 2px;
--shadow-md-out-2-blur: 4px;
--shadow-md-out-2-spread: -2px;
--shadow-lg-out-1-x: 0px;
--shadow-lg-out-1-y: 12px;
--shadow-lg-out-1-blur: 16px;
--shadow-lg-out-1-spread: -4px;
--shadow-lg-out-2-x: 0px;
--shadow-lg-out-2-y: 4px;
--shadow-lg-out-2-blur: 6px;
--shadow-lg-out-2-spread: -2px;
--shadow-lg-out-3-x: 0px;
--shadow-lg-out-3-y: 2px;
--shadow-lg-out-3-blur: 2px;
--shadow-lg-out-3-spread: -1px;
--shadow-xl-out-1-x: 0px;
--shadow-xl-out-1-y: 20px;
--shadow-xl-out-1-blur: 24px;
--shadow-xl-out-1-spread: -4px;
--shadow-xl-out-2-x: 0px;
--shadow-xl-out-2-y: 8px;
--shadow-xl-out-2-blur: 8px;
--shadow-xl-out-2-spread: -4px;
--shadow-xl-out-3-x: 0px;
--shadow-xl-out-3-y: 3px;
--shadow-xl-out-3-blur: 3px;
--shadow-xl-out-3-spread: -1.5px;
--shadow-2xl-out-1-x: 0px;
--shadow-2xl-out-1-y: 24px;
--shadow-2xl-out-1-blur: 48px;
--shadow-2xl-out-1-spread: -12px;
--shadow-2xl-out-2-x: 0px;
--shadow-2xl-out-2-y: 4px;
--shadow-2xl-out-2-blur: 4px;
--shadow-2xl-out-2-spread: -2px;
--shadow-3xl-out-1-x: 0px;
--shadow-3xl-out-1-y: 32px;
--shadow-3xl-out-1-blur: 64px;
--shadow-3xl-out-1-spread: -12px;
--shadow-3xl-out-2-x: 0px;
--shadow-3xl-out-2-y: 5px;
--shadow-3xl-out-2-blur: 5px;
--shadow-3xl-out-2-spread: -2.5px;
--letter_spacing-display_lg: -2%;
--letter_spacing-display_xl: -2%;
--letter_spacing-display_2xl: -2%;
--softie-line_height-display_xs: 2.063rem;
--softie-line_height-display_sm: 2.375rem;
--softie-line_height-display_md: 2.813rem;
--softie-line_height-display_lg: 3.75rem;
--softie-line_height-display_xl: 4.563rem;
--softie-line_height-display_2xl: 5.688rem;
    /* Z-index */
    
  }
  @keyframes animation-spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  @keyframes animation-fade-in {
    from {
      opacity:0;
    }
    to {
      opacity:1;
    }
  }
  @keyframes animation-fade-out {
    from {
      opacity:1;
    }
    to {
      opacity:0;
    }
  }
}
