/* Generated from sources/figma.json and foundations-visual.json. */
:root {
  --grano-color-core-graphite: #1B1B1D;
  --grano-color-core-white: #F3F3F3;
  --grano-color-core-acid: #D8FF36;
  --grano-color-core-blue: #3157FF;
  --grano-color-core-magenta: #F02B78;
  --grano-color-neutral-900: #1B1B1D;
  --grano-color-neutral-800: #2A2A2E;
  --grano-color-neutral-700: #3D3D42;
  --grano-color-neutral-600: #56565C;
  --grano-color-neutral-500: #7A7A82;
  --grano-color-neutral-400: #9E9EA6;
  --grano-color-neutral-300: #C4C4CA;
  --grano-color-neutral-200: #E0E0E4;
  --grano-color-neutral-100: #EEEEEF;
  --grano-color-neutral-50: #F3F3F3;
  --grano-color-neutral-white: #FFFFFF;
  --grano-color-background-primary: #F3F3F3;
  --grano-color-background-inverse: #1B1B1D;
  --grano-color-background-surface: #FFFFFF;
  --grano-color-text-primary: #1B1B1D;
  --grano-color-text-secondary: #56565C;
  --grano-color-text-inverse: #F3F3F3;
  --grano-color-text-accent: #D8FF36;
  --grano-color-action-primary: #3157FF;
  --grano-color-action-hover: #2445CC;
  --grano-color-border-default: #E0E0E4;
  --grano-color-border-subtle: #EEEEEF;
  --grano-spacing-xs: 4px;
  --grano-spacing-sm: 8px;
  --grano-spacing-md: 16px;
  --grano-spacing-lg: 24px;
  --grano-spacing-xl: 32px;
  --grano-spacing-2xl: 48px;
  --grano-spacing-3xl: 64px;
  --grano-spacing-4xl: 96px;
  --grano-radius-none: 0px;
  --grano-radius-sm: 4px;
  --grano-radius-md: 8px;
  --grano-radius-lg: 12px;
  --grano-radius-xl: 16px;
  --grano-radius-2xl: 24px;
  --grano-radius-full: 999px;
  --grano-spacing-step-12: 12px;
  --grano-spacing-step-40: 40px;
  --grano-spacing-step-80: 80px;
  --grano-spacing-step-120: 120px;
  --grano-spacing-step-160: 160px;
  --grano-typography-family: Sora;
  --grano-typography-display-xl-font-size: 80px;
  --grano-typography-display-xl-font-weight: 600;
  --grano-typography-display-xl-line-height: 1.1;
  --grano-typography-display-xl-letter-spacing: -2px;
  --grano-typography-display-xl-text-transform: none;
  --grano-typography-display-xl-text-decoration: none;
  --grano-typography-display-xl-paragraph-spacing: 0px;
  --grano-typography-display-large-font-size: 64px;
  --grano-typography-display-large-font-weight: 600;
  --grano-typography-display-large-line-height: 1.125;
  --grano-typography-display-large-letter-spacing: -1.5px;
  --grano-typography-display-large-text-transform: none;
  --grano-typography-display-large-text-decoration: none;
  --grano-typography-display-large-paragraph-spacing: 0px;
  --grano-typography-display-medium-font-size: 48px;
  --grano-typography-display-medium-font-weight: 400;
  --grano-typography-display-medium-line-height: 1.16667;
  --grano-typography-display-medium-letter-spacing: -1px;
  --grano-typography-display-medium-text-transform: none;
  --grano-typography-display-medium-text-decoration: none;
  --grano-typography-display-medium-paragraph-spacing: 0px;
  --grano-typography-heading-h1-font-size: 40px;
  --grano-typography-heading-h1-font-weight: 600;
  --grano-typography-heading-h1-line-height: 1.2;
  --grano-typography-heading-h1-letter-spacing: -0.8px;
  --grano-typography-heading-h1-text-transform: none;
  --grano-typography-heading-h1-text-decoration: none;
  --grano-typography-heading-h1-paragraph-spacing: 0px;
  --grano-typography-heading-h2-font-size: 32px;
  --grano-typography-heading-h2-font-weight: 600;
  --grano-typography-heading-h2-line-height: 1.25;
  --grano-typography-heading-h2-letter-spacing: -0.5px;
  --grano-typography-heading-h2-text-transform: none;
  --grano-typography-heading-h2-text-decoration: none;
  --grano-typography-heading-h2-paragraph-spacing: 0px;
  --grano-typography-heading-h3-font-size: 24px;
  --grano-typography-heading-h3-font-weight: 400;
  --grano-typography-heading-h3-line-height: 1.33333;
  --grano-typography-heading-h3-letter-spacing: -0.3px;
  --grano-typography-heading-h3-text-transform: none;
  --grano-typography-heading-h3-text-decoration: none;
  --grano-typography-heading-h3-paragraph-spacing: 0px;
  --grano-typography-heading-h4-font-size: 20px;
  --grano-typography-heading-h4-font-weight: 400;
  --grano-typography-heading-h4-line-height: 1.4;
  --grano-typography-heading-h4-letter-spacing: 0px;
  --grano-typography-heading-h4-text-transform: none;
  --grano-typography-heading-h4-text-decoration: none;
  --grano-typography-heading-h4-paragraph-spacing: 0px;
  --grano-typography-body-large-font-size: 18px;
  --grano-typography-body-large-font-weight: 400;
  --grano-typography-body-large-line-height: 1.55556;
  --grano-typography-body-large-letter-spacing: 0px;
  --grano-typography-body-large-text-transform: none;
  --grano-typography-body-large-text-decoration: none;
  --grano-typography-body-large-paragraph-spacing: 0px;
  --grano-typography-body-base-font-size: 14px;
  --grano-typography-body-base-font-weight: 400;
  --grano-typography-body-base-line-height: 1.71429;
  --grano-typography-body-base-letter-spacing: 0px;
  --grano-typography-body-base-text-transform: none;
  --grano-typography-body-base-text-decoration: none;
  --grano-typography-body-base-paragraph-spacing: 0px;
  --grano-typography-body-small-font-size: 12px;
  --grano-typography-body-small-font-weight: 400;
  --grano-typography-body-small-line-height: 1.33333;
  --grano-typography-body-small-letter-spacing: 0px;
  --grano-typography-body-small-text-transform: none;
  --grano-typography-body-small-text-decoration: none;
  --grano-typography-body-small-paragraph-spacing: 0px;
  --grano-typography-label-large-font-size: 16px;
  --grano-typography-label-large-font-weight: 400;
  --grano-typography-label-large-line-height: 1.5;
  --grano-typography-label-large-letter-spacing: 3px;
  --grano-typography-label-large-text-transform: uppercase;
  --grano-typography-label-large-text-decoration: none;
  --grano-typography-label-large-paragraph-spacing: 0px;
  --grano-typography-label-base-font-size: 14px;
  --grano-typography-label-base-font-weight: 400;
  --grano-typography-label-base-line-height: 1.42857;
  --grano-typography-label-base-letter-spacing: 3px;
  --grano-typography-label-base-text-transform: uppercase;
  --grano-typography-label-base-text-decoration: none;
  --grano-typography-label-base-paragraph-spacing: 0px;
  --grano-typography-label-small-font-size: 12px;
  --grano-typography-label-small-font-weight: 400;
  --grano-typography-label-small-line-height: 1.33333;
  --grano-typography-label-small-letter-spacing: 3px;
  --grano-typography-label-small-text-transform: uppercase;
  --grano-typography-label-small-text-decoration: none;
  --grano-typography-label-small-paragraph-spacing: 0px;
  --grano-typography-caption-font-size: 12px;
  --grano-typography-caption-font-weight: 400;
  --grano-typography-caption-line-height: 1.33333;
  --grano-typography-caption-letter-spacing: 0.2px;
  --grano-typography-caption-text-transform: none;
  --grano-typography-caption-text-decoration: none;
  --grano-typography-caption-paragraph-spacing: 0px;
  --grano-typography-button-text-font-size: 14px;
  --grano-typography-button-text-font-weight: 400;
  --grano-typography-button-text-line-height: normal;
  --grano-typography-button-text-letter-spacing: 1px;
  --grano-typography-button-text-text-transform: uppercase;
  --grano-typography-button-text-text-decoration: none;
  --grano-typography-button-text-paragraph-spacing: 0px;
  --grano-typography-menu-button-font-size: 14px;
  --grano-typography-menu-button-font-weight: 400;
  --grano-typography-menu-button-line-height: normal;
  --grano-typography-menu-button-letter-spacing: 4px;
  --grano-typography-menu-button-text-transform: uppercase;
  --grano-typography-menu-button-text-decoration: none;
  --grano-typography-menu-button-paragraph-spacing: 0px;
  --grano-typography-button-small-font-size: 12px;
  --grano-typography-button-small-font-weight: 400;
  --grano-typography-button-small-line-height: normal;
  --grano-typography-button-small-letter-spacing: 1px;
  --grano-typography-button-small-text-transform: uppercase;
  --grano-typography-button-small-text-decoration: none;
  --grano-typography-button-small-paragraph-spacing: 0px;
  --grano-typography-body-xs-font-size: 10px;
  --grano-typography-body-xs-font-weight: 400;
  --grano-typography-body-xs-line-height: 1.3;
  --grano-typography-body-xs-letter-spacing: 0px;
  --grano-typography-body-xs-text-transform: none;
  --grano-typography-body-xs-text-decoration: none;
  --grano-typography-body-xs-paragraph-spacing: 0px;
  --grano-effect-glass-default-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.25);
}