:root {
  --gray-900: rgba(16, 24, 40, 1);
  --gray-500: rgba(102, 112, 133, 1);
  --gray-600: rgba(71, 84, 103, 1);
  --gray-700: rgba(52, 64, 84, 1);
  --gray-200: rgba(228, 231, 236, 1);
  --white: rgba(255, 255, 255, 1);
  --gray-100: rgba(242, 244, 247, 1);
  --gray-50: rgba(249, 250, 251, 1);
  --success-100: rgba(209, 250, 223, 1);
  --success-50: rgba(236, 253, 243, 1);
  --warning-100: rgba(254, 240, 199, 1);
  --warning-50: rgba(255, 250, 235, 1);
  --success-600: rgba(3, 152, 85, 1);
  --success-700: rgba(2, 122, 72, 1);
  --text-xl-medium-font-family: "Inter", Helvetica;
  --text-xl-medium-font-weight: 500;
  --text-xl-medium-font-size: 20px;
  --text-xl-medium-letter-spacing: 0px;
  --text-xl-medium-line-height: 30px;
  --text-xl-medium-font-style: normal;
  --text-md-regular-font-family: "Inter", Helvetica;
  --text-md-regular-font-weight: 400;
  --text-md-regular-font-size: 16px;
  --text-md-regular-letter-spacing: 0px;
  --text-md-regular-line-height: 24px;
  --text-md-regular-font-style: normal;
  --display-md-semibold-font-family: "Inter", Helvetica;
  --display-md-semibold-font-weight: 600;
  --display-md-semibold-font-size: 36px;
  --display-md-semibold-letter-spacing: -0.72px;
  --display-md-semibold-line-height: 44px;
  --display-md-semibold-font-style: normal;
  --text-xl-semibold-font-family: "Inter", Helvetica;
  --text-xl-semibold-font-weight: 600;
  --text-xl-semibold-font-size: 20px;
  --text-xl-semibold-letter-spacing: 0px;
  --text-xl-semibold-line-height: 30px;
  --text-xl-semibold-font-style: normal;
  --text-lg-regular-font-family: "Inter", Helvetica;
  --text-lg-regular-font-weight: 400;
  --text-lg-regular-font-size: 18px;
  --text-lg-regular-letter-spacing: 0px;
  --text-lg-regular-line-height: 28px;
  --text-lg-regular-font-style: normal;
  --text-md-semibold-font-family: "Inter", Helvetica;
  --text-md-semibold-font-weight: 600;
  --text-md-semibold-font-size: 16px;
  --text-md-semibold-letter-spacing: 0px;
  --text-md-semibold-line-height: 24px;
  --text-md-semibold-font-style: normal;
  --text-xl-regular-font-family: "Inter", Helvetica;
  --text-xl-regular-font-weight: 400;
  --text-xl-regular-font-size: 20px;
  --text-xl-regular-letter-spacing: 0px;
  --text-xl-regular-line-height: 30px;
  --text-xl-regular-font-style: normal;
  --display-xl-semibold-font-family: "Inter", Helvetica;
  --display-xl-semibold-font-weight: 600;
  --display-xl-semibold-font-size: 60px;
  --display-xl-semibold-letter-spacing: -1.2px;
  --display-xl-semibold-line-height: 72px;
  --display-xl-semibold-font-style: normal;
  --text-lg-medium-font-family: "Inter", Helvetica;
  --text-lg-medium-font-weight: 500;
  --text-lg-medium-font-size: 18px;
  --text-lg-medium-letter-spacing: 0px;
  --text-lg-medium-line-height: 28px;
  --text-lg-medium-font-style: normal;
  --text-md-medium-font-family: "Inter", Helvetica;
  --text-md-medium-font-weight: 500;
  --text-md-medium-font-size: 16px;
  --text-md-medium-letter-spacing: 0px;
  --text-md-medium-line-height: 24px;
  --text-md-medium-font-style: normal;
  --text-sm-medium-font-family: "Inter", Helvetica;
  --text-sm-medium-font-weight: 500;
  --text-sm-medium-font-size: 14px;
  --text-sm-medium-letter-spacing: 0px;
  --text-sm-medium-line-height: 20px;
  --text-sm-medium-font-style: normal;
  --shadows-shadow-xs: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  --shadow-xs: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  --1-color-modes-colors-text-text-primary-900: var(--primitives-colors-gray-light-mode-900-duplicate);
  --1-color-modes-colors-text-text-primary-on-brand: var(--primitives-colors-base-white-duplicate);
  --1-color-modes-colors-text-text-tertiary-600: var(--primitives-colors-gray-light-mode-600);
  --1-color-modes-colors-text-text-brand-secondary-700: var(--primitives-colors-brand-700);
  --1-color-modes-colors-border-border-secondary: var(--primitives-colors-gray-light-mode-200);
  --1-color-modes-colors-border-border-disabled-subtle: var(--primitives-colors-gray-light-mode-200);
  --1-color-modes-colors-border-border-brand-solid-alt: var(--primitives-colors-brand-600);
  --1-color-modes-component-colors-utility-blue-utility-blue-500: var(--primitives-colors-blue-500);
  --1-color-modes-component-colors-utility-blue-utility-blue-600: var(--primitives-colors-blue-600);
  --1-color-modes-component-colors-components-avatars-avatar-contrast-border: rgba(0, 0, 0, 0.08);
  --1-color-modes-component-colors-components-avatars-avatar-focus-border: rgba(152, 162, 179, 0.14);
  --1-color-modes-component-colors-components-buttons-primary-button-primary-fg: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-fg-hover: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-bg: var(--primitives-colors-brand-600);
  --1-color-modes-component-colors-components-buttons-primary-button-primary-bg-hover: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-border: var(--primitives-colors-brand-600);
  --1-color-modes-component-colors-components-buttons-primary-button-primary-border-hover: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-secondary-button-secondary-bg: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-secondary-button-secondary-bg-hover: var(
    --primitives-colors-gray-light-mode-50
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-fg: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-fg-hover: var(
    --primitives-colors-brand-800
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-bg: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-tertiary-button-tertiary-fg: var(
    --primitives-colors-gray-light-mode-600
  );
  --1-color-modes-component-colors-components-buttons-tertiary-button-tertiary-bg-hover: var(
    --primitives-colors-gray-light-mode-50
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-hover: var(
    --primitives-colors-brand-800
  );
  --1-color-modes-colors-foreground-fg-white: var(--primitives-colors-base-white-duplicate);
  --1-color-modes-component-colors-components-icons-icons-icon-fg-brand: var(--primitives-colors-brand-600);
  --1-color-modes-component-colors-components-icons-featured-icons-light-featured-icon-light-fg-brand: var(
    --primitives-colors-brand-600
  );
  --1-color-modes-component-colors-components-icons-featured-icons-dark-featured-icon-dark-fg-brand: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-icons-featured-icons-dark-featured-icon-dark-fg-gray: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-icons-featured-icons-dark-featured-icon-dark-fg-error: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-icons-featured-icons-dark-featured-icon-dark-fg-warning: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-icons-featured-icons-dark-featured-icon-dark-fg-success: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-icons-featured-icons-modern-featured-icon-modern-border: var(
    --primitives-colors-gray-light-mode-200
  );
  --1-color-modes-colors-background-bg-primary: var(--primitives-colors-base-white-duplicate);
  --1-color-modes-colors-background-bg-secondary: var(--primitives-colors-gray-light-mode-50);
  --1-color-modes-colors-background-bg-secondary-solid: var(--primitives-colors-gray-light-mode-600);
  --1-color-modes-colors-background-bg-brand-solid: var(--primitives-colors-brand-600);
  --1-color-modes-colors-background-bg-brand-section: var(--primitives-colors-brand-800);
  --1-color-modes-colors-background-bg-brand-section-subtle: var(--primitives-colors-brand-700);
  --1-color-modes-colors-text-text-primary-900-duplicate: var(--primitives-colors-gray-light-mode-900-duplicate);
  --1-color-modes-colors-text-text-tertiary-600-duplicate: var(--primitives-colors-gray-light-mode-600);
  --1-color-modes-component-colors-components-avatars-avatar-contrast-border-duplicate: rgba(0, 0, 0, 0.08);
  --1-color-modes-component-colors-components-icons-featured-icons-modern-featured-icon-modern-border-duplicate: var(
    --primitives-colors-gray-light-mode-200
  );
  --1-color-modes-colors-foreground-fg-white-duplicate: var(--primitives-colors-base-white-duplicate);
  --1-color-modes-colors-background-bg-secondary-duplicate: var(--primitives-colors-gray-light-mode-50);
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-duplicate: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-hover-duplicate: var(
    --primitives-colors-brand-800
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-fg-duplicate: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-fg-hover-duplicate: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-bg-duplicate: var(
    --primitives-colors-brand-600
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-bg-hover-duplicate: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-border-duplicate: var(
    --primitives-colors-brand-600
  );
  --1-color-modes-component-colors-components-buttons-primary-button-primary-border-hover-duplicate: var(
    --primitives-colors-brand-700
  );
  --3-spacing-spacing-xxs: var(--primitives-spacing-0-5-2px);
  --3-spacing-spacing-sm: var(--primitives-spacing-1-5-6px);
  --3-spacing-spacing-md: var(--primitives-spacing-2-8px);
  --3-spacing-spacing-lg: var(--primitives-spacing-3-12px);
  --3-spacing-spacing-2xl: var(--primitives-spacing-5-20px);
  --3-spacing-spacing-4xl: var(--primitives-spacing-8-32px);
  --3-spacing-spacing-7xl: var(--primitives-spacing-16-64px);
  --3-spacing-spacing-9xl: var(--primitives-spacing-24-96px);
  --3-spacing-spacing-md-duplicate: var(--primitives-spacing-2-8px);
  --3-spacing-spacing-2xl-duplicate: var(--primitives-spacing-5-20px);
  --3-spacing-spacing-4xl-duplicate: var(--primitives-spacing-8-32px);
  --3-spacing-spacing-xxs-duplicate: var(--primitives-spacing-0-5-2px);
  --3-spacing-spacing-sm-duplicate: var(--primitives-spacing-1-5-6px);
  --3-spacing-spacing-lg-duplicate: var(--primitives-spacing-3-12px);
  --2-radius-radius-none: 0px;
  --2-radius-radius-sm: 6px;
  --2-radius-radius-md: 8px;
  --2-radius-radius-lg: 10px;
  --2-radius-radius-2xl: 16px;
  --2-radius-radius-full: 9999px;
  --2-radius-radius-full-duplicate: 9999px;
  --2-radius-radius-lg-duplicate: 10px;
  --2-radius-radius-md-duplicate: 8px;
  --4-widths-width-sm: var(--primitives-spacing-120-480px);
  --4-widths-width-xl: var(--primitives-spacing-192-768px);
  --primitives-colors-base-white: rgba(255, 255, 255, 1);
  --primitives-colors-gray-light-mode-900: rgba(16, 24, 40, 1);
  --primitives-colors-gray-light-mode-900-duplicate: rgba(16, 24, 40, 1);
  --primitives-colors-gray-light-mode-600: rgba(71, 84, 103, 1);
  --primitives-colors-base-white-duplicate: rgba(255, 255, 255, 1);
  --primitives-colors-gray-light-mode-200: rgba(234, 236, 240, 1);
  --primitives-spacing-2-8px: 8px;
  --primitives-spacing-0-5-2px: 2px;
  --primitives-spacing-5-20px: 20px;
  --primitives-colors-gray-dark-mode-50: rgba(245, 245, 246, 1);
  --primitives-colors-gray-dark-mode-400: rgba(148, 150, 156, 1);
  --primitives-spacing-120-480px: 480px;
  --primitives-spacing-192-768px: 768px;
  --primitives-spacing-1-5-6px: 6px;
  --primitives-colors-gray-dark-mode-700: rgba(51, 55, 65, 1);
  --primitives-spacing-3-12px: 12px;
  --primitives-spacing-8-32px: 32px;
  --primitives-colors-blue-500: rgba(46, 144, 250, 1);
  --primitives-spacing-16-64px: 64px;
  --primitives-spacing-320-1-280px: 1280px;
  --primitives-colors-blue-600: rgba(21, 112, 239, 1);
  --primitives-colors-blue-400: rgba(83, 177, 253, 1);
  --primitives-colors-gray-light-mode-50: rgba(249, 250, 251, 1);
  --primitives-colors-gray-dark-mode-900: rgba(22, 27, 38, 1);
  --primitives-spacing-24-96px: 96px;
  --primitives-colors-brand-700: rgba(105, 65, 198, 1);
  --primitives-colors-brand-800: rgba(83, 56, 158, 1);
  --primitives-colors-gray-dark-mode-950: rgba(12, 17, 29, 1);
  --primitives-colors-gray-dark-mode-300: rgba(206, 207, 210, 1);
  --primitives-colors-gray-dark-mode-100: rgba(240, 241, 241, 1);
  --primitives-colors-brand-600: rgba(127, 86, 217, 1);
  --5-containers-container-padding-desktop: var(--primitives-spacing-8-32px);
  --5-containers-container-max-width-desktop: var(--primitives-spacing-320-1-280px);
}

/*

To enable a theme in your HTML, simply add one of the following data attributes to an HTML element, like so:

<body data-1-color-modes-mode="light-mode">
    <!-- the rest of your content -->
</body>

You can apply the theme on any DOM node, not just the `body`

*/

[data-1-color-modes-mode="light-mode"] {
  --1-color-modes-colors-text-text-primary-900: var(--primitives-colors-gray-light-mode-900-duplicate);
  --1-color-modes-colors-text-text-primary-on-brand: var(--primitives-colors-base-white-duplicate);
  --1-color-modes-colors-text-text-tertiary-600: var(--primitives-colors-gray-light-mode-600);
  --1-color-modes-colors-text-text-brand-secondary-700: var(--primitives-colors-brand-700);
  --1-color-modes-colors-border-border-brand-solid-alt: var(--primitives-colors-brand-600);
  --1-color-modes-component-colors-utility-blue-utility-blue-600: var(--primitives-colors-blue-600);
  --1-color-modes-component-colors-components-avatars-avatar-contrast-border: rgba(0, 0, 0, 0.08);
  --1-color-modes-component-colors-components-buttons-secondary-button-secondary-bg: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-fg: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-fg-hover: var(
    --primitives-colors-brand-800
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-bg: var(
    --primitives-colors-base-white-duplicate
  );
  --1-color-modes-component-colors-components-buttons-tertiary-button-tertiary-fg: var(
    --primitives-colors-gray-light-mode-600
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-hover: var(
    --primitives-colors-brand-800
  );
  --1-color-modes-component-colors-components-icons-icons-icon-fg-brand: var(--primitives-colors-brand-600);
  --1-color-modes-component-colors-components-icons-featured-icons-modern-featured-icon-modern-border: var(
    --primitives-colors-gray-light-mode-200
  );
  --1-color-modes-colors-background-bg-primary: var(--primitives-colors-base-white-duplicate);
  --1-color-modes-colors-background-bg-secondary: var(--primitives-colors-gray-light-mode-50);
  --1-color-modes-colors-background-bg-brand-section: var(--primitives-colors-brand-800);
  --1-color-modes-colors-text-text-primary-900-duplicate: var(--primitives-colors-gray-light-mode-900-duplicate);
  --1-color-modes-colors-text-text-tertiary-600-duplicate: var(--primitives-colors-gray-light-mode-600);
  --1-color-modes-component-colors-components-avatars-avatar-contrast-border-duplicate: rgba(0, 0, 0, 0.08);
  --1-color-modes-component-colors-components-icons-featured-icons-modern-featured-icon-modern-border-duplicate: var(
    --primitives-colors-gray-light-mode-200
  );
  --1-color-modes-colors-background-bg-secondary-duplicate: var(--primitives-colors-gray-light-mode-50);
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-duplicate: var(
    --primitives-colors-brand-700
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-hover-duplicate: var(
    --primitives-colors-brand-800
  );
}

[data-1-color-modes-mode="dark-mode"] {
  --1-color-modes-colors-text-text-primary-900: var(--primitives-colors-gray-dark-mode-50);
  --1-color-modes-colors-text-text-primary-on-brand: var(--primitives-colors-gray-dark-mode-50);
  --1-color-modes-colors-text-text-tertiary-600: var(--primitives-colors-gray-dark-mode-400);
  --1-color-modes-colors-text-text-brand-secondary-700: var(--primitives-colors-gray-dark-mode-300);
  --1-color-modes-colors-border-border-brand-solid-alt: var(--primitives-colors-gray-dark-mode-700);
  --1-color-modes-component-colors-utility-blue-utility-blue-600: var(--primitives-colors-blue-400);
  --1-color-modes-component-colors-components-avatars-avatar-contrast-border: rgba(255, 255, 255, 0.12);
  --1-color-modes-component-colors-components-buttons-secondary-button-secondary-bg: var(
    --primitives-colors-gray-dark-mode-900
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-fg: var(
    --primitives-colors-gray-dark-mode-300
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-fg-hover: var(
    --primitives-colors-gray-dark-mode-100
  );
  --1-color-modes-component-colors-components-buttons-secondary-color-button-secondary-color-bg: var(
    --primitives-colors-gray-dark-mode-900
  );
  --1-color-modes-component-colors-components-buttons-tertiary-button-tertiary-fg: var(
    --primitives-colors-gray-dark-mode-400
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg: var(
    --primitives-colors-gray-dark-mode-300
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-hover: var(
    --primitives-colors-gray-dark-mode-100
  );
  --1-color-modes-component-colors-components-icons-icons-icon-fg-brand: var(--primitives-colors-gray-dark-mode-400);
  --1-color-modes-component-colors-components-icons-featured-icons-modern-featured-icon-modern-border: var(
    --primitives-colors-gray-dark-mode-700
  );
  --1-color-modes-colors-background-bg-primary: var(--primitives-colors-gray-dark-mode-950);
  --1-color-modes-colors-background-bg-secondary: var(--primitives-colors-gray-dark-mode-900);
  --1-color-modes-colors-background-bg-brand-section: var(--1-color-modes-colors-background-bg-secondary-duplicate);
  --1-color-modes-colors-text-text-primary-900-duplicate: var(--primitives-colors-gray-dark-mode-50);
  --1-color-modes-colors-text-text-tertiary-600-duplicate: var(--primitives-colors-gray-dark-mode-400);
  --1-color-modes-component-colors-components-avatars-avatar-contrast-border-duplicate: rgba(255, 255, 255, 0.12);
  --1-color-modes-component-colors-components-icons-featured-icons-modern-featured-icon-modern-border-duplicate: var(
    --primitives-colors-gray-dark-mode-700
  );
  --1-color-modes-colors-background-bg-secondary-duplicate: var(--primitives-colors-gray-dark-mode-900);
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-duplicate: var(
    --primitives-colors-gray-dark-mode-300
  );
  --1-color-modes-component-colors-components-buttons-tertiary-color-button-tertiary-color-fg-hover-duplicate: var(
    --primitives-colors-gray-dark-mode-100
  );
}