/* Dandy Brandy_color base */
:root {
  /* Mode 1 */
  /* color */
  --color-neutral-10: #f7f7f7;
  --color-neutral-100: #d0d0d0;
  --color-neutral-20: #f1f1f1;
  --color-neutral-200: #bfbfbf;
  --color-neutral-25: #ececec;
  --color-neutral-30: #eaeaea;
  --color-neutral-300: #adadad;
  --color-neutral-40: #e3e3e3;
  --color-neutral-400: #9c9c9c;
  --color-neutral-50: #dddddd;
  --color-neutral-500: #838383;
  --color-neutral-600: #7c7c7c;
  --color-neutral-700: #6a6a6a;
  --color-neutral-75: #d8d8d8;
  --color-neutral-800: #525252;
  --color-neutral-900: #404040;
  --color-neutral-910: #393939;
  --color-neutral-920: #2d2d2d;
  --color-neutral-930: #232323;
  --color-neutral-935: #212121;
  --color-neutral-940: #1e1e1e;
  --color-neutral-950: #101010;
  --color-primary-10: #fffcec;
  --color-primary-100: #f6e15d;
  --color-primary-200: #f1d841;
  --color-primary-25: #fff4ae;
  --color-primary-300: #ecd023;
  --color-primary-35: #feed88;
  --color-primary-400: #e5bd1a;
  --color-primary-50: #fae772;
  --color-primary-500: #dea811;
  --color-primary-600: #d79408;
  --color-primary-700: #d18101;
  --color-primary-800: #b87200;
  --color-primary-900: #a56702;
  --color-primary-910: #9a6002;
  --color-primary-920: #8e5902;
  --color-primary-935: #7d4e02;
  --color-primary-950: #5d3b04;
}

