@arc-ui/tokens-ee 12.0.0-beta.3

package/dist/index.css

@@ -0,0 +1,1617 @@
+/**
+ * Do not edit directly
+ * Generated on Fri, 23 Aug 2024 17:25:49 GMT
+ */
+
+.arc-ds-sys-theme--ee {
+  --sem-font-family-heading: Non-Dottee;
+  --sem-font-family-body: Non-Dottee;
+  --sem-font-family-interface: Non-Dottee;
+  --sem-font-weight-regular: 400;
+  --sem-font-weight-semi: 700;
+  --sem-font-weight-bold: 700;
+  --sem-font-weight-button: 700;
+  --sem-font-weight-semi-bold: 500;
+  --sem-type-body-reg-xs: 400 12px/16px Non-Dottee;
+  --sem-type-body-reg-s: 400 14px/20px Non-Dottee;
+  --sem-type-body-reg-m: 400 16px/24px Non-Dottee;
+  --sem-type-body-reg-l: 400 20px/26px Non-Dottee;
+  --sem-type-body-bold-xs: 700 12px/16px Non-Dottee;
+  --sem-type-body-bold-s: 700 14px/20px Non-Dottee;
+  --sem-type-body-bold-m: 700 16px/24px Non-Dottee;
+  --sem-type-body-bold-l: 700 20px/26px Non-Dottee;
+  --sem-type-body-semi-xs: 700 12px/16px Non-Dottee;
+  --sem-type-body-semi-s: 700 14px/20px Non-Dottee;
+  --sem-type-body-semi-m: 700 16px/24px Non-Dottee;
+  --sem-type-body-semi-l: 700 20px/26px Non-Dottee;
+  --sem-type-interface-reg-xs: 400 12px/12px Non-Dottee;
+  --sem-type-interface-reg-s: 400 14px/14px Non-Dottee;
+  --sem-type-interface-reg-m: 400 16px/16px Non-Dottee;
+  --sem-type-interface-reg-l: 400 20px/20px Non-Dottee;
+  --sem-type-interface-semi-xs: 700 12px/12px Non-Dottee;
+  --sem-type-interface-semi-s: 700 14px/14px Non-Dottee;
+  --sem-type-interface-semi-m: 700 16px/16px Non-Dottee;
+  --sem-type-interface-semi-l: 700 20px/20px Non-Dottee;
+  --sem-type-interface-bold-xs: 700 12px/12px Non-Dottee;
+  --sem-type-interface-bold-s: 700 14px/14px Non-Dottee;
+  --sem-type-interface-bold-m: 700 16px/16px Non-Dottee;
+  --sem-type-interface-bold-l: 700 20px/20px Non-Dottee;
+  --sem-type-interface-button-s: 700 14px/14px Non-Dottee;
+  --sem-type-interface-button-m: 700 16px/16px Non-Dottee;
+  --sem-type-interface-button-l: 700 20px/20px Non-Dottee;
+  --sem-type-interface-card-semi-m: 700 24px/32px Non-Dottee;
+  --sem-type-interface-card-semi-l: 700 28px/32px Non-Dottee;
+  --sem-type-interface-card-semi-xl: 700 32px/40px Non-Dottee;
+  --sem-type-interface-card-semi-s: 700 20px/26px Non-Dottee;
+  --sem-type-interface-alert-title-m: 700 16px/24px Non-Dottee;
+  --sem-type-interface-progress-bar-title-m: 400 16px/16px Non-Dottee;
+  --sem-type-support-reg-xs: 400 12px/16px Non-Dottee;
+  --sem-type-support-reg-s: 400 14px/20px Non-Dottee;
+  --sem-type-support-reg-m: 400 16px/24px Non-Dottee;
+  --sem-type-support-reg-l: 400 20px/26px Non-Dottee;
+  --sem-type-mobile-semi-xxxs: 700 12px/16px Non-Dottee;
+  --sem-type-mobile-semi-xxs: 700 14px/20px Non-Dottee;
+  --sem-type-mobile-semi-xs: 700 16px/24px Non-Dottee;
+  --sem-type-mobile-semi-s: 700 20px/26px Non-Dottee;
+  --sem-type-mobile-semi-m: 700 24px/32px Non-Dottee;
+  --sem-type-mobile-semi-l: 700 28px/36px Non-Dottee;
+  --sem-type-mobile-semi-xl: 700 36px/44px Non-Dottee;
+  --sem-type-mobile-semi-xxl: 700 40px/48px Non-Dottee;
+  --sem-type-mobile-semi-xxxl: 700 56px/64px Non-Dottee;
+  --sem-type-mobile-bold-xxxs: 700 12px/16px Non-Dottee;
+  --sem-type-mobile-bold-xxs: 700 14px/20px Non-Dottee;
+  --sem-type-mobile-bold-xs: 700 16px/24px Non-Dottee;
+  --sem-type-mobile-bold-s: 700 20px/26px Non-Dottee;
+  --sem-type-mobile-bold-m: 700 24px/32px Non-Dottee;
+  --sem-type-mobile-bold-l: 700 28px/36px Non-Dottee;
+  --sem-type-mobile-bold-xl: 700 36px/44px Non-Dottee;
+  --sem-type-mobile-bold-xxl: 700 40px/48px Non-Dottee;
+  --sem-type-mobile-bold-xxxl: 700 56px/64px Non-Dottee;
+  --sem-type-tablet-semi-m: 700 28px/36px Non-Dottee;
+  --sem-type-tablet-semi-l: 700 32px/40px Non-Dottee;
+  --sem-type-tablet-semi-xl: 700 40px/48px Non-Dottee;
+  --sem-type-tablet-semi-xxl: 700 56px/64px Non-Dottee;
+  --sem-type-tablet-semi-xxxl: 700 80px/96px Non-Dottee;
+  --sem-type-tablet-bold-m: 700 28px/36px Non-Dottee;
+  --sem-type-tablet-bold-l: 700 32px/40px Non-Dottee;
+  --sem-type-tablet-bold-xl: 700 40px/48px Non-Dottee;
+  --sem-type-tablet-bold-xxl: 700 56px/64px Non-Dottee;
+  --sem-type-tablet-bold-xxxl: 700 80px/96px Non-Dottee;
+  --sem-type-desktop-semi-m: 700 32px/40px Non-Dottee;
+  --sem-type-desktop-semi-l: 700 40px/48px Non-Dottee;
+  --sem-type-desktop-semi-xl: 700 56px/64px Non-Dottee;
+  --sem-type-desktop-semi-xxl: 700 80px/96px Non-Dottee;
+  --sem-type-desktop-semi-xxxl: 700 120px/136px Non-Dottee;
+  --sem-type-desktop-bold-m: 700 32px/40px Non-Dottee;
+  --sem-type-desktop-bold-l: 700 40px/48px Non-Dottee;
+  --sem-type-desktop-bold-xl: 700 56px/64px Non-Dottee;
+  --sem-type-desktop-bold-xxl: 700 80px/96px Non-Dottee;
+  --sem-type-desktop-bold-xxxl: 700 120px/136px Non-Dottee;
+  --sem-type-label-reg-xxs: 400 14px/20px Non-Dottee;
+  --sem-type-label-reg-xs: 400 14px/20px Non-Dottee;
+  --sem-type-label-reg-l: 400 20px/26px Non-Dottee;
+  --sem-type-label-reg-m: 400 16px/24px Non-Dottee;
+  --sem-type-label-reg-xl: 400 20px/26px Non-Dottee;
+  --sem-type-label-reg-s: 400 14px/20px Non-Dottee;
+  --sem-font-size-75: 12px;
+  --sem-font-size-87: 14px;
+  --sem-font-size-100: 16px;
+  --sem-font-size-125: 20px;
+  --sem-font-size-150: 24px;
+  --sem-font-size-175: 28px;
+  --sem-font-size-200: 32px;
+  --sem-font-size-225: 36px;
+  --sem-font-size-250: 40px;
+  --sem-font-size-300: 48px;
+  --sem-font-size-350: 56px;
+  --sem-font-size-400: 64px;
+  --sem-font-size-500: 80px;
+  --sem-font-size-750: 120px;
+  --sem-line-height-base-scale-xxxs: 16px;
+  --sem-line-height-base-scale-xxs: 20px;
+  --sem-line-height-base-scale-xs: 24px;
+  --sem-line-height-base-scale-s: 26px;
+  --sem-line-height-base-scale-m: 28px;
+  --sem-line-height-base-scale-l: 32px;
+  --sem-line-height-base-scale-xl: 36px;
+  --sem-line-height-base-scale-xxl: 40px;
+  --sem-line-height-base-scale-xxxl: 44px;
+  --sem-line-height-base-scale-xxxxl: 48px;
+  --sem-line-height-base-scale-xxxxxl: 64px;
+  --sem-line-height-base-scale-xxxxxxl: 96px;
+  --sem-line-height-base-scale-xxxxxxxl: 136px;
+  --sem-line-height-interface-none: 0px;
+  --sem-line-height-interface-xxxs: 8px;
+  --sem-line-height-interface-xxs: 10px;
+  --sem-line-height-interface-xs: 12px;
+  --sem-line-height-interface-s: 14px;
+  --sem-line-height-interface-m: 16px;
+  --sem-line-height-interface-l: 20px;
+  --sem-paragraph-spacing-heading: 0;
+  --sem-paragraph-spacing-body: 0.5;
+  --sem-paragraph-spacing-interface: 0;
+  --sem-size-icon-xxxs: 12px;
+  --sem-size-icon-xxs: 14px;
+  --sem-size-icon-xs: 16px;
+  --sem-size-icon-s: 20px;
+  --sem-size-icon-m: 24px;
+  --sem-size-icon-ml: 42px;
+  --sem-size-icon-l: 28px;
+  --sem-size-icon-xl: 32px;
+  --sem-size-icon-xxl: 40px;
+  --sem-size-icon-xxxl: 48px;
+  --sem-size-icon-xxxxl: 64px;
+  --sem-size-icon-xxxxxl: 80px;
+  --sem-size-icon-xxxxxxl: 96px;
+  --sem-size-icon-xxxxs: 32px;
+  --sem-size-icon-xxxxxxs: 10px;
+  --sem-size-all-5: 2px;
+  --sem-size-all-10: 1px;
+  --sem-size-all-20: 4px;
+  --sem-size-all-30: 8px;
+  --sem-size-all-40: 12px;
+  --sem-size-all-45: 14px;
+  --sem-size-all-50: 16px;
+  --sem-size-all-60: 20px;
+  --sem-size-all-70: 24px;
+  --sem-size-all-75: 26px;
+  --sem-size-all-80: 28px;
+  --sem-size-all-85: 28px;
+  --sem-size-all-90: 32px;
+  --sem-size-all-95: 34px;
+  --sem-size-all-100: 36px;
+  --sem-size-all-110: 40px;
+  --sem-size-all-115: 36px;
+  --sem-size-all-120: 42px;
+  --sem-size-all-130: 44px;
+  --sem-size-all-140: 48px;
+  --sem-size-all-142: 52px;
+  --sem-size-all-145: 56px;
+  --sem-size-all-150: 58px;
+  --sem-size-all-155: 60px;
+  --sem-size-all-160: 64px;
+  --sem-size-all-162: 84px; /* SiteHeader (ENT) */
+  --sem-size-all-165: 80px;
+  --sem-size-all-170: 96px;
+  --sem-size-all-175: 96px;
+  --sem-size-all-178: 72px;
+  --sem-size-all-180: 128px;
+  --sem-size-all-182: 106px;
+  --sem-size-all-185: 282px;
+  --sem-size-all-190: 288px;
+  --sem-size-all-195: 304px;
+  --sem-size-all-200: 384px;
+  --sem-size-all-210: 472px;
+  --sem-size-all-220: 591px;
+  --sem-size-all-230: 800px;
+  --sem-size-all-240: 800px;
+  --sem-size-breakpoints-xs: 320px; /* Extra Small (XS) - 320px or under 576px: This is typically the breakpoint for smartphones in portrait mode. */
+  --sem-size-breakpoints-s: 576px; /* Small (SM) - 576px to 767px: This is often used for smartphones in landscape mode and small tablets. */
+  --sem-size-breakpoints-m: 768px; /* Medium (MD) - 768px to 991px: This is commonly used for larger tablets and smaller desktop screens. */
+  --sem-size-breakpoints-l: 1024px; /* Large (LG) - 1024px - 1279px: This breakpoint is often applied to larger desktop screens and some laptops. */
+  --sem-size-breakpoints-xl: 1280px; /* Extra Large (XL) - 1280px and above: This breakpoint is used for very large desktop screens. */
+  --sem-size-breakpoints-xxl: 1440px; /* Extra Large (XXL) - Used for very large desktop screens. */
+  --sem-size-vertical-10: 4px; /* This can be reserved for commonly used components: buttons, dropdowns, inputs etc */
+  --sem-size-vertical-20: 8px;
+  --sem-size-vertical-30: 12px;
+  --sem-size-vertical-40: 16px;
+  --sem-size-vertical-50: 20px;
+  --sem-size-vertical-60: 24px;
+  --sem-size-vertical-70: 28px;
+  --sem-size-vertical-80: 32px;
+  --sem-size-vertical-90: 40px;
+  --sem-size-vertical-100: 48px;
+  --sem-size-vertical-110: 64px;
+  --sem-size-vertical-120: 96px;
+  --sem-size-vertical-130: 128px;
+  --sem-space-padding-5: 1px;
+  --sem-space-padding-10: 2px;
+  --sem-space-padding-15: 3px;
+  --sem-space-padding-20: 4px;
+  --sem-space-padding-30: 6px;
+  --sem-space-padding-40: 8px;
+  --sem-space-padding-45: 22px;
+  --sem-space-padding-50: 10px;
+  --sem-space-padding-60: 12px;
+  --sem-space-padding-70: 16px;
+  --sem-space-padding-80: 18px;
+  --sem-space-padding-90: 20px;
+  --sem-space-padding-100: 22px;
+  --sem-space-padding-110: 24px;
+  --sem-space-padding-120: 28px;
+  --sem-space-padding-130: 32px;
+  --sem-space-padding-140: 40px;
+  --sem-space-padding-145: 40px;
+  --sem-space-padding-150: 44px;
+  --sem-space-padding-160: 48px;
+  --sem-space-padding-170: 56px;
+  --sem-space-padding-180: 64px;
+  --sem-space-padding-190: 128px;
+  --sem-space-gap-5: 0px;
+  --sem-space-gap-10: 2px;
+  --sem-space-gap-20: 4px;
+  --sem-space-gap-30: 6px;
+  --sem-space-gap-40: 8px;
+  --sem-space-gap-60: 12px;
+  --sem-space-gap-70: 16px;
+  --sem-space-gap-80: 18px;
+  --sem-space-gap-90: 20px;
+  --sem-space-gap-100: 22px;
+  --sem-space-gap-110: 24px;
+  --sem-space-gap-120: 28px;
+  --sem-space-gap-130: 32px;
+  --sem-space-gap-140: 40px;
+  --sem-space-gap-150: 44px;
+  --sem-space-gap-160: 48px;
+  --sem-space-gap-170: 56px;
+  --sem-space-gap-180: 64px;
+  --sem-space-gap-190: 128px;
+  --sem-space-gap-none: 0px;
+  --sem-space-stack-10: 2px;
+  --sem-space-stack-20: 4px;
+  --sem-space-stack-30: 8px;
+  --sem-space-stack-40: 12px;
+  --sem-space-stack-50: 16px;
+  --sem-space-stack-60: 18px;
+  --sem-space-stack-70: 20px;
+  --sem-space-stack-80: 22px;
+  --sem-space-stack-90: 24px;
+  --sem-space-stack-100: 28px;
+  --sem-space-stack-110: 32px;
+  --sem-space-stack-120: 36px;
+  --sem-space-stack-130: 40px;
+  --sem-space-stack-140: 44px;
+  --sem-space-stack-150: 48px;
+  --sem-space-stack-160: 56px;
+  --sem-space-stack-170: 64px;
+  --sem-space-stack-180: 72px;
+  --sem-space-stack-190: 80px;
+  --sem-space-stack-200: 96px;
+  --sem-space-stack-210: 112px;
+  --sem-space-stack-220: 128px;
+  --sem-space-stack-none: 0px;
+  --sem-space-variant-gap-30: 8px;
+  --sem-border-width-xxxxs: 0;
+  --sem-border-width-xxxs: 1px; /* Used: Alerts /  */
+  --sem-border-width-xxs: 4px; /* Used: Alerts /  */
+  --sem-border-width-xs: 1px;
+  --sem-border-width-s: 2px;
+  --sem-border-width-l: 3px;
+  --sem-border-width-xl: 4px;
+  --sem-border-width-xxl: 8px;
+  --sem-border-width-xxxl: 10px;
+  --sem-border-width-m: 2px;
+  --sem-border-radius-xxxxxxs: 2px;
+  --sem-border-radius-xxxxxs: 8px;
+  --sem-border-radius-xxxxs: 8px;
+  --sem-border-radius-xxxs: 4px;
+  --sem-border-radius-xxs: 4px;
+  --sem-border-radius-xs: 8px;
+  --sem-border-radius-s: 16px;
+  --sem-border-radius-m: 16px;
+  --sem-border-radius-l: 24px;
+  --sem-border-radius-xl: 32px;
+  --sem-border-radius-xxl: 1000px;
+  --sem-border-radius-xxxl: 4px;
+  --sem-border-radius-variant-s: 8px;
+  --sem-border-radius-variant-m: 12px;
+  --sem-border-radius-variant-l: 8px;
+  --sem-color-gradient-border-02: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%); /* indigo-gradient-1 */
+  --sem-color-gradient-border-03: linear-gradient(53deg, #5514b4 0%, #ff80ff 100%); /* dark: pink-gradient-1 */
+  --sem-color-gradient-border-04: linear-gradient(90deg, #ff80ff 50%, #d666ed 100%); /* dark: pink-gradient-2 */
+  --sem-color-gradient-border-05: linear-gradient(244deg, #f200f5 0%, #1ec8e6 100%); /* dark: pink-gradient-2 */
+  --sem-color-gradient-border-01: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%); /* turquoise-gradient */
+  --sem-color-gradient-bg-10: linear-gradient(53deg, #5514b4 0%, #ff80ff 100%); /* dark: pink-gradient-1 */
+  --sem-color-gradient-bg-11: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%); /* indigo-gradient-1 */
+  --sem-color-gradient-bg-09: linear-gradient(90deg, #ff80ff 50%, #d666ed 100%); /* dark: pink-gradient-2 */
+  --sem-color-gradient-bg-08: linear-gradient(90deg, #fff2f0 0%, #f5eefa 100%); /* coral-gradient */
+  --sem-color-gradient-bg-05: linear-gradient(90deg, #f5eefa 0%, #eafcff 100%); /* turquoise-gradient */
+  --sem-color-gradient-bg-06: linear-gradient(225deg, #5615b4 0%, #4665cd 100%); /* turquoise-gradient */
+  --sem-color-gradient-bg-07: linear-gradient(90deg, #fcf9ff 0%, #f9f9ff 100%); /* turquoise-gradient */
+  --sem-color-gradient-bg-01: linear-gradient(244deg, #f200f5 0%, #1ec8e6 100%);
+  --sem-color-gradient-bg-02: linear-gradient(-45deg, #ff80ff 0%, #72d4e9 100%); /* turquoise-gradient */
+  --sem-color-gradient-bg-03: linear-gradient(-44deg, #72d4e9 0%, #ff80ff 100%); /* turquoise-gradient */
+  --sem-color-gradient-bg-04: linear-gradient(90deg, #f5eefa 0%, #eafcff 100%); /* turquoise-gradient */
+  --sem-color-gradient-fg-01: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%); /* turquoise-gradient */
+  --sem-color-gradient-tertiary-light-emphasis: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%); /* turquoise-gradient */
+  --sem-color-gradient-tertiary-dark-emphasis: linear-gradient(90deg, #ff80ff 50%, #d666ed 100%); /* turquoise-gradient */
+  --sem-color-status-border-light-error: #D20007;
+  --sem-color-status-border-light-warning: #B14D00;
+  --sem-color-status-border-light-success: #138100;
+  --sem-color-status-border-light-general: #3F3F3F;
+  --sem-color-status-border-dark-error: #FF8883;
+  --sem-color-status-border-dark-warning: #FFA94D;
+  --sem-color-status-border-dark-general: #F3F3F3;
+  --sem-color-status-border-dark-success: #73C367;
+  --sem-color-status-border-dark-error-subtle: #E81D1D;
+  --sem-color-status-border-dark-warning-subtle: #FEDDA4;
+  --sem-color-status-border-dark-success-subtle: #138100;
+  --sem-color-status-border-dark-error-minimal: #D20007;
+  --sem-color-status-bg-light-error-alt: #D20007;
+  --sem-color-status-bg-light-warning-alt: #FFA94D;
+  --sem-color-status-bg-light-success-alt: #0F6D00;
+  --sem-color-status-bg-light-warning-strong: #ffa200;
+  --sem-color-status-bg-light-error-strong: #da020f;
+  --sem-color-status-bg-light-error: #FEEDED;
+  --sem-color-status-bg-light-success: #e6f4e5;
+  --sem-color-status-bg-light-warning: #FEF2DE;
+  --sem-color-status-bg-light-general: #F3F3F3;
+  --sem-color-status-bg-light-general-alt: #2a2a2a;
+  --sem-color-status-bg-light-error-subtle: #AA0006;
+  --sem-color-status-bg-light-error-emphasis: #ffc8cb;
+  --sem-color-status-bg-dark-error-strong: #FF8883;
+  --sem-color-status-bg-dark-warning-strong: #FFA94D;
+  --sem-color-status-bg-dark-error: #2D0002;
+  --sem-color-status-bg-dark-success: #073600;
+  --sem-color-status-bg-dark-warning: #4B2000;
+  --sem-color-status-bg-dark-general: #2B2B2B;
+  --sem-color-status-bg-dark-general-alt: #f0f0f0;
+  --sem-color-status-bg-dark-default: #FFFFFF;
+  --sem-color-status-bg-dark-error-subtle: #401313;
+  --sem-color-status-fg-light-error: #D20007;
+  --sem-color-status-fg-light-warning: #B14D00;
+  --sem-color-status-fg-light-success: #138100;
+  --sem-color-status-fg-light-general: #3F3F3F;
+  --sem-color-status-fg-light-warning-alt: #ffa200;
+  --sem-color-status-fg-dark-error-alt: #D20007;
+  --sem-color-status-fg-dark-error-subtle: #E81D1D;
+  --sem-color-status-fg-dark-error: #FF8883;
+  --sem-color-status-fg-dark-warning: #FFA94D;
+  --sem-color-status-fg-dark-success: #73C367;
+  --sem-color-status-fg-dark-success-subtle: #138100;
+  --sem-color-status-fg-dark-warning-alt: #2a2a2a;
+  --sem-color-status-fg-dark-warning-subtle: #2a2a2a;
+  --sem-color-status-fg-dark-general: #F3F3F3;
+  --sem-color-border-primary-light-default: #111111; /* Brand indigo */
+  --sem-color-border-primary-light-subtle: #686868;
+  --sem-color-border-primary-light-strong: #525252; /* Brand indigo */
+  --sem-color-border-primary-light-emphasis: #111111; /* Brand indigo */
+  --sem-color-border-primary-light-minimal: #BBBBBB;
+  --sem-color-border-primary-light-minimal-alt: #3F3F3F;
+  --sem-color-border-primary-light-emphasis-subtle: #BBBBBB; /* Brand indigo */
+  --sem-color-border-primary-dark-default: #FFFFFF;
+  --sem-color-border-primary-dark-subtle: #BBBBBB;
+  --sem-color-border-primary-dark-strong: #F3F3F3;
+  --sem-color-border-primary-dark-emphasis: #D9D9D9;
+  --sem-color-border-primary-dark-minimal: #BBBBBB;
+  --sem-color-border-secondary-light-default: #818181;
+  --sem-color-border-secondary-light-subtle: #D9D9D9;
+  --sem-color-border-secondary-light-strong: #525252;
+  --sem-color-border-secondary-light-minimal: #BBBBBB;
+  --sem-color-border-secondary-light-alt: #F3F3F3;
+  --sem-color-border-secondary-light-default-alt: #818181;
+  --sem-color-border-secondary-light-muted: #ffffff;
+  --sem-color-border-secondary-dark-default: #F3F3F3;
+  --sem-color-border-secondary-dark-strong: #BBBBBB;
+  --sem-color-border-secondary-dark-subtle: #686868;
+  --sem-color-border-secondary-dark-minimal: #525252;
+  --sem-color-border-secondary-dark-alt: #2B2B2B;
+  --sem-color-border-secondary-dark-muted: #6b6b6b;
+  --sem-color-border-tertiary-light-default: #009BA5;
+  --sem-color-border-tertiary-dark-default: #06C3C2;
+  --sem-color-bg-primary-light-default: #111111;
+  --sem-color-bg-primary-light-default-alt: #035F6E; /* Brand indigo */
+  --sem-color-bg-primary-light-default-strong: #111111; /* Brand indigo */
+  --sem-color-bg-primary-light-subtle: #3F3F3F; /* Brand indigo */
+  --sem-color-bg-primary-light-strong: #2B2B2B;
+  --sem-color-bg-primary-light-emphasis: #9C9C9C; /* Brand indigo */
+  --sem-color-bg-primary-light-minimal: #F3F3F3; /* Brand indigo */
+  --sem-color-bg-primary-light-subtle-alt: #F3F3F3; /* Brand indigo */
+  --sem-color-bg-primary-light-minimal-alt: #057382;
+  --sem-color-bg-primary-dark-default: #FFFFFF;
+  --sem-color-bg-primary-dark-default-alt: #F3F3F3;
+  --sem-color-bg-primary-dark-strong: #F3F3F3;
+  --sem-color-bg-primary-dark-subtle: #BBBBBB;
+  --sem-color-bg-primary-dark-emphasis: #F3F3F3;
+  --sem-color-bg-primary-dark-minimal: #FFFFFF;
+  --sem-color-bg-primary-dark-minimal-alt: #818181;
+  --sem-color-bg-secondary-light-default: #FFFFFF;
+  --sem-color-bg-secondary-light-default-alt: #f7f7f7;
+  --sem-color-bg-secondary-light-subtle: #818181;
+  --sem-color-bg-secondary-light-strong: #686868;
+  --sem-color-bg-secondary-light-minimal: #BBBBBB;
+  --sem-color-bg-secondary-light-minimal-alt: #D9D9D9;
+  --sem-color-bg-secondary-light-muted: #D9D9D9;
+  --sem-color-bg-secondary-light-alt: #2B2B2B;
+  --sem-color-bg-secondary-light-strong-alt: #111111;
+  --sem-color-bg-secondary-light-muted-alt: #F3F3F3;
+  --sem-color-bg-secondary-light-muted-subtle: #ffffff;
+  --sem-color-bg-secondary-dark-default: #111111;
+  --sem-color-bg-secondary-dark-strong: #BBBBBB;
+  --sem-color-bg-secondary-dark-alt: #FFFFFF;
+  --sem-color-bg-secondary-dark-strong-alt: #FFFFFF;
+  --sem-color-bg-secondary-dark-subtle: #9C9C9C;
+  --sem-color-bg-secondary-dark-minimal: #818181;
+  --sem-color-bg-secondary-dark-minimal-alt: #2B2B2B;
+  --sem-color-bg-secondary-dark-muted: #686868;
+  --sem-color-bg-secondary-dark-muted-alt: #3F3F3F;
+  --sem-color-bg-tertiary-warning-default: #AA0006;
+  --sem-color-bg-tertiary-warning-subtle: #840106;
+  --sem-color-bg-tertiary-warning-strong: #600104;
+  --sem-color-bg-tertiary-status-light-general: #2a2a2a;
+  --sem-color-bg-tertiary-status-light-error: #2a2a2a;
+  --sem-color-bg-tertiary-status-light-warning: #2a2a2a;
+  --sem-color-bg-tertiary-status-light-success: #2a2a2a;
+  --sem-color-bg-tertiary-status-light-error-alt: #2a2a2a;
+  --sem-color-bg-tertiary-status-light-success-alt: #2a2a2a;
+  --sem-color-text-status-light-default: #ffffff;
+  --sem-color-text-status-light-error: #ffffff;
+  --sem-color-text-status-light-warning: #2a2a2a;
+  --sem-color-text-status-light-success: #ffffff;
+  --sem-color-text-status-dark-default: #2a2a2a;
+  --sem-color-text-status-dark-error: #2a2a2a;
+  --sem-color-text-primary-light-default: #001318;
+  --sem-color-text-primary-light-default-alt: #5514b4;
+  --sem-color-text-primary-light-hover: #2a1c4a;
+  --sem-color-text-primary-light-default-strong: #ffffff;
+  --sem-color-text-primary-light-emphasis: #ffffff;
+  --sem-color-text-primary-light-subtle: #6b6b6b;
+  --sem-color-text-primary-light-strong: #01404C;
+  --sem-color-text-primary-dark-default: #ffffff;
+  --sem-color-text-primary-dark-strong: #ffffff;
+  --sem-color-text-primary-dark-default-alt: #efe5f7;
+  --sem-color-text-primary-dark-strong-alt: #D9D9D9;
+  --sem-color-text-secondary-light-default: #5514b4;
+  --sem-color-text-secondary-light-default-alt: #ffffff;
+  --sem-color-text-secondary-light-hover: #2a1c4a;
+  --sem-color-text-secondary-light-default-strong: #ffffff;
+  --sem-color-text-secondary-light-emphasis: #ff80ff;
+  --sem-color-text-secondary-light-subtle: #6b6b6b;
+  --sem-color-text-secondary-light-strong: #2a2a2a;
+  --sem-color-text-secondary-dark-default: #ffffff;
+  --sem-color-text-secondary-dark-default-alt: #F3F3F3;
+  --sem-color-text-secondary-dark-strong: #ffffff;
+  --sem-color-text-secondary-dark-strong-alt: #ffe4ff;
+  --sem-color-fg-primary-light-default: #009BA5;
+  --sem-color-fg-primary-light-subtle: #057382;
+  --sem-color-fg-primary-light-strong: #001318;
+  --sem-color-fg-primary-light-emphasis: #035F6E; /* Brand indigo */
+  --sem-color-fg-primary-light-vibrant: #057382; /* Brand indigo */
+  --sem-color-fg-primary-light-minimal: #3F3F3F; /* Brand indigo */
+  --sem-color-fg-primary-light-default-alt: #001318;
+  --sem-color-fg-primary-light-subtle-alt: #3f187f;
+  --sem-color-fg-primary-dark-default: #EBF304;
+  --sem-color-fg-primary-dark-subtle: #FFFFFF;
+  --sem-color-fg-primary-dark-strong: #F8FF19;
+  --sem-color-fg-primary-dark-emphasis: #ABAD00;
+  --sem-color-fg-primary-dark-vibrant: #EBF304; /* Brand indigo */
+  --sem-color-fg-secondary-light-default: #2B2B2B;
+  --sem-color-fg-secondary-light-subtle: #818181;
+  --sem-color-fg-secondary-light-strong: #686868;
+  --sem-color-fg-secondary-light-minimal: #BBBBBB;
+  --sem-color-fg-secondary-light-muted: #525252;
+  --sem-color-fg-secondary-light-alt: #FFFFFF;
+  --sem-color-fg-secondary-light-default-alt: #2a2a2a;
+  --sem-color-fg-secondary-light-subtle-alt: #9C9C9C;
+  --sem-color-fg-secondary-light-strong-alt: #111111;
+  --sem-color-fg-secondary-light-minimal-alt: #ffffff;
+  --sem-color-fg-secondary-light-muted-alt: #6b6b6b;
+  --sem-color-fg-secondary-light-strong-subtle: #aaaaaa;
+  --sem-color-fg-secondary-dark-default: #FFFFFF;
+  --sem-color-fg-secondary-dark-muted: #BBBBBB;
+  --sem-color-fg-secondary-dark-strong: #9C9C9C;
+  --sem-color-fg-secondary-dark-subtle: #686868;
+  --sem-color-fg-secondary-dark-minimal: #525252;
+  --sem-color-fg-secondary-dark-alt: #2B2B2B;
+  --sem-color-fg-secondary-dark-minimal-alt: #111111;
+  --sem-color-fg-secondary-dark-subtle-alt: #818181;
+  --sem-color-overlay-gradient-faded: rgba(85,20,180,0.5);
+  --sem-color-overlay-gradient-dark-faded: rgba(255,128,255,0.5);
+  --sem-color-overlay-flat-default: rgba(0,0,0,0.5);
+  --sem-color-overlay-flat-light: rgba(255,255,255,0.5);
+  --sem-color-overlay-flat-brand: rgba(85,20,180,0.5);
+  --sem-inner-shadow-01: inset 0 1px 0 0 #c8c8c8;
+  --sem-inner-shadow-02: inset 0 1px 0 0 #c8c8c8;
+  --sem-box-shadow-01: 0 2px 6px 2px rgba( 0, 0, 0 , 0.25);
+  --sem-box-shadow-02: -8px 8px 36px 0 rgba( 0, 0, 0 , 0.25);
+  --sem-box-shadow-03: 0 2px 6px 2px rgba( 0, 0, 0 , 0.9 );
+  --sem-box-shadow-04: -8px 8px 36px 0 rgba( 0, 0, 0 , 0.9);
+  --sem-box-shadow-05: 0 0 0 2px #8449cc;
+  --sem-box-shadow-06: 0 0 0 2px #fd51ff;
+  --sem-underline: underline;
+  --sem-line-through: line-through;
+  --sem-scale-modifier-1: 4px;
+  --sem-scale-modifier-3: 4px;
+  --sem-scale-modifier-2: 3px;
+  --sem-scale-modifier-4: 0;
+  --select-size-s: 32px;
+  --select-size-m: 44px;
+  --select-size-l: 64px;
+  --select-padding-s: 8px;
+  --select-padding-m: 12px;
+  --select-padding-l: 16px;
+  --select-padding-xl: 28px;
+  --select-border-radius-s: 4px;
+  --select-border-radius-m: 4px;
+  --select-border-radius-l: 8px;
+  --select-border-weight-s: 1px;
+  --select-border-weight-m: 2px;
+  --select-border-weight-l: 4px;
+  --select-gap-s: 4px;
+  --select-gap-m: 8px;
+  --select-gap-l: 12px;
+  --select-size-icon-s: 16px;
+  --select-size-icon-m: 20px;
+  --select-size-icon-l: 24px;
+  --select-colors-light-bg-default: #FFFFFF;
+  --select-colors-light-bg-hover: #D9D9D9;
+  --select-colors-light-bg-disabled: #D9D9D9;
+  --select-colors-light-bg-error: #FEEDED;
+  --select-colors-light-bg-hover-alt: #D9D9D9;
+  --select-colors-light-bg-selected: #F3F3F3;
+  --select-colors-light-border-default: #818181;
+  --select-colors-light-border-hover: #525252;
+  --select-colors-light-border-focus: #111111;
+  --select-colors-light-border-disabled: #D9D9D9;
+  --select-colors-light-border-error: #D20007;
+  --select-colors-light-border-subtle: #BBBBBB;
+  --select-colors-light-fg-default: #2B2B2B;
+  --select-colors-light-fg-disabled: #686868;
+  --select-colors-light-fg-subtle: #BBBBBB;
+  --select-colors-light-fg-error: #D20007;
+  --select-colors-light-text-default: #2B2B2B;
+  --select-colors-light-text-default-alt: #5514b4;
+  --select-colors-light-text-disabled: #686868;
+  --select-colors-light-text-error: #D20007;
+  --select-colors-dark-bg-default: #111111;
+  --select-colors-dark-bg-hover: #111111;
+  --select-colors-dark-bg-disabled: #686868;
+  --select-colors-dark-bg-error: #2D0002;
+  --select-colors-dark-bg-hover-alt: #F3F3F3;
+  --select-colors-dark-bg-selected: #818181;
+  --select-colors-dark-border-strong: #F3F3F3;
+  --select-colors-dark-border-hover: #F3F3F3;
+  --select-colors-dark-border-focus: #D9D9D9;
+  --select-colors-dark-border-disabled: #686868;
+  --select-colors-dark-border-error: #FF8883;
+  --select-colors-dark-border-subtle: #525252;
+  --select-colors-dark-text-default: #FFFFFF;
+  --select-colors-dark-text-disabled: #9C9C9C;
+  --select-colors-dark-text-error: #2a2a2a;
+  --select-colors-dark-fg-default: #FFFFFF;
+  --select-colors-dark-fg-disabled: #9C9C9C;
+  --select-colors-dark-fg-subtle: #525252;
+  --select-colors-dark-fg-error: #FF8883;
+  --select-border-radius-test-s: 32px;
+  --select-border-radius-test-m: 24px;
+  --select-border-radius-test-l: 32px;
+  --checkbox-size-s: 24px;
+  --checkbox-size-l: 36px;
+  --checkbox-padding-s: 2px;
+  --checkbox-gap-s: 8px;
+  --checkbox-gap-m: 12px;
+  --checkbox-border-radius-xs: 8px;
+  --checkbox-border-radius-s: 12px;
+  --checkbox-border-weight-s: 2px;
+  --checkbox-size-icon-s: 20px;
+  --checkbox-size-icon-m: 32px;
+  --checkbox-colors-light-bg-default: #035F6E;
+  --checkbox-colors-light-bg-default-alt: #FFFFFF;
+  --checkbox-colors-light-bg-disabled: #D9D9D9;
+  --checkbox-colors-light-bg-error: #FEEDED;
+  --checkbox-colors-light-fg-default: #FFFFFF;
+  --checkbox-colors-light-fg-disabled: #686868;
+  --checkbox-colors-light-border-default: #818181;
+  --checkbox-colors-light-border-disabled: #D9D9D9;
+  --checkbox-colors-light-border-error: #D20007;
+  --checkbox-colors-light-text-default: #2B2B2B;
+  --checkbox-colors-light-text-disabled: #686868;
+  --checkbox-colors-dark-bg-default: #FFFFFF;
+  --checkbox-colors-dark-bg-default-alt: #111111;
+  --checkbox-colors-dark-bg-disabled: #686868;
+  --checkbox-colors-dark-bg-error: #2D0002;
+  --checkbox-colors-dark-fg-default: #2B2B2B;
+  --checkbox-colors-dark-fg-disabled: #9C9C9C;
+  --checkbox-colors-dark-border-default: #F3F3F3;
+  --checkbox-colors-dark-border-disabled: #686868;
+  --checkbox-colors-dark-border-error: #FF8883;
+  --checkbox-colors-dark-text-default: #FFFFFF;
+  --checkbox-colors-dark-text-disabled: #9C9C9C;
+  --radio-size-s: 12px;
+  --radio-size-m: 20px;
+  --radio-size-l: 24px;
+  --radio-size-xl: 34px;
+  --radio-gap-s: 8px;
+  --radio-gap-m: 12px;
+  --radio-border-weight-s: 2px;
+  --radio-colors-light-bg-default: #FFFFFF;
+  --radio-colors-light-bg-disabled: #D9D9D9;
+  --radio-colors-light-border-default: #818181;
+  --radio-colors-light-border-disabled: #D9D9D9;
+  --radio-colors-light-fg-default: #035F6E;
+  --radio-colors-light-fg-disabled: #686868;
+  --radio-colors-light-text-default: #2B2B2B;
+  --radio-colors-light-text-disabled: #686868;
+  --radio-colors-dark-bg-default: #111111;
+  --radio-colors-dark-bg-disabled: #686868;
+  --radio-colors-dark-border-default: #F3F3F3;
+  --radio-colors-dark-border-disabled: #686868;
+  --radio-colors-dark-fg-default: #EBF304;
+  --radio-colors-dark-fg-disabled: #9C9C9C;
+  --radio-colors-dark-text-default: #FFFFFF;
+  --radio-colors-dark-text-disabled: #9C9C9C;
+  --date-picker-size-s: 32px;
+  --date-picker-size-m: 34px;
+  --date-picker-size-l: 36px;
+  --date-picker-size-xl: 40px;
+  --date-picker-size-xxl: 44px;
+  --date-picker-size-xxxl: 48px;
+  --date-picker-size-xxxxl: 64px;
+  --date-picker-padding-xxs: 2px;
+  --date-picker-padding-xs: 3px;
+  --date-picker-padding-s: 4px;
+  --date-picker-padding-m: 8px;
+  --date-picker-padding-l: 12px;
+  --date-picker-padding-xl: 16px;
+  --date-picker-border-radius-s: 4px;
+  --date-picker-border-radius-m: 4px;
+  --date-picker-border-radius-l: 8px;
+  --date-picker-border-radius-xl: 1000px;
+  --date-picker-border-weight-s: 1px;
+  --date-picker-border-weight-m: 2px;
+  --date-picker-border-weight-l: 4px;
+  --date-picker-colors-light-bg-default-alt: #FFFFFF;
+  --date-picker-colors-light-bg-hover: #2B2B2B;
+  --date-picker-colors-light-bg-selected: #057382;
+  --date-picker-colors-light-bg-pressed: #057382;
+  --date-picker-colors-light-bg-disabled: #D9D9D9;
+  --date-picker-colors-light-bg-error: #FEEDED;
+  --date-picker-colors-light-bg-subtle: #F3F3F3;
+  --date-picker-colors-light-bg-hover-alt: #D9D9D9;
+  --date-picker-colors-light-border-hover: #525252;
+  --date-picker-colors-light-border-focus: #111111;
+  --date-picker-colors-light-border-selected: #3F3F3F;
+  --date-picker-colors-light-border-disabled: #D9D9D9;
+  --date-picker-colors-light-border-error: #D20007;
+  --date-picker-colors-light-border-strong: #818181;
+  --date-picker-colors-light-fg-default-alt: #FFFFFF;
+  --date-picker-colors-light-fg-hover: #001318;
+  --date-picker-colors-light-fg-strong: #2B2B2B;
+  --date-picker-colors-light-fg-disabled: #686868;
+  --date-picker-colors-light-fg-error: #D20007;
+  --date-picker-colors-light-text-default: #009BA5;
+  --date-picker-colors-light-text-default-alt: #FFFFFF;
+  --date-picker-colors-light-text-strong: #2B2B2B;
+  --date-picker-colors-light-text-disabled: #686868;
+  --date-picker-colors-light-text-error: #D20007;
+  --date-picker-colors-light-text-hint: #686868;
+  --date-picker-gap-xs: 4px;
+  --date-picker-gap-s: 8px;
+  --date-picker-gap-m: 12px;
+  --date-picker-gap-l: 40px;
+  --date-picker-size-icon-s: 24px;
+  --date-picker-size-icon-m: 32px;
+  --date-picker-size-icon-l: 40px;
+  --switch-size-s: 24px;
+  --switch-size-m: 32px;
+  --switch-border-weight-s: 2px;
+  --switch-colors-light-bg-default: #035F6E;
+  --switch-colors-light-bg-disabled: #D9D9D9;
+  --switch-colors-light-bg-strong: #FFFFFF;
+  --switch-colors-light-bg-subtle: #D9D9D9;
+  --switch-colors-light-border-default: #111111;
+  --switch-colors-light-border-disabled: #D9D9D9;
+  --switch-colors-light-border-strong: #818181;
+  --switch-colors-light-fg-default: #009BA5;
+  --switch-colors-light-fg-disabled: #686868;
+  --switch-colors-light-text-default: #2B2B2B;
+  --switch-colors-light-text-disabled: #686868;
+  --switch-colors-dark-bg-default: #FFFFFF;
+  --switch-colors-dark-bg-disabled: #686868;
+  --switch-colors-dark-bg-strong: #111111;
+  --switch-colors-dark-bg-subtle: #3F3F3F;
+  --switch-colors-dark-border-default: #FFFFFF;
+  --switch-colors-dark-border-disabled: #686868;
+  --switch-colors-dark-border-strong: #F3F3F3;
+  --switch-colors-dark-fg-default: #EBF304;
+  --switch-colors-dark-fg-disabled: #9C9C9C;
+  --switch-colors-dark-text-default: #FFFFFF;
+  --switch-colors-dark-text-disabled: #9C9C9C;
+  --switch-border-radius-s: 1000px;
+  --switch-box-shadow-01: 0 0 0 2px #8449cc;
+  --switch-box-shadow-02: 0 0 0 2px #fd51ff;
+  --switch-gap-s: 8px;
+  --switch-gap-m: 12px;
+  --textinput-size-s: 32px;
+  --textinput-size-m: 44px;
+  --textinput-size-l: 64px;
+  --textinput-border-radius-s: 4px;
+  --textinput-border-radius-m: 4px;
+  --textinput-border-radius-l: 8px;
+  --textinput-padding-s: 8px;
+  --textinput-padding-m: 12px;
+  --textinput-padding-l: 16px;
+  --textinput-gap-s: 4px;
+  --textinput-gap-m: 12px;
+  --textinput-border-weight-s: 1px;
+  --textinput-border-weight-m: 2px;
+  --textinput-border-weight-l: 4px;
+  --textinput-size-icon-m: 24px;
+  --textinput-colors-light-bg-default: #FFFFFF;
+  --textinput-colors-light-bg-hover: #D9D9D9;
+  --textinput-colors-light-bg-disabled: #D9D9D9;
+  --textinput-colors-light-bg-error: #FEEDED;
+  --textinput-colors-light-border-default: #818181;
+  --textinput-colors-light-border-hover: #525252;
+  --textinput-colors-light-border-focus: #111111;
+  --textinput-colors-light-border-disabled: #D9D9D9;
+  --textinput-colors-light-border-error: #D20007;
+  --textinput-colors-light-text-default: #2B2B2B;
+  --textinput-colors-light-text-disabled: #686868;
+  --textinput-colors-light-text-error: #D20007;
+  --textinput-colors-light-fg-default: #2B2B2B;
+  --textinput-colors-light-fg-error: #D20007;
+  --textinput-colors-dark-bg-default: #111111;
+  --textinput-colors-dark-bg-hover: #111111;
+  --textinput-colors-dark-bg-disabled: #686868;
+  --textinput-colors-dark-bg-error: #2D0002;
+  --textinput-colors-dark-border-default: #F3F3F3;
+  --textinput-colors-dark-border-hover: #F3F3F3;
+  --textinput-colors-dark-border-focus: #D9D9D9;
+  --textinput-colors-dark-border-disabled: #686868;
+  --textinput-colors-dark-border-error: #FF8883;
+  --textinput-colors-dark-text-default: #FFFFFF;
+  --textinput-colors-dark-text-disabled: #9C9C9C;
+  --textinput-colors-dark-text-error: #FF8883;
+  --textinput-colors-dark-fg-default: #FFFFFF;
+  --textinput-colors-dark-fg-error: #FF8883;
+  --textarea-padding-s: 10px;
+  --textarea-padding-m: 12px;
+  --textarea-size-icon-s: 16px;
+  --textarea-border-radius-s: 8px;
+  --textarea-border-weight-s: 1px;
+  --textarea-border-weight-m: 2px;
+  --textarea-border-weight-l: 4px;
+  --textarea-gap-s: 4px;
+  --textarea-gap-m: 12px;
+  --textarea-colors-light-bg-default: #FFFFFF;
+  --textarea-colors-light-bg-hover: #D9D9D9;
+  --textarea-colors-light-bg-disabled: #D9D9D9;
+  --textarea-colors-light-bg-error: #FEEDED;
+  --textarea-colors-light-border-default: #818181;
+  --textarea-colors-light-border-hover: #525252;
+  --textarea-colors-light-border-focus: #111111;
+  --textarea-colors-light-border-error: #D20007;
+  --textarea-colors-light-border-disabled: #D9D9D9;
+  --textarea-colors-light-fg-default: #2B2B2B;
+  --textarea-colors-light-fg-disabled: #686868;
+  --textarea-colors-light-fg-error: #D20007;
+  --textarea-colors-light-text-default: #2B2B2B;
+  --textarea-colors-light-text-disabled: #686868;
+  --textarea-colors-light-text-error: #D20007;
+  --textarea-colors-dark-fg-default: #FFFFFF;
+  --textarea-colors-dark-fg-disabled: #9C9C9C;
+  --textarea-colors-dark-fg-error: #FF8883;
+  --textarea-colors-dark-bg-default: #111111;
+  --textarea-colors-dark-bg-hover: #2B2B2B;
+  --textarea-colors-dark-bg-disabled: #686868;
+  --textarea-colors-dark-bg-error: #2D0002;
+  --textarea-colors-dark-border-strong: #F3F3F3;
+  --textarea-colors-dark-border-hover: #F3F3F3;
+  --textarea-colors-dark-border-focus: #D9D9D9;
+  --textarea-colors-dark-border-disabled: #686868;
+  --textarea-colors-dark-border-error: #FF8883;
+  --textarea-colors-dark-text-strong: #FFFFFF;
+  --textarea-colors-dark-text-disabled: #9C9C9C;
+  --textarea-colors-dark-text-error: #FF8883;
+  --backtotop-size-m: 48px;
+  --backtotop-size-icon-m: 48px;
+  --backtotop-padding-m: 22px;
+  --backtotop-border-radius-m: 1000px;
+  --backtotop-border-weight-m: 2px;
+  --backtotop-colors-light-bg-default: #111111;
+  --backtotop-colors-light-bg-hover: #2B2B2B;
+  --backtotop-colors-light-bg-selected: #057382;
+  --backtotop-colors-light-bg-strong: #FFFFFF;
+  --backtotop-colors-light-bg-subtle: #D9D9D9;
+  --backtotop-colors-light-border-default: #111111;
+  --backtotop-colors-light-border-hover: #525252;
+  --backtotop-colors-light-border-selected: #3F3F3F;
+  --backtotop-colors-light-border-strong: #F3F3F3;
+  --backtotop-colors-light-border-focus: #111111;
+  --backtotop-colors-light-fg-default: #009BA5;
+  --backtotop-colors-light-fg-default-alt: #FFFFFF;
+  --backtotop-colors-light-text-default: #009BA5;
+  --backtotop-colors-light-text-default-alt: #FFFFFF;
+  --backtotop-colors-dark-bg-default: #FFFFFF;
+  --backtotop-colors-dark-bg-hover: #F3F3F3;
+  --backtotop-colors-dark-bg-selected: #818181;
+  --backtotop-colors-dark-bg-strong: #111111;
+  --backtotop-colors-dark-bg-subtle: #3F3F3F;
+  --backtotop-colors-dark-border-default: #FFFFFF;
+  --backtotop-colors-dark-border-hover: #F3F3F3;
+  --backtotop-colors-dark-border-selected: #818181;
+  --backtotop-colors-dark-border-strong: #818181;
+  --backtotop-colors-dark-border-focus: #D9D9D9;
+  --backtotop-colors-dark-fg-default: #2B2B2B;
+  --backtotop-colors-dark-fg-default-alt: #FFFFFF;
+  --backtotop-colors-dark-text-default: #2B2B2B;
+  --backtotop-colors-dark-text-default-alt: #FFFFFF;
+  --tabs-border-weight-s: 0;
+  --tabs-border-weight-m: 1px;
+  --tabs-border-weight-l: 2px;
+  --tabs-border-radius-s: 8px;
+  --tabs-padding-s: 4px;
+  --tabs-padding-m: 12px;
+  --tabs-padding-l: 16px;
+  --tabs-padding-xl: 24px;
+  --tabs-gap-s: 4px;
+  --tabs-gap-m: 6px;
+  --tabs-gap-l: 12px;
+  --tabs-size-s: 42px;
+  --tabs-size-m: 48px;
+  --tabs-size-icon-s: 40px;
+  --tabs-colors-light-bg-default: #FFFFFF;
+  --tabs-colors-light-bg-subtle: #D9D9D9;
+  --tabs-colors-light-bg-error: #D20007;
+  --tabs-colors-light-border-subtle: #BBBBBB;
+  --tabs-colors-light-border-selected: #3F3F3F;
+  --tabs-colors-light-border-focus: #111111;
+  --tabs-colors-light-border-error: #D20007;
+  --tabs-colors-light-fg-default: #009BA5;
+  --tabs-colors-light-fg-hover: #001318;
+  --tabs-colors-light-fg-selected: #3F3F3F;
+  --tabs-colors-light-text-default: #009BA5;
+  --tabs-colors-light-text-hover: #001318;
+  --tabs-colors-light-text-selected: #3F3F3F;
+  --tabs-colors-light-text-strong: #01404C;
+  --tabs-colors-dark-bg-default: #111111;
+  --tabs-colors-dark-bg-subtle: #3F3F3F;
+  --tabs-colors-dark-bg-error: #401313;
+  --tabs-colors-dark-border-subtle: #525252;
+  --tabs-colors-dark-border-selected: #818181;
+  --tabs-colors-dark-border-focus: #D9D9D9;
+  --tabs-colors-dark-border-error: #D20007;
+  --tabs-colors-dark-fg-default: #EBF304;
+  --tabs-colors-dark-fg-hover: #F8FF19;
+  --tabs-colors-dark-fg-selected: #818181;
+  --tabs-colors-dark-fg-strong: #FFFFFF;
+  --tabs-colors-dark-text-default: #FFFFFF;
+  --tabs-colors-dark-text-hover: #F8FF19;
+  --tabs-colors-dark-text-selected: #818181;
+  --tabs-colors-dark-text-strong: #ffffff;
+  --pagination-size-m: 32px;
+  --pagination-padding-s: 8px;
+  --pagination-padding-m: 12px;
+  --pagination-border-radius-m: 1000px;
+  --pagination-border-weight-s: 2px;
+  --pagination-colors-light-bg-hover: #2B2B2B;
+  --pagination-colors-light-bg-selected: #057382;
+  --pagination-colors-light-bg-pressed: #057382;
+  --pagination-colors-light-bg-subtle: #BBBBBB;
+  --pagination-colors-light-border-focus: #111111;
+  --pagination-colors-light-text-default: #FFFFFF;
+  --pagination-colors-light-text-strong: #2B2B2B;
+  --pagination-colors-light-fg-default: #009BA5;
+  --pagination-colors-light-fg-default-alt: #FFFFFF;
+  --pagination-colors-dark-bg-hover: #F3F3F3;
+  --pagination-colors-dark-bg-selected: #818181;
+  --pagination-colors-dark-bg-pressed: #818181;
+  --pagination-colors-dark-border-focus: #D9D9D9;
+  --pagination-colors-dark-text-default: #2B2B2B;
+  --pagination-colors-dark-text-strong: #FFFFFF;
+  --pagination-colors-dark-fg-default: #EBF304;
+  --pagination-colors-dark-fg-default-alt: #2B2B2B;
+  --pagination-size-icon-m: 32px;
+  --pagination-gap-s: 4px;
+  --pagination-gap-m: 16px;
+  --breadcrumb-size-icon-s: 12px;
+  --breadcrumb-colors-light-fg-strong: #2B2B2B;
+  --breadcrumb-colors-light-text-default: #009BA5;
+  --breadcrumb-colors-light-text-hover: #001318;
+  --breadcrumb-colors-light-text-strong: #2B2B2B;
+  --breadcrumb-colors-dark-fg-strong: #FFFFFF;
+  --breadcrumb-colors-dark-text-default: #EBF304;
+  --breadcrumb-colors-dark-text-hover: #F8FF19;
+  --breadcrumb-colors-dark-text-strong: #FFFFFF;
+  --breadcrumb-gap-xs: 6px;
+  --breadcrumb-gap-s: 8px;
+  --box-padding-s: 16px;
+  --box-border-radius-s: 16px;
+  --box-border-weight-xs: 1px;
+  --box-border-weight-s: 2px;
+  --box-colors-light-bg-default: #FFFFFF;
+  --box-colors-light-bg-subtle: #D9D9D9;
+  --box-colors-light-bg-error-subtle: #D20007;
+  --box-colors-light-bg-minimal: #f7f7f7;
+  --box-colors-light-bg-error: #AA0006;
+  --box-colors-light-fg-strong: #2B2B2B;
+  --box-colors-light-border-subtle: #BBBBBB;
+  --box-colors-light-border-error: #D20007;
+  --box-colors-light-text-strong: #2B2B2B;
+  --box-colors-dark-bg-default: #111111;
+  --box-colors-dark-bg-subtle: #686868;
+  --box-colors-dark-bg-minimal: #2B2B2B;
+  --box-colors-dark-bg-default-alt: #111111;
+  --box-colors-dark-border-subtle: #525252;
+  --box-colors-variant-light-bg-default-01: linear-gradient(90deg, #fff2f0 0%, #f5eefa 100%); /* coral-gradient */
+  --box-colors-variant-light-bg-default-02: linear-gradient(90deg, #f5eefa 0%, #eafcff 100%); /* turquoise-gradient */
+  --box-colors-variant-dark-bg-default-01: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%); /* Brand gradient (light) */
+  --disclosure-mini-padding-s: 28px;
+  --disclosure-mini-size-icon-s: 16px;
+  --disclosure-mini-gap-s: 8px;
+  --disclosure-mini-gap-m: 12px;
+  --disclosure-mini-colors-light-fg-default: #009BA5;
+  --disclosure-mini-colors-light-text-default: #009BA5;
+  --disclosure-mini-colors-light-text-strong: #2B2B2B;
+  --disclosure-mini-colors-dark-fg-default: #EBF304;
+  --disclosure-mini-colors-dark-text-default: #EBF304;
+  --disclosure-mini-colors-dark-text-strong: #FFFFFF;
+  --disclosure-padding-s: 16px;
+  --disclosure-gap-s: 20px;
+  --disclosure-size-s: 58px;
+  --disclosure-border-weight-s: 1px;
+  --disclosure-size-icon-s: 20px;
+  --disclosure-colors-light-bg-hover: #D9D9D9;
+  --disclosure-colors-light-border-subtle: #BBBBBB;
+  --disclosure-colors-light-fg-default: #009BA5;
+  --disclosure-colors-light-fg-hover: #001318;
+  --disclosure-colors-light-text-default: #009BA5;
+  --disclosure-colors-light-text-hover: #001318;
+  --disclosure-colors-dark-bg-hover: #3F3F3F;
+  --disclosure-colors-dark-border-subtle: #525252;
+  --disclosure-colors-dark-fg-default: #EBF304;
+  --disclosure-colors-dark-fg-hover: #F8FF19;
+  --disclosure-colors-dark-text-default: #EBF304;
+  --disclosure-colors-dark-text-hover: #F8FF19;
+  --avatar-size-s: 32px;
+  --avatar-size-m: 48px;
+  --avatar-size-l: 64px;
+  --avatar-size-xl: 80px;
+  --avatar-size-icon-s: 16px;
+  --avatar-size-icon-m: 24px;
+  --avatar-size-icon-l: 32px;
+  --avatar-size-icon-xl: 40px;
+  --avatar-border-weight-s: 1px;
+  --avatar-colors-light-bg-default: #111111;
+  --avatar-colors-light-fg-default-alt: #FFFFFF;
+  --avatar-colors-light-text-default-alt: #FFFFFF;
+  --modal-size-s: 288px;
+  --modal-size-m: 472px;
+  --modal-size-l: 591px;
+  --modal-size-xl: 800px;
+  --modal-size-xxl: 800px;
+  --modal-size-icon-s: 32px;
+  --modal-padding-m: 24px;
+  --modal-gap-s: 8px;
+  --modal-gap-m: 20px;
+  --modal-border-radius-s: 16px;
+  --modal-colors-light-bg-default: #FFFFFF;
+  --modal-colors-light-text-default: #2B2B2B;
+  --modal-colors-light-fg-default: #2B2B2B;
+  --overlay-colors-overlay-default: rgba(0,0,0,0.5);
+  --stepper-size-s: 8px;
+  --stepper-size-m: 14px;
+  --stepper-size-l: 16px;
+  --stepper-size-xl: 24px;
+  --stepper-size-icon-s: 16px;
+  --stepper-size-icon-l: 24px;
+  --stepper-padding-s: 16px;
+  --stepper-padding-m: 24px;
+  --stepper-gap-s: 16px;
+  --stepper-gap-m: 24px;
+  --stepper-colors-light-bg-default: #111111;
+  --stepper-colors-light-bg-subtle: #BBBBBB;
+  --stepper-colors-light-bg-error: #da020f;
+  --stepper-colors-light-bg-warning: #ffa200;
+  --stepper-colors-light-bg-error-subtle: #FEEDED;
+  --stepper-colors-light-bg-warning-subtle: #FEF2DE;
+  --stepper-colors-light-border-default: #111111;
+  --stepper-colors-light-border-subtle: #BBBBBB;
+  --stepper-colors-light-border-error: #D20007;
+  --stepper-colors-light-border-warning: #B14D00;
+  --stepper-colors-light-border-variant: #009BA5;
+  --stepper-colors-light-fg-default: #009BA5;
+  --stepper-colors-light-fg-default-alt: #FFFFFF;
+  --stepper-colors-light-fg-error: #D20007;
+  --stepper-colors-light-fg-warning: #B14D00;
+  --stepper-colors-light-fg-variant: #001318;
+  --stepper-colors-light-text-default: #2B2B2B;
+  --stepper-colors-light-text-hover: #001318;
+  --stepper-colors-light-text-subtle: #686868;
+  --stepper-colors-dark-bg-default: #FFFFFF;
+  --stepper-colors-dark-bg-subtle: #818181;
+  --stepper-colors-dark-bg-strong: #FFFFFF;
+  --stepper-colors-dark-bg-error: #FF8883;
+  --stepper-colors-dark-bg-warning: #FFA94D;
+  --stepper-colors-dark-bg-error-subtle: #2D0002;
+  --stepper-colors-dark-bg-warning-subtle: #4B2000;
+  --stepper-colors-dark-border-default: #FFFFFF;
+  --stepper-colors-dark-border-subtle: #525252;
+  --stepper-colors-dark-border-strong: #F3F3F3;
+  --stepper-colors-dark-border-error: #FF8883;
+  --stepper-colors-dark-border-warning: #FFA94D;
+  --stepper-colors-dark-border-variant: #FFFFFF;
+  --stepper-colors-dark-fg-default: #FFFFFF;
+  --stepper-colors-dark-fg-default-alt: #2B2B2B;
+  --stepper-colors-dark-fg-strong: #FFFFFF;
+  --stepper-colors-dark-fg-error: #FF8883;
+  --stepper-colors-dark-fg-warning: #FFA94D;
+  --stepper-colors-dark-fg-variant: #FFFFFF;
+  --stepper-colors-dark-text-default: #FFFFFF;
+  --stepper-colors-dark-text-hover: #F8FF19;
+  --stepper-colors-dark-text-subtle: #9C9C9C;
+  --stepper-border-weight-s: 1px;
+  --stepper-border-weight-m: 2px;
+  --progress-bar-gap-s: 4px;
+  --progress-bar-gap-m: 8px;
+  --progress-bar-size-s: 12px;
+  --progress-bar-border-radius-s: 24px;
+  --progress-bar-colors-light-bg-default: #111111;
+  --progress-bar-colors-light-bg-default-alt: #D9D9D9;
+  --progress-bar-colors-light-bg-muted: #F3F3F3;
+  --progress-bar-colors-light-bg-error: #2a2a2a;
+  --progress-bar-colors-light-bg-success: #2a2a2a;
+  --progress-bar-colors-light-text-default: #2B2B2B;
+  --progress-bar-colors-light-text-default-alt: #009BA5;
+  --progress-bar-colors-light-text-default-alt-hover: hsl(184 100% 25.9%);
+  --progress-bar-colors-light-text-error: #D20007;
+  --progress-bar-colors-light-text-error-hover: hsl(358 100% 28.8%);
+  --progress-bar-colors-light-text-success: #2a2a2a;
+  --progress-bar-colors-light-text-success-hover: hsl(0 0% 11.5%);
+  --progress-bar-colors-light-fg-default: #009BA5;
+  --progress-bar-colors-light-fg-default-hover: hsl(184 100% 25.9%);
+  --progress-bar-colors-light-fg-error: #D20007;
+  --progress-bar-colors-light-fg-error-hover: hsl(358 100% 28.8%);
+  --progress-bar-colors-light-fg-success: #2a2a2a;
+  --progress-bar-colors-light-fg-success-hover: hsl(0 0% 11.5%);
+  --progress-bar-colors-dark-bg-default: #FFFFFF;
+  --progress-bar-colors-dark-bg-default-alt: #3F3F3F;
+  --progress-bar-colors-dark-bg-error: #FF8883;
+  --progress-bar-colors-dark-bg-success: #73C367;
+  --progress-bar-colors-dark-fg-default: #EBF304;
+  --progress-bar-colors-dark-fg-default-hover: hsl(62 96.8% 63.9%);
+  --progress-bar-colors-dark-fg-error: #FF8883;
+  --progress-bar-colors-dark-fg-error-hover: hsl(2.42 100% 87.8%);
+  --progress-bar-colors-dark-fg-success: #73C367;
+  --progress-bar-colors-dark-fg-success-hover: hsl(112 43.4% 63.6%);
+  --progress-bar-colors-dark-text-default: #FFFFFF;
+  --progress-bar-colors-dark-text-default-alt: #EBF304;
+  --progress-bar-colors-dark-text-default-alt-hover: hsl(62 96.8% 74.2%);
+  --progress-bar-colors-dark-text-error: #FF8883;
+  --progress-bar-colors-dark-text-error-hover: hsl(2.42 100% 87.8%);
+  --progress-bar-colors-dark-text-success: #73C367;
+  --progress-bar-colors-dark-text-success-hover: hsl(112 43.4% 63.6%);
+  --toast-size-s: 40px;
+  --toast-padding-s: 8px;
+  --toast-border-radius-s: 4px;
+  --toast-gap-s: 8px;
+  --toast-size-icon-s: 24px;
+  --toast-border-weight-s: 1px;
+  --toast-colors-status-light-bg-default: #2a2a2a;
+  --toast-colors-status-light-bg-error: #2a2a2a;
+  --toast-colors-status-light-bg-warning: #2a2a2a;
+  --toast-colors-status-light-bg-success: #2a2a2a;
+  --toast-colors-status-light-border-default: #F3F3F3;
+  --toast-colors-status-light-border-error: #FF8883;
+  --toast-colors-status-light-border-warning: #FFA94D;
+  --toast-colors-status-light-border-success: #73C367;
+  --toast-colors-status-light-fg-default: #2a2a2a;
+  --toast-colors-status-light-fg-error: #FF8883;
+  --toast-colors-status-light-fg-warning: #ffa200;
+  --toast-colors-status-light-fg-success: #73C367;
+  --toast-colors-status-light-fg-default-alt: #FFFFFF;
+  --toast-colors-status-light-text-default: #ffffff;
+  --toast-colors-status-light-text-default-alt: #ffffff;
+  --toast-colors-status-dark-bg-default: #f0f0f0;
+  --toast-colors-status-dark-bg-error: #f0f0f0;
+  --toast-colors-status-dark-bg-warning: #f0f0f0;
+  --toast-colors-status-dark-bg-success: #f0f0f0;
+  --toast-colors-status-dark-border-default: #3F3F3F;
+  --toast-colors-status-dark-border-error: #D20007;
+  --toast-colors-status-dark-border-warning: #FEDDA4;
+  --toast-colors-status-dark-border-success: #138100;
+  --toast-colors-status-dark-fg-default: #2B2B2B;
+  --toast-colors-status-dark-fg-error: #D20007;
+  --toast-colors-status-dark-fg-warning: #2a2a2a;
+  --toast-colors-status-dark-fg-success: #138100;
+  --toast-colors-status-dark-text-default: #2a2a2a;
+  --tag-size-s: 28px;
+  --tag-padding-xxs: 4px;
+  --tag-padding-xs: 6px;
+  --tag-padding-s: 8px;
+  --tag-border-radius-s: 32px;
+  --tag-border-weight-s: 1px;
+  --tag-colors-light-bg-default: #FFFFFF;
+  --tag-colors-light-bg-default-alt: #D9D9D9;
+  --tag-colors-light-bg-hover: #ffffff;
+  --tag-colors-light-border-default: #BBBBBB;
+  --tag-colors-light-border-default-alt: #ffffff;
+  --tag-colors-light-border-hover: #ffffff;
+  --tag-colors-light-fg-default: #2B2B2B;
+  --tag-colors-light-fg-hover: #001318;
+  --tag-colors-light-text-default: #2B2B2B;
+  --tag-colors-light-text-hover: #001318;
+  --tag-size-icon-s: 16px;
+  --tag-size-icon-m: 14px;
+  --badge-size-s: 24px;
+  --badge-padding-s: 8px;
+  --badge-border-radius-s: 1000px;
+  --badge-colors-bg-default: #2a2a2a;
+  --badge-colors-bg-error: #AA0006;
+  --badge-colors-bg-warning: #FFA94D;
+  --badge-colors-bg-success: #0F6D00;
+  --badge-colors-text-default: #ffffff;
+  --badge-colors-text-error: #ffffff;
+  --badge-colors-text-warning: #2a2a2a;
+  --badge-colors-text-success: #ffffff;
+  --alert-padding-xxs: 2px;
+  --alert-padding-xs: 6px;
+  --alert-padding-s: 22px;
+  --alert-padding-m: 10px;
+  --alert-border-radius-s: 8px;
+  --alert-border-weight-s: 1px;
+  --alert-border-weight-m: 4px;
+  --alert-box-shadow-01: sem.box-shadow.01;
+  --alert-colors-status-light-bg-subtle-default: #F3F3F3;
+  --alert-colors-status-light-bg-subtle-error: #FEEDED;
+  --alert-colors-status-light-bg-subtle-warning: #FEF2DE;
+  --alert-colors-status-light-bg-subtle-success: #e6f4e5;
+  --alert-colors-status-light-border-default: #3F3F3F;
+  --alert-colors-status-light-border-error: #D20007;
+  --alert-colors-status-light-border-warning: #B14D00;
+  --alert-colors-status-light-border-success: #138100;
+  --alert-colors-status-light-fg-default: #2B2B2B;
+  --alert-colors-status-light-text-default: #2B2B2B;
+  --alert-colors-status-dark-bg-subtle-default: #2B2B2B;
+  --alert-colors-status-dark-bg-subtle-error: #2D0002;
+  --alert-colors-status-dark-bg-subtle-warning: #4B2000;
+  --alert-colors-status-dark-bg-subtle-success: #073600;
+  --alert-colors-status-dark-border-default: #F3F3F3;
+  --alert-colors-status-dark-border-error: #E81D1D;
+  --alert-colors-status-dark-border-warning: #FFA94D;
+  --alert-colors-status-dark-border-success: #73C367;
+  --alert-colors-status-dark-fg-default: #F3F3F3;
+  --alert-colors-status-dark-text-default: #F3F3F3;
+  --alert-size-icon-s: 24px;
+  --alert-gap-s: 0px;
+  --segmented-control-size-icon-s: 24px;
+  --segmented-control-size-s: 40px;
+  --segmented-control-padding-s: 8px;
+  --segmented-control-padding-m: 16px;
+  --segmented-control-gap-s: 4px;
+  --segmented-control-gap-m: 8px;
+  --segmented-control-border-radius-m: 1000px;
+  --segmented-control-border-weight-s: 1px;
+  --segmented-control-border-weight-m: 2px;
+  --segmented-control-colors-light-bg-default: #FFFFFF;
+  --segmented-control-colors-light-bg-hover: #001318;
+  --segmented-control-colors-light-bg-selected: #3F3F3F;
+  --segmented-control-colors-light-fg-default: #009BA5;
+  --segmented-control-colors-light-fg-default-alt: #FFFFFF;
+  --segmented-control-colors-light-fg-focus: #035F6E;
+  --segmented-control-colors-light-border-focus: #111111;
+  --segmented-control-colors-light-border-subtle: #BBBBBB;
+  --segmented-control-colors-light-text-default: #009BA5;
+  --segmented-control-colors-light-text-default-alt: #FFFFFF;
+  --segmented-control-colors-light-text-focus: #035F6E;
+  --rule-colors-light-border-subtle: #BBBBBB;
+  --rule-colors-dark-border-subtle: #525252;
+  --rule-border-weight-s: 1px;
+  --logos-size-m: 40px;
+  --logos-colors-light-fg-default: #009BA5;
+  --logos-colors-light-fg-strong: #2B2B2B;
+  --logos-colors-light-fg-variant: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%);
+  --logos-colors-dark-fg-default: #EBF304;
+  --vertical-space-size-4: 4px;
+  --vertical-space-size-8: 8px;
+  --vertical-space-size-12: 12px;
+  --vertical-space-size-16: 16px;
+  --vertical-space-size-20: 20px;
+  --vertical-space-size-24: 24px;
+  --vertical-space-size-28: 28px;
+  --vertical-space-size-32: 32px;
+  --vertical-space-size-40: 40px;
+  --vertical-space-size-48: 48px;
+  --vertical-space-size-64: 64px;
+  --vertical-space-size-96: 96px;
+  --vertical-space-size-128: 128px;
+  --textlink-size-s: 20px;
+  --textlink-size-m: 24px;
+  --textlink-size-l: 26px;
+  --textlink-size-icon-s: 20px;
+  --textlink-size-icon-m: 24px;
+  --textlink-padding-s: 2px;
+  --textlink-colors-light-fg-default: #009BA5;
+  --textlink-colors-light-fg-hover: #001318;
+  --textlink-colors-light-fg-visited: #111111;
+  --textlink-colors-light-text-default: #009BA5;
+  --textlink-colors-light-text-hover: #001318;
+  --textlink-colors-light-text-visited: #111111;
+  --textlink-colors-dark-fg-default: #EBF304;
+  --textlink-colors-dark-fg-hover: #F8FF19;
+  --textlink-colors-dark-fg-visited: #ABAD00;
+  --textlink-colors-dark-text-default: #EBF304;
+  --textlink-colors-dark-text-hover: #F8FF19;
+  --textlink-colors-dark-text-visited: #ABAD00;
+  --textlink-gap-s: 4px;
+  --siteheader-size-s: 34px;
+  --siteheader-size-m: 58px;
+  --siteheader-size-l: 84px;
+  --siteheader-padding-s: 12px;
+  --siteheader-padding-m: 16px;
+  --siteheader-padding-l: 24px;
+  --siteheader-padding-xl: 32px;
+  --siteheader-gap-s: 12px;
+  --siteheader-gap-m: 24px;
+  --siteheader-gap-l: 40px;
+  --siteheader-size-icon-s: 24px;
+  --siteheader-colors-light-bg-default: #111111;
+  --siteheader-colors-light-fg-default: #aaaaaa;
+  --siteheader-colors-light-fg-default-alt: #2B2B2B;
+  --siteheader-colors-light-text-default: #5514b4;
+  --siteheader-colors-light-text-default-alt: #01404C;
+  --sitefooter-size-s: 20px;
+  --sitefooter-size-m: 34px;
+  --sitefooter-size-icon-s: 16px;
+  --sitefooter-size-icon-m: 24px;
+  --sitefooter-size-icon-l: 32px;
+  --sitefooter-padding-s: 8px;
+  --sitefooter-padding-m: 12px;
+  --sitefooter-padding-l: 16px;
+  --sitefooter-padding-xl: 24px;
+  --sitefooter-padding-xxl: 32px;
+  --sitefooter-gap-s: 4px;
+  --sitefooter-gap-m: 8px;
+  --sitefooter-gap-l: 16px;
+  --sitefooter-gap-xl: 24px;
+  --sitefooter-gap-xxl: 48px;
+  --sitefooter-colors-light-bg-default: #111111;
+  --sitefooter-colors-light-fg-default: #aaaaaa;
+  --sitefooter-colors-light-fg-default-alt: #3f187f;
+  --sitefooter-colors-light-border-subtle: #BBBBBB;
+  --sitefooter-colors-light-text-default: #ffffff;
+  --sitefooter-colors-light-text-subtle: #6b6b6b;
+  --sitefooter-border-weight-s: 1px;
+  --header-menu-size-s: 40px;
+  --header-menu-size-m: 96px;
+  --header-menu-size-l: 72px;
+  --header-menu-size-xl: 106px;
+  --header-menu-padding-s: 8px;
+  --header-menu-padding-m: 12px;
+  --header-menu-padding-l: 24px;
+  --header-menu-padding-xl: 40px;
+  --header-menu-gap-s: 8px;
+  --header-menu-gap-m: 16px;
+  --header-menu-gap-l: 20px;
+  --header-menu-gap-xl: 24px;
+  --header-menu-gap-xxl: 28px;
+  --header-menu-gap-xxxl: 44px;
+  --header-menu-gap-xxxxl: 48px;
+  --header-menu-border-radius-s: 24px;
+  --header-menu-border-radius-m: 16px;
+  --header-menu-border-radius-l: 16px;
+  --header-menu-border-radius-xl: 16px;
+  --header-menu-size-icon-s: 16px;
+  --header-menu-size-icon-m: 28px;
+  --header-menu-size-icon-l: 48px;
+  --header-menu-border-weight-s: 1px;
+  --header-menu-colors-light-bg-strong: #2B2B2B;
+  --header-menu-colors-light-bg-default-alt: #FFFFFF;
+  --header-menu-colors-light-fg-default: #009BA5;
+  --header-menu-colors-light-fg-default-alt: #FFFFFF;
+  --header-menu-colors-light-fg-strong: #2B2B2B;
+  --header-menu-colors-light-border-strong-alt-copy: #818181;
+  --header-menu-colors-light-text-default: #009BA5;
+  --header-menu-colors-light-text-default-alt: #FFFFFF;
+  --header-menu-colors-light-text-strong: #2B2B2B;
+  --button-v2-padding-xxxs: 3px;
+  --button-v2-padding-xxs: 4px;
+  --button-v2-padding-xs: 8px;
+  --button-v2-padding-s: 10px;
+  --button-v2-padding-m: 12px;
+  --button-v2-padding-l: 16px;
+  --button-v2-padding-xl: 18px;
+  --button-v2-padding-xxl: 24px;
+  --button-v2-padding-xxxl: 32px;
+  --button-v2-gap-xs: 4px;
+  --button-v2-gap-s: 6px;
+  --button-v2-gap-m: 8px;
+  --button-v2-border-radius-s: 16px;
+  --button-v2-size-s: 32px;
+  --button-v2-size-m: 44px;
+  --button-v2-size-l: 64px;
+  --button-v2-size-icon-s: 20px;
+  --button-v2-size-icon-m: 24px;
+  --button-v2-size-icon-l: 28px;
+  --button-v2-size-icon-xl: 64px;
+  --button-v2-border-weight-xs: 1px; /* 0.5 border-weight needed, core, semantic token will need to be created */
+  --button-v2-border-weight-s: 2px;
+  --button-v2-border-weight-m: 2px;
+  --button-v2-colors-light-bg-default: #111111;
+  --button-v2-colors-light-bg-hover: #2B2B2B;
+  --button-v2-colors-light-bg-pressed: #057382;
+  --button-v2-colors-light-bg-disabled: #D9D9D9;
+  --button-v2-colors-light-bg-strong: #D9D9D9;
+  --button-v2-colors-light-bg-subtle: #F3F3F3;
+  --button-v2-colors-light-bg-minimal: #D9D9D9;
+  --button-v2-colors-light-border-default: #111111;
+  --button-v2-colors-light-border-pressed: #3F3F3F;
+  --button-v2-colors-light-border-disabled: #D9D9D9;
+  --button-v2-colors-light-fg-default: #001318;
+  --button-v2-colors-light-fg-default-alt: #FFFFFF;
+  --button-v2-colors-light-fg-default-strong: #009BA5;
+  --button-v2-colors-light-fg-hover: #001318;
+  --button-v2-colors-light-fg-pressed: #3F3F3F;
+  --button-v2-colors-light-fg-disabled: #686868;
+  --button-v2-colors-light-fg-strong-subtle: #9C9C9C;
+  --button-v2-colors-light-text-default: #001318;
+  --button-v2-colors-light-text-default-alt: #FFFFFF;
+  --button-v2-colors-light-text-hover: #001318;
+  --button-v2-colors-light-text-pressed: #3F3F3F;
+  --button-v2-colors-light-text-disabled: #686868;
+  --button-v2-colors-light-status-text-default: #FFFFFF;
+  --button-v2-colors-light-status-bg-default: #AA0006;
+  --button-v2-colors-light-status-bg-hover: #840106;
+  --button-v2-colors-light-status-bg-pressed: #600104;
+  --button-v2-colors-light-variant-bg-default: linear-gradient(244deg, #f200f5 0%, #1ec8e6 100%);
+  --button-v2-colors-light-variant-bg-hover: linear-gradient(-45deg, #ff80ff 0%, #72d4e9 100%);
+  --button-v2-colors-light-variant-bg-pressed: linear-gradient(-44deg, #72d4e9 0%, #ff80ff 100%);
+  --button-v2-colors-light-variant-fg-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --button-v2-colors-light-variant-border-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --button-v2-colors-dark-bg-default: #FFFFFF;
+  --button-v2-colors-dark-bg-hover: #F3F3F3;
+  --button-v2-colors-dark-bg-pressed: #818181;
+  --button-v2-colors-dark-bg-disabled: #686868;
+  --button-v2-colors-dark-bg-strong: #686868;
+  --button-v2-colors-dark-bg-hover-alt: #3F3F3F;
+  --button-v2-colors-dark-bg-subtle: #818181;
+  --button-v2-colors-dark-bg-minimal: #818181;
+  --button-v2-colors-dark-border-default: #FFFFFF;
+  --button-v2-colors-dark-border-pressed: #818181;
+  --button-v2-colors-dark-border-disabled: #686868;
+  --button-v2-colors-dark-border-subtle: #6b6b6b;
+  --button-v2-colors-dark-fg-default: #EBF304;
+  --button-v2-colors-dark-fg-default-alt: #2B2B2B;
+  --button-v2-colors-dark-fg-hover: #F8FF19;
+  --button-v2-colors-dark-fg-pressed: #818181;
+  --button-v2-colors-dark-fg-disabled: #9C9C9C;
+  --button-v2-colors-dark-fg-strong: #9C9C9C;
+  --button-v2-colors-dark-fg-strong-subtle: #818181;
+  --button-v2-colors-dark-status-fg-default: #FFFFFF;
+  --button-v2-colors-dark-status-text-default: #FFFFFF;
+  --button-v2-colors-dark-status-bg-default: #600104;
+  --button-v2-colors-dark-status-bg-hover: #840106;
+  --button-v2-colors-dark-status-bg-pressed: #AA0006;
+  --button-v2-colors-dark-text-default: #EBF304;
+  --button-v2-colors-dark-text-default-alt: #2B2B2B;
+  --button-v2-colors-dark-text-hover: #F8FF19;
+  --button-v2-colors-dark-text-pressed: #818181;
+  --button-v2-colors-dark-text-disabled: #9C9C9C;
+  --button-v2-colors-dark-variant-bg-loader: linear-gradient(90deg, #f5eefa 0%, #eafcff 100%);
+  --button-v2-colors-dark-variant-fg-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --button-v2-colors-dark-variant-border-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --button-v2-colors-overlay-flat-01: rgba(255,255,255,0.5);
+  --button-v2-colors-overlay-flat-02: rgba(85,20,180,0.5);
+  --hero-button-padding-xxxs: 3px;
+  --hero-button-padding-xxs: 4px;
+  --hero-button-padding-xs: 8px;
+  --hero-button-padding-s: 10px;
+  --hero-button-padding-m: 12px;
+  --hero-button-padding-l: 16px;
+  --hero-button-padding-xl: 18px;
+  --hero-button-padding-xxl: 24px;
+  --hero-button-padding-xxxl: 32px;
+  --hero-button-gap-xs: 4px;
+  --hero-button-gap-s: 6px;
+  --hero-button-gap-m: 8px;
+  --hero-button-border-radius-s: 16px;
+  --hero-button-size-s: 32px;
+  --hero-button-size-m: 44px;
+  --hero-button-size-l: 64px;
+  --hero-button-size-icon-s: 20px;
+  --hero-button-size-icon-m: 24px;
+  --hero-button-size-icon-l: 28px;
+  --hero-button-size-icon-xl: 64px;
+  --hero-button-border-weight-xs: 1px; /* 0.5 border-weight needed, core, semantic token will need to be created */
+  --hero-button-border-weight-s: 2px;
+  --hero-button-border-weight-m: 2px;
+  --hero-button-colors-light-bg-default: #111111;
+  --hero-button-colors-light-bg-hover: #2B2B2B;
+  --hero-button-colors-light-bg-pressed: #057382;
+  --hero-button-colors-light-bg-disabled: #D9D9D9;
+  --hero-button-colors-light-bg-strong: #D9D9D9;
+  --hero-button-colors-light-bg-subtle: #F3F3F3;
+  --hero-button-colors-light-bg-minimal: #D9D9D9;
+  --hero-button-colors-light-border-default: #111111;
+  --hero-button-colors-light-border-pressed: #3F3F3F;
+  --hero-button-colors-light-border-disabled: #D9D9D9;
+  --hero-button-colors-light-fg-default: #001318;
+  --hero-button-colors-light-fg-default-alt: #FFFFFF;
+  --hero-button-colors-light-fg-default-strong: #009BA5;
+  --hero-button-colors-light-fg-hover: #001318;
+  --hero-button-colors-light-fg-pressed: #3F3F3F;
+  --hero-button-colors-light-fg-disabled: #686868;
+  --hero-button-colors-light-fg-strong-subtle: #9C9C9C;
+  --hero-button-colors-light-text-default: #001318;
+  --hero-button-colors-light-text-default-alt: #FFFFFF;
+  --hero-button-colors-light-text-hover: #001318;
+  --hero-button-colors-light-text-pressed: #3F3F3F;
+  --hero-button-colors-light-text-disabled: #686868;
+  --hero-button-colors-light-status-text-default: #FFFFFF;
+  --hero-button-colors-light-status-bg-default: #AA0006;
+  --hero-button-colors-light-status-bg-hover: #840106;
+  --hero-button-colors-light-status-bg-pressed: #600104;
+  --hero-button-colors-light-variant-bg-default: linear-gradient(244deg, #f200f5 0%, #1ec8e6 100%);
+  --hero-button-colors-light-variant-bg-hover: linear-gradient(-45deg, #ff80ff 0%, #72d4e9 100%);
+  --hero-button-colors-light-variant-bg-pressed: linear-gradient(-44deg, #72d4e9 0%, #ff80ff 100%);
+  --hero-button-colors-light-variant-fg-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --hero-button-colors-light-variant-border-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --hero-button-colors-dark-bg-default: #FFFFFF;
+  --hero-button-colors-dark-bg-hover: #F3F3F3;
+  --hero-button-colors-dark-bg-pressed: #818181;
+  --hero-button-colors-dark-bg-disabled: #686868;
+  --hero-button-colors-dark-bg-strong: #686868;
+  --hero-button-colors-dark-bg-hover-alt: #3F3F3F;
+  --hero-button-colors-dark-bg-subtle: #818181;
+  --hero-button-colors-dark-bg-minimal: #818181;
+  --hero-button-colors-dark-border-default: #FFFFFF;
+  --hero-button-colors-dark-border-pressed: #818181;
+  --hero-button-colors-dark-border-disabled: #686868;
+  --hero-button-colors-dark-border-subtle: #6b6b6b;
+  --hero-button-colors-dark-fg-default: #EBF304;
+  --hero-button-colors-dark-fg-default-alt: #2B2B2B;
+  --hero-button-colors-dark-fg-hover: #F8FF19;
+  --hero-button-colors-dark-fg-pressed: #818181;
+  --hero-button-colors-dark-fg-disabled: #9C9C9C;
+  --hero-button-colors-dark-fg-strong: #9C9C9C;
+  --hero-button-colors-dark-fg-strong-subtle: #818181;
+  --hero-button-colors-dark-status-fg-default: #FFFFFF;
+  --hero-button-colors-dark-status-text-default: #FFFFFF;
+  --hero-button-colors-dark-status-bg-default: #600104;
+  --hero-button-colors-dark-status-bg-hover: #840106;
+  --hero-button-colors-dark-status-bg-pressed: #AA0006;
+  --hero-button-colors-dark-text-default: #EBF304;
+  --hero-button-colors-dark-text-default-alt: #2B2B2B;
+  --hero-button-colors-dark-text-hover: #F8FF19;
+  --hero-button-colors-dark-text-pressed: #818181;
+  --hero-button-colors-dark-text-disabled: #9C9C9C;
+  --hero-button-colors-dark-variant-bg-loader: linear-gradient(90deg, #f5eefa 0%, #eafcff 100%);
+  --hero-button-colors-dark-variant-fg-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --hero-button-colors-dark-variant-border-default: linear-gradient(105deg, #f200f5 0%, #1ec8e6 100%);
+  --hero-button-colors-overlay-flat-01: rgba(255,255,255,0.5);
+  --hero-button-colors-overlay-flat-02: rgba(85,20,180,0.5);
+  --button-padding-s: 10px;
+  --button-padding-m: 12px;
+  --button-padding-l: 16px;
+  --button-padding-xl: 18px;
+  --button-padding-xxl: 20px;
+  --button-padding-xxxl: 24px;
+  --button-gap-xs: 2px;
+  --button-gap-s: 4px;
+  --button-gap-m: 6px;
+  --button-gap-l: 8px;
+  --button-border-radius-s: 16px;
+  --button-size-xxs: 20px;
+  --button-size-xs: 24px;
+  --button-size-s: 28px;
+  --button-size-m: 32px;
+  --button-size-l: 44px;
+  --button-size-xl: 48px;
+  --button-size-xxl: 60px;
+  --button-size-icon-xs: 12px;
+  --button-size-icon-s: 16px;
+  --button-size-icon-m: 20px;
+  --button-size-icon-l: 24px;
+  --button-size-icon-xl: 28px;
+  --button-colors-light-bg-default: #111111;
+  --button-colors-light-bg-hover: #2B2B2B;
+  --button-colors-light-bg-pressed: #057382;
+  --button-colors-light-bg-disabled: #D9D9D9;
+  --button-colors-light-border-default: #111111;
+  --button-colors-light-border-pressed: #3F3F3F;
+  --button-colors-light-border-disabled: #D9D9D9;
+  --button-colors-light-fg-default: #001318;
+  --button-colors-light-fg-default-alt: #FFFFFF;
+  --button-colors-light-fg-hover: #001318;
+  --button-colors-light-fg-pressed: #3F3F3F;
+  --button-colors-light-fg-disabled: #686868;
+  --button-colors-light-text-default: #001318;
+  --button-colors-light-text-default-alt: #FFFFFF;
+  --button-colors-light-text-hover: #001318;
+  --button-colors-light-text-pressed: #3F3F3F;
+  --button-colors-light-text-disabled: #686868;
+  --button-colors-dark-bg-default: #FFFFFF;
+  --button-colors-dark-bg-hover: #F3F3F3;
+  --button-colors-dark-bg-pressed: #818181;
+  --button-colors-dark-bg-disabled: #686868;
+  --button-colors-dark-border-default: #FFFFFF;
+  --button-colors-dark-border-pressed: #818181;
+  --button-colors-dark-border-disabled: #686868;
+  --button-colors-dark-fg-default: #EBF304;
+  --button-colors-dark-fg-default-alt: #2B2B2B;
+  --button-colors-dark-fg-hover: #F8FF19;
+  --button-colors-dark-fg-pressed: #818181;
+  --button-colors-dark-fg-disabled: #9C9C9C;
+  --button-colors-dark-text-default: #EBF304;
+  --button-colors-dark-text-default-alt: #2B2B2B;
+  --button-colors-dark-text-hover: #F8FF19;
+  --button-colors-dark-text-pressed: #818181;
+  --button-colors-dark-text-disabled: #9C9C9C;
+  --button-border-weight-s: 2px;
+  --focus-colors-light-border-subtle: #111111;
+  --focus-colors-dark-border-subtle: #D9D9D9;
+  --focus-border-weight-s: 2px;
+  --focus-border-radius-s: 16px;
+  --universal-header-size-s: 32px;
+  --universal-header-padding-s: 10px;
+  --universal-header-padding-m: 16px;
+  --universal-header-padding-l: 24px;
+  --universal-header-padding-xl: 32px;
+  --universal-header-gap-s: 6px;
+  --universal-header-gap-m: 12px;
+  --universal-header-gap-l: 32px;
+  --universal-header-size-icon-s: 10px;
+  --universal-header-colors-light-bg-default: #D9D9D9;
+  --universal-header-colors-light-fg-default: #2B2B2B;
+  --universal-header-colors-light-text-default: #01404C;
+  --universal-header-colors-light-text-hover: #001318;
+  --card-colors-light-bg-default: #111111;
+  --card-colors-light-bg-default-alt: #FFFFFF;
+  --card-colors-light-bg-emphasis: linear-gradient(90deg, #fcf9ff 0%, #f9f9ff 100%);
+  --card-colors-light-fg-default: #001318;
+  --card-colors-light-fg-default-alt: #FFFFFF;
+  --card-colors-light-fg-hover: #057382;
+  --card-colors-light-border-default: #BBBBBB;
+  --card-colors-light-border-hover: #525252;
+  --card-colors-light-border-minimal: #BBBBBB;
+  --card-colors-light-text-default: #2B2B2B;
+  --card-colors-light-text-hover: #001318;
+  --card-colors-light-text-support: #686868;
+  --card-colors-dark-bg-default: #FFFFFF;
+  --card-colors-dark-bg-default-alt: #111111;
+  --card-colors-dark-bg-emphasis: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%);
+  --card-colors-dark-fg-default-alt: #FFFFFF;
+  --card-colors-dark-border-hover: #F3F3F3;
+  --card-colors-dark-text-default: #FFFFFF;
+  --card-colors-dark-text-hover: #F8FF19;
+  --card-colors-dark-text-support: #BBBBBB;
+  --card-padding-s: 24px;
+  --card-padding-m: 32px;
+  --card-border-weight-s: 1px;
+  --card-border-weight-m: 2px;
+  --card-border-radius-s: 16px;
+  --card-gap-xs: 8px;
+  --card-gap-s: 16px;
+  --card-gap-m: 20px;
+  --card-gap-l: 22px;
+  --card-gap-xl: 24px;
+  --card-size-s: 48px;
+  --card-size-m: 80px;
+  --card-size-l: 96px;
+  --card-size-icon-s: 42px;
+  --card-size-icon-m: 80px;
+  --surface-colors-bg-dark-brand-02: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%);
+  --surface-colors-bg-dark-brand-01: #111111;
+  --surface-colors-bg-dark-neutral-01: #686868;
+  --surface-colors-bg-dark-neutral-02: #2B2B2B;
+  --surface-colors-bg-light-white: #FFFFFF;
+  --surface-colors-bg-light-neutral-01: #f7f7f7;
+  --surface-colors-bg-light-neutral-02: #D9D9D9;
+  --surface-colors-bg-light-brand-01: linear-gradient(90deg, #fff2f0 0%, #f5eefa 100%);
+  --surface-colors-bg-light-brand-02: linear-gradient(90deg, #f5eefa 0%, #eafcff 100%);
+  --surface-colors-bg-dark-black: #111111;
+  --filter-size-s: 28px;
+  --filter-padding-s: 4px;
+  --filter-padding-m: 10px;
+  --filter-border-radius-s: 32px;
+  --filter-border-weight-s: 1px;
+  --filter-border-weight-m: 2px;
+  --filter-colors-light-border-default: #BBBBBB;
+  --filter-colors-light-border-hover: #525252;
+  --filter-colors-light-bg-default: #FFFFFF;
+  --filter-colors-light-bg-selected: #111111;
+  --filter-colors-light-text-default: #001318;
+  --filter-colors-light-text-default-alt: #ffffff;
+  --filter-colors-light-text-hover: #2a1c4a;
+  --filter-colors-dark-border-default: #06C3C2;
+  --filter-colors-dark-border-hover: #525252;
+  --filter-colors-dark-bg-selected: #FFFFFF;
+  --filter-colors-dark-bg-default: #111111;
+  --filter-colors-dark-text-default: #001318;
+  --filter-colors-dark-text-default-alt: #efe5f7;
+  --filter-colors-dark-text-hover: #D9D9D9;
+  --filter-colors-dark-text-seleced: #2a1c4a;
+  --filter-gap-l: 16px;
+  --filter-margin-m: 16px;
+}