:root {
  --base: rgba(0, 0, 0, 1);
  --surface: rgba(15, 15, 16, 1);
  --card: rgba(21, 21, 23, 1);
  --texto-primari: rgba(255, 255, 255, 1);
  --texto-secundario: rgba(179, 179, 179, 1);
  --texto-inabilitado: rgba(107, 114, 128, 1);
  --borders: rgba(38, 38, 38, 1);
  --resaltat: rgba(255, 199, 0, 1);
  --primary-0: rgba(255, 255, 255, 1);
  --secondary-500: rgba(26, 28, 30, 1);
  --h1-font-family: "Inter", Helvetica;
  --h1-font-weight: 700;
  --h1-font-size: 30px;
  --h1-letter-spacing: 0.09000000357627869px;
  --h1-line-height: normal;
  --h1-font-style: normal;
  --h2-font-family: "Inter", Helvetica;
  --h2-font-weight: 700;
  --h2-font-size: 18px;
  --h2-letter-spacing: 0.05400000214576721px;
  --h2-line-height: 23px;
  --h2-font-style: normal;
  --h3-font-family: "Inter", Helvetica;
  --h3-font-weight: 700;
  --h3-font-size: 24px;
  --h3-letter-spacing: 0.07200000286102295px;
  --h3-line-height: normal;
  --h3-font-style: normal;
  --body-font-family: "Inter", Helvetica;
  --body-font-weight: 600;
  --body-font-size: 14px;
  --body-letter-spacing: 0.04200000166893005px;
  --body-line-height: normal;
  --body-font-style: normal;
  --small-font-family: "Inter", Helvetica;
  --small-font-weight: 300;
  --small-font-size: 13px;
  --small-letter-spacing: 0.03900000154972076px;
  --small-line-height: normal;
  --small-font-style: normal;
  --bot-n-font-family: "Inter", Helvetica;
  --bot-n-font-weight: 700;
  --bot-n-font-size: 16px;
  --bot-n-letter-spacing: 0.048000001907348634px;
  --bot-n-line-height: normal;
  --bot-n-font-style: normal;
  --copyright-font-family: "Inter", Helvetica;
  --copyright-font-weight: 300;
  --copyright-font-size: 11px;
  --copyright-letter-spacing: 0.033000001311302186px;
  --copyright-line-height: normal;
  --copyright-font-style: normal;
  --heading-h1-font-family: "Inter", Helvetica;
  --heading-h1-font-weight: 700;
  --heading-h1-font-size: 32px;
  --heading-h1-letter-spacing: -0.64px;
  --heading-h1-line-height: 129.99999523162842%;
  --heading-h1-font-style: normal;
  --body-small-medium-font-family: "Inter", Helvetica;
  --body-small-medium-font-weight: 500;
  --body-small-medium-font-size: 14px;
  --body-small-medium-letter-spacing: -0.14px;
  --body-small-medium-line-height: 139.9999976158142%;
  --body-small-medium-font-style: normal;
  --heading-h3-font-family: "Inter", Helvetica;
  --heading-h3-font-weight: 700;
  --heading-h3-font-size: 18px;
  --heading-h3-letter-spacing: -0.20000000298023224px;
  --heading-h3-line-height: 26px;
  --heading-h3-font-style: normal;
  --body-small-font-family: "Inter", Helvetica;
  --body-small-font-weight: 400;
  --body-small-font-size: 14px;
  --body-small-letter-spacing: 0px;
  --body-small-line-height: 20px;
  --body-small-font-style: normal;
  --body-smallstrong-font-family: "Inter", Helvetica;
  --body-smallstrong-font-weight: 600;
  --body-smallstrong-font-size: 14px;
  --body-smallstrong-letter-spacing: 0px;
  --body-smallstrong-line-height: 20px;
  --body-smallstrong-font-style: normal;
  --body-default-font-family: "Inter", Helvetica;
  --body-default-font-weight: 400;
  --body-default-font-size: 16px;
  --body-default-letter-spacing: 0px;
  --body-default-line-height: 22px;
  --body-default-font-style: normal;
  --body-defaultstrong-font-family: "Inter", Helvetica;
  --body-defaultstrong-font-weight: 600;
  --body-defaultstrong-font-size: 16px;
  --body-defaultstrong-letter-spacing: 0px;
  --body-defaultstrong-line-height: 22px;
  --body-defaultstrong-font-style: normal;
  --body-tinystrong-font-family: "Inter", Helvetica;
  --body-tinystrong-font-weight: 600;
  --body-tinystrong-font-size: 12px;
  --body-tinystrong-letter-spacing: 0px;
  --body-tinystrong-line-height: 18px;
  --body-tinystrong-font-style: normal;
  --medium-type-12-font-family: "Plus Jakarta Sans", Helvetica;
  --medium-type-12-font-weight: 500;
  --medium-type-12-font-size: 12px;
  --medium-type-12-letter-spacing: -0.24px;
  --medium-type-12-line-height: 160.0000023841858%;
  --medium-type-12-font-style: normal;
  --mode-headline: rgba(17, 24, 39, 1);
  --alias-textcolor-default: var(--brand-neutral-nr11);
  --alias-bgcolor-light: var(--brand-neutral-nr01);
  --spacing-spacing-xxxs: 2px;
  --spacing-spacing-xs: 6px;
  --spacing-spacing-smd: 12px;
  --spacing-spacing-lg: 24px;
  --mode-stroke: rgba(237, 241, 243, 1);
  --mode-grey: rgba(108, 114, 120, 1);
  --brand-neutral-nr11: rgba(11, 11, 11, 1);
  --brand-neutral-nr01: rgba(255, 255, 255, 1);
  --brand-neutral-nr10: rgba(35, 35, 35, 1);
  --brand-radi-xl: 16px;
  --radii-radi-mlg: 8px;
  --themes-textcolor-default-duplicate: var(--brands-neutral-nr20);
  --themes-textcolor-primary: var(--brands-primary-pr10);
  --themes-textcolor-secdefault: var(--brands-neutral-nr07);
  --themes-bgcolor-light-duplicate: var(--brands-neutral-nr01-duplicate);
  --themes-strokecolor-primary: var(--brands-primary-pr10);
  --themes-bgcolor-lightprimary: var(--brands-primary-pr01);
  --themes-textcolor-light: var(--brands-neutral-nr01-duplicate);
  --themes-bgcolor-orange: var(--brands-sem-or10);
  --brands-neutral-nr20: rgba(28, 28, 28, 1);
  --brands-primary-pr10: rgba(24, 73, 214, 1);
  --brands-neutral-nr07: rgba(175, 175, 175, 1);
  --brands-neutral-nr01-duplicate: rgba(255, 255, 255, 1);
  --brands-primary-pr06: rgba(108, 141, 239, 1);
  --brands-neutral-nr09: rgba(142, 142, 142, 1);
  --brands-primary-pr01: rgba(231, 236, 252, 1);
  --brands-primary-pr19: rgba(12, 36, 107, 1);
  --brands-sem-or10: rgba(255, 162, 77, 1);
}