/* Project_02_color_styles */
.light,
.color-theme-light {
  --color-badge-bg-primary: var(--color-primary-400, #e5bd1a);
  --color-badge-bg-secondary: #ffffff;
  --color-bg-neutral-lg: #9c9c9cb2;
  --color-bg-neutral-md: var(--color-neutral-400, #9c9c9c);
  --color-bg-neutral-xs: var(--color-neutral-800, #525252);
  --color-bg-neutral-xs-2: #2d2d2db2;
  --color-border-neutral-lg: var(--color-primary-200, #f1d841);
  --color-border-neutral-md: var(--color-neutral-400, #9c9c9c);
  --color-button-filled-base-bg-active: var(--color-neutral-800, #525252);
  --color-button-filled-base-bg-default: var(--color-neutral-940, #1e1e1e);
  --color-button-filled-base-bg-disabled: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-base-bg-focus: var(--color-neutral-940, #1e1e1e);
  --color-button-filled-base-bg-hover: var(--color-neutral-910, #393939);
  --color-button-filled-base-bg-inverse-active: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-base-bg-inverse-default: var(--color-neutral-100, #d0d0d0);
  --color-button-filled-base-bg-inverse-disabled: var(--color-neutral-30, #eaeaea);
  --color-button-filled-base-bg-inverse-focus: var(--color-neutral-100, #d0d0d0);
  --color-button-filled-base-bg-inverse-hover: var(--color-neutral-400, #9c9c9c);
  --color-button-filled-base-content-active: #ffffff;
  --color-button-filled-base-content-default: #ffffff;
  --color-button-filled-base-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-base-content-focus: #ffffff;
  --color-button-filled-base-content-hover: #ffffff;
  --color-button-filled-base-content-inverse-active: #ffffff;
  --color-button-filled-base-content-inverse-default: #ffffff;
  --color-button-filled-base-content-inverse-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-base-content-inverse-focus: #ffffff;
  --color-button-filled-base-content-inverse-hover: #ffffff;
  --color-button-filled-neutal-bg-active: var(--color-neutral-700, #6a6a6a);
  --color-button-filled-neutal-bg-default: var(--color-neutral-920, #2d2d2d);
  --color-button-filled-neutal-bg-disabled: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-neutal-bg-focus: var(--color-neutral-920, #2d2d2d);
  --color-button-filled-neutal-bg-hover: var(--color-neutral-900, #404040);
  --color-button-filled-neutal-content-active: #ffffff;
  --color-button-filled-neutal-content-default: #ffffff;
  --color-button-filled-neutal-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-neutal-content-focus: #ffffff;
  --color-button-filled-neutal-content-hover: #ffffff;
  --color-button-filled-primary-bg-active: var(--color-primary-800, #b87200);
  --color-button-filled-primary-bg-default: var(--color-primary-400, #e5bd1a);
  --color-button-filled-primary-bg-disabled: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-primary-bg-focus: var(--color-primary-400, #e5bd1a);
  --color-button-filled-primary-bg-hover: var(--color-primary-600, #d79408);
  --color-button-filled-primary-content-active: #ffffff;
  --color-button-filled-primary-content-default: #ffffff;
  --color-button-filled-primary-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-primary-content-focus: #ffffff;
  --color-button-filled-primary-content-hover: #ffffff;
  --color-button-focus-primary-neutral: var(--color-neutral-500, #838383);
  --color-button-focus-primary-primary: var(--color-primary-500, #dea811);
  --color-button-text-neutral-content-primary-active: #ffffff;
  --color-button-text-neutral-content-primary-default: #ffffff;
  --color-button-text-neutral-content-primary-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-text-neutral-content-primary-focus: #ffffff;
  --color-button-text-neutral-content-primary-hover: #ffffff;
  --color-button-text-primary-content-active: #ffffff;
  --color-button-text-primary-content-default: #ffffff;
  --color-button-text-primary-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-text-primary-content-focus: #ffffff;
  --color-button-text-primary-content-hover: #ffffff;
  --color-content-neutral-primary: #ffffff;
  --color-content-neutral-secondary: var(--color-neutral-400, #9c9c9c);
  --color-content-neutral-tertiary: var(--color-neutral-800, #525252);
  --color-content-neutral-inverse-primary: #ffffff;
  --color-content-primary-primary: var(--color-primary-200, #f1d841);
  --color-content-primary-secondary: var(--color-primary-500, #dea811);
  --color-textfield-filled-neutral-bg-md-default-2: var(--color-neutral-940, #1e1e1e);
  --color-textfield-filled-neutral-bg-md-disabled: var(--color-neutral-200, #bfbfbf);
  --color-textfield-filled-neutral-bg-md-error: var(--color-neutral-200, #bfbfbf);
  --color-textfield-filled-neutral-bg-md-focus: var(--color-neutral-940, #1e1e1e);
  --color-textfield-filled-neutral-bg-md-hover: var(--color-neutral-910, #393939);
  --color-textfield-filled-neutral-content-default: var(--color-content-neutral-secondary, #9c9c9c);
  --color-textfield-outline-border-default: var(--color-neutral-940, #1e1e1e);
  --color-textfield-outline-border-disabled: var(--color-neutral-200, #bfbfbf);
  --color-textfield-outline-border-error: #f13434;
  --color-textfield-outline-border-focus: var(--color-neutral-600, #7c7c7c);
  --color-textfield-outline-border-hover: var(--color-neutral-910, #393939);
  --color-textfield-outline-content-default: var(--color-content-neutral-secondary, #9c9c9c);
  --color-textfield-outline-content-disabled: var(--color-content-neutral-tertiary, #525252);
  --color-textfield-outline-content-input: #ffffff;
}

.dark,
.color-theme-dark {
  --color-badge-bg-primary: var(--color-primary-400, #e5bd1a);
  --color-badge-bg-secondary: #ffffff;
  --color-bg-neutral-lg: #2d2d2d80;
  --color-bg-neutral-md: #2d2d2dcc;
  --color-bg-neutral-xs: var(--color-neutral-940, #1e1e1e);
  --color-bg-neutral-xs-2: #9c9c9cb2;
  --color-border-neutral-lg: var(--color-primary-200, #f1d841);
  --color-border-neutral-md: var(--color-neutral-400, #9c9c9c);
  --color-button-filled-base-bg-active: var(--color-neutral-800, #525252);
  --color-button-filled-base-bg-default: var(--color-neutral-940, #1e1e1e);
  --color-button-filled-base-bg-disabled: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-base-bg-focus: var(--color-neutral-940, #1e1e1e);
  --color-button-filled-base-bg-hover: var(--color-neutral-910, #393939);
  --color-button-filled-base-bg-inverse-active: var(--color-neutral-800, #525252);
  --color-button-filled-base-bg-inverse-default: var(--color-neutral-940, #1e1e1e);
  --color-button-filled-base-bg-inverse-disabled: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-base-bg-inverse-focus: var(--color-neutral-940, #1e1e1e);
  --color-button-filled-base-bg-inverse-hover: var(--color-neutral-910, #393939);
  --color-button-filled-base-content-active: #ffffff;
  --color-button-filled-base-content-default: #ffffff;
  --color-button-filled-base-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-base-content-focus: #ffffff;
  --color-button-filled-base-content-hover: #ffffff;
  --color-button-filled-base-content-inverse-active: #ffffff;
  --color-button-filled-base-content-inverse-default: #ffffff;
  --color-button-filled-base-content-inverse-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-base-content-inverse-focus: #ffffff;
  --color-button-filled-base-content-inverse-hover: #ffffff;
  --color-button-filled-neutal-bg-active: var(--color-neutral-700, #6a6a6a);
  --color-button-filled-neutal-bg-default: var(--color-neutral-920, #2d2d2d);
  --color-button-filled-neutal-bg-disabled: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-neutal-bg-focus: var(--color-neutral-920, #2d2d2d);
  --color-button-filled-neutal-bg-hover: var(--color-neutral-900, #404040);
  --color-button-filled-neutal-content-active: #ffffff;
  --color-button-filled-neutal-content-default: #ffffff;
  --color-button-filled-neutal-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-neutal-content-focus: #ffffff;
  --color-button-filled-neutal-content-hover: #ffffff;
  --color-button-filled-primary-bg-active: var(--color-primary-800, #b87200);
  --color-button-filled-primary-bg-default: var(--color-primary-400, #e5bd1a);
  --color-button-filled-primary-bg-disabled: var(--color-neutral-200, #bfbfbf);
  --color-button-filled-primary-bg-focus: var(--color-primary-400, #e5bd1a);
  --color-button-filled-primary-bg-hover: var(--color-primary-600, #d79408);
  --color-button-filled-primary-content-active: var(--color-neutral-930, #232323);
  --color-button-filled-primary-content-default: var(--color-neutral-930, #232323);
  --color-button-filled-primary-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-filled-primary-content-focus: var(--color-neutral-930, #232323);
  --color-button-filled-primary-content-hover: var(--color-neutral-930, #232323);
  --color-button-focus-primary-neutral: var(--color-neutral-500, #838383);
  --color-button-focus-primary-primary: var(--color-primary-500, #dea811);
  --color-button-text-neutral-content-primary-active: #ffffff;
  --color-button-text-neutral-content-primary-default: #ffffff;
  --color-button-text-neutral-content-primary-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-text-neutral-content-primary-focus: #ffffff;
  --color-button-text-neutral-content-primary-hover: #ffffff;
  --color-button-text-primary-content-active: #ffffff;
  --color-button-text-primary-content-default: #ffffff;
  --color-button-text-primary-content-disabled: var(--color-neutral-75, #d8d8d8);
  --color-button-text-primary-content-focus: #ffffff;
  --color-button-text-primary-content-hover: #ffffff;
  --color-content-neutral-primary: #ffffff;
  --color-content-neutral-secondary: var(--color-neutral-400, #9c9c9c);
  --color-content-neutral-tertiary: var(--color-neutral-800, #525252);
  --color-content-neutral-inverse-primary: #ffffff;
  --color-content-primary-primary: var(--color-primary-200, #f1d841);
  --color-content-primary-secondary: var(--color-primary-500, #dea811);
  --color-textfield-filled-neutral-bg-md-default-2: var(--color-neutral-940, #1e1e1e);
  --color-textfield-filled-neutral-bg-md-disabled: var(--color-neutral-200, #bfbfbf);
  --color-textfield-filled-neutral-bg-md-error: var(--color-neutral-200, #bfbfbf);
  --color-textfield-filled-neutral-bg-md-focus: var(--color-neutral-940, #1e1e1e);
  --color-textfield-filled-neutral-bg-md-hover: var(--color-neutral-910, #393939);
  --color-textfield-filled-neutral-content-default: var(--color-content-neutral-secondary, #9c9c9c);
  --color-textfield-outline-border-default: var(--color-neutral-940, #1e1e1e);
  --color-textfield-outline-border-disabled: var(--color-neutral-200, #bfbfbf);
  --color-textfield-outline-border-error: #f13434;
  --color-textfield-outline-border-focus: var(--color-neutral-600, #7c7c7c);
  --color-textfield-outline-border-hover: var(--color-neutral-910, #393939);
  --color-textfield-outline-content-default: var(--color-content-neutral-secondary, #9c9c9c);
  --color-textfield-outline-content-disabled: var(--color-content-neutral-tertiary, #525252);
  --color-textfield-outline-content-input: #ffffff;
}

/* Project_02_size */
/* Lg */
@media (min-width: 1180px) {
  /* Dandy_Brandy_ size */
  :root {
    /* Lg */
    /* number */
    --letter-spacing: 0.20000000298023224px;
    --line: 20.799999237060547px;
    --size-font-1xl-letter-spacing: 0px;
    --size-font-1xl-size: var(--size-base-5x-20, 20px);
    --size-font-1xl-line: 22px;
    --size-font-2xl-letter-spacing: 0px;
    --size-font-2xl-size: var(--size-base-5x-20, 20px);
    --size-font-2xl-line: 24px;
    --size-font-3xl-letter-spacing: 0px;
    --size-font-3xl-size: var(--size-base-7x-28, 28px);
    --size-font-3xl-line: 30.799999237060547px;
    --size-font-4xl-letter-spacing: 0px;
    --size-font-4xl-size: var(--size-base-9x-36, 36px);
    --size-font-4xl-line: 39.599998474121094px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-12x-48, 48px);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-14x-56, 56px);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-button-lg-letter-spacing: 0.20000000298023224px;
    --size-font-button-lg-size: var(--size-base-4x-16, 16px);
    --size-font-button-lg-line: 20.799999237060547px;
    --size-font-button-md-letter-spacing: 0px;
    --size-font-button-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-button-md-line: 15.399999618530273px;
    --size-font-button-sm-letter-spacing: 0px;
    --size-font-button-sm-size: var(--size-base-3x-12, 12px);
    --size-font-button-sm-line: 13.199999809265137px;
    --size-font-lg-letter-spacing: 0.10000000149011612px;
    --size-font-lg-size: var(--size-base-4x-16, 16px);
    --size-font-lg-line: 24px;
    --size-font-md-letter-spacing: 0px;
    --size-font-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-md-line: 15.399999618530273px;
    --size-font-sm-letter-spacing: 0.10000000149011612px;
    --size-font-sm-size: var(--size-base-3x-12, 12px);
    --size-font-sm-line: 15.600000381469727px;
    /* string */
    --size-font-1xl-line-percent: 130%;
    --size-font-2xl-line-percent: 130%;
    --size-font-3xl-line-percent: 110%;
    --size-font-4xl-line-percent: 110%;
    --size-font-5xl-line-percent: 110%;
    --size-font-6xl-line-percent: 110%;
    --size-font-button-lg-line-percent: 130%;
    --size-font-button-md-line-percent: 120%;
    --size-font-button-sm-line-percent: 100%;
    --size-font-lg-line-percent: 150%;
    --size-font-md-line-percent: 130%;
    --size-font-sm-line-percent: 130%;
  }
}
/* Md */
@media (min-width: 894px) and (max-width: 1179px) {
  /* Dandy_Brandy_ size */
  :root {
    /* Md */
    /* number */
    --letter-spacing: 0.20000000298023224px;
    --line: 20.799999237060547px;
    --size-font-1xl-letter-spacing: 0px;
    --size-font-1xl-size: var(--size-base-5x-20, 20px);
    --size-font-1xl-line: 22px;
    --size-font-2xl-letter-spacing: 0px;
    --size-font-2xl-size: var(--size-base-5x-20, 20px);
    --size-font-2xl-line: 24px;
    --size-font-3xl-letter-spacing: 0px;
    --size-font-3xl-size: var(--size-base-7x-28, 28px);
    --size-font-3xl-line: 30.799999237060547px;
    --size-font-4xl-letter-spacing: 0px;
    --size-font-4xl-size: var(--size-base-9x-36, 36px);
    --size-font-4xl-line: 39.599998474121094px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-12x-48, 48px);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-14x-56, 56px);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-button-lg-letter-spacing: 0.20000000298023224px;
    --size-font-button-lg-size: var(--size-base-4x-16, 16px);
    --size-font-button-lg-line: 20.799999237060547px;
    --size-font-button-md-letter-spacing: 0px;
    --size-font-button-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-button-md-line: 15.399999618530273px;
    --size-font-button-sm-letter-spacing: 0px;
    --size-font-button-sm-size: var(--size-base-3x-12, 12px);
    --size-font-button-sm-line: 13.199999809265137px;
    --size-font-lg-letter-spacing: 0.10000000149011612px;
    --size-font-lg-size: var(--size-base-4x-16, 16px);
    --size-font-lg-line: 24px;
    --size-font-md-letter-spacing: 0px;
    --size-font-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-md-line: 15.399999618530273px;
    --size-font-sm-letter-spacing: 0.10000000149011612px;
    --size-font-sm-size: var(--size-base-3x-12, 12px);
    --size-font-sm-line: 15.600000381469727px;
    /* string */
    --size-font-1xl-line-percent: 130%;
    --size-font-2xl-line-percent: 130%;
    --size-font-3xl-line-percent: 110%;
    --size-font-4xl-line-percent: 110%;
    --size-font-5xl-line-percent: 110%;
    --size-font-6xl-line-percent: 110%;
    --size-font-button-lg-line-percent: 130%;
    --size-font-button-md-line-percent: 120%;
    --size-font-button-sm-line-percent: 100%;
    --size-font-lg-line-percent: 150%;
    --size-font-md-line-percent: 130%;
    --size-font-sm-line-percent: 130%;
  }
}
/* Sm */
@media (min-width: 604px) and (max-width: 893px) {
  /* Dandy_Brandy_ size */
  :root {
    /* Sm */
    /* number */
    --letter-spacing: 0.20000000298023224px;
    --line: 20.799999237060547px;
    --size-font-1xl-letter-spacing: 0px;
    --size-font-1xl-size: var(--size-base-5x-20, 20px);
    --size-font-1xl-line: 22px;
    --size-font-2xl-letter-spacing: 0px;
    --size-font-2xl-size: var(--size-base-5x-20, 20px);
    --size-font-2xl-line: 24px;
    --size-font-3xl-letter-spacing: 0px;
    --size-font-3xl-size: var(--size-base-7x-28, 28px);
    --size-font-3xl-line: 30.799999237060547px;
    --size-font-4xl-letter-spacing: 0px;
    --size-font-4xl-size: var(--size-base-9x-36, 36px);
    --size-font-4xl-line: 39.599998474121094px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-12x-48, 48px);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-14x-56, 56px);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-button-lg-letter-spacing: 0.20000000298023224px;
    --size-font-button-lg-size: var(--size-base-4x-16, 16px);
    --size-font-button-lg-line: 20.799999237060547px;
    --size-font-button-md-letter-spacing: 0px;
    --size-font-button-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-button-md-line: 15.399999618530273px;
    --size-font-button-sm-letter-spacing: 0px;
    --size-font-button-sm-size: var(--size-base-3x-12, 12px);
    --size-font-button-sm-line: 13.199999809265137px;
    --size-font-lg-letter-spacing: 0.10000000149011612px;
    --size-font-lg-size: var(--size-base-4x-16, 16px);
    --size-font-lg-line: 24px;
    --size-font-md-letter-spacing: 0px;
    --size-font-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-md-line: 15.399999618530273px;
    --size-font-sm-letter-spacing: 0.10000000149011612px;
    --size-font-sm-size: var(--size-base-3x-12, 12px);
    --size-font-sm-line: 15.600000381469727px;
    /* string */
    --size-font-1xl-line-percent: 130%;
    --size-font-2xl-line-percent: 130%;
    --size-font-3xl-line-percent: 110%;
    --size-font-4xl-line-percent: 110%;
    --size-font-5xl-line-percent: 110%;
    --size-font-6xl-line-percent: 110%;
    --size-font-button-lg-line-percent: 130%;
    --size-font-button-md-line-percent: 120%;
    --size-font-button-sm-line-percent: 100%;
    --size-font-lg-line-percent: 150%;
    --size-font-md-line-percent: 130%;
    --size-font-sm-line-percent: 130%;
  }
}
/* Xs */
@media (max-width: 603px) {
  /* Dandy_Brandy_ size */
  :root {
    /* Xs */
    /* number */
    --letter-spacing: 0.20000000298023224px;
    --line: 20.799999237060547px;
    --size-font-1xl-letter-spacing: 0px;
    --size-font-1xl-size: var(--size-base-5x-20, 20px);
    --size-font-1xl-line: 22px;
    --size-font-2xl-letter-spacing: 0px;
    --size-font-2xl-size: var(--size-base-5x-20, 20px);
    --size-font-2xl-line: 24px;
    --size-font-3xl-letter-spacing: 0px;
    --size-font-3xl-size: var(--size-base-7x-28, 28px);
    --size-font-3xl-line: 30.799999237060547px;
    --size-font-4xl-letter-spacing: 0px;
    --size-font-4xl-size: var(--size-base-9x-36, 36px);
    --size-font-4xl-line: 39.599998474121094px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-12x-48, 48px);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-14x-56, 56px);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-button-lg-letter-spacing: 0.20000000298023224px;
    --size-font-button-lg-size: var(--size-base-4x-16, 16px);
    --size-font-button-lg-line: 20.799999237060547px;
    --size-font-button-md-letter-spacing: 0px;
    --size-font-button-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-button-md-line: 15.399999618530273px;
    --size-font-button-sm-letter-spacing: 0px;
    --size-font-button-sm-size: var(--size-base-3x-12, 12px);
    --size-font-button-sm-line: 13.199999809265137px;
    --size-font-lg-letter-spacing: 0.10000000149011612px;
    --size-font-lg-size: var(--size-base-4x-16, 16px);
    --size-font-lg-line: 24px;
    --size-font-md-letter-spacing: 0px;
    --size-font-md-size: var(--size-base-3-5x-14, 14px);
    --size-font-md-line: 15.399999618530273px;
    --size-font-sm-letter-spacing: 0.10000000149011612px;
    --size-font-sm-size: var(--size-base-3x-12, 12px);
    --size-font-sm-line: 15.600000381469727px;
    /* string */
    --size-font-1xl-line-percent: 130%;
    --size-font-2xl-line-percent: 130%;
    --size-font-3xl-line-percent: 110%;
    --size-font-4xl-line-percent: 110%;
    --size-font-5xl-line-percent: 110%;
    --size-font-6xl-line-percent: 110%;
    --size-font-button-lg-line-percent: 130%;
    --size-font-button-md-line-percent: 120%;
    --size-font-button-sm-line-percent: 100%;
    --size-font-lg-line-percent: 150%;
    --size-font-md-line-percent: 130%;
    --size-font-sm-line-percent: 130%;
  }
}
.radius-middle {
  --radius-card-lg: var(--size-base-7x-28, 28px);
  --radius-card-md: var(--size-base-7x-28, 28px);
  --radius-card-sm: var(--size-base-7x-28, 28px);
  --radius-card-img-sm: var(--size-base-5x-20, 20px);
}

/*# sourceMappingURL=vars.css.map */