@import 'variables';

:root {
    --ym-spacing-scale-1:#{$ym-spacing-scale-1};
    --ym-spacing-scale-2:#{$ym-spacing-scale-2};
    --ym-spacing-scale-3:#{$ym-spacing-scale-3};
    --ym-spacing-scale-4:#{$ym-spacing-scale-4};
    --ym-spacing-scale-5:#{$ym-spacing-scale-5};
    --ym-spacing-scale-6:#{$ym-spacing-scale-6};
    --ym-spacing-scale-7:#{$ym-spacing-scale-7};
    --ym-spacing-scale-8:#{$ym-spacing-scale-8};
    --ym-spacing-scale-9:#{$ym-spacing-scale-9};
    --ym-spacing-scale-10:#{$ym-spacing-scale-10};
    --ym-spacing-scale-11:#{$ym-spacing-scale-11};
    --ym-spacing-scale-11-5:#{$ym-spacing-scale-11-5};
    --ym-spacing-scale-12:#{$ym-spacing-scale-12};
    --ym-spacing-scale-13:#{$ym-spacing-scale-13};
    --ym-spacing-scale-15:#{$ym-spacing-scale-15};
    --ym-spacing-scale-20:#{$ym-spacing-scale-20};
    --ym-spacing-scale-26:#{$ym-spacing-scale-26};
    --ym-spacing-scale-28:#{$ym-spacing-scale-28};
    --ym-spacing-scale-30:#{$ym-spacing-scale-30};
    --ym-spacing-scale-34:#{$ym-spacing-scale-34};
    --ym-spacing-scale-40:#{$ym-spacing-scale-40};
    --ym-spacing-scale-48:#{$ym-spacing-scale-48};
    --ym-spacing-scale-54:#{$ym-spacing-scale-54};
    --ym-spacing-scale-62:#{$ym-spacing-scale-62};
    --ym-spacing-scale-75:#{$ym-spacing-scale-75};
    --ym-spacing-scale-80:#{$ym-spacing-scale-80};
    --breakpoint-sm:#{$breakpoint-sm};
    --breakpoint-md:#{$breakpoint-md};
    --breakpoint-lg:#{$breakpoint-lg};
    --breakpoint-xl:#{$breakpoint-xl};
    --limited-layout-width:#{$limited-layout-width};
    --container-xl:#{$container-xl};

    --ym-font-weight-light:#{$ym-font-weight-light};
    --ym-font-weight-normal:#{$ym-font-weight-normal};
    --ym-font-weight-semibold:#{$ym-font-weight-semibold};
    --ym-font-weight-bold:#{$ym-font-weight-bold};
    --ym-line-height-12:#{$ym-line-height-12};
    --ym-line-height-16:#{$ym-line-height-16};
    --ym-line-height-20:#{$ym-line-height-20};
    --ym-line-height-24:#{$ym-line-height-24};
    --ym-line-height-28:#{$ym-line-height-28};
    --ym-line-height-32:#{$ym-line-height-32};
    --ym-line-height-36:#{$ym-line-height-36};
    --ym-line-height-42:#{$ym-line-height-42};
    --ym-line-height-44:#{$ym-line-height-44};
    --ym-line-height-52:#{$ym-line-height-52};
    --ym-font-size:#{$ym-font-size};
    --ym-font-size-xs:#{$ym-font-size-xs};
    --ym-font-size-sm:#{$ym-font-size-sm};
    --ym-font-size-lg:#{$ym-font-size-lg};
    --ym-font-size-xl:#{$ym-font-size-xl};
    --ym-font-size-h-display:#{$ym-font-size-h-display};
    --ym-font-size-h-display-xl:#{$ym-font-size-h-display-xl};
    --ym-font-size-h1:#{$ym-font-size-h1};
    --ym-font-size-h1-xl:#{$ym-font-size-h1-xl};
    --ym-font-size-h2:#{$ym-font-size-h2};
    --ym-font-size-h2-xl:#{$ym-font-size-h2-xl};
    --ym-monospace-font:#{$ym-monospace-font};
    --ym-regular-font:#{$ym-regular-font};
    --ym-border-size-1:#{$ym-border-size-1};
    --ym-border-size-2:#{$ym-border-size-2};
    --ym-border-size-3:#{$ym-border-size-3};
    --ym-border-size-4:#{$ym-border-size-4};
    --ym-border-size-5:#{$ym-border-size-5};
    --ym-border-size-8:#{$ym-border-size-8};
    --ym-border-radius-small:#{$ym-border-radius-small};
    --ym-border-radius-base:#{$ym-border-radius-base};
    --ym-border-radius-large:#{$ym-border-radius-large};
    --ym-border-radius-2:#{$ym-border-radius-2};
    --ym-border-radius-3:#{$ym-border-radius-3};
    --ym-border-radius-4:#{$ym-border-radius-4};
    --ym-border-radius-5:#{$ym-border-radius-5};
    --ym-border-radius-6:#{$ym-border-radius-6};
    --ym-border-radius-7:#{$ym-border-radius-7};
    --ym-border-radius-full:#{$ym-border-radius-full};
    --ym-transition-duration-slow:#{$ym-transition-duration-slow};
    --ym-transition-duration-medium:#{$ym-transition-duration-medium};

    --ym-motion-keyframes-bounce: ym-motion-keyframes-bounce;
    --ym-motion-keyframes-fade-in: ym-motion-keyframes-fade-in;
    --ym-motion-keyframes-pulse: ym-motion-keyframes-pulse;
    --ym-motion-keyframes-spin: ym-motion-keyframes-spin;
    --ym-motion-keyframes-appear-above: ym-motion-keyframes-appear-above;
    --ym-motion-keyframes-appear-below: ym-motion-keyframes-appear-below;
    --ym-motion-keyframes-backdrop: ym-motion-keyframes-backdrop;
    --ym-motion-duration-slow: #{$ym-transition-duration-slow};
    --ym-motion-duration-medium: #{$ym-transition-duration-medium};
    --ym-motion-linear: linear;
    --ym-motion-ease-in-out: ease-in-out;
    --ym-motion-ease-out: ease-out;
    --ym-motion-ease-in: ease-in;
    --ym-motion-ease: ease;

    --ym-inset-border-l-4-gray-100: inset var(--ym-spacing-scale-2) 0 0 0 var(--ym-border-gray-100);
    --ym-shadow-drawer: -4px 0 8px rgba(23, 23, 23, 0.16);
    --ym-shadow-layer-sm: 0px 1px 2px 0px rgba(0, 0, 0, 0.15), 0px 0px 5px 0px rgba(0, 0, 0, 0.05);
    --ym-shadow-layer-md: 0px 0px 2px 0px rgba(23, 23, 23, 0.16), 0px 2px 8px 0px rgba(23, 23, 23, 0.16);
    --ym-shadow-layer-lg: 0px 0px 4px 0px rgba(23, 23, 23, 0.16), 0px 4px 12px 0px rgba(23, 23, 23, 0.16);
    --ym-shadow-layer-xl: -40px -40px 72px 0px #f3f3f3, 40px 40px 72px 0px #b3b3b3;
    --ym--focus: 0 0 0 1px var(--ym-border-white), 0 0 0 3px var(--ym-focus-color);
    --ym--focus-inset: inset 0 0 0 2px var(--ym-focus-color);
    --ym--focus-border: 0 0 0 2px var(--ym-focus-color);
    --ym-shadow-button: 0px 1px 2px 0px rgba(0, 0, 0, 0.5);
    --ym-shadow-button-inset: 0px 2px 2px 0px rgba(0, 0, 0, 0.15) inset;
    --ym-shadow-scroll: 0px 0px 8px 0px rgba(23, 23, 23, 0.26);
    --ym-dropdown-width: #{$ym-dropdown-width};
    --ym-dropdown-width-narrow: #{$ym-dropdown-width-narrow};
    --ym-dropdown-width-wide: #{$ym-dropdown-width-wide};
    --ym-max-dropdown-max-height: #{$ym-max-dropdown-max-height};
    --ym-toast-min-width: #{$ym-toast-min-width};
    --ym-toast-max-width: #{$ym-toast-max-width};
    --ym-modal-small-width: #{$ym-modal-small-width};
    --ym-modal-base-width: #{$ym-modal-base-width};
    --ym-modal-large-width: #{$ym-modal-large-width};
    --ym-modal-extra-large-width: #{$ym-modal-extra-large-width};
    --ym-backdrop-bg: #{$ym-backdrop-bg};
    --ym-backdrop-opacity: #{$ym-backdrop-opacity};
    --ym-drawer-small-width: #{$ym-drawer-small-width};
    --ym-drawer-base-width: #{$ym-drawer-base-width};
    --ym-drawer-large-width: #{$ym-drawer-large-width};
    --ym-backdrop-bg: #{$ym-backdrop-bg};
    --ym-backdrop-opacity: #{$ym-backdrop-opacity};
    --ym-text-transparent: #{$transparent-rgba};
    --ym-text-white: #{$white};
    --ym-text-white-contrast: #{$white-contrast};
    --ym-text-white-dark: #{$white-dark};
    --ym-text-white-normal: #{$white-normal};
    --ym-text-white-transparent: #{$white-transparent};
    --ym-text-color: #{$black-normal};
    --ym-text-disabled: #{$gray-400};
    --ym-text-primary: #{$primary};
    --ym-text-secondary: #{$secondary};
    --ym-text-success: #{$success};
    --ym-text-info: #{$info};
    --ym-text-warning: #{$warning};
    --ym-text-danger: #{$danger};
    --ym-text-gray-50: #{$gray-50};
    --ym-text-gray-100: #{$gray-100};
    --ym-text-gray-200: #{$gray-200};
    --ym-text-gray-300: #{$gray-300};
    --ym-text-gray-400: #{$gray-400};
    --ym-text-gray-500: #{$gray-500};
    --ym-text-gray-600: #{$gray-600};
    --ym-text-gray-700: #{$gray-700};
    --ym-text-gray-800: #{$gray-800};
    --ym-text-gray-900: #{$gray-900};
    --ym-text-gray-950: #{$gray-950};
    --ym-text-blue-200: #{$blue-200};
    --ym-text-blue-300: #{$blue-300};
    --ym-text-blue-400: #{$blue-400};
    --ym-text-blue-500: #{$blue-500};
    --ym-text-blue-600: #{$blue-600};
    --ym-text-blue-700: #{$blue-700};
    --ym-text-blue-800: #{$blue-800};
    --ym-text-blue-900: #{$blue-900};
    --ym-text-green-300: #{$green-300};
    --ym-text-green-400: #{$green-400};
    --ym-text-green-500: #{$green-500};
    --ym-text-green-600: #{$green-600};
    --ym-text-green-700: #{$green-700};
    --ym-text-green-800: #{$green-800};
    --ym-text-green-900: #{$green-900};
    --ym-text-orange-300: #{$orange-300};
    --ym-text-orange-400: #{$orange-400};
    --ym-text-orange-500: #{$orange-500};
    --ym-text-orange-600: #{$orange-600};
    --ym-text-orange-700: #{$orange-700};
    --ym-text-orange-800: #{$orange-800};
    --ym-text-orange-900: #{$orange-900};
    --ym-text-red-300: #{$red-300};
    --ym-text-red-500: #{$red-500};
    --ym-text-red-600: #{$red-600};
    --ym-text-red-700: #{$red-700};
    --ym-text-red-800: #{$red-800};
    --ym-text-red-900: #{$red-900};
    --ym-text-purple-300: #{$purple-300};
    --ym-text-purple-500: #{$purple-500};
    --ym-text-purple-600: #{$purple-600};
    --ym-text-purple-700: #{$purple-700};
    --ym-text-purple-800: #{$purple-800};
    --ym-text-purple-900: #{$purple-900};
    --ym-text-primary-300: #{$primary-300};
    --ym-text-primary-500: #{$primary-500};
    --ym-text-primary-600: #{$primary-600};
    --ym-text-primary-700: #{$primary-700};
    --ym-text-primary-800: #{$primary-800};
    --ym-text-primary-900: #{$primary-900};
    --ym-bg-transparent: #{$transparent-rgba};
    --ym-bg-white: #{$white};
    --ym-bg-white-normal: #{$white-normal};
    --ym-bg-white-dark: #{$white-dark};
    --ym-bg-white-transparent: #{$white-transparent};
    --ym-bg-white-contrast: #{$white-contrast};
    --ym-bg-black: #{$black};
    --ym-bg-black-normal: #{$black-normal};
    --ym-bg-secondary: #{$secondary};
    --ym-bg-success: #{$success};
    --ym-bg-primary: #{$primary};
    --ym-bg-info: #{$info};
    --ym-bg-warning: #{$warning};
    --ym-bg-danger: #{$danger};
    --ym-bg-gray-10: #{$gray-10};
    --ym-bg-gray-50: #{$gray-50};
    --ym-bg-gray-100: #{$gray-100};
    --ym-bg-gray-200: #{$gray-200};
    --ym-bg-gray-300: #{$gray-300};
    --ym-bg-gray-400: #{$gray-400};
    --ym-bg-gray-500: #{$gray-500};
    --ym-bg-gray-600: #{$gray-600};
    --ym-bg-gray-700: #{$gray-700};
    --ym-bg-gray-900: #{$gray-900};
    --ym-bg-blue-50: #{$blue-50};
    --ym-bg-blue-100: #{$blue-100};
    --ym-bg-blue-200: #{$blue-200};
    --ym-bg-blue-500: #{$blue-500};
    --ym-bg-blue-600: #{$blue-600};
    --ym-bg-blue-700: #{$blue-700};
    --ym-bg-green-50: #{$green-50};
    --ym-bg-green-100: #{$green-100};
    --ym-bg-green-200: #{$green-200};
    --ym-bg-green-500: #{$green-500};
    --ym-bg-green-600: #{$green-600};
    --ym-bg-green-700: #{$green-700};
    --ym-bg-orange-50: #{$orange-50};
    --ym-bg-orange-100: #{$orange-100};
    --ym-bg-orange-200: #{$orange-200};
    --ym-bg-orange-500: #{$orange-500};
    --ym-bg-orange-600: #{$orange-600};
    --ym-bg-orange-700: #{$orange-700};
    --ym-bg-purple-50: #{$purple-50};
    --ym-bg-purple-100: #{$purple-100};
    --ym-bg-purple-200: #{$purple-200};
    --ym-bg-purple-500: #{$purple-500};
    --ym-bg-purple-600: #{$purple-600};
    --ym-bg-purple-700: #{$purple-700};
    --ym-bg-primary-50: #{$primary-50};
    --ym-bg-primary-100: #{$primary-100};
    --ym-bg-primary-200: #{$primary-200};
    --ym-bg-primary-500: #{$primary-500};
    --ym-bg-primary-600: #{$primary-600};
    --ym-bg-primary-700: #{$primary-700};
    --ym-bg-primary-800: #{$primary-800};
    --ym-bg-red-50: #{$red-50};
    --ym-bg-red-100: #{$red-100};
    --ym-bg-red-200: #{$red-200};
    --ym-bg-red-500: #{$red-500};
    --ym-bg-red-600: #{$red-600};
    --ym-bg-red-700: #{$red-700};
    --ym-bg-t-gray-a-04: #{$t-gray-a-04};
    --ym-bg-t-gray-a-08: #{$t-gray-a-08};
    --ym-bg-t-gray-a-16: #{$t-gray-a-16};
    --ym-bg-t-gray-a-24: #{$t-gray-a-24};
    --ym-bg-t-white-a-04: #{$t-white-a-04};
    --ym-bg-t-white-a-08: #{$t-white-a-08};
    --ym-bg-t-white-a-16: #{$t-white-a-16};
    --ym-bg-t-white-a-24: #{$t-white-a-24};
    --ym-bg-data-viz-blue-500: #{$data-viz-blue-500};
    --ym-bg-data-viz-blue-600: #{$data-viz-blue-600};
    --ym-bg-data-viz-blue-700: #{$data-viz-blue-700};
    --ym-bg-data-viz-blue-800: #{$data-viz-blue-800};
    --ym-bg-data-viz-blue-900: #{$data-viz-blue-900};
    --ym-bg-data-viz-blue-950: #{$data-viz-blue-950};
    --ym-bg-data-viz-orange-500: #{$data-viz-orange-500};
    --ym-bg-data-viz-orange-600: #{$data-viz-orange-600};
    --ym-bg-data-viz-orange-700: #{$data-viz-orange-700};
    --ym-bg-data-viz-orange-800: #{$data-viz-orange-800};
    --ym-bg-data-viz-orange-900: #{$data-viz-orange-900};
    --ym-bg-data-viz-orange-950: #{$data-viz-orange-950};
    --ym-bg-data-viz-aqua-100: #{$data-viz-aqua-100};
    --ym-bg-data-viz-aqua-500: #{$data-viz-aqua-500};
    --ym-bg-data-viz-aqua-600: #{$data-viz-aqua-600};
    --ym-bg-data-viz-aqua-700: #{$data-viz-aqua-700};
    --ym-bg-data-viz-aqua-800: #{$data-viz-aqua-800};
    --ym-bg-data-viz-aqua-900: #{$data-viz-aqua-900};
    --ym-bg-data-viz-aqua-950: #{$data-viz-aqua-950};
    --ym-bg-data-viz-green-500: #{$data-viz-green-500};
    --ym-bg-data-viz-green-600: #{$data-viz-green-600};
    --ym-bg-data-viz-green-700: #{$data-viz-green-700};
    --ym-bg-data-viz-green-800: #{$data-viz-green-800};
    --ym-bg-data-viz-green-900: #{$data-viz-green-900};
    --ym-bg-data-viz-green-950: #{$data-viz-green-950};
    --ym-bg-data-viz-magenta-100: #{$data-viz-magenta-100};
    --ym-bg-data-viz-magenta-500: #{$data-viz-magenta-500};
    --ym-bg-data-viz-magenta-600: #{$data-viz-magenta-600};
    --ym-bg-data-viz-magenta-700: #{$data-viz-magenta-700};
    --ym-bg-data-viz-magenta-800: #{$data-viz-magenta-800};
    --ym-bg-data-viz-magenta-900: #{$data-viz-magenta-900};
    --ym-bg-data-viz-magenta-950: #{$data-viz-magenta-950};
    --ym-border-transparent: #{$transparent-rgba};
    --ym-border-white: #{$white};
    --ym-border-primary: #{$primary};
    --ym-border-secondary: #{$secondary};
    --ym-border-success: #{$success};
    --ym-border-info: #{$info};
    --ym-border-warning: #{$warning};
    --ym-border-danger: #{$danger};
    --ym-focus-color: #{$focus-color};
    --ym-border-gray-10: #{$gray-10};
    --ym-border-gray-50: #{$gray-50};
    --ym-border-gray-100: #{$gray-100};
    --ym-border-gray-200: #{$gray-200};
    --ym-border-gray-300: #{$gray-300};
    --ym-border-gray-400: #{$gray-400};
    --ym-border-gray-500: #{$gray-500};
    --ym-border-red-50: #{$red-50};
    --ym-border-red-100: #{$red-100};
    --ym-border-red-200: #{$red-200};
    --ym-border-red-300: #{$red-300};
    --ym-border-red-500: #{$red-500};
    --ym-border-orange-50: #{$orange-50};
    --ym-border-orange-100: #{$orange-100};
    --ym-border-orange-200: #{$orange-200};
    --ym-border-orange-300: #{$orange-300};
    --ym-border-orange-500: #{$orange-500};
    --ym-border-green-50: #{$green-50};
    --ym-border-green-100: #{$green-100};
    --ym-border-green-200: #{$green-200};
    --ym-border-green-300: #{$green-300};
    --ym-border-green-500: #{$green-500};
    --ym-border-blue-50: #{$blue-50};
    --ym-border-blue-100: #{$blue-100};
    --ym-border-blue-200: #{$blue-200};
    --ym-border-blue-300: #{$blue-300};
    --ym-border-blue-500: #{$blue-500};
    --ym-border-blue-600: #{$blue-600};
    --ym-border-blue-700: #{$blue-700};
    --ym-border-purple-50: #{$purple-50};
    --ym-border-purple-100: #{$purple-100};
    --ym-border-purple-200: #{$purple-200};
    --ym-border-purple-300: #{$purple-300};
    --ym-border-purple-500: #{$purple-500};
    --ym-border-purple-700: #{$purple-700};
    --ym-border-primary-50: #{$primary-50};
    --ym-border-primary-100: #{$primary-100};
    --ym-border-primary-200: #{$primary-200};
    --ym-border-primary-300: #{$primary-300};
    --ym-border-primary-500: #{$primary-500};
    --ym-border-primary-600: #{$primary-600};
    --ym-border-primary-700: #{$primary-700};
    --ym-border-gray-a-08: #{$t-gray-a-08};
    --ym-border-gray-a-16: #{$t-gray-a-16};
    --ym-border-gray-a-24: #{$t-gray-a-24};
    --ym-border-white-a-08: #{$t-white-a-08};
    --ym-border-white-a-16: #{$t-white-a-16};
    --ym-border-white-a-24: #{$t-white-a-24};
}
[data-theme="dark"] {
    --ym-text-color: #{$white};
    --ym-text-disabled: #{$gray-400};
    --ym-text-white: #{$black};
    --ym-text-white-contrast: #{$black-normal};
    --ym-text-white-dark: #{$gray-700};
    --ym-text-white-normal: #{$gray-600};
    --ym-text-white-transparent: rgba(0, 0, 0, 0.8);
    --ym-text-transparent: #{$transparent-rgba};
    --ym-bg-white: #191919;
    --ym-bg-white-normal: #{$gray-800};
    --ym-bg-white-dark: #{$gray-700};
    --ym-bg-white-contrast: #{$gray-950};
    --ym-bg-white-transparent: rgba(55, 65, 81, 0.8);
    --ym-bg-black: #{$white};
    --ym-bg-black-normal: #{$white-normal};
    --ym-text-primary: #{$primary-300};
    --ym-bg-primary: #{$primary-600};
    --ym-border-primary: #{$primary-500};
    --ym-text-secondary: #{$gray-300};
    --ym-bg-secondary: #{$gray-600};
    --ym-border-secondary: #{$gray-500};
    --ym-text-success: #{$green-300};
    --ym-bg-success: #{$green-700};
    --ym-border-success: #{$green-500};
    --ym-text-info: #{$blue-300};
    --ym-bg-info: #{$blue-700};
    --ym-border-info: #{$blue-500};
    --ym-text-warning: #{$orange-300};
    --ym-bg-warning: #{$orange-700};
    --ym-border-warning: #{$orange-500};
    --ym-text-danger: #{$red-300};
    --ym-bg-danger: #{$red-700};
    --ym-border-danger: #{$red-500};
    --ym-focus-color: #{$blue-400};
    --ym-text-gray-50: #{$gray-900};
    --ym-text-gray-100: #{$gray-800};
    --ym-text-gray-200: #{$gray-700};
    --ym-text-gray-300: #{$gray-600};
    --ym-text-gray-400: #{$gray-500};
    --ym-text-gray-500: #{$gray-400};
    --ym-text-gray-600: #{$gray-300};
    --ym-text-gray-700: #{$gray-200};
    --ym-text-gray-800: #{$gray-100};
    --ym-text-gray-900: #{$gray-50};
    --ym-text-gray-950: #{$white};
    --ym-text-blue-200: #{$blue-700};
    --ym-text-blue-300: #{$blue-600};
    --ym-text-blue-400: #{$blue-500};
    --ym-text-blue-500: #{$blue-400};
    --ym-text-blue-600: #{$blue-300};
    --ym-text-blue-700: #{$blue-200};
    --ym-text-blue-800: #{$blue-100};
    --ym-text-blue-900: #{$blue-50};
    --ym-text-green-300: #{$green-600};
    --ym-text-green-400: #{$green-500};
    --ym-text-green-500: #{$green-400};
    --ym-text-green-600: #{$green-300};
    --ym-text-green-700: #{$green-200};
    --ym-text-green-800: #{$green-100};
    --ym-text-green-900: #{$green-50};
    --ym-text-orange-300: #{$orange-600};
    --ym-text-orange-400: #{$orange-500};
    --ym-text-orange-500: #{$orange-400};
    --ym-text-orange-600: #{$orange-300};
    --ym-text-orange-700: #{$orange-200};
    --ym-text-orange-800: #{$orange-100};
    --ym-text-orange-900: #{$orange-50};
    --ym-text-red-300: #{$red-600};
    --ym-text-red-500: #{$red-400};
    --ym-text-red-600: #{$red-300};
    --ym-text-red-700: #{$red-200};
    --ym-text-red-800: #{$red-100};
    --ym-text-red-900: #{$red-50};
    --ym-text-purple-300: #{$purple-600};
    --ym-text-purple-500: #{$purple-400};
    --ym-text-purple-600: #{$purple-300};
    --ym-text-purple-700: #{$purple-200};
    --ym-text-purple-800: #{$purple-100};
    --ym-text-purple-900: #{$purple-50};
    --ym-text-primary-300: #{$primary-600};
    --ym-text-primary-500: #{$primary-400};
    --ym-text-primary-600: #{$primary-300};
    --ym-text-primary-700: #{$primary-200};
    --ym-text-primary-800: #{$primary-100};
    --ym-text-primary-900: #{$primary-50};
    --ym-bg-gray-10: #{$gray-950};
    --ym-bg-gray-50: #{$gray-900};
    --ym-bg-gray-100: #{$gray-800};
    --ym-bg-gray-200: #{$gray-800};
    --ym-bg-gray-300: #{$gray-700};
    --ym-bg-gray-400: #{$gray-600};
    --ym-bg-gray-500: #{$gray-500};
    --ym-bg-gray-600: #{$gray-400};
    --ym-bg-gray-700: #{$gray-300};
    --ym-bg-gray-900: #{$gray-100};
    --ym-bg-blue-50: #{$blue-900};
    --ym-bg-blue-100: #{$blue-800};
    --ym-bg-blue-200: #{$blue-700};
    --ym-bg-blue-500: #{$blue-600};
    --ym-bg-blue-600: #{$blue-700};
    --ym-bg-blue-700: #{$blue-800};
    --ym-bg-green-50: #{$green-900};
    --ym-bg-green-100: #{$green-800};
    --ym-bg-green-200: #{$green-700};
    --ym-bg-green-500: #{$green-600};
    --ym-bg-green-600: #{$green-700};
    --ym-bg-green-700: #{$green-800};
    --ym-bg-orange-50: #{$orange-900};
    --ym-bg-orange-100: #{$orange-800};
    --ym-bg-orange-200: #{$orange-700};
    --ym-bg-orange-500: #{$orange-600};
    --ym-bg-orange-600: #{$orange-700};
    --ym-bg-orange-700: #{$orange-800};
    --ym-bg-red-50: #{$red-900};
    --ym-bg-red-100: #{$red-800};
    --ym-bg-red-200: #{$red-700};
    --ym-bg-red-500: #{$red-600};
    --ym-bg-red-600: #{$red-700};
    --ym-bg-red-700: #{$red-800};
    --ym-bg-purple-50: #{$purple-900};
    --ym-bg-purple-100: #{$purple-800};
    --ym-bg-purple-200: #{$purple-700};
    --ym-bg-purple-500: #{$purple-600};
    --ym-bg-purple-600: #{$purple-700};
    --ym-bg-purple-700: #{$purple-800};
    --ym-bg-primary-50: #{$primary-900};
    --ym-bg-primary-100: #{$primary-800};
    --ym-bg-primary-200: #{$primary-700};
    --ym-bg-primary-500: #{$primary-500};
    --ym-bg-primary-600: #{$primary-200};
    --ym-bg-primary-700: #{$primary-100};
    --ym-bg-primary-800: #{$primary-50};
    --ym-bg-data-viz-blue-500: #{$data-viz-blue-600};
    --ym-bg-data-viz-blue-600: #{$data-viz-blue-700};
    --ym-bg-data-viz-blue-700: #{$data-viz-blue-800};
    --ym-bg-data-viz-blue-800: #{$data-viz-blue-900};
    --ym-bg-data-viz-blue-900: #{$data-viz-blue-950};
    --ym-bg-data-viz-blue-950: #{$data-viz-blue};
    --ym-bg-data-viz-orange-500: #{$data-viz-orange-600};
    --ym-bg-data-viz-orange-600: #{$data-viz-orange-700};
    --ym-bg-data-viz-orange-700: #{$data-viz-orange-800};
    --ym-bg-data-viz-orange-800: #{$data-viz-orange-900};
    --ym-bg-data-viz-orange-900: #{$data-viz-orange-950};
    --ym-bg-data-viz-orange-950: #{$data-viz-orange};
    --ym-bg-data-viz-aqua-100: #{$data-viz-aqua-800};
    --ym-bg-data-viz-aqua-500: #{$data-viz-aqua-600};
    --ym-bg-data-viz-aqua-600: #{$data-viz-aqua-700};
    --ym-bg-data-viz-aqua-700: #{$data-viz-aqua-800};
    --ym-bg-data-viz-aqua-800: #{$data-viz-aqua-900};
    --ym-bg-data-viz-aqua-900: #{$data-viz-aqua-950};
    --ym-bg-data-viz-aqua-950: #{$data-viz-aqua};
    --ym-bg-data-viz-green-500: #{$data-viz-green-600};
    --ym-bg-data-viz-green-600: #{$data-viz-green-700};
    --ym-bg-data-viz-green-700: #{$data-viz-green-800};
    --ym-bg-data-viz-green-800: #{$data-viz-green-900};
    --ym-bg-data-viz-green-900: #{$data-viz-green-950};
    --ym-bg-data-viz-green-950: #{$data-viz-green};
    --ym-bg-data-viz-magenta-100: #{$data-viz-magenta-800};
    --ym-bg-data-viz-magenta-500: #{$data-viz-magenta-600};
    --ym-bg-data-viz-magenta-600: #{$data-viz-magenta-700};
    --ym-bg-data-viz-magenta-700: #{$data-viz-magenta-800};
    --ym-bg-data-viz-magenta-800: #{$data-viz-magenta-900};
    --ym-bg-data-viz-magenta-900: #{$data-viz-magenta-950};
    --ym-bg-data-viz-magenta-950: #{$data-viz-magenta};
    --ym-bg-t-gray-a-04: #{$t-white-a-04};
    --ym-bg-t-gray-a-08: #{$t-white-a-08};
    --ym-bg-t-gray-a-16: #{$t-white-a-16};
    --ym-bg-t-gray-a-24: #{$t-white-a-24};
    --ym-bg-t-white-a-04: #{$t-white-a-04};
    --ym-bg-t-white-a-08: #{$t-white-a-08};
    --ym-bg-t-white-a-16: #{$t-white-a-16};
    --ym-bg-t-white-a-24: #{$t-white-a-24};
    --ym-border-transparent: #{$transparent-rgba};
    --ym-border-white: #{$gray-600};
    --ym-border-gray-10: #{$gray-800};
    --ym-border-gray-50: #{$gray-700};
    --ym-border-gray-100: #{$gray-600};
    --ym-border-gray-200: #{$gray-500};
    --ym-border-gray-300: #{$gray-400};
    --ym-border-gray-400: #{$gray-300};
    --ym-border-gray-500: #{$gray-200};
    --ym-border-red-50: #{$red-800};
    --ym-border-red-100: #{$red-700};
    --ym-border-red-200: #{$red-600};
    --ym-border-red-300: #{$red-500};
    --ym-border-red-500: #{$red-400};

    --ym-border-orange-50: #{$orange-800};
    --ym-border-orange-100: #{$orange-700};
    --ym-border-orange-200: #{$orange-600};
    --ym-border-orange-300: #{$orange-500};
    --ym-border-orange-500: #{$orange-400};

    --ym-border-green-50: #{$green-800};
    --ym-border-green-100: #{$green-700};
    --ym-border-green-200: #{$green-600};
    --ym-border-green-300: #{$green-500};
    --ym-border-green-500: #{$green-400};

    --ym-border-blue-50: #{$blue-800};
    --ym-border-blue-100: #{$blue-700};
    --ym-border-blue-200: #{$blue-600};
    --ym-border-blue-300: #{$blue-500};
    --ym-border-blue-500: #{$blue-400};
    --ym-border-blue-600: #{$blue-300};
    --ym-border-blue-700: #{$blue-200};

    --ym-border-purple-50: #{$purple-800};
    --ym-border-purple-100: #{$purple-700};
    --ym-border-purple-200: #{$purple-600};
    --ym-border-purple-300: #{$purple-500};
    --ym-border-purple-500: #{$purple-400};
    --ym-border-purple-700: #{$purple-200};

    --ym-border-primary-50: #{$primary-800};
    --ym-border-primary-100: #{$primary-700};
    --ym-border-primary-200: #{$primary-600};
    --ym-border-primary-300: #{$primary-500};
    --ym-border-primary-500: #{$primary-400};
    --ym-border-primary-600: #{$primary-300};
    --ym-border-primary-700: #{$primary-200};
    --ym-border-gray-a-08: #{$t-white-a-08};
    --ym-border-gray-a-16: #{$t-white-a-16};
    --ym-border-gray-a-24: #{$t-white-a-24};

    --ym-border-white-a-08: #{$t-white-a-08};
    --ym-border-white-a-16: #{$t-white-a-16};
    --ym-border-white-a-24: #{$t-white-a-24};
    --ym-shadow-drawer: 4px 0 16px rgba(0, 0, 0, 0.6);
    --ym-shadow-layer-sm: 0px 1px 3px 0px rgba(0, 0, 0, 0.4), 0px 0px 8px 0px rgba(0, 0, 0, 0.2);
    --ym-shadow-layer-md: 0px 0px 4px 0px rgba(0, 0, 0, 0.5), 0px 4px 12px 0px rgba(0, 0, 0, 0.4);
    --ym-shadow-layer-lg: 0px 0px 8px 0px rgba(0, 0, 0, 0.5), 0px 8px 16px 0px rgba(0, 0, 0, 0.4);
    --ym-shadow-layer-xl: -40px -40px 72px 0px rgba(0, 0, 0, 0.1), 40px 40px 72px 0px rgba(0, 0, 0, 0.3);
    --ym-shadow-button: 0px 2px 4px 0px rgba(0, 0, 0, 0.8);
    --ym-shadow-button-inset: 0px 2px 4px 0px rgba(0, 0, 0, 0.4) inset;
    --ym-shadow-scroll: 0px 0px 12px 0px rgba(0, 0, 0, 0.6);
    --ym--focus: 0 0 0 1px var(--ym-bg-white), 0 0 0 3px var(--ym-focus-color);
    --ym--focus-inset: inset 0 0 0 2px var(--ym-focus-color);
    --ym--focus-border: 0 0 0 2px var(--ym-focus-color);
    --ym-inset-border-l-4-gray-100: inset var(--ym-spacing-scale-2) 0 0 0 var(--ym-border-gray-100);
}