/*

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

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

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

*/

[data-mode-mode="light"] {
  --mode-headline: rgba(17, 24, 39, 1);
}

[data-mode-mode="dark"] {
  --mode-headline: rgba(255, 255, 255, 1);
}

[data-alias-mode="light"] {
  --alias-textcolor-default: var(--brand-neutral-nr11);
  --alias-bgcolor-light: var(--brand-neutral-nr01);
}

[data-alias-mode="dark"] {
  --alias-textcolor-default: var(--brand-neutral-nr01);
  --alias-bgcolor-light: var(--brand-neutral-nr10);
}

[data-spacing-mode="default"] {
  --spacing-spacing-xxxs: 2px;
  --spacing-spacing-xs: 6px;
  --spacing-spacing-smd: 12px;
  --spacing-spacing-lg: 24px;
}

[data-spacing-mode="medium"] {
  --spacing-spacing-xxxs: 6px;
  --spacing-spacing-xs: 10px;
  --spacing-spacing-smd: 16px;
  --spacing-spacing-lg: 28px;
}

[data-spacing-mode="large"] {
  --spacing-spacing-xxxs: 12px;
  --spacing-spacing-xs: 16px;
  --spacing-spacing-smd: 22px;
  --spacing-spacing-lg: 34px;
}

[data-spacing-mode="big"] {
  --spacing-spacing-xxxs: 14px;
  --spacing-spacing-xs: 18px;
  --spacing-spacing-smd: 24px;
  --spacing-spacing-lg: 36px;
}

