$sb-border-radius-none: var(--sb-border-radius-none, 0);
$sb-border-radius-xs: var(--sb-border-radius-xs, 4px);
$sb-border-radius-sm: var(--sb-border-radius-sm, 6px);
$sb-border-radius-base: var(--sb-border-radius-base, 8px);
$sb-border-radius-md: var(--sb-border-radius-md, 10px);
$sb-border-radius-lg: var(--sb-border-radius-lg, 12px);
$sb-border-radius-full: var(--sb-border-radius-full, 100%);
$sb-border-width-none: var(--sb-border-width-none, 0);
$sb-border-width-sm: var(--sb-border-width-sm, 1px);
$sb-border-width-md: var(--sb-border-width-md, 2px);
$sb-border-width-lg: var(--sb-border-width-lg, 4px);
$sb-border-width-xl: var(--sb-border-width-xl, 8px);
$sb-color-primary-50: var(--sb-color-primary-50, #eefbfa);
$sb-color-primary-100: var(--sb-color-primary-100, #c2dedc);
$sb-color-primary-200: var(--sb-color-primary-200, #acd3d1);
$sb-color-primary-300: var(--sb-color-primary-300, #8dc3c1);
$sb-color-primary-400: var(--sb-color-primary-400, #60b2ae);
$sb-color-primary-500: var(--sb-color-primary-500, #359993);
$sb-color-primary-600: var(--sb-color-primary-600, #2c8684);
$sb-color-primary-700: var(--sb-color-primary-700, #05807f);
$sb-color-primary-800: var(--sb-color-primary-800, #0a6465);
$sb-color-primary-900: var(--sb-color-primary-900, #03494a);
$sb-color-primary-950: var(--sb-color-primary-950, #003033);
$sb-color-secondary-50: var(--sb-color-secondary-50, #f7f9fc);
$sb-color-secondary-100: var(--sb-color-secondary-100, #dde3ee);
$sb-color-secondary-200: var(--sb-color-secondary-200, #b5c0e2);
$sb-color-secondary-300: var(--sb-color-secondary-300, #9eaacf);
$sb-color-secondary-400: var(--sb-color-secondary-400, #9eaacf);
$sb-color-secondary-500: var(--sb-color-secondary-500, #8794bc);
$sb-color-secondary-600: var(--sb-color-secondary-600, #5f6e9a);
$sb-color-secondary-700: var(--sb-color-secondary-700, #495781);
$sb-color-secondary-800: var(--sb-color-secondary-800, #424d6d);
$sb-color-secondary-900: var(--sb-color-secondary-900, #293455);
$sb-color-secondary-950: var(--sb-color-secondary-950, #1b243f);
$sb-color-base-50: var(--sb-color-base-50, #f6f7f8);
$sb-color-base-100: var(--sb-color-base-100, #ebecee);
$sb-color-base-200: var(--sb-color-base-200, #dbdde2);
$sb-color-base-300: var(--sb-color-base-300, #c3c7cd);
$sb-color-base-400: var(--sb-color-base-400, #b1b5be);
$sb-color-base-500: var(--sb-color-base-500, #8f93a2);
$sb-color-base-600: var(--sb-color-base-600, #717384);
$sb-color-base-700: var(--sb-color-base-700, #5f616e);
$sb-color-base-800: var(--sb-color-base-800, #4f5059);
$sb-color-base-900: var(--sb-color-base-900, #333338);
$sb-color-base-950: var(--sb-color-base-950, #242429);
$sb-color-info-50: var(--sb-color-info-50, #f1f5fd);
$sb-color-info-100: var(--sb-color-info-100, #e0e9f9);
$sb-color-info-200: var(--sb-color-info-200, #c8d9f5);
$sb-color-info-300: var(--sb-color-info-300, #a2c1ee);
$sb-color-info-400: var(--sb-color-info-400, #75a0e5);
$sb-color-info-500: var(--sb-color-info-500, #557fdc);
$sb-color-info-600: var(--sb-color-info-600, #395ece);
$sb-color-info-700: var(--sb-color-info-700, #3751be);
$sb-color-info-800: var(--sb-color-info-800, #32449b);
$sb-color-info-900: var(--sb-color-info-900, #2d3c7b);
$sb-color-info-950: var(--sb-color-info-950, #1b243f);
$sb-color-success-50: var(--sb-color-success-50, #eefbf4);
$sb-color-success-100: var(--sb-color-success-100, #d7f4e3);
$sb-color-success-200: var(--sb-color-success-200, #b2e8cb);
$sb-color-success-300: var(--sb-color-success-300, #7fd6ac);
$sb-color-success-400: var(--sb-color-success-400, #4bbc8a);
$sb-color-success-500: var(--sb-color-success-500, #2db47d);
$sb-color-success-600: var(--sb-color-success-600, #1a8159);
$sb-color-success-700: var(--sb-color-success-700, #15674a);
$sb-color-success-800: var(--sb-color-success-800, #13523b);
$sb-color-success-900: var(--sb-color-success-900, #104432);
$sb-color-success-950: var(--sb-color-success-950, #08261d);
$sb-color-warning-50: var(--sb-color-warning-50, #fff4d5);
$sb-color-warning-100: var(--sb-color-warning-100, #ffe6aa);
$sb-color-warning-200: var(--sb-color-warning-200, #fcd867);
$sb-color-warning-300: var(--sb-color-warning-300, #fbce41);
$sb-color-warning-400: var(--sb-color-warning-400, #fabd25);
$sb-color-warning-500: var(--sb-color-warning-500, #f49c0c);
$sb-color-warning-600: var(--sb-color-warning-600, #d87507);
$sb-color-warning-700: var(--sb-color-warning-700, #b65e00);
$sb-color-warning-800: var(--sb-color-warning-800, #913f0f);
$sb-color-warning-900: var(--sb-color-warning-900, #78340f);
$sb-color-warning-950: var(--sb-color-warning-950, #451903);
$sb-color-danger-50: var(--sb-color-danger-50, #fff2f1);
$sb-color-danger-100: var(--sb-color-danger-100, #ffe2e1);
$sb-color-danger-200: var(--sb-color-danger-200, #ffcac7);
$sb-color-danger-300: var(--sb-color-danger-300, #ffa5a0);
$sb-color-danger-400: var(--sb-color-danger-400, #ff6159);
$sb-color-danger-500: var(--sb-color-danger-500, #f83c3b);
$sb-color-danger-600: var(--sb-color-danger-600, #e5271d);
$sb-color-danger-700: var(--sb-color-danger-700, #c11c14);
$sb-color-danger-800: var(--sb-color-danger-800, #a01b14);
$sb-color-danger-900: var(--sb-color-danger-900, #841d18);
$sb-color-danger-950: var(--sb-color-danger-950, #480a07);
$sb-color-neutral-white: var(--sb-color-neutral-white, #fff);
$sb-color-neutral-black: var(--sb-color-neutral-black, #000);
$sb-color-overlay-primary-subtle: var(
  --sb-color-overlay-primary-subtle,
  rgb(27 36 63 / 8%)
);
$sb-color-overlay-primary: var(--sb-color-overlay-primary, rgb(27 36 63 / 14%));
$sb-color-overlay-primary-bold: var(
  --sb-color-overlay-primary-bold,
  rgb(27 36 63 / 50%)
);
$sb-color-overlay-secondary-subtle: var(
  --sb-color-overlay-secondary-subtle,
  rgb(246 247 248 / 8%)
);
$sb-color-overlay-secondary: var(
  --sb-color-overlay-secondary,
  rgb(246 247 248 / 14%)
);
$sb-color-overlay-secondary-bold: var(
  --sb-color-overlay-secondary-bold,
  rgb(246 247 248 / 50%)
);
$sb-color-overlay-darkness: var(--sb-color-overlay-darkness, rgb(0 0 0 / 14%));
$sb-color-overlay-transparent: var(
  --sb-color-overlay-transparent,
  rgb(255 255 255 / 0%)
);
$sb-color-highlight-50: var(--sb-color-highlight-50, #fbf8fc);
$sb-color-highlight-100: var(--sb-color-highlight-100, #f5eef9);
$sb-color-highlight-200: var(--sb-color-highlight-200, #e2d6fe);
$sb-color-highlight-300: var(--sb-color-highlight-300, #cbb5fd);
$sb-color-highlight-400: var(--sb-color-highlight-400, #ad8bfa);
$sb-color-highlight-500: var(--sb-color-highlight-500, #8b5cf6);
$sb-color-highlight-600: var(--sb-color-highlight-600, #713aed);
$sb-color-highlight-700: var(--sb-color-highlight-700, #5e28d9);
$sb-color-highlight-800: var(--sb-color-highlight-800, #4e21b6);
$sb-color-highlight-900: var(--sb-color-highlight-900, #421d95);
$sb-color-highlight-950: var(--sb-color-highlight-950, #2a1065);
$sb-font-family-base: var(--sb-font-family-base, Roboto);
$sb-font-family-mono: var(--sb-font-family-mono, 'Roboto Mono');
$sb-font-weight-regular: var(--sb-font-weight-regular, 400);
$sb-font-weight-medium: var(--sb-font-weight-medium, 500);
$sb-font-weight-bold: var(--sb-font-weight-bold, 700);
$sb-font-size-xs: var(--sb-font-size-xs, 1rem);
$sb-font-size-sm: var(--sb-font-size-sm, 1.2rem);
$sb-font-size-base: var(--sb-font-size-base, 1.4rem);
$sb-font-size-lg: var(--sb-font-size-lg, 1.6rem);
$sb-font-size-xl: var(--sb-font-size-xl, 2rem);
$sb-font-size-2xl: var(--sb-font-size-2xl, 2.4rem);
$sb-font-size-3xl: var(--sb-font-size-3xl, 3rem);
$sb-font-letter-spacing-tighter: var(--sb-font-letter-spacing-tighter, -1);
$sb-font-letter-spacing-tight: var(--sb-font-letter-spacing-tight, -0.5);
$sb-font-letter-spacing-normal: var(--sb-font-letter-spacing-normal, 0);
$sb-font-letter-spacing-wide: var(--sb-font-letter-spacing-wide, 0.5);
$sb-font-letter-spacing-wider: var(--sb-font-letter-spacing-wider, 1);
$sb-font-line-height-tight: var(--sb-font-line-height-tight, 1);
$sb-font-line-height-medium: var(--sb-font-line-height-medium, 1.2);
$sb-font-line-height-distant: var(--sb-font-line-height-distant, 1.4);
$sb-font-line-height-half-distant: var(--sb-font-line-height-half-distant, 1.7);
$sb-font-line-height-super-distant: var(--sb-font-line-height-super-distant, 2);
$sb-font-case-original: var(--sb-font-case-original, none);
$sb-font-case-lowercase: var(--sb-font-case-lowercase, lowercase);
$sb-font-case-uppercase: var(--sb-font-case-uppercase, uppercase);
$sb-font-case-capitalize: var(--sb-font-case-capitalize, capitalize);
$sb-opacity-level-none: var(--sb-opacity-level-none, 100%);
$sb-opacity-level-semiopaque: var(--sb-opacity-level-semiopaque, 80%);
$sb-opacity-level-intense: var(--sb-opacity-level-intense, 64%);
$sb-opacity-level-medium: var(--sb-opacity-level-medium, 32%);
$sb-opacity-level-light: var(--sb-opacity-level-light, 16%);
$sb-opacity-level-semitransparent: var(--sb-opacity-level-semitransparent, 8%);
$sb-opacity-level-transparent: var(--sb-opacity-level-transparent, 0%);
$sb-shadow-level-1: var(--sb-shadow-level-1, 0 4px 8px 0 rgb(27 36 63 / 8%));
$sb-shadow-level-2: var(--sb-shadow-level-2, 0 8px 24px 0 rgb(27 36 63 / 8%));
$sb-shadow-level-3: var(--sb-shadow-level-3, 0 16px 32px 0 rgb(27 36 63 / 8%));
$sb-shadow-level-4: var(--sb-shadow-level-4, 0 16px 48px 0 rgb(27 36 63 / 8%));
$sb-size-unit-none: var(--sb-size-unit-none, 0);
$sb-size-unit-2xs: var(--sb-size-unit-2xs, 2px);
$sb-size-unit-xs: var(--sb-size-unit-xs, 4px);
$sb-size-unit-sm: var(--sb-size-unit-sm, 6px);
$sb-size-unit-base: var(--sb-size-unit-base, 8px);
$sb-size-unit-md: var(--sb-size-unit-md, 10px);
$sb-size-unit-lg: var(--sb-size-unit-lg, 12px);
$sb-size-unit-xl: var(--sb-size-unit-xl, 16px);
$sb-size-unit-2xl: var(--sb-size-unit-2xl, 24px);
$sb-size-unit-3xl: var(--sb-size-unit-3xl, 48px);
$sb-size-view-port-default: var(--sb-size-view-port-default, 1440px);
$sb-size-spacing-none: var(--sb-size-spacing-none, 0);
$sb-size-spacing-2xs: var(--sb-size-spacing-2xs, 2px);
$sb-size-spacing-xs: var(--sb-size-spacing-xs, 4px);
$sb-size-spacing-sm: var(--sb-size-spacing-sm, 6px);
$sb-size-spacing-base: var(--sb-size-spacing-base, 8px);
$sb-size-spacing-md: var(--sb-size-spacing-md, 10px);
$sb-size-spacing-lg: var(--sb-size-spacing-lg, 12px);
$sb-size-spacing-xl: var(--sb-size-spacing-xl, 16px);
$sb-size-spacing-2xl: var(--sb-size-spacing-2xl, 24px);
$sb-size-spacing-3xl: var(--sb-size-spacing-3xl, 48px);
$sb-typography-heading-3xl: var(
  --sb-typography-heading-3xl,
  700 3rem/1.2 Roboto
);
$sb-typography-heading-2xl: var(
  --sb-typography-heading-2xl,
  700 2.4rem/1.2 Roboto
);
$sb-typography-heading-xl: var(--sb-typography-heading-xl, 700 2rem/1.2 Roboto);
$sb-typography-heading-lg: var(
  --sb-typography-heading-lg,
  700 1.6rem/1.2 Roboto
);
$sb-typography-heading-md: var(
  --sb-typography-heading-md,
  700 1.4rem/1.2 Roboto
);
$sb-typography-body-xl-regular: var(
  --sb-typography-body-xl-regular,
  400 2rem/1.2 Roboto
);
$sb-typography-body-xl-medium: var(
  --sb-typography-body-xl-medium,
  500 2rem/1.2 Roboto
);
$sb-typography-body-xl-bold: var(
  --sb-typography-body-xl-bold,
  700 2rem/1.2 Roboto
);
$sb-typography-body-lg-regular: var(
  --sb-typography-body-lg-regular,
  400 1.6rem/1.4 Roboto
);
$sb-typography-body-lg-medium: var(
  --sb-typography-body-lg-medium,
  500 1.6rem/1.4 Roboto
);
$sb-typography-body-lg-bold: var(
  --sb-typography-body-lg-bold,
  700 1.6rem/1.4 Roboto
);
$sb-typography-body-base-regular: var(
  --sb-typography-body-base-regular,
  400 1.4rem/1.4 Roboto
);
$sb-typography-body-base-medium: var(
  --sb-typography-body-base-medium,
  500 1.4rem/1.4 Roboto
);
$sb-typography-body-base-bold: var(
  --sb-typography-body-base-bold,
  700 1.4rem/1.4 Roboto
);
$sb-typography-body-sm-regular: var(
  --sb-typography-body-sm-regular,
  400 1.2rem/1.4 Roboto
);
$sb-typography-body-sm-medium: var(
  --sb-typography-body-sm-medium,
  500 1.2rem/1.4 Roboto
);
$sb-typography-body-sm-bold: var(
  --sb-typography-body-sm-bold,
  700 1.2rem/1.4 Roboto
);
$sb-typography-body-xs-regular: var(
  --sb-typography-body-xs-regular,
  400 1rem/1.4 Roboto
);
$sb-typography-body-xs-medium: var(
  --sb-typography-body-xs-medium,
  500 1rem/1.4 Roboto
);
$sb-typography-body-xs-bold: var(
  --sb-typography-body-xs-bold,
  700 1rem/1.4 Roboto
);