:root,
:host,
.rui-theme-light {
  color-scheme: light;

  --rui-color-gray-0: #ffffff;
  --rui-color-gray-10: #fbfcfc;
  --rui-color-gray-30: #f5f6f7;
  --rui-color-gray-50: #eff0f1;
  --rui-color-gray-100: #dfe1e4;
  --rui-color-gray-150: #cfd3d6;
  --rui-color-gray-200: #c0c4c9;
  --rui-color-gray-300: #a1a7ad;
  --rui-color-gray-400: #838a91;
  --rui-color-gray-500: #686d73;
  --rui-color-gray-600: #52575c;
  --rui-color-gray-700: #3d4146;
  --rui-color-gray-800: #282b2f;
  --rui-color-gray-900: #131517;
  --rui-color-gray-1000: #000000;

  --rui-color-red-50: hsl(3.2, 70.4%, 94.7%);
  --rui-color-red-100: hsl(3.2, 67.3%, 89.2%);
  --rui-color-red-150: hsl(3.2, 68.3%, 83.9%);
  --rui-color-red-200: hsl(3.2, 68.8%, 78.6%);
  --rui-color-red-300: hsl(3.2, 68.3%, 67.8%);
  --rui-color-red-400: hsl(3.2, 68.8%, 57.3%);
  --rui-color-red-500: hsl(3.2, 78.9%, 46.5%);
  --rui-color-red-600: hsl(3.2, 78.7%, 36.9%);
  --rui-color-red-700: hsl(3.1, 78.5%, 29.2%);
  --rui-color-red-800: hsl(3.2, 78.2%, 23.3%);
  --rui-color-red-900: hsl(3.2, 78.7%, 18.4%);

  --rui-color-orange-50: hsl(26.1, 92%, 95.1%);
  --rui-color-orange-100: hsl(26.7, 91.8%, 90.4%);
  --rui-color-orange-150: hsl(26.9, 89.3%, 85.3%);
  --rui-color-orange-200: hsl(27.3, 90%, 80.4%);
  --rui-color-orange-300: hsl(26.7, 90.6%, 70.8%);
  --rui-color-orange-400: hsl(27, 90%, 60.8%);
  --rui-color-orange-500: hsl(26.9, 90.4%, 51.2%);
  --rui-color-orange-600: hsl(26.8, 86.5%, 40.6%);
  --rui-color-orange-700: hsl(27, 86.6%, 32.2%);
  --rui-color-orange-800: hsl(27.1, 86.3%, 25.7%);
  --rui-color-orange-900: hsl(26.7, 86.5%, 20.4%);

  --rui-color-yellow-50: hsl(47.5, 100%, 95.3%);
  --rui-color-yellow-100: hsl(48.8, 100%, 90.6%);
  --rui-color-yellow-150: hsl(49.2, 97.3%, 85.5%);
  --rui-color-yellow-200: hsl(49.4, 98%, 80.8%);
  --rui-color-yellow-300: hsl(48.8, 98.6%, 71.4%);
  --rui-color-yellow-400: hsl(49.1, 98%, 61.6%);
  --rui-color-yellow-500: hsl(49, 98.4%, 52.2%);
  --rui-color-yellow-600: hsl(49.3, 90.5%, 41.2%);
  --rui-color-yellow-700: hsl(49.3, 90.4%, 32.7%);
  --rui-color-yellow-800: hsl(49, 89.6%, 26.3%);
  --rui-color-yellow-900: hsl(48.8, 90.6%, 20.8%);

  --rui-color-lime-50: hsl(71.4, 72.4%, 94.3%);
  --rui-color-lime-100: hsl(70.2, 71.9%, 88.8%);
  --rui-color-lime-150: hsl(71.4, 74.1%, 83.3%);
  --rui-color-lime-200: hsl(71.4, 73.7%, 77.6%);
  --rui-color-lime-300: hsl(71, 73.1%, 66.5%);
  --rui-color-lime-400: hsl(71.4, 73.7%, 55.3%);
  --rui-color-lime-500: hsl(71.2, 92.9%, 44.1%);
  --rui-color-lime-600: hsl(71.2, 93.3%, 34.9%);
  --rui-color-lime-700: hsl(71.4, 93%, 27.8%);
  --rui-color-lime-800: hsl(71.4, 92.9%, 22.2%);
  --rui-color-lime-900: hsl(70.8, 93.3%, 17.5%);

  --rui-color-spring-50: hsl(137.6, 68%, 95.1%);
  --rui-color-spring-100: hsl(140.6, 68.6%, 90%);
  --rui-color-spring-150: hsl(140.4, 68.8%, 84.9%);
  --rui-color-spring-200: hsl(139.7, 68.6%, 80%);
  --rui-color-spring-300: hsl(140, 68.6%, 70%);
  --rui-color-spring-400: hsl(139.7, 68.6%, 60%);
  --rui-color-spring-500: hsl(139.9, 68.6%, 50%);
  --rui-color-spring-600: hsl(140, 68.3%, 39.6%);
  --rui-color-spring-700: hsl(140.2, 68.8%, 31.4%);
  --rui-color-spring-800: hsl(139.8, 68.8%, 25.1%);
  --rui-color-spring-900: hsl(140, 68.3%, 19.8%);

  --rui-color-green-50: hsl(160, 31.6%, 92.5%);
  --rui-color-green-100: hsl(162.5, 31.6%, 85.1%);
  --rui-color-green-150: hsl(161.7, 31.6%, 77.6%);
  --rui-color-green-200: hsl(162.5, 31.6%, 70.2%);
  --rui-color-green-300: hsl(161.4, 31.3%, 55.5%);
  --rui-color-green-400: hsl(161.7, 45.9%, 40.6%);
  --rui-color-green-500: hsl(161.8, 90.8%, 25.7%);
  --rui-color-green-600: hsl(162.1, 90.4%, 20.4%);
  --rui-color-green-700: hsl(161.6, 90.4%, 16.3%);
  --rui-color-green-800: hsl(162, 90.9%, 12.9%);
  --rui-color-green-900: hsl(161.3, 92.3%, 10.2%);

  --rui-color-aqua-50: hsl(183.8, 57.1%, 94.5%);
  --rui-color-aqua-100: hsl(181.8, 57.9%, 88.8%);
  --rui-color-aqua-150: hsl(183.6, 59.5%, 83.5%);
  --rui-color-aqua-200: hsl(182.7, 58.9%, 78%);
  --rui-color-aqua-300: hsl(183, 58.6%, 66.9%);
  --rui-color-aqua-400: hsl(183.2, 58.9%, 56.1%);
  --rui-color-aqua-500: hsl(182.9, 72.1%, 44.9%);
  --rui-color-aqua-600: hsl(182.7, 72.4%, 35.5%);
  --rui-color-aqua-700: hsl(182.9, 72.2%, 28.2%);
  --rui-color-aqua-800: hsl(182.9, 72.2%, 22.5%);
  --rui-color-aqua-900: hsl(182.8, 71.4%, 17.8%);

  --rui-color-sky-50: hsl(202.5, 88.9%, 96.5%);
  --rui-color-sky-100: hsl(202.5, 88.9%, 92.9%);
  --rui-color-sky-150: hsl(203, 88.7%, 89.6%);
  --rui-color-sky-200: hsl(202.9, 88.7%, 86.1%);
  --rui-color-sky-300: hsl(203, 87%, 78.8%);
  --rui-color-sky-400: hsl(203, 87.4%, 72%);
  --rui-color-sky-500: hsl(202.9, 87.7%, 64.9%);
  --rui-color-sky-600: hsl(202.7, 50%, 51.4%);
  --rui-color-sky-700: hsl(203, 47.4%, 41%);
  --rui-color-sky-800: hsl(203.1, 47%, 32.5%);
  --rui-color-sky-900: hsl(203.2, 47%, 25.9%);

  --rui-color-blue-50: hsl(220, 75%, 95.3%);
  --rui-color-blue-100: hsl(220, 72%, 90.2%);
  --rui-color-blue-150: hsl(219.3, 73.3%, 85.3%);
  --rui-color-blue-200: hsl(220.3, 73.7%, 80.6%);
  --rui-color-blue-300: hsl(219.6, 73.2%, 70.8%);
  --rui-color-blue-400: hsl(219.9, 73.7%, 61.2%);
  --rui-color-blue-500: hsl(219.9, 73.4%, 51.4%);
  --rui-color-blue-600: hsl(220, 69.2%, 40.8%);
  --rui-color-blue-700: hsl(219.7, 69.7%, 32.4%);
  --rui-color-blue-800: hsl(219.6, 69.5%, 25.7%);
  --rui-color-blue-900: hsl(220, 69.2%, 20.4%);

  --rui-color-magenta-50: hsl(315, 57.1%, 94.5%);
  --rui-color-magenta-100: hsl(317.4, 56.4%, 89.2%);
  --rui-color-magenta-150: hsl(316.6, 56.6%, 83.7%);
  --rui-color-magenta-200: hsl(317.4, 56.4%, 78.4%);
  --rui-color-magenta-300: hsl(316.1, 55.7%, 67.3%);
  --rui-color-magenta-400: hsl(316.5, 55.9%, 56.5%);
  --rui-color-magenta-500: hsl(316.6, 66.5%, 45.7%);
  --rui-color-magenta-600: hsl(316.6, 66.5%, 36.3%);
  --rui-color-magenta-700: hsl(316.7, 66%, 28.8%);
  --rui-color-magenta-800: hsl(316.4, 65.8%, 22.9%);
  --rui-color-magenta-900: hsl(316.7, 65.6%, 18.2%);

  --rui-color-pink-50: hsl(340, 100%, 97.1%);
  --rui-color-pink-100: hsl(338, 93.8%, 93.7%);
  --rui-color-pink-150: hsl(339.1, 95.8%, 90.6%);
  --rui-color-pink-200: hsl(339.3, 96.8%, 87.6%);
  --rui-color-pink-300: hsl(338.9, 95.8%, 81.4%);
  --rui-color-pink-400: hsl(339.3, 96.8%, 75.3%);
  --rui-color-pink-500: hsl(339.1, 96.2%, 69%);
  --rui-color-pink-600: hsl(339.2, 52.4%, 54.7%);
  --rui-color-pink-700: hsl(339.4, 43.2%, 43.5%);
  --rui-color-pink-800: hsl(338.7, 43.2%, 34.5%);
  --rui-color-pink-900: hsl(339, 42.9%, 27.5%);

  --rui-color-primary: var(--rui-color-blue-500);
  --rui-color-negative: var(--rui-color-red-500);
  --rui-color-caution: var(--rui-color-yellow-500);
  --rui-color-caution-visible: var(--rui-color-yellow-700);
  --rui-color-positive: var(--rui-color-green-500);
  --rui-color-neutral: var(--rui-color-gray-500);

  --rui-color-primary-50: var(--rui-color-blue-50);
  --rui-color-primary-100: var(--rui-color-blue-100);
  --rui-color-primary-150: var(--rui-color-blue-150);
  --rui-color-primary-200: var(--rui-color-blue-200);
  --rui-color-primary-300: var(--rui-color-blue-300);
  --rui-color-primary-400: var(--rui-color-blue-400);
  --rui-color-primary-500: var(--rui-color-blue-500);
  --rui-color-primary-600: var(--rui-color-blue-600);
  --rui-color-primary-700: var(--rui-color-blue-700);
  --rui-color-primary-800: var(--rui-color-blue-800);
  --rui-color-primary-900: var(--rui-color-blue-900);

  --rui-color-positive-50: var(--rui-color-green-50);
  --rui-color-positive-100: var(--rui-color-green-100);
  --rui-color-positive-150: var(--rui-color-green-150);
  --rui-color-positive-200: var(--rui-color-green-200);
  --rui-color-positive-300: var(--rui-color-green-300);
  --rui-color-positive-400: var(--rui-color-green-400);
  --rui-color-positive-500: var(--rui-color-green-500);
  --rui-color-positive-600: var(--rui-color-green-600);
  --rui-color-positive-700: var(--rui-color-green-700);
  --rui-color-positive-800: var(--rui-color-green-800);
  --rui-color-positive-900: var(--rui-color-green-900);

  --rui-color-caution-50: var(--rui-color-yellow-50);
  --rui-color-caution-100: var(--rui-color-yellow-100);
  --rui-color-caution-150: var(--rui-color-yellow-150);
  --rui-color-caution-200: var(--rui-color-yellow-200);
  --rui-color-caution-300: var(--rui-color-yellow-300);
  --rui-color-caution-400: var(--rui-color-yellow-400);
  --rui-color-caution-500: var(--rui-color-yellow-500);
  --rui-color-caution-600: var(--rui-color-yellow-600);
  --rui-color-caution-700: var(--rui-color-yellow-700);
  --rui-color-caution-800: var(--rui-color-yellow-800);
  --rui-color-caution-900: var(--rui-color-yellow-900);

  --rui-color-negative-50: var(--rui-color-red-50);
  --rui-color-negative-100: var(--rui-color-red-100);
  --rui-color-negative-150: var(--rui-color-red-150);
  --rui-color-negative-200: var(--rui-color-red-200);
  --rui-color-negative-300: var(--rui-color-red-300);
  --rui-color-negative-400: var(--rui-color-red-400);
  --rui-color-negative-500: var(--rui-color-red-500);
  --rui-color-negative-600: var(--rui-color-red-600);
  --rui-color-negative-700: var(--rui-color-red-700);
  --rui-color-negative-800: var(--rui-color-red-800);
  --rui-color-negative-900: var(--rui-color-red-900);

  --rui-color-neutral-0: var(--rui-color-gray-0);
  --rui-color-neutral-10: var(--rui-color-gray-10);
  --rui-color-neutral-30: var(--rui-color-gray-30);
  --rui-color-neutral-50: var(--rui-color-gray-50);
  --rui-color-neutral-100: var(--rui-color-gray-100);
  --rui-color-neutral-150: var(--rui-color-gray-150);
  --rui-color-neutral-200: var(--rui-color-gray-200);
  --rui-color-neutral-300: var(--rui-color-gray-300);
  --rui-color-neutral-400: var(--rui-color-gray-400);
  --rui-color-neutral-500: var(--rui-color-gray-500);
  --rui-color-neutral-600: var(--rui-color-gray-600);
  --rui-color-neutral-700: var(--rui-color-gray-700);
  --rui-color-neutral-800: var(--rui-color-gray-800);
  --rui-color-neutral-900: var(--rui-color-gray-900);
  --rui-color-neutral-1000: var(--rui-color-gray-1000);

  --rui-color-background-primary: var(--rui-color-gray-10);
  --rui-color-background-secondary: var(--rui-color-gray-30);
  --rui-color-background-tertiary: var(--rui-color-gray-50);

  --rui-color-text-primary: var(--rui-color-gray-800);
  --rui-color-text-secondary: var(--rui-color-gray-500);
  --rui-color-text-placeholder: var(--rui-color-gray-500);
  --rui-color-text-placeholder-hover: var(--rui-color-gray-300);
  --rui-color-text-disabled: var(--rui-color-gray-200);
  --rui-color-text-red: var(--rui-color-red-500);
  --rui-color-text-blue: var(--rui-color-blue-500);
  --rui-color-text-inverse: var(--rui-color-gray-0);

  --rui-color-lowest-gray: var(--rui-color-gray-200);
  --rui-color-low-gray: var(--rui-color-gray-300);
  --rui-color-gray: var(--rui-color-gray-500);
  --rui-color-high-gray: var(--rui-color-gray-700);
  --rui-color-highest-gray: var(--rui-color-gray-800);

  --rui-color-red: var(--rui-color-red-500);
  --rui-color-orange: var(--rui-color-orange-500);
  --rui-color-yellow: var(--rui-color-yellow-500);
  --rui-color-lime: var(--rui-color-lime-500);
  --rui-color-spring: var(--rui-color-spring-500);
  --rui-color-green: var(--rui-color-green-500);
  --rui-color-aqua: var(--rui-color-aqua-500);
  --rui-color-sky: var(--rui-color-sky-500);
  --rui-color-blue: var(--rui-color-blue-500);
  --rui-color-magenta: var(--rui-color-magenta-500);
  --rui-color-pink: var(--rui-color-pink-500);
  --rui-color-white: var(--rui-color-gray-0);
  --rui-color-black: var(--rui-color-gray-1000);

  --rui-color-background-button: var(--rui-color-neutral-0);
  --rui-color-background-button-hover: var(--rui-color-neutral-50);
  --rui-color-background-button-active: var(--rui-color-primary-100);
  --rui-color-background-button-toggled: var(--rui-color-primary-150);
  --rui-color-background-button-toggled-hover: var(--rui-color-primary-200);
  --rui-color-background-button-toggled-active: var(--rui-color-primary-300);
  --rui-color-background-button-primary: var(--rui-color-primary-500);
  --rui-color-background-button-primary-hover: var(--rui-color-primary-600);
  --rui-color-background-button-primary-active: var(--rui-color-primary-700);
  --rui-color-background-button-danger: var(--rui-color-neutral-0);
  --rui-color-background-button-danger-hover: var(--rui-color-neutral-50);
  --rui-color-background-button-danger-active: var(--rui-color-negative-100);

  --rui-color-border-button: var(--rui-color-lowest-gray);
  --rui-color-border-button-secondary: var(--rui-color-primary);
  --rui-color-border-button-danger: var(--rui-color-negative);
  --rui-color-border-button-primary-group: var(--rui-color-gray-0);

  --rui-color-text-button: var(--rui-color-text-primary);
  --rui-color-text-button-hover: var(--rui-color-text-primary);
  --rui-color-text-button-active: var(--rui-color-text-primary);
  --rui-color-text-button-primary: var(--rui-color-text-inverse);
  --rui-color-text-button-primary-hover: var(--rui-color-text-inverse);
  --rui-color-text-button-primary-active: var(--rui-color-text-inverse);
  --rui-color-text-button-secondary: var(--rui-color-text-blue);
  --rui-color-text-button-secondary-hover: var(--rui-color-text-blue);
  --rui-color-text-button-secondary-active: var(--rui-color-text-blue);
  --rui-color-text-button-danger: var(--rui-color-text-red);
  --rui-color-text-button-danger-hover: var(--rui-color-text-red);
  --rui-color-text-button-danger-active: var(--rui-color-text-red);
  --rui-color-text-button-link: var(--rui-color-primary-500);
  --rui-color-text-button-link-hover: var(--rui-color-primary-600);
  --rui-color-text-button-link-active: var(--rui-color-primary-700);
  --rui-color-text-button-gray: var(--rui-color-gray);
  --rui-color-text-button-gray-hover: var(--rui-color-high-gray);
  --rui-color-text-button-gray-active: var(--rui-color-primary-700);

  --rui-color-background-input: var(--rui-color-gray-0);
  --rui-color-background-input-hover: var(--rui-color-gray-0);

  --rui-color-border-input: var(--rui-color-lowest-gray);
  --rui-color-border-input-hover: var(--rui-color-low-gray);

  --rui-color-text-input: var(--rui-color-text-primary);
  --rui-color-text-input-hover: var(--rui-color-text-primary);
  --rui-color-text-input-placeholder: var(--rui-color-text-placeholder);
  --rui-color-text-input-placeholder-hover: var(
    --rui-color-text-placeholder-hover
  );
  --rui-color-text-input-icon: var(--rui-color-gray);
  --rui-color-text-input-icon-hover: var(--rui-color-high-gray);
  --rui-color-text-input-icon-active: var(--rui-color-primary-700);
  --rui-color-text-input-clear: var(--rui-color-low-gray);
  --rui-color-text-input-clear-hover: var(--rui-color-gray);
  --rui-color-text-input-clear-active: var(--rui-color-primary-700);

  --rui-color-background-info-soft-primary: var(--rui-color-primary-50);
  --rui-color-background-info-soft-success: var(--rui-color-positive-50);
  --rui-color-background-info-soft-caution: var(--rui-color-caution-50);
  --rui-color-background-info-soft-warning: var(--rui-color-negative-50);
  --rui-color-background-info-soft-neutral: var(--rui-color-neutral-50);
  --rui-color-background-info-soft-transparent: transparent;
  --rui-color-background-info-vivid-primary: var(--rui-color-primary);
  --rui-color-background-info-vivid-success: var(--rui-color-positive);
  --rui-color-background-info-vivid-caution: var(--rui-color-caution);
  --rui-color-background-info-vivid-warning: var(--rui-color-negative);
  --rui-color-background-info-vivid-neutral: var(--rui-color-neutral);
  --rui-color-background-info-vivid-hard: var(--rui-color-highest-gray);

  --rui-color-border-info-soft-primary: var(--rui-color-primary-400);
  --rui-color-border-info-soft-success: var(--rui-color-positive-400);
  --rui-color-border-info-soft-caution: var(--rui-color-caution-400);
  --rui-color-border-info-soft-warning: var(--rui-color-negative-400);
  --rui-color-border-info-soft-neutral: var(--rui-color-low-gray);
  --rui-color-border-info-soft-transparent: var(--rui-color-lowest-gray);
  --rui-color-border-info-vivid-primary: var(--rui-color-white);
  --rui-color-border-info-vivid-success: var(--rui-color-white);
  --rui-color-border-info-vivid-caution: var(--rui-color-white);
  --rui-color-border-info-vivid-warning: var(--rui-color-white);
  --rui-color-border-info-vivid-neutral: var(--rui-color-white);
  --rui-color-border-info-vivid-hard: var(--rui-color-white);

  --rui-color-text-info-soft-primary: var(--rui-color-text-primary);
  --rui-color-text-info-soft-success: var(--rui-color-text-primary);
  --rui-color-text-info-soft-caution: var(--rui-color-text-primary);
  --rui-color-text-info-soft-warning: var(--rui-color-text-primary);
  --rui-color-text-info-soft-neutral: var(--rui-color-text-primary);
  --rui-color-text-info-soft-transparent: var(--rui-color-text-primary);
  --rui-color-text-info-vivid-primary: var(--rui-color-text-inverse);
  --rui-color-text-info-vivid-success: var(--rui-color-text-inverse);
  --rui-color-text-info-vivid-caution: var(--rui-color-text-primary);
  --rui-color-text-info-vivid-warning: var(--rui-color-text-inverse);
  --rui-color-text-info-vivid-neutral: var(--rui-color-text-inverse);
  --rui-color-text-info-vivid-hard: var(--rui-color-text-inverse);

  --rui-color-nav-info-soft-primary: var(--rui-color-primary-700);
  --rui-color-nav-info-soft-success: var(--rui-color-positive-700);
  --rui-color-nav-info-soft-caution: var(--rui-color-caution-700);
  --rui-color-nav-info-soft-warning: var(--rui-color-negative-700);
  --rui-color-nav-info-soft-neutral: var(--rui-color-text-secondary);
  --rui-color-nav-info-soft-transparent: var(--rui-color-text-secondary);
  --rui-color-nav-info-vivid-primary: var(--rui-color-primary-150);
  --rui-color-nav-info-vivid-success: var(--rui-color-positive-150);
  --rui-color-nav-info-vivid-caution: var(--rui-color-caution-900);
  --rui-color-nav-info-vivid-warning: var(--rui-color-negative-150);
  --rui-color-nav-info-vivid-neutral: var(--rui-color-neutral-150);
  --rui-color-nav-info-vivid-hard: var(--rui-color-neutral-150);
  --rui-color-nav-info-soft-primary-hover: var(--rui-color-highest-gray);
  --rui-color-nav-info-soft-success-hover: var(--rui-color-highest-gray);
  --rui-color-nav-info-soft-caution-hover: var(--rui-color-highest-gray);
  --rui-color-nav-info-soft-warning-hover: var(--rui-color-highest-gray);
  --rui-color-nav-info-soft-neutral-hover: var(--rui-color-highest-gray);
  --rui-color-nav-info-soft-transparent-hover: var(--rui-color-highest-gray);
  --rui-color-nav-info-vivid-primary-hover: var(--rui-color-primary-50);
  --rui-color-nav-info-vivid-success-hover: var(--rui-color-positive-50);
  --rui-color-nav-info-vivid-caution-hover: var(--rui-color-highest-gray);
  --rui-color-nav-info-vivid-warning-hover: var(--rui-color-negative-50);
  --rui-color-nav-info-vivid-neutral-hover: var(--rui-color-neutral-50);
  --rui-color-nav-info-vivid-hard-hover: var(--rui-color-neutral-50);
  --rui-color-nav-info-soft-primary-active: var(--rui-color-primary-700);
  --rui-color-nav-info-soft-success-active: var(--rui-color-primary-700);
  --rui-color-nav-info-soft-caution-active: var(--rui-color-primary-700);
  --rui-color-nav-info-soft-warning-active: var(--rui-color-primary-700);
  --rui-color-nav-info-soft-neutral-active: var(--rui-color-primary-700);
  --rui-color-nav-info-soft-transparent-active: var(--rui-color-primary-700);
  --rui-color-nav-info-vivid-primary-active: var(--rui-color-primary-200);
  --rui-color-nav-info-vivid-success-active: var(--rui-color-primary-200);
  --rui-color-nav-info-vivid-caution-active: var(--rui-color-primary-700);
  --rui-color-nav-info-vivid-warning-active: var(--rui-color-primary-200);
  --rui-color-nav-info-vivid-neutral-active: var(--rui-color-primary-200);
  --rui-color-nav-info-vivid-hard-active: var(--rui-color-primary-200);

  --rui-color-icon-info-soft-primary: var(--rui-color-primary);
  --rui-color-icon-info-soft-success: var(--rui-color-positive);
  --rui-color-icon-info-soft-caution: var(--rui-color-caution-visible);
  --rui-color-icon-info-soft-warning: var(--rui-color-negative);
  --rui-color-icon-info-soft-neutral: var(--rui-color-neutral);
  --rui-color-icon-info-soft-transparent: var(--rui-color-neutral);
  --rui-color-icon-info-vivid-primary: var(--rui-color-text-inverse);
  --rui-color-icon-info-vivid-success: var(--rui-color-text-inverse);
  --rui-color-icon-info-vivid-caution: var(--rui-color-text-primary);
  --rui-color-icon-info-vivid-warning: var(--rui-color-text-inverse);
  --rui-color-icon-info-vivid-neutral: var(--rui-color-text-inverse);
  --rui-color-icon-info-vivid-hard: var(--rui-color-text-inverse);

  --rui-color-foreground-indicator: var(--rui-color-primary);
  --rui-color-background-indicator: var(--rui-color-neutral-100);

  --rui-font-mono: SFMono-Regular, Consolas, "Liberation Mono", Söhne Mono,
    Menlo, monospace;
  --rui-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Helvetica, Arial, "Yu Gothic UI", "Hiragino Sans", Meiryo,
    sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --rui-font-icon-font: "RICOH-Icon-Font", "RICOH-Icon-Font Regular";
  --rui-font-serif: Georgia, "Times New Roman", serif;

  --rui-font-size-x2s: var(--rui-font-size-x2s-rem);
  --rui-font-size-xs: var(--rui-font-size-xs-rem);
  --rui-font-size-s: var(--rui-font-size-s-rem);
  --rui-font-size-m: var(--rui-font-size-m-rem);
  --rui-font-size-l: var(--rui-font-size-l-rem);
  --rui-font-size-xl: var(--rui-font-size-xl-rem);
  --rui-font-size-x2l: var(--rui-font-size-x2l-rem);
  --rui-font-size-x3l: var(--rui-font-size-x3l-rem);

  --rui-font-size-x2s-rem: 0.58333rem;
  --rui-font-size-xs-rem: 0.65625rem;
  --rui-font-size-s-rem: 0.75rem;
  --rui-font-size-m-rem: 0.875rem;
  --rui-font-size-l-rem: 1.05rem;
  --rui-font-size-xl-rem: 1.3125rem;
  --rui-font-size-x2l-rem: 1.75rem;
  --rui-font-size-x3l-rem: 2.625rem;

  --rui-font-size-x2s-px: 9.3px;
  --rui-font-size-xs-px: 10.5px;
  --rui-font-size-s-px: 12px;
  --rui-font-size-m-px: 14px;
  --rui-font-size-l-px: 16.8px;
  --rui-font-size-xl-px: 21px;
  --rui-font-size-x2l-px: 28px;
  --rui-font-size-x3l-px: 42px;

  --rui-font-weight-light: 300;
  --rui-font-weight-normal: 400;
  --rui-font-weight-semibold: 500;
  --rui-font-weight-bold: 700;

  --rui-line-height-xs: 1;
  --rui-line-height-s: 1.25;
  --rui-line-height-m: 1.5;
  --rui-line-height-l: 1.75;
  --rui-line-height-xl: 2;

  --rui-letter-spacing-xs: -0.03em;
  --rui-letter-spacing-s: -0.015em;
  --rui-letter-spacing-m: normal;
  --rui-letter-spacing-l: 0.075em;
  --rui-letter-spacing-xl: 0.15em;

  --rui-font-size-primary-xs: var(--rui-font-size-s);
  --rui-font-size-primary-s: var(--rui-font-size-m);
  --rui-font-size-primary-m: var(--rui-font-size-m);
  --rui-font-size-primary-l: var(--rui-font-size-l);
  --rui-font-size-primary-xl: var(--rui-font-size-l);

  --rui-font-size-secondary-s: var(--rui-font-size-s);
  --rui-font-size-secondary-m: var(--rui-font-size-m);
  --rui-font-size-secondary-l: var(--rui-font-size-l);

  --rui-font-size-tertiary-s: var(--rui-font-size-xs);
  --rui-font-size-tertiary-m: var(--rui-font-size-s);
  --rui-font-size-tertiary-l: var(--rui-font-size-m);

  --rui-0-px-rem: 0;
  --rui-1-px-rem: 0.0625rem;
  --rui-2-px-rem: 0.125rem;
  --rui-4-px-rem: 0.25rem;
  --rui-6-px-rem: 0.375rem;
  --rui-8-px-rem: 0.5rem;
  --rui-10-px-rem: 0.625rem;
  --rui-12-px-rem: 0.75rem;
  --rui-14-px-rem: 0.875rem;
  --rui-16-px-rem: 1rem;
  --rui-18-px-rem: 1.125rem;
  --rui-20-px-rem: 1.25rem;
  --rui-22-px-rem: 1.375rem;
  --rui-24-px-rem: 1.5rem;
  --rui-28-px-rem: 1.75rem;
  --rui-32-px-rem: 2rem;
  --rui-40-px-rem: 2.5rem;
  --rui-48-px-rem: 3rem;
  --rui-64-px-rem: 4rem;
  --rui-96-px-rem: 6rem;
  --rui-128-px-rem: 8rem;
  --rui-160-px-rem: 10rem;
  --rui-192-px-rem: 12rem;
  --rui-256-px-rem: 16rem;

  --rui-0-px: 0;
  --rui-1-px: 1px;
  --rui-2-px: 2px;
  --rui-4-px: 4px;
  --rui-6-px: 6px;
  --rui-8-px: 8px;
  --rui-10-px: 10px;
  --rui-12-px: 12px;
  --rui-14-px: 14px;
  --rui-16-px: 16px;
  --rui-18-px: 18px;
  --rui-20-px: 20px;
  --rui-22-px: 22px;
  --rui-24-px: 24px;
  --rui-28-px: 28px;
  --rui-32-px: 32px;
  --rui-40-px: 40px;
  --rui-48-px: 48px;
  --rui-64-px: 64px;
  --rui-96-px: 96px;
  --rui-128-px: 128px;
  --rui-160-px: 160px;
  --rui-192-px: 192px;
  --rui-256-px: 256px;

  --rui-size-x4s: var(--rui-1-px-rem);
  --rui-size-x3s: var(--rui-2-px-rem);
  --rui-size-x2s: var(--rui-4-px-rem);
  --rui-size-xs: var(--rui-8-px-rem);
  --rui-size-s: var(--rui-12-px-rem);
  --rui-size-m: var(--rui-16-px-rem);
  --rui-size-l: var(--rui-20-px-rem);
  --rui-size-xl: var(--rui-24-px-rem);
  --rui-size-x2l: var(--rui-32-px-rem);
  --rui-size-x3l: var(--rui-40-px-rem);
  --rui-size-x4l: var(--rui-48-px-rem);
  --rui-size-x5l: var(--rui-64-px-rem);

  --rui-height-primary-xs: var(--rui-size-xl);
  --rui-height-primary-s: var(--rui-size-x2l);
  --rui-height-primary-m: var(--rui-size-x3l);
  --rui-height-primary-l: var(--rui-size-x4l);
  --rui-height-primary-xl: var(--rui-size-x5l);

  --rui-height-secondary-s: var(--rui-size-m);
  --rui-height-secondary-m: var(--rui-size-l);
  --rui-height-secondary-l: var(--rui-size-xl);

  --rui-height-tertiary-s: var(--rui-size-m);
  --rui-height-tertiary-m: var(--rui-size-l);
  --rui-height-tertiary-l: var(--rui-size-xl);

  --rui-size-graphic-x2s: var(--rui-size-xs);
  --rui-size-graphic-xs: var(--rui-size-s);
  --rui-size-graphic-s: var(--rui-size-m);
  --rui-size-graphic-m: var(--rui-size-l);
  --rui-size-graphic-l: var(--rui-size-xl);
  --rui-size-graphic-xl: var(--rui-size-x2l);
  --rui-size-graphic-x2l: var(--rui-size-x4l);
  --rui-size-graphic-x3l: var(--rui-size-x5l);

  --rui-size-bar-xs: var(--rui-1-px);
  --rui-size-bar-s: var(--rui-2-px);
  --rui-size-bar-m: var(--rui-4-px);
  --rui-size-bar-l: var(--rui-8-px);

  --rui-spacing-zero: 0;
  --rui-spacing-x3s: var(--rui-2-px-rem);
  --rui-spacing-x2s: var(--rui-4-px-rem);
  --rui-spacing-xs: var(--rui-8-px-rem);
  --rui-spacing-s: var(--rui-12-px-rem);
  --rui-spacing-m: var(--rui-16-px-rem);
  --rui-spacing-l: var(--rui-24-px-rem);
  --rui-spacing-xl: var(--rui-32-px-rem);
  --rui-spacing-x2l: var(--rui-48-px-rem);
  --rui-spacing-x3l: var(--rui-64-px-rem);

  --rui-padding-primary-xs: var(--rui-spacing-s);
  --rui-padding-primary-s: var(--rui-spacing-m);
  --rui-padding-primary-m: var(--rui-spacing-m);
  --rui-padding-primary-l: var(--rui-spacing-l);
  --rui-padding-primary-xl: var(--rui-spacing-l);

  --rui-padding-primary-graphic-xs: var(--rui-spacing-xs);
  --rui-padding-primary-graphic-s: var(--rui-spacing-s);
  --rui-padding-primary-graphic-m: var(--rui-spacing-s);
  --rui-padding-primary-graphic-l: var(--rui-spacing-m);
  --rui-padding-primary-graphic-xl: var(--rui-spacing-m);

  --rui-padding-primary-nav-xs: var(--rui-spacing-xs);
  --rui-padding-primary-nav-s: var(--rui-spacing-xs);
  --rui-padding-primary-nav-m: var(--rui-spacing-xs);
  --rui-padding-primary-nav-l: var(--rui-spacing-xs);
  --rui-padding-primary-nav-xl: var(--rui-spacing-xs);

  --rui-padding-primary-nav-pill-xs: var(--rui-spacing-xs);
  --rui-padding-primary-nav-pill-s: var(--rui-spacing-xs);
  --rui-padding-primary-nav-pill-m: var(--rui-spacing-xs);
  --rui-padding-primary-nav-pill-l: var(--rui-spacing-s);
  --rui-padding-primary-nav-pill-xl: var(--rui-spacing-s);

  --rui-padding-v-primary-xs: var(--rui-spacing-x2s);
  --rui-padding-v-primary-s: var(--rui-spacing-x2s);
  --rui-padding-v-primary-m: var(--rui-spacing-xs);
  --rui-padding-v-primary-l: var(--rui-spacing-s);
  --rui-padding-v-primary-xl: var(--rui-spacing-m);

  --rui-padding-secondary-s: var(--rui-spacing-xs);
  --rui-padding-secondary-m: var(--rui-spacing-xs);
  --rui-padding-secondary-l: var(--rui-spacing-xs);

  --rui-padding-secondary-graphic-s: var(--rui-spacing-x2s);
  --rui-padding-secondary-graphic-m: var(--rui-spacing-x2s);
  --rui-padding-secondary-graphic-l: var(--rui-spacing-x2s);

  --rui-padding-tertiary-s: var(--rui-spacing-xs);
  --rui-padding-tertiary-m: var(--rui-spacing-xs);
  --rui-padding-tertiary-l: var(--rui-spacing-s);

  --rui-padding-tertiary-graphic-s: var(--rui-spacing-x2s);
  --rui-padding-tertiary-graphic-m: var(--rui-spacing-x2s);
  --rui-padding-tertiary-graphic-l: var(--rui-spacing-xs);

  --rui-padding-higher-xs: var(--rui-spacing-m);
  --rui-padding-higher-s: var(--rui-spacing-l);
  --rui-padding-higher-m: var(--rui-spacing-xl);
  --rui-padding-higher-l: var(--rui-spacing-x2l);

  --rui-gap-intra-s: var(--rui-spacing-x2s);
  --rui-gap-intra-m: var(--rui-spacing-xs);
  --rui-gap-intra-l: var(--rui-spacing-s);
  --rui-gap-intra-xl: var(--rui-spacing-m);

  --rui-gap-s: var(--rui-spacing-xs);
  --rui-gap-m: var(--rui-spacing-m);
  --rui-gap-l: var(--rui-spacing-l);
  --rui-gap-xl: var(--rui-spacing-x2l);

  --rui-border-radius-zero: 0;
  --rui-border-radius-s: var(--rui-2-px-rem);
  --rui-border-radius-m: var(--rui-4-px-rem);
  --rui-border-radius-l: var(--rui-8-px-rem);
  --rui-border-radius-xl: var(--rui-16-px-rem);
  --rui-border-radius-x2l: var(--rui-24-px-rem);
  --rui-border-radius-circle: 50%;
  --rui-border-radius-pill: 9999px;

  --rui-border-radius-higher-zero: var(--rui-border-radius-zero);
  --rui-border-radius-higher-s: var(--rui-border-radius-m);
  --rui-border-radius-higher-m: var(--rui-border-radius-l);
  --rui-border-radius-higher-l: var(--rui-border-radius-xl);
  --rui-border-radius-higher-xl: var(--rui-border-radius-x2l);

  --rui-border-radius-common-zero: var(--rui-border-radius-zero);
  --rui-border-radius-common-s: var(--rui-border-radius-s);
  --rui-border-radius-common-m: var(--rui-border-radius-m);
  --rui-border-radius-common-l: var(--rui-border-radius-l);
  --rui-border-radius-common-pill: var(--rui-border-radius-pill);

  --rui-border-width-zero: var(--rui-0-px);
  --rui-border-width-m: var(--rui-1-px);
  --rui-border-width-l: var(--rui-2-px);
  --rui-border-width-xl: var(--rui-4-px);

  --rui-shadow-inset: inset 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  --rui-shadow-s: 0 1px 3px 0 rgba(0, 0, 0, 0.3);
  --rui-shadow-m: 0 0 6px 0 rgba(0, 0, 0, 0.2);
  --rui-shadow-l-light: 0 0 12px 0 rgba(0, 0, 0, 0.1);
  --rui-shadow-l: 0 0 12px 0 rgba(0, 0, 0, 0.2);
  --rui-shadow-l-heavy: 0 0 12px 0 rgba(0, 0, 0, 0.3);

  --rui-shadow-concave-m: var(--rui-shadow-inset);
  --rui-shadow-convex-m: var(--rui-shadow-s);
  --rui-shadow-popover-m: var(--rui-shadow-m);
  --rui-shadow-float-s: var(--rui-shadow-l-light);
  --rui-shadow-float-m: var(--rui-shadow-l);
  --rui-shadow-float-l: var(--rui-shadow-l-heavy);

  --rui-duration-xs: 75ms;
  --rui-duration-s: 150ms;
  --rui-duration-m: 300ms;
  --rui-duration-l: 450ms;

  --rui-easing-linear: linear;
  --rui-easing-regular: cubic-bezier(0.3, 0, 0.4, 1);
  --rui-easing-fluid: cubic-bezier(0.2, 0, 0.2, 1);

  --rui-transition-mouse-event-s: var(--rui-duration-xs)
    var(--rui-easing-linear);
  --rui-transition-mouse-event-m: var(--rui-duration-s) var(--rui-easing-linear);

  --rui-transition-display-s: var(--rui-duration-s) var(--rui-easing-regular);
  --rui-transition-display-m: var(--rui-duration-m) var(--rui-easing-regular);
  --rui-transition-display-l: var(--rui-duration-l) var(--rui-easing-fluid);

  --rui-transition-motion-s: var(--rui-duration-s) var(--rui-easing-regular);
  --rui-transition-motion-m: var(--rui-duration-m) var(--rui-easing-regular);
  --rui-transition-motion-l: var(--rui-duration-l) var(--rui-easing-fluid);

  --rui-z-index-drawer: 700;
  --rui-z-index-dialog: 800;
  --rui-z-index-dropdown: 900;
  --rui-z-index-toast: 950;
  --rui-z-index-tooltip: 1000;
  --rui-z-index-trump: 9999;

  --rui-color-blue-alpha-80: rgba(40, 101, 222, 0.8);

  --rui-color-focus-ring: var(--rui-color-blue-alpha-80);
  --rui-style-focus-ring: solid;
  --rui-width-focus-ring: var(--rui-border-width-l);
  --rui-focus-ring: var(--rui-style-focus-ring) var(--rui-width-focus-ring)
    var(--rui-color-focus-ring);
  --rui-offset-focus-ring: 2px;

  --rui-opacity-disabled: 0.3;

  --rui-color-background-overlay: hsl(0 0% 0% / 30%);

  --rui-required-mark-content: "*";
  --rui-required-mark-offset: -2px;
  --rui-required-mark-color: var(--rui-color-text-red);
  --rui-color-help-text: var(--rui-color-text-secondary);
  --rui-color-invalid-text: var(--rui-color-text-red);

  --rui-size-toggle-s: var(--rui-12-px-rem);
  --rui-size-toggle-m: var(--rui-14-px-rem);
  --rui-size-toggle-l: var(--rui-16-px-rem);
  --rui-color-border-toggle: var(--rui-color-gray);
  --rui-border-width-toggle: 1px;

  --rui-color-divider: var(--rui-color-low-gray);

  --rui-heading-color: inherit;

  --rui-link-opacity: 1;

  --rui-link-color-rgb: 40, 101, 222;

  --rui-link-hover-color-rgb: 32, 80, 176;

  --rui-highlight-bg: rgba(253, 218, 61, 1);

  --rui-color-code-bg: rgba(0 0 0 / 0.05);

  --rui-color-kbd-bg: var(--rui-color-neutral-50);
  --rui-border-kbd: solid 1px var(--rui-color-neutral-200);
  --rui-box-shadow-kbd: inset 0 1px 0 0 var(--rui-color-neutral-0),
    inset 0 -1px 0 0 var(--rui-color-neutral-100);
}

.rui-scroll-lock {
  padding-right: var(--rui-scroll-lock-size) !important;
  overflow: hidden !important;
}

.rui-toast-stack {
  position: fixed;
  top: 0;
  inset-inline-end: 0;
  z-index: var(--rui-z-index-toast);
  max-width: 100%;
  max-height: 100%;
  overflow: auto;
}

.rui-toast-stack rui-alert::part(base) {
  box-shadow: var(--rui-shadow-float-m);
  width: 30rem;
  max-width: calc(100% - var(--rui-spacing-m) * 2);
  margin: var(--rui-spacing-m);
}