@navikt/ds-css 7.10.0 → 7.11.0

package/dist/global/tokens.css

@@ -3,331 +3,331 @@
  */
 
 :root, :host {
-  --ax-version: "7.10.0";
-  --a-spacing-1-alt: 0.375rem;
-  --a-spacing-05: 0.125rem;
-  --a-spacing-32: 8rem;
-  --a-spacing-24: 6rem;
-  --a-spacing-20: 5rem;
-  --a-spacing-18: 4.5rem;
-  --a-spacing-16: 4rem;
-  --a-spacing-14: 3.5rem;
-  --a-spacing-12: 3rem;
-  --a-spacing-11: 2.75rem;
-  --a-spacing-10: 2.5rem;
-  --a-spacing-9: 2.25rem;
-  --a-spacing-8: 2rem;
-  --a-spacing-7: 1.75rem;
-  --a-spacing-6: 1.5rem;
-  --a-spacing-5: 1.25rem;
-  --a-spacing-4: 1rem;
-  --a-spacing-3: 0.75rem;
-  --a-spacing-2: 0.5rem;
-  --a-spacing-1: 0.25rem;
-  --a-spacing-0: 0;
-  --a-shadow-xlarge: 0px 2px 5px 0px rgba(0, 0, 0, 0.15), 0px 10px 24px 0px rgba(0, 0, 0, 0.18), 0px 0px 1px 0px rgba(0, 0, 0, 0.08);
-  --a-shadow-large: 0px 2px 5px 0px rgba(0, 0, 0, 0.15), 0px 10px 16px 0px rgba(0, 0, 0, 0.12), 0px 0px 1px 0px rgba(0, 0, 0, 0.12);
-  --a-shadow-medium: 0px 5px 12px 0px rgba(0, 0, 0, 0.13), 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
-  --a-shadow-small: 0px 3px 8px 0px rgba(0, 0, 0, 0.10), 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 0px 1px 0px rgba(0, 0, 0, 0.18);
-  --a-shadow-xsmall: 0px 1px 3px 0px rgba(0, 0, 0, 0.15), 0px 0px 1px 0px rgba(0, 0, 0, 0.20);
-  --a-purple-900: rgba(31, 20, 47, 1);
-  --a-purple-800: rgba(48, 31, 70, 1);
-  --a-purple-700: rgba(65, 43, 93, 1);
-  --a-purple-600: rgba(82, 56, 116, 1);
-  --a-purple-500: rgba(99, 70, 137, 1);
-  --a-purple-400: rgba(130, 105, 162, 1);
-  --a-purple-300: rgba(161, 141, 187, 1);
-  --a-purple-200: rgba(192, 178, 210, 1);
-  --a-purple-100: rgba(224, 216, 233, 1);
-  --a-purple-50: rgba(239, 236, 244, 1);
-  --a-orange-900: rgba(82, 51, 0, 1);
-  --a-orange-800: rgba(125, 76, 0, 1);
-  --a-orange-700: rgba(168, 100, 0, 1);
-  --a-orange-600: rgba(199, 115, 0, 1);
-  --a-orange-500: rgba(255, 145, 0, 1);
-  --a-orange-400: rgba(255, 170, 51, 1);
-  --a-orange-300: rgba(255, 193, 102, 1);
-  --a-orange-200: rgba(255, 215, 153, 1);
-  --a-orange-100: rgba(255, 236, 204, 1);
-  --a-orange-50: rgba(255, 249, 240, 1);
-  --a-limegreen-900: rgba(71, 78, 0, 1);
-  --a-limegreen-800: rgba(102, 110, 0, 1);
-  --a-limegreen-700: rgba(127, 137, 0, 1);
-  --a-limegreen-600: rgba(147, 158, 0, 1);
-  --a-limegreen-500: rgba(162, 173, 0, 1);
-  --a-limegreen-400: rgba(193, 203, 51, 1);
-  --a-limegreen-300: rgba(217, 227, 102, 1);
-  --a-limegreen-200: rgba(236, 243, 153, 1);
-  --a-limegreen-100: rgba(249, 252, 204, 1);
-  --a-limegreen-50: rgba(253, 255, 230, 1);
-  --a-lightblue-900: rgba(19, 72, 82, 1);
-  --a-lightblue-800: rgba(35, 107, 125, 1);
-  --a-lightblue-700: rgba(54, 141, 168, 1);
-  --a-lightblue-600: rgba(76, 173, 205, 1);
-  --a-lightblue-500: rgba(102, 203, 236, 1);
-  --a-lightblue-400: rgba(124, 218, 248, 1);
-  --a-lightblue-300: rgba(151, 230, 255, 1);
-  --a-lightblue-200: rgba(181, 241, 255, 1);
-  --a-lightblue-100: rgba(216, 249, 255, 1);
-  --a-lightblue-50: rgba(235, 252, 255, 1);
-  --a-green-900: rgba(0, 59, 15, 1);
-  --a-green-800: rgba(0, 85, 25, 1);
-  --a-green-700: rgba(0, 106, 35, 1);
-  --a-green-600: rgba(0, 124, 46, 1);
-  --a-green-500: rgba(6, 137, 58, 1);
-  --a-green-400: rgba(42, 167, 88, 1);
-  --a-green-300: rgba(102, 199, 134, 1);
-  --a-green-200: rgba(153, 222, 173, 1);
-  --a-green-100: rgba(204, 241, 214, 1);
-  --a-green-50: rgba(243, 252, 245, 1);
-  --a-deepblue-900: rgba(0, 36, 58, 1);
-  --a-deepblue-800: rgba(0, 52, 83, 1);
-  --a-deepblue-700: rgba(0, 67, 103, 1);
-  --a-deepblue-600: rgba(0, 80, 119, 1);
-  --a-deepblue-500: rgba(0, 91, 130, 1);
-  --a-deepblue-400: rgba(51, 128, 165, 1);
-  --a-deepblue-300: rgba(102, 163, 196, 1);
-  --a-deepblue-200: rgba(153, 196, 221, 1);
-  --a-deepblue-100: rgba(204, 226, 240, 1);
-  --a-deepblue-50: rgba(230, 241, 248, 1);
-  --a-red-900: rgba(38, 0, 0, 1);
-  --a-red-800: rgba(92, 0, 0, 1);
-  --a-red-700: rgba(140, 0, 0, 1);
-  --a-red-600: rgba(173, 0, 0, 1);
-  --a-red-500: rgba(195, 0, 0, 1);
-  --a-red-400: rgba(222, 46, 46, 1);
-  --a-red-300: rgba(242, 92, 92, 1);
-  --a-red-200: rgba(246, 130, 130, 1);
-  --a-red-100: rgba(255, 194, 194, 1);
-  --a-red-50: rgba(255, 230, 230, 1);
-  --a-blue-900: rgba(0, 34, 82, 1);
-  --a-blue-800: rgba(0, 52, 125, 1);
-  --a-blue-700: rgba(0, 69, 156, 1);
-  --a-blue-600: rgba(0, 86, 180, 1);
-  --a-blue-500: rgba(0, 103, 197, 1);
-  --a-blue-400: rgba(51, 134, 224, 1);
-  --a-blue-300: rgba(102, 165, 244, 1);
-  --a-blue-200: rgba(153, 195, 255, 1);
-  --a-blue-100: rgba(204, 225, 255, 1);
-  --a-blue-50: rgba(230, 240, 255, 1);
-  --a-grayalpha-900: rgba(2, 5, 9, 0.87);
-  --a-grayalpha-800: rgba(3, 11, 22, 0.75);
-  --a-grayalpha-700: rgba(1, 11, 24, 0.68);
-  --a-grayalpha-600: rgba(2, 15, 34, 0.6);
-  --a-grayalpha-500: rgba(2, 20, 49, 0.49);
-  --a-grayalpha-400: rgba(5, 23, 51, 0.34);
-  --a-grayalpha-300: rgba(7, 26, 54, 0.21);
-  --a-grayalpha-200: rgba(17, 41, 64, 0.13);
-  --a-grayalpha-100: rgba(18, 43, 68, 0.08);
-  --a-grayalpha-50: rgba(38, 55, 89, 0.06);
-  --a-gray-900: rgba(35, 38, 42, 1);
-  --a-gray-800: rgba(66, 71, 79, 1);
-  --a-gray-700: rgba(82, 89, 98, 1);
-  --a-gray-600: rgba(103, 111, 123, 1);
-  --a-gray-500: rgba(131, 140, 154, 1);
-  --a-gray-400: rgba(170, 176, 186, 1);
-  --a-gray-300: rgba(203, 207, 213, 1);
-  --a-gray-200: rgba(224, 227, 230, 1);
-  --a-gray-100: rgba(236, 238, 240, 1);
-  --a-gray-50: rgba(242, 243, 245, 1);
-  --a-nav-red: rgba(195, 0, 0, 1);
-  --a-white: rgba(255, 255, 255, 1);
-  --a-transparent: rgba(255, 255, 255, 0);
-  --a-space-0: 0rem;
-  --a-space-1: .0625rem;
-  --a-space-2: .125rem;
-  --a-space-4: .25rem;
-  --a-space-6: .375rem;
-  --a-space-8: .5rem;
-  --a-space-12: .75rem;
-  --a-space-16: 1rem;
-  --a-space-20: 1.25rem;
-  --a-space-24: 1.5rem;
-  --a-space-28: 1.75rem;
-  --a-space-32: 2rem;
-  --a-space-36: 2.25rem;
-  --a-space-40: 2.5rem;
-  --a-space-44: 2.75rem;
-  --a-space-48: 3rem;
-  --a-space-56: 3.5rem;
-  --a-space-64: 4rem;
-  --a-space-72: 4.5rem;
-  --a-space-80: 5rem;
-  --a-space-96: 6rem;
-  --a-space-128: 8rem;
-  --a-border-radius-full: 9999px;
-  --a-border-radius-xlarge: 12px;
-  --a-border-radius-large: 8px;
-  --a-border-radius-medium: 4px;
-  --a-border-radius-small: 2px;
-  --a-z-index-tooltip: 3000;
-  --a-z-index-focus: 10;
-  --a-z-index-popover: 1000;
-  --a-font-weight-regular: 400;
-  --a-font-weight-bold: 600;
-  --a-font-size-small: 0.875rem;
-  --a-font-size-medium: 1rem;
-  --a-font-size-large: 1.125rem;
-  --a-font-size-xlarge: 1.25rem;
-  --a-font-size-heading-xsmall: 1.125rem;
-  --a-font-size-heading-small: 1.25rem;
-  --a-font-size-heading-medium: 1.5rem;
-  --a-font-size-heading-large: 1.75rem;
-  --a-font-size-heading-xlarge: 2rem;
-  --a-font-size-heading-2xlarge: 2.5rem;
-  --a-font-line-height-medium: 1.25rem;
-  --a-font-line-height-large: 1.5rem;
-  --a-font-line-height-xlarge: 1.75rem;
-  --a-font-line-height-heading-xsmall: 1.5rem;
-  --a-font-line-height-heading-small: 1.75rem;
-  --a-font-line-height-heading-medium: 2rem;
-  --a-font-line-height-heading-large: 2.25rem;
-  --a-font-line-height-heading-xlarge: 2.5rem;
-  --a-font-line-height-heading-2xlarge: 3.25rem;
-  --a-font-family: 'Source Sans 3', 'Source Sans Pro', Arial, sans-serif;
-  --a-text-width-max: 576px;
-  --a-breakpoint-2xl-down: 1439px;
-  --a-breakpoint-2xl: 1440px;
-  --a-breakpoint-xl-down: 1279px;
-  --a-breakpoint-xl: 1280px;
-  --a-breakpoint-lg-down: 1023px;
-  --a-breakpoint-lg: 1024px;
-  --a-breakpoint-md-down: 767px;
-  --a-breakpoint-md: 768px;
-  --a-breakpoint-sm-down: 479px;
-  --a-breakpoint-sm: 480px;
+  --ax-version: "7.11.0";
   --a-breakpoint-xs: 0;
-  --a-data-border-6: var(--a-purple-400);
-  --a-data-border-5: var(--a-green-400);
-  --a-data-border-4: var(--a-lightblue-700);
-  --a-data-border-3: var(--a-orange-600);
-  --a-data-border-2: var(--a-deepblue-500);
-  --a-data-border-1: var(--a-blue-400);
-  --a-data-surface-6-subtle: var(--a-purple-200);
-  --a-data-surface-6: var(--a-purple-400);
-  --a-data-surface-5-subtle: var(--a-green-200);
-  --a-data-surface-5: var(--a-green-400);
-  --a-data-surface-4-subtle: var(--a-lightblue-500);
-  --a-data-surface-4: var(--a-lightblue-700);
-  --a-data-surface-3-subtle: var(--a-orange-300);
-  --a-data-surface-3: var(--a-orange-600);
-  --a-data-surface-2-subtle: var(--a-deepblue-200);
-  --a-data-surface-2: var(--a-deepblue-500);
-  --a-data-surface-1-subtle: var(--a-blue-100);
-  --a-data-surface-1: var(--a-blue-400);
-  --a-text-on-alt-3: var(--a-white);
-  --a-text-on-alt-2: var(--a-gray-900);
-  --a-text-on-alt-1: var(--a-white);
-  --a-text-on-info: var(--a-gray-900);
-  --a-text-on-warning: var(--a-gray-900);
-  --a-text-on-danger: var(--a-white);
-  --a-text-on-success: var(--a-white);
-  --a-text-on-action: var(--a-white);
-  --a-text-on-neutral: var(--a-white);
-  --a-text-on-inverted: var(--a-white);
-  --a-text-action: var(--a-blue-500);
-  --a-text-action-on-action-subtle: var(--a-blue-600);
-  --a-text-action-hover: var(--a-blue-600);
-  --a-text-action-selected: var(--a-blue-700);
-  --a-text-danger: var(--a-red-500);
-  --a-text-visited: var(--a-purple-500);
-  --a-text-subtle: var(--a-grayalpha-700);
-  --a-text-default: var(--a-gray-900);
-  --a-surface-alt-3: var(--a-deepblue-500);
-  --a-surface-alt-3-strong: var(--a-deepblue-800);
-  --a-surface-alt-3-moderate: var(--a-deepblue-200);
-  --a-surface-alt-3-subtle: var(--a-deepblue-100);
-  --a-surface-alt-2: var(--a-limegreen-400);
-  --a-surface-alt-2-moderate: var(--a-limegreen-200);
-  --a-surface-alt-2-subtle: var(--a-limegreen-100);
-  --a-surface-alt-1: var(--a-purple-400);
-  --a-surface-alt-1-moderate: var(--a-purple-200);
-  --a-surface-alt-1-subtle: var(--a-purple-100);
-  --a-surface-info: var(--a-lightblue-500);
-  --a-surface-info-moderate: var(--a-lightblue-200);
-  --a-surface-info-subtle: var(--a-lightblue-100);
-  --a-surface-warning: var(--a-orange-500);
-  --a-surface-warning-moderate: var(--a-orange-200);
-  --a-surface-warning-subtle: var(--a-orange-100);
-  --a-surface-danger: var(--a-red-500);
-  --a-surface-danger-moderate: var(--a-red-200);
-  --a-surface-danger-subtle: var(--a-red-100);
-  --a-surface-success: var(--a-green-500);
-  --a-surface-success-moderate: var(--a-green-200);
-  --a-surface-success-subtle: var(--a-green-100);
-  --a-surface-neutral: var(--a-gray-700);
-  --a-surface-neutral-selected: var(--a-gray-900);
-  --a-surface-neutral-moderate: var(--a-grayalpha-200);
-  --a-surface-neutral-subtle: var(--a-grayalpha-100);
-  --a-surface-action: var(--a-blue-500);
-  --a-surface-action-selected: var(--a-blue-700);
-  --a-surface-action-subtle: var(--a-blue-50);
-  --a-surface-inverted: var(--a-gray-900);
-  --a-surface-backdrop: var(--a-grayalpha-500);
-  --a-surface-transparent: var(--a-transparent);
-  --a-surface-subtle: var(--a-gray-50);
-  --a-surface-selected: var(--a-blue-50);
-  --a-surface-default: var(--a-white);
-  --a-surface-info-subtle-hover: var(--a-lightblue-200);
-  --a-surface-warning-subtle-hover: var(--a-orange-200);
-  --a-surface-danger-active: var(--a-red-700);
-  --a-surface-danger-hover: var(--a-red-600);
-  --a-surface-danger-subtle-hover: var(--a-red-200);
-  --a-surface-success-hover: var(--a-green-600);
-  --a-surface-success-subtle-hover: var(--a-green-200);
-  --a-surface-neutral-hover: var(--a-gray-800);
-  --a-surface-neutral-active: var(--a-gray-900);
-  --a-surface-neutral-subtle-hover: var(--a-grayalpha-200);
-  --a-surface-action-selected-hover: var(--a-blue-800);
-  --a-surface-action-active: var(--a-blue-700);
-  --a-surface-action-hover: var(--a-blue-600);
-  --a-surface-action-subtle-hover: var(--a-blue-100);
-  --a-surface-inverted-active: var(--a-gray-700);
-  --a-surface-inverted-hover: var(--a-gray-800);
-  --a-surface-active: var(--a-grayalpha-200);
-  --a-surface-hover: var(--a-grayalpha-100);
-  --a-icon-on-info: var(--a-gray-900);
-  --a-icon-on-warning: var(--a-gray-900);
-  --a-icon-on-danger: var(--a-white);
-  --a-icon-on-success: var(--a-white);
-  --a-icon-on-action: var(--a-white);
-  --a-icon-on-inverted: var(--a-white);
-  --a-icon-on-neutral: var(--a-white);
-  --a-icon-alt-3: var(--a-deepblue-500);
-  --a-icon-alt-2: var(--a-limegreen-700);
-  --a-icon-alt-1: var(--a-purple-500);
-  --a-icon-info: var(--a-lightblue-800);
-  --a-icon-warning: var(--a-orange-600);
-  --a-icon-danger: var(--a-red-500);
-  --a-icon-success: var(--a-green-500);
-  --a-icon-action: var(--a-blue-500);
-  --a-icon-action-on-action-subtle: var(--a-blue-600);
-  --a-icon-action-hover: var(--a-blue-600);
-  --a-icon-action-selected: var(--a-blue-700);
-  --a-icon-subtle: var(--a-grayalpha-700);
-  --a-icon-default: var(--a-gray-900);
-  --a-border-alt-3: var(--a-deepblue-500);
-  --a-border-alt-2: var(--a-limegreen-700);
-  --a-border-alt-1: var(--a-purple-400);
-  --a-border-on-inverted-subtle: var(--a-gray-700);
-  --a-border-on-inverted: var(--a-gray-200);
-  --a-border-focus: var(--a-blue-800);
-  --a-border-focus-on-inverted: var(--a-blue-200);
-  --a-border-info: var(--a-lightblue-700);
-  --a-border-warning: var(--a-orange-600);
-  --a-border-danger: var(--a-red-500);
-  --a-border-success: var(--a-green-500);
-  --a-border-selected: var(--a-blue-500);
-  --a-border-action: var(--a-blue-500);
-  --a-border-action-hover: var(--a-blue-600);
-  --a-border-action-selected: var(--a-blue-700);
-  --a-border-subtle: var(--a-grayalpha-300);
-  --a-border-divider: var(--a-grayalpha-300);
-  --a-border-strong: var(--a-grayalpha-700);
-  --a-border-default: var(--a-grayalpha-500);
-  --a-border-subtle-hover: var(--a-grayalpha-400);
-  --a-bg-subtle: var(--a-gray-100);
+  --a-breakpoint-sm: 480px;
+  --a-breakpoint-sm-down: 479px;
+  --a-breakpoint-md: 768px;
+  --a-breakpoint-md-down: 767px;
+  --a-breakpoint-lg: 1024px;
+  --a-breakpoint-lg-down: 1023px;
+  --a-breakpoint-xl: 1280px;
+  --a-breakpoint-xl-down: 1279px;
+  --a-breakpoint-2xl: 1440px;
+  --a-breakpoint-2xl-down: 1439px;
+  --a-text-width-max: 576px;
+  --a-font-family: 'Source Sans 3', 'Source Sans Pro', Arial, sans-serif;
+  --a-font-line-height-heading-2xlarge: 3.25rem;
+  --a-font-line-height-heading-xlarge: 2.5rem;
+  --a-font-line-height-heading-large: 2.25rem;
+  --a-font-line-height-heading-medium: 2rem;
+  --a-font-line-height-heading-small: 1.75rem;
+  --a-font-line-height-heading-xsmall: 1.5rem;
+  --a-font-line-height-xlarge: 1.75rem;
+  --a-font-line-height-large: 1.5rem;
+  --a-font-line-height-medium: 1.25rem;
+  --a-font-size-heading-2xlarge: 2.5rem;
+  --a-font-size-heading-xlarge: 2rem;
+  --a-font-size-heading-large: 1.75rem;
+  --a-font-size-heading-medium: 1.5rem;
+  --a-font-size-heading-small: 1.25rem;
+  --a-font-size-heading-xsmall: 1.125rem;
+  --a-font-size-xlarge: 1.25rem;
+  --a-font-size-large: 1.125rem;
+  --a-font-size-medium: 1rem;
+  --a-font-size-small: 0.875rem;
+  --a-font-weight-bold: 600;
+  --a-font-weight-regular: 400;
+  --a-z-index-popover: 1000;
+  --a-z-index-focus: 10;
+  --a-z-index-tooltip: 3000;
+  --a-border-radius-small: 2px;
+  --a-border-radius-medium: 4px;
+  --a-border-radius-large: 8px;
+  --a-border-radius-xlarge: 12px;
+  --a-border-radius-full: 9999px;
+  --a-space-128: 8rem;
+  --a-space-96: 6rem;
+  --a-space-80: 5rem;
+  --a-space-72: 4.5rem;
+  --a-space-64: 4rem;
+  --a-space-56: 3.5rem;
+  --a-space-48: 3rem;
+  --a-space-44: 2.75rem;
+  --a-space-40: 2.5rem;
+  --a-space-36: 2.25rem;
+  --a-space-32: 2rem;
+  --a-space-28: 1.75rem;
+  --a-space-24: 1.5rem;
+  --a-space-20: 1.25rem;
+  --a-space-16: 1rem;
+  --a-space-12: .75rem;
+  --a-space-8: .5rem;
+  --a-space-6: .375rem;
+  --a-space-4: .25rem;
+  --a-space-2: .125rem;
+  --a-space-1: .0625rem;
+  --a-space-0: 0rem;
+  --a-transparent: rgba(255, 255, 255, 0);
+  --a-white: rgba(255, 255, 255, 1);
+  --a-nav-red: rgba(195, 0, 0, 1);
+  --a-gray-50: rgba(242, 243, 245, 1);
+  --a-gray-100: rgba(236, 238, 240, 1);
+  --a-gray-200: rgba(224, 227, 230, 1);
+  --a-gray-300: rgba(203, 207, 213, 1);
+  --a-gray-400: rgba(170, 176, 186, 1);
+  --a-gray-500: rgba(131, 140, 154, 1);
+  --a-gray-600: rgba(103, 111, 123, 1);
+  --a-gray-700: rgba(82, 89, 98, 1);
+  --a-gray-800: rgba(66, 71, 79, 1);
+  --a-gray-900: rgba(35, 38, 42, 1);
+  --a-grayalpha-50: rgba(38, 55, 89, 0.06);
+  --a-grayalpha-100: rgba(18, 43, 68, 0.08);
+  --a-grayalpha-200: rgba(17, 41, 64, 0.13);
+  --a-grayalpha-300: rgba(7, 26, 54, 0.21);
+  --a-grayalpha-400: rgba(5, 23, 51, 0.34);
+  --a-grayalpha-500: rgba(2, 20, 49, 0.49);
+  --a-grayalpha-600: rgba(2, 15, 34, 0.6);
+  --a-grayalpha-700: rgba(1, 11, 24, 0.68);
+  --a-grayalpha-800: rgba(3, 11, 22, 0.75);
+  --a-grayalpha-900: rgba(2, 5, 9, 0.87);
+  --a-blue-50: rgba(230, 240, 255, 1);
+  --a-blue-100: rgba(204, 225, 255, 1);
+  --a-blue-200: rgba(153, 195, 255, 1);
+  --a-blue-300: rgba(102, 165, 244, 1);
+  --a-blue-400: rgba(51, 134, 224, 1);
+  --a-blue-500: rgba(0, 103, 197, 1);
+  --a-blue-600: rgba(0, 86, 180, 1);
+  --a-blue-700: rgba(0, 69, 156, 1);
+  --a-blue-800: rgba(0, 52, 125, 1);
+  --a-blue-900: rgba(0, 34, 82, 1);
+  --a-red-50: rgba(255, 230, 230, 1);
+  --a-red-100: rgba(255, 194, 194, 1);
+  --a-red-200: rgba(246, 130, 130, 1);
+  --a-red-300: rgba(242, 92, 92, 1);
+  --a-red-400: rgba(222, 46, 46, 1);
+  --a-red-500: rgba(195, 0, 0, 1);
+  --a-red-600: rgba(173, 0, 0, 1);
+  --a-red-700: rgba(140, 0, 0, 1);
+  --a-red-800: rgba(92, 0, 0, 1);
+  --a-red-900: rgba(38, 0, 0, 1);
+  --a-deepblue-50: rgba(230, 241, 248, 1);
+  --a-deepblue-100: rgba(204, 226, 240, 1);
+  --a-deepblue-200: rgba(153, 196, 221, 1);
+  --a-deepblue-300: rgba(102, 163, 196, 1);
+  --a-deepblue-400: rgba(51, 128, 165, 1);
+  --a-deepblue-500: rgba(0, 91, 130, 1);
+  --a-deepblue-600: rgba(0, 80, 119, 1);
+  --a-deepblue-700: rgba(0, 67, 103, 1);
+  --a-deepblue-800: rgba(0, 52, 83, 1);
+  --a-deepblue-900: rgba(0, 36, 58, 1);
+  --a-green-50: rgba(243, 252, 245, 1);
+  --a-green-100: rgba(204, 241, 214, 1);
+  --a-green-200: rgba(153, 222, 173, 1);
+  --a-green-300: rgba(102, 199, 134, 1);
+  --a-green-400: rgba(42, 167, 88, 1);
+  --a-green-500: rgba(6, 137, 58, 1);
+  --a-green-600: rgba(0, 124, 46, 1);
+  --a-green-700: rgba(0, 106, 35, 1);
+  --a-green-800: rgba(0, 85, 25, 1);
+  --a-green-900: rgba(0, 59, 15, 1);
+  --a-lightblue-50: rgba(235, 252, 255, 1);
+  --a-lightblue-100: rgba(216, 249, 255, 1);
+  --a-lightblue-200: rgba(181, 241, 255, 1);
+  --a-lightblue-300: rgba(151, 230, 255, 1);
+  --a-lightblue-400: rgba(124, 218, 248, 1);
+  --a-lightblue-500: rgba(102, 203, 236, 1);
+  --a-lightblue-600: rgba(76, 173, 205, 1);
+  --a-lightblue-700: rgba(54, 141, 168, 1);
+  --a-lightblue-800: rgba(35, 107, 125, 1);
+  --a-lightblue-900: rgba(19, 72, 82, 1);
+  --a-limegreen-50: rgba(253, 255, 230, 1);
+  --a-limegreen-100: rgba(249, 252, 204, 1);
+  --a-limegreen-200: rgba(236, 243, 153, 1);
+  --a-limegreen-300: rgba(217, 227, 102, 1);
+  --a-limegreen-400: rgba(193, 203, 51, 1);
+  --a-limegreen-500: rgba(162, 173, 0, 1);
+  --a-limegreen-600: rgba(147, 158, 0, 1);
+  --a-limegreen-700: rgba(127, 137, 0, 1);
+  --a-limegreen-800: rgba(102, 110, 0, 1);
+  --a-limegreen-900: rgba(71, 78, 0, 1);
+  --a-orange-50: rgba(255, 249, 240, 1);
+  --a-orange-100: rgba(255, 236, 204, 1);
+  --a-orange-200: rgba(255, 215, 153, 1);
+  --a-orange-300: rgba(255, 193, 102, 1);
+  --a-orange-400: rgba(255, 170, 51, 1);
+  --a-orange-500: rgba(255, 145, 0, 1);
+  --a-orange-600: rgba(199, 115, 0, 1);
+  --a-orange-700: rgba(168, 100, 0, 1);
+  --a-orange-800: rgba(125, 76, 0, 1);
+  --a-orange-900: rgba(82, 51, 0, 1);
+  --a-purple-50: rgba(239, 236, 244, 1);
+  --a-purple-100: rgba(224, 216, 233, 1);
+  --a-purple-200: rgba(192, 178, 210, 1);
+  --a-purple-300: rgba(161, 141, 187, 1);
+  --a-purple-400: rgba(130, 105, 162, 1);
+  --a-purple-500: rgba(99, 70, 137, 1);
+  --a-purple-600: rgba(82, 56, 116, 1);
+  --a-purple-700: rgba(65, 43, 93, 1);
+  --a-purple-800: rgba(48, 31, 70, 1);
+  --a-purple-900: rgba(31, 20, 47, 1);
+  --a-shadow-xsmall: 0px 1px 3px 0px rgba(0, 0, 0, 0.15), 0px 0px 1px 0px rgba(0, 0, 0, 0.20);
+  --a-shadow-small: 0px 3px 8px 0px rgba(0, 0, 0, 0.10), 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 0px 1px 0px rgba(0, 0, 0, 0.18);
+  --a-shadow-medium: 0px 5px 12px 0px rgba(0, 0, 0, 0.13), 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
+  --a-shadow-large: 0px 2px 5px 0px rgba(0, 0, 0, 0.15), 0px 10px 16px 0px rgba(0, 0, 0, 0.12), 0px 0px 1px 0px rgba(0, 0, 0, 0.12);
+  --a-shadow-xlarge: 0px 2px 5px 0px rgba(0, 0, 0, 0.15), 0px 10px 24px 0px rgba(0, 0, 0, 0.18), 0px 0px 1px 0px rgba(0, 0, 0, 0.08);
+  --a-spacing-0: 0;
+  --a-spacing-1: 0.25rem;
+  --a-spacing-2: 0.5rem;
+  --a-spacing-3: 0.75rem;
+  --a-spacing-4: 1rem;
+  --a-spacing-5: 1.25rem;
+  --a-spacing-6: 1.5rem;
+  --a-spacing-7: 1.75rem;
+  --a-spacing-8: 2rem;
+  --a-spacing-9: 2.25rem;
+  --a-spacing-10: 2.5rem;
+  --a-spacing-11: 2.75rem;
+  --a-spacing-12: 3rem;
+  --a-spacing-14: 3.5rem;
+  --a-spacing-16: 4rem;
+  --a-spacing-18: 4.5rem;
+  --a-spacing-20: 5rem;
+  --a-spacing-24: 6rem;
+  --a-spacing-32: 8rem;
+  --a-spacing-05: 0.125rem;
+  --a-spacing-1-alt: 0.375rem;
   --a-bg-default: var(--a-white);
-  --a-shadow-focus-inverted: 0 0 0 3px var(--a-border-focus-on-inverted);
+  --a-bg-subtle: var(--a-gray-100);
+  --a-border-subtle-hover: var(--a-grayalpha-400);
+  --a-border-default: var(--a-grayalpha-500);
+  --a-border-strong: var(--a-grayalpha-700);
+  --a-border-divider: var(--a-grayalpha-300);
+  --a-border-subtle: var(--a-grayalpha-300);
+  --a-border-action-selected: var(--a-blue-700);
+  --a-border-action-hover: var(--a-blue-600);
+  --a-border-action: var(--a-blue-500);
+  --a-border-selected: var(--a-blue-500);
+  --a-border-success: var(--a-green-500);
+  --a-border-danger: var(--a-red-500);
+  --a-border-warning: var(--a-orange-600);
+  --a-border-info: var(--a-lightblue-700);
+  --a-border-focus-on-inverted: var(--a-blue-200);
+  --a-border-focus: var(--a-blue-800);
+  --a-border-on-inverted: var(--a-gray-200);
+  --a-border-on-inverted-subtle: var(--a-gray-700);
+  --a-border-alt-1: var(--a-purple-400);
+  --a-border-alt-2: var(--a-limegreen-700);
+  --a-border-alt-3: var(--a-deepblue-500);
+  --a-icon-default: var(--a-gray-900);
+  --a-icon-subtle: var(--a-grayalpha-700);
+  --a-icon-action-selected: var(--a-blue-700);
+  --a-icon-action-hover: var(--a-blue-600);
+  --a-icon-action-on-action-subtle: var(--a-blue-600);
+  --a-icon-action: var(--a-blue-500);
+  --a-icon-success: var(--a-green-500);
+  --a-icon-danger: var(--a-red-500);
+  --a-icon-warning: var(--a-orange-600);
+  --a-icon-info: var(--a-lightblue-800);
+  --a-icon-alt-1: var(--a-purple-500);
+  --a-icon-alt-2: var(--a-limegreen-700);
+  --a-icon-alt-3: var(--a-deepblue-500);
+  --a-icon-on-neutral: var(--a-white);
+  --a-icon-on-inverted: var(--a-white);
+  --a-icon-on-action: var(--a-white);
+  --a-icon-on-success: var(--a-white);
+  --a-icon-on-danger: var(--a-white);
+  --a-icon-on-warning: var(--a-gray-900);
+  --a-icon-on-info: var(--a-gray-900);
+  --a-surface-hover: var(--a-grayalpha-100);
+  --a-surface-active: var(--a-grayalpha-200);
+  --a-surface-inverted-hover: var(--a-gray-800);
+  --a-surface-inverted-active: var(--a-gray-700);
+  --a-surface-action-subtle-hover: var(--a-blue-100);
+  --a-surface-action-hover: var(--a-blue-600);
+  --a-surface-action-active: var(--a-blue-700);
+  --a-surface-action-selected-hover: var(--a-blue-800);
+  --a-surface-neutral-subtle-hover: var(--a-grayalpha-200);
+  --a-surface-neutral-active: var(--a-gray-900);
+  --a-surface-neutral-hover: var(--a-gray-800);
+  --a-surface-success-subtle-hover: var(--a-green-200);
+  --a-surface-success-hover: var(--a-green-600);
+  --a-surface-danger-subtle-hover: var(--a-red-200);
+  --a-surface-danger-hover: var(--a-red-600);
+  --a-surface-danger-active: var(--a-red-700);
+  --a-surface-warning-subtle-hover: var(--a-orange-200);
+  --a-surface-info-subtle-hover: var(--a-lightblue-200);
+  --a-surface-default: var(--a-white);
+  --a-surface-selected: var(--a-blue-50);
+  --a-surface-subtle: var(--a-gray-50);
+  --a-surface-transparent: var(--a-transparent);
+  --a-surface-backdrop: var(--a-grayalpha-500);
+  --a-surface-inverted: var(--a-gray-900);
+  --a-surface-action-subtle: var(--a-blue-50);
+  --a-surface-action-selected: var(--a-blue-700);
+  --a-surface-action: var(--a-blue-500);
+  --a-surface-neutral-subtle: var(--a-grayalpha-100);
+  --a-surface-neutral-moderate: var(--a-grayalpha-200);
+  --a-surface-neutral-selected: var(--a-gray-900);
+  --a-surface-neutral: var(--a-gray-700);
+  --a-surface-success-subtle: var(--a-green-100);
+  --a-surface-success-moderate: var(--a-green-200);
+  --a-surface-success: var(--a-green-500);
+  --a-surface-danger-subtle: var(--a-red-100);
+  --a-surface-danger-moderate: var(--a-red-200);
+  --a-surface-danger: var(--a-red-500);
+  --a-surface-warning-subtle: var(--a-orange-100);
+  --a-surface-warning-moderate: var(--a-orange-200);
+  --a-surface-warning: var(--a-orange-500);
+  --a-surface-info-subtle: var(--a-lightblue-100);
+  --a-surface-info-moderate: var(--a-lightblue-200);
+  --a-surface-info: var(--a-lightblue-500);
+  --a-surface-alt-1-subtle: var(--a-purple-100);
+  --a-surface-alt-1-moderate: var(--a-purple-200);
+  --a-surface-alt-1: var(--a-purple-400);
+  --a-surface-alt-2-subtle: var(--a-limegreen-100);
+  --a-surface-alt-2-moderate: var(--a-limegreen-200);
+  --a-surface-alt-2: var(--a-limegreen-400);
+  --a-surface-alt-3-subtle: var(--a-deepblue-100);
+  --a-surface-alt-3-moderate: var(--a-deepblue-200);
+  --a-surface-alt-3-strong: var(--a-deepblue-800);
+  --a-surface-alt-3: var(--a-deepblue-500);
+  --a-text-default: var(--a-gray-900);
+  --a-text-subtle: var(--a-grayalpha-700);
+  --a-text-visited: var(--a-purple-500);
+  --a-text-danger: var(--a-red-500);
+  --a-text-action-selected: var(--a-blue-700);
+  --a-text-action-hover: var(--a-blue-600);
+  --a-text-action-on-action-subtle: var(--a-blue-600);
+  --a-text-action: var(--a-blue-500);
+  --a-text-on-inverted: var(--a-white);
+  --a-text-on-neutral: var(--a-white);
+  --a-text-on-action: var(--a-white);
+  --a-text-on-success: var(--a-white);
+  --a-text-on-danger: var(--a-white);
+  --a-text-on-warning: var(--a-gray-900);
+  --a-text-on-info: var(--a-gray-900);
+  --a-text-on-alt-1: var(--a-white);
+  --a-text-on-alt-2: var(--a-gray-900);
+  --a-text-on-alt-3: var(--a-white);
+  --a-data-surface-1: var(--a-blue-400);
+  --a-data-surface-1-subtle: var(--a-blue-100);
+  --a-data-surface-2: var(--a-deepblue-500);
+  --a-data-surface-2-subtle: var(--a-deepblue-200);
+  --a-data-surface-3: var(--a-orange-600);
+  --a-data-surface-3-subtle: var(--a-orange-300);
+  --a-data-surface-4: var(--a-lightblue-700);
+  --a-data-surface-4-subtle: var(--a-lightblue-500);
+  --a-data-surface-5: var(--a-green-400);
+  --a-data-surface-5-subtle: var(--a-green-200);
+  --a-data-surface-6: var(--a-purple-400);
+  --a-data-surface-6-subtle: var(--a-purple-200);
+  --a-data-border-1: var(--a-blue-400);
+  --a-data-border-2: var(--a-deepblue-500);
+  --a-data-border-3: var(--a-orange-600);
+  --a-data-border-4: var(--a-lightblue-700);
+  --a-data-border-5: var(--a-green-400);
+  --a-data-border-6: var(--a-purple-400);
   --a-shadow-focus: 0 0 0 3px var(--a-border-focus);
+  --a-shadow-focus-inverted: 0 0 0 3px var(--a-border-focus-on-inverted);
 }