[data-mode-mode="lightmode"] {
  --mode-stroke: rgba(237, 241, 243, 1);
}

[data-mode-mode="darkmode"] {
  --mode-stroke: rgba(26, 28, 30, 1);
}

[data-radii-mode="default"] {
  --radii-radi-mlg: 8px;
}

[data-radii-mode="medium"] {
  --radii-radi-mlg: 16px;
}

[data-radii-mode="large"] {
  --radii-radi-mlg: 24px;
}

[data-radii-mode="big"] {
  --radii-radi-mlg: 32px;
}

[data-themes-mode="light"] {
  --themes-textcolor-default-duplicate: var(--brands-neutral-nr20);
  --themes-textcolor-primary: var(--brands-primary-pr10);
  --themes-textcolor-secdefault: var(--brands-neutral-nr07);
  --themes-bgcolor-light-duplicate: var(--brands-neutral-nr01-duplicate);
  --themes-bgcolor-lightprimary: var(--brands-primary-pr01);
  --themes-textcolor-light: var(--brands-neutral-nr01-duplicate);
}

[data-themes-mode="dark"] {
  --themes-textcolor-default-duplicate: var(--brands-neutral-nr01-duplicate);
  --themes-textcolor-primary: var(--brands-primary-pr06);
  --themes-textcolor-secdefault: var(--brands-neutral-nr09);
  --themes-bgcolor-light-duplicate: var(--brands-neutral-nr20);
  --themes-bgcolor-lightprimary: var(--brands-primary-pr19);
  --themes-textcolor-light: var(--brands-neutral-nr20);
}

[data-brands-mode="core"] {
  --brands-neutral-nr20: rgba(28, 28, 28, 1);
  --brands-primary-pr10: rgba(24, 73, 214, 1);
  --brands-neutral-nr07: rgba(175, 175, 175, 1);
  --brands-primary-pr06: rgba(108, 141, 239, 1);
  --brands-neutral-nr09: rgba(142, 142, 142, 1);
  --brands-primary-pr01: rgba(231, 236, 252, 1);
  --brands-primary-pr19: rgba(12, 36, 107, 1);
}

[data-brands-mode="brand-1"] {
  --brands-neutral-nr20: rgba(51, 51, 51, 1);
  --brands-primary-pr10: rgba(58, 24, 214, 1);
  --brands-neutral-nr07: rgba(184, 184, 184, 1);
  --brands-primary-pr06: rgba(132, 108, 239, 1);
  --brands-neutral-nr09: rgba(153, 153, 153, 1);
  --brands-primary-pr01: rgba(235, 231, 252, 1);
  --brands-primary-pr19: rgba(29, 12, 107, 1);
}

[data-brands-mode="brand-2"] {
  --brands-neutral-nr20: rgba(40, 40, 40, 1);
  --brands-primary-pr10: rgba(99, 91, 255, 1);
  --brands-neutral-nr07: rgba(180, 180, 180, 1);
  --brands-primary-pr06: rgba(161, 157, 255, 1);
  --brands-neutral-nr09: rgba(147, 147, 147, 1);
  --brands-primary-pr01: rgba(239, 239, 255, 1);
  --brands-primary-pr19: rgba(9, 0, 173, 1);
}

[data-brands-mode="brand-3"] {
  --brands-neutral-nr20: rgba(18, 17, 17, 1);
  --brands-primary-pr10: rgba(232, 30, 97, 1);
  --brands-neutral-nr07: rgba(174, 169, 169, 1);
  --brands-primary-pr06: rgba(241, 120, 160, 1);
  --brands-neutral-nr09: rgba(140, 133, 133, 1);
  --brands-primary-pr01: rgba(253, 232, 239, 1);
  --brands-primary-pr19: rgba(119, 12, 48, 1);
}
:root {
  --base: rgba(0, 0, 0, 1);
  --surface: rgba(15, 15, 16, 1);
  --card: rgba(21, 21, 23, 1);
  --texto-primari: rgba(255, 255, 255, 1);
  --texto-secundario: rgba(179, 179, 179, 1);
  --texto-inabilitado: rgba(107, 114, 128, 1);
  --borders: rgba(38, 38, 38, 1);
  --resaltat: rgba(255, 199, 0, 1);
  --primary-0: rgba(255, 255, 255, 1);
  --texttxt-tertiary: rgba(60, 60, 67, 0.5);
  --texttxt-primary: rgba(0, 0, 0, 1);
  --texttxt-secondary: rgba(60, 60, 67, 0.85);
  --backgroundbg-primary: rgba(255, 255, 255, 1);
  --dividerprimary: rgba(255, 255, 255, 1);
  --h1-font-family: "Inter", Helvetica;
  --h1-font-weight: 700;
  --h1-font-size: 30px;
  --h1-letter-spacing: 0.09000000357627869px;
  --h1-line-height: normal;
  --h1-font-style: normal;
  --h2-font-family: "Inter", Helvetica;
  --h2-font-weight: 700;
  --h2-font-size: 18px;
  --h2-letter-spacing: 0.05400000214576721px;
  --h2-line-height: 23px;
  --h2-font-style: normal;
  --h3-font-family: "Inter", Helvetica;
  --h3-font-weight: 700;
  --h3-font-size: 24px;
  --h3-letter-spacing: 0.07200000286102295px;
  --h3-line-height: normal;
  --h3-font-style: normal;
  --body-font-family: "Inter", Helvetica;
  --body-font-weight: 600;
  --body-font-size: 14px;
  --body-letter-spacing: 0.04200000166893005px;
  --body-line-height: normal;
  --body-font-style: normal;
  --small-font-family: "Inter", Helvetica;
  --small-font-weight: 300;
  --small-font-size: 13px;
  --small-letter-spacing: 0.03900000154972076px;
  --small-line-height: normal;
  --small-font-style: normal;
  --bot-n-font-family: "Inter", Helvetica;
  --bot-n-font-weight: 700;
  --bot-n-font-size: 16px;
  --bot-n-letter-spacing: 0.048000001907348634px;
  --bot-n-line-height: normal;
  --bot-n-font-style: normal;
  --copyright-font-family: "Inter", Helvetica;
  --copyright-font-weight: 300;
  --copyright-font-size: 11px;
  --copyright-letter-spacing: 0.033000001311302186px;
  --copyright-line-height: normal;
  --copyright-font-style: normal;
  --large-title-3-strong-font-family: "Inter", Helvetica;
  --large-title-3-strong-font-weight: 700;
  --large-title-3-strong-font-size: 48px;
  --large-title-3-strong-letter-spacing: 0.25px;
  --large-title-3-strong-line-height: 120.00000476837158%;
  --large-title-3-strong-font-style: normal;
  --heading-h1-font-family: "Inter", Helvetica;
  --heading-h1-font-weight: 700;
  --heading-h1-font-size: 32px;
  --heading-h1-letter-spacing: -0.64px;
  --heading-h1-line-height: 129.99999523162842%;
  --heading-h1-font-style: normal;
  --title-1-strong-font-family: "Inter", Helvetica;
  --title-1-strong-font-weight: 700;
  --title-1-strong-font-size: 32px;
  --title-1-strong-letter-spacing: 0px;
  --title-1-strong-line-height: 120.00000476837158%;
  --title-1-strong-font-style: normal;
  --text-1-regular-font-family: "Inter", Helvetica;
  --text-1-regular-font-weight: 400;
  --text-1-regular-font-size: 20px;
  --text-1-regular-letter-spacing: 0px;
  --text-1-regular-line-height: 139.9999976158142%;
  --text-1-regular-font-style: normal;
}