@arc-ui/tokens-bt-enterprise 12.0.0-beta.3

package/dist/index.css

@@ -0,0 +1,1614 @@
+/**
+ * Do not edit directly
+ * Generated on Fri, 23 Aug 2024 17:25:36 GMT
+ */
+
+.arc-ds-sys-theme--bt-enterprise {
+  --sem-font-family-heading: 'BT Curve';
+  --sem-font-family-body: 'BT Curve';
+  --sem-font-family-interface: 'BT Curve';
+  --sem-font-weight-regular: 400;
+  --sem-font-weight-semi: 500;
+  --sem-font-weight-bold: 700;
+  --sem-font-weight-button: 400;
+  --sem-font-weight-semi-bold: 500;
+  --sem-type-body-reg-xs: 400 12px/16px 'BT Curve';
+  --sem-type-body-reg-s: 400 14px/20px 'BT Curve';
+  --sem-type-body-reg-m: 400 16px/24px 'BT Curve';
+  --sem-type-body-reg-l: 400 20px/26px 'BT Curve';
+  --sem-type-body-bold-xs: 700 12px/16px 'BT Curve';
+  --sem-type-body-bold-s: 700 14px/20px 'BT Curve';
+  --sem-type-body-bold-m: 700 16px/24px 'BT Curve';
+  --sem-type-body-bold-l: 700 20px/26px 'BT Curve';
+  --sem-type-body-semi-xs: 500 12px/16px 'BT Curve';
+  --sem-type-body-semi-s: 500 14px/20px 'BT Curve';
+  --sem-type-body-semi-m: 500 16px/24px 'BT Curve';
+  --sem-type-body-semi-l: 500 20px/26px 'BT Curve';
+  --sem-type-label-reg-xxs: 400 14px/20px 'BT Curve';
+  --sem-type-label-reg-xs: 400 14px/20px 'BT Curve';
+  --sem-type-label-reg-s: 400 14px/20px 'BT Curve';
+  --sem-type-label-reg-m: 400 16px/24px 'BT Curve';
+  --sem-type-label-reg-l: 400 20px/26px 'BT Curve';
+  --sem-type-label-reg-xl: 400 20px/26px 'BT Curve';
+  --sem-type-interface-reg-xs: 400 12px/12px 'BT Curve';
+  --sem-type-interface-reg-s: 400 14px/14px 'BT Curve';
+  --sem-type-interface-reg-m: 400 16px/16px 'BT Curve';
+  --sem-type-interface-reg-l: 400 20px/20px 'BT Curve';
+  --sem-type-interface-semi-xs: 500 12px/12px 'BT Curve';
+  --sem-type-interface-semi-s: 500 14px/14px 'BT Curve';
+  --sem-type-interface-semi-m: 500 16px/16px 'BT Curve';
+  --sem-type-interface-semi-l: 500 20px/20px 'BT Curve';
+  --sem-type-interface-bold-xs: 700 12px/12px 'BT Curve';
+  --sem-type-interface-bold-s: 700 14px/14px 'BT Curve';
+  --sem-type-interface-bold-m: 700 16px/16px 'BT Curve';
+  --sem-type-interface-bold-l: 700 20px/20px 'BT Curve';
+  --sem-type-interface-button-s: 400 14px/14px 'BT Curve';
+  --sem-type-interface-button-m: 400 16px/16px 'BT Curve';
+  --sem-type-interface-button-l: 400 20px/20px 'BT Curve';
+  --sem-type-interface-card-semi-s: 500 20px/26px 'BT Curve';
+  --sem-type-interface-card-semi-m: 500 24px/32px 'BT Curve';
+  --sem-type-interface-card-semi-l: 500 28px/36px 'BT Curve';
+  --sem-type-interface-card-semi-xl: 500 32px/40px 'BT Curve';
+  --sem-type-interface-progress-bar-title-m: 400 16px/16px 'BT Curve';
+  --sem-type-interface-alert-title-m: 700 16px/24px 'BT Curve';
+  --sem-type-support-reg-xs: 400 12px/16px 'BT Curve';
+  --sem-type-support-reg-s: 400 14px/20px 'BT Curve';
+  --sem-type-support-reg-m: 400 16px/24px 'BT Curve';
+  --sem-type-support-reg-l: 400 20px/26px 'BT Curve';
+  --sem-type-mobile-semi-xxxs: 500 12px/16px 'BT Curve';
+  --sem-type-mobile-semi-xxs: 500 14px/20px 'BT Curve';
+  --sem-type-mobile-semi-xs: 500 16px/24px 'BT Curve';
+  --sem-type-mobile-semi-s: 500 20px/26px 'BT Curve';
+  --sem-type-mobile-semi-m: 500 24px/32px 'BT Curve';
+  --sem-type-mobile-semi-l: 500 28px/36px 'BT Curve';
+  --sem-type-mobile-semi-xl: 500 36px/44px 'BT Curve';
+  --sem-type-mobile-semi-xxl: 500 40px/48px 'BT Curve';
+  --sem-type-mobile-semi-xxxl: 500 56px/64px 'BT Curve';
+  --sem-type-mobile-bold-xxxs: 700 12px/16px 'BT Curve';
+  --sem-type-mobile-bold-xxs: 700 14px/20px 'BT Curve';
+  --sem-type-mobile-bold-xs: 700 16px/24px 'BT Curve';
+  --sem-type-mobile-bold-s: 700 20px/26px 'BT Curve';
+  --sem-type-mobile-bold-m: 700 24px/32px 'BT Curve';
+  --sem-type-mobile-bold-l: 700 28px/36px 'BT Curve';
+  --sem-type-mobile-bold-xl: 700 36px/44px 'BT Curve';
+  --sem-type-mobile-bold-xxl: 700 40px/48px 'BT Curve';
+  --sem-type-mobile-bold-xxxl: 700 56px/64px 'BT Curve';
+  --sem-type-tablet-semi-m: 500 28px/36px 'BT Curve';
+  --sem-type-tablet-semi-l: 500 32px/40px 'BT Curve';
+  --sem-type-tablet-semi-xl: 500 40px/48px 'BT Curve';
+  --sem-type-tablet-semi-xxl: 500 56px/64px 'BT Curve';
+  --sem-type-tablet-semi-xxxl: 500 80px/96px 'BT Curve';
+  --sem-type-tablet-bold-m: 700 28px/36px 'BT Curve';
+  --sem-type-tablet-bold-l: 700 32px/40px 'BT Curve';
+  --sem-type-tablet-bold-xl: 700 40px/48px 'BT Curve';
+  --sem-type-tablet-bold-xxl: 700 56px/64px 'BT Curve';
+  --sem-type-tablet-bold-xxxl: 700 80px/96px 'BT Curve';
+  --sem-type-desktop-semi-s: 500 28px/36px 'BT Curve';
+  --sem-type-desktop-semi-m: 500 32px/40px 'BT Curve';
+  --sem-type-desktop-semi-l: 500 40px/48px 'BT Curve';
+  --sem-type-desktop-semi-xl: 500 56px/64px 'BT Curve';
+  --sem-type-desktop-semi-xxl: 500 80px/96px 'BT Curve';
+  --sem-type-desktop-semi-xxxl: 500 120px/136px 'BT Curve';
+  --sem-type-desktop-bold-m: 700 32px/40px 'BT Curve';
+  --sem-type-desktop-bold-l: 700 40px/48px 'BT Curve';
+  --sem-type-desktop-bold-xl: 700 56px/64px 'BT Curve';
+  --sem-type-desktop-bold-xxl: 700 80px/96px 'BT Curve';
+  --sem-type-desktop-bold-xxxl: 700 120px/136px 'BT Curve';
+  --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-xxxxxxs: 10px;
+  --sem-size-icon-xxxxxl: 80px;
+  --sem-size-icon-xxxxs: 32px;
+  --sem-size-icon-xxxs: 12px;
+  --sem-size-icon-xxs: 20px;
+  --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-xxxxxxl: 96px;
+  --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: 348px;
+  --sem-size-all-210: 384px;
+  --sem-size-all-220: 472px;
+  --sem-size-all-230: 591px;
+  --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;
+  --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: 8px;
+  --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-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-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: 4px;
+  --sem-border-radius-xxxs: 4px;
+  --sem-border-radius-xxs: 4px;
+  --sem-border-radius-xs: 4px;
+  --sem-border-radius-s: 8px;
+  --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: 4px;
+  --sem-border-radius-variant-m: 4px;
+  --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: #da020f;
+  --sem-color-status-border-light-warning: #ffa200;
+  --sem-color-status-border-light-success: #088003;
+  --sem-color-status-border-light-general: #2a2a2a;
+  --sem-color-status-border-dark-error: #fa9590;
+  --sem-color-status-border-dark-warning: #ffc501;
+  --sem-color-status-border-dark-success: #75c26c;
+  --sem-color-status-border-dark-general: #f0f0f0;
+  --sem-color-status-border-dark-error-subtle: #f91f14;
+  --sem-color-status-border-dark-warning-subtle: #ffa200;
+  --sem-color-status-border-dark-success-subtle: #088003;
+  --sem-color-status-border-dark-error-minimal: #da020f;
+  --sem-color-status-bg-light-error-strong: #da020f;
+  --sem-color-status-bg-light-warning-strong: #ffa200;
+  --sem-color-status-bg-light-error: #ffe9ec;
+  --sem-color-status-bg-light-warning: #fef6de;
+  --sem-color-status-bg-light-success: #e6f4e5;
+  --sem-color-status-bg-light-success-copy: #e6f4e5;
+  --sem-color-status-bg-light-general: #f7f7f7;
+  --sem-color-status-bg-light-error-alt: #ffc8cb;
+  --sem-color-status-bg-light-error-emphasis: #ffc8cb;
+  --sem-color-status-bg-light-warning-alt: #ffa200;
+  --sem-color-status-bg-light-success-alt: #088003;
+  --sem-color-status-bg-light-general-alt: #2a2a2a;
+  --sem-color-status-bg-light-error-subtle: #da020f;
+  --sem-color-status-bg-dark-error-strong: #fa9590;
+  --sem-color-status-bg-dark-warning-strong: #ffc501;
+  --sem-color-status-bg-dark-error: #401313;
+  --sem-color-status-bg-dark-error-subtle: #ab0000;
+  --sem-color-status-bg-dark-warning: #332700;
+  --sem-color-status-bg-dark-success: #233A20;
+  --sem-color-status-bg-dark-general: #2a2a2a;
+  --sem-color-status-bg-dark-general-alt: #f0f0f0;
+  --sem-color-status-bg-dark-default: #ffffff;
+  --sem-color-status-fg-light-error: #da020f;
+  --sem-color-status-fg-light-warning: #ffa200;
+  --sem-color-status-fg-light-success: #088003;
+  --sem-color-status-fg-light-general: #2a2a2a;
+  --sem-color-status-fg-light-warning-alt: #ffa200;
+  --sem-color-status-fg-dark-error: #fa9590;
+  --sem-color-status-fg-dark-warning: #ffc501;
+  --sem-color-status-fg-dark-success: #75c26c;
+  --sem-color-status-fg-dark-general: #f0f0f0;
+  --sem-color-status-fg-dark-error-subtle: #f91f14;
+  --sem-color-status-fg-dark-success-subtle: #088003;
+  --sem-color-status-fg-dark-warning-subtle: #2a2a2a;
+  --sem-color-status-fg-dark-error-alt: #da020f;
+  --sem-color-status-fg-dark-warning-alt: #2a2a2a;
+  --sem-color-border-primary-light-default: #5514b4; /* Brand indigo */
+  --sem-color-border-primary-light-subtle: #3f187f;
+  --sem-color-border-primary-light-strong: #3f187f; /* Brand indigo */
+  --sem-color-border-primary-light-emphasis: #8449cc; /* Brand indigo */
+  --sem-color-border-primary-light-emphasis-subtle: #996cd5; /* Brand indigo */
+  --sem-color-border-primary-light-minimal: #d4bfec;
+  --sem-color-border-primary-light-minimal-alt: #2a1c4a;
+  --sem-color-border-primary-dark-default: #ff80ff;
+  --sem-color-border-primary-dark-subtle: #ffe4ff;
+  --sem-color-border-primary-dark-strong: #ffb7fe;
+  --sem-color-border-primary-dark-emphasis: #fd51ff;
+  --sem-color-border-primary-dark-minimal: #7e0091;
+  --sem-color-border-secondary-light-default: #2a2a2a;
+  --sem-color-border-secondary-light-subtle: #949494;
+  --sem-color-border-secondary-light-strong: #6b6b6b;
+  --sem-color-border-secondary-light-minimal: #c8c8c8;
+  --sem-color-border-secondary-light-alt: #ffffff;
+  --sem-color-border-secondary-light-default-alt: #2a2a2a;
+  --sem-color-border-secondary-light-muted: #c8c8c8;
+  --sem-color-border-secondary-dark-default: #ffffff;
+  --sem-color-border-secondary-dark-strong: #c8c8c8;
+  --sem-color-border-secondary-dark-subtle: #808080;
+  --sem-color-border-secondary-dark-minimal: #6b6b6b;
+  --sem-color-border-secondary-dark-alt: #2a2a2a;
+  --sem-color-border-secondary-dark-muted: #6b6b6b;
+  --sem-color-border-tertiary-light-default: #5514b4; /* Used: Progress-stepper /  */
+  --sem-color-border-tertiary-dark-default: #996cd5;
+  --sem-color-bg-primary-light-default: #5514b4; /* Brand indigo */
+  --sem-color-bg-primary-light-default-alt: #5514b4; /* Brand indigo */
+  --sem-color-bg-primary-light-default-strong: #5514b4; /* Brand indigo */
+  --sem-color-bg-primary-light-subtle: #3f187f; /* Brand indigo */
+  --sem-color-bg-primary-light-strong: #3f187f; /* Brand indigo */
+  --sem-color-bg-primary-light-emphasis: #8449cc; /* Brand indigo */
+  --sem-color-bg-primary-light-minimal: #f8efff; /* Brand indigo */
+  --sem-color-bg-primary-light-subtle-alt: #efe5f7; /* Brand indigo */
+  --sem-color-bg-primary-light-minimal-alt: #2a1c4a;
+  --sem-color-bg-primary-dark-default: #ff80ff;
+  --sem-color-bg-primary-dark-strong: #ffb7fe;
+  --sem-color-bg-primary-dark-subtle: #ffe4ff;
+  --sem-color-bg-primary-dark-emphasis: #fd51ff;
+  --sem-color-bg-primary-dark-minimal: #fbf1f8;
+  --sem-color-bg-primary-dark-minimal-alt: #fbf1f8;
+  --sem-color-bg-secondary-light-default: #ffffff;
+  --sem-color-bg-secondary-light-default-alt: #f7f7f7;
+  --sem-color-bg-secondary-light-subtle: #949494;
+  --sem-color-bg-secondary-light-strong: #6b6b6b;
+  --sem-color-bg-secondary-light-minimal: #c8c8c8;
+  --sem-color-bg-secondary-light-muted: #f0f0f0;
+  --sem-color-bg-secondary-light-minimal-alt: #ffffff;
+  --sem-color-bg-secondary-light-muted-alt: #e3e3e3;
+  --sem-color-bg-secondary-light-muted-subtle: #ffffff;
+  --sem-color-bg-secondary-light-alt: #2a2a2a;
+  --sem-color-bg-secondary-light-strong-alt: #000000;
+  --sem-color-bg-secondary-dark-default: #000000;
+  --sem-color-bg-secondary-dark-strong: #d9d9d9;
+  --sem-color-bg-secondary-dark-alt: #ffffff;
+  --sem-color-bg-secondary-dark-strong-alt: #ffffff;
+  --sem-color-bg-secondary-dark-subtle: #949494;
+  --sem-color-bg-secondary-dark-minimal: #6b6b6b;
+  --sem-color-bg-secondary-dark-minimal-alt: #000000;
+  --sem-color-bg-secondary-dark-muted: #434343;
+  --sem-color-bg-secondary-dark-muted-alt: #2a2a2a;
+  --sem-color-bg-tertiary-warning-default: #da020f;
+  --sem-color-bg-tertiary-warning-subtle: #c90104;
+  --sem-color-bg-tertiary-warning-strong: #ab0000;
+  --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: #da020f; /* Used: progress-bar /  */
+  --sem-color-bg-tertiary-status-light-success-alt: #088003; /* Used: progress-bar /  */
+  --sem-color-fg-primary-light-default: #5514b4;
+  --sem-color-fg-primary-light-subtle: #3f187f;
+  --sem-color-fg-primary-light-strong: #3f187f;
+  --sem-color-fg-primary-light-emphasis: #8449cc; /* Brand indigo */
+  --sem-color-fg-primary-light-vibrant: #f200f5; /* Brand indigo */
+  --sem-color-fg-primary-light-minimal: #2a1c4a;
+  --sem-color-fg-primary-light-default-alt: #5514b4;
+  --sem-color-fg-primary-light-subtle-alt: #ffffff;
+  --sem-color-fg-primary-dark-default: #ff80ff;
+  --sem-color-fg-primary-dark-subtle: #ffe4ff;
+  --sem-color-fg-primary-dark-strong: #ffb7fe;
+  --sem-color-fg-primary-dark-emphasis: #fd51ff;
+  --sem-color-fg-primary-dark-vibrant: #ff80ff; /* Brand indigo */
+  --sem-color-fg-secondary-light-default: #2a2a2a;
+  --sem-color-fg-secondary-light-subtle: #949494;
+  --sem-color-fg-secondary-light-strong: #6b6b6b;
+  --sem-color-fg-secondary-light-minimal: #c8c8c8;
+  --sem-color-fg-secondary-light-muted: #434343;
+  --sem-color-fg-secondary-light-alt: #ffffff;
+  --sem-color-fg-secondary-light-default-alt: #ffffff;
+  --sem-color-fg-secondary-light-subtle-alt: #949494;
+  --sem-color-fg-secondary-light-minimal-alt: #ffffff;
+  --sem-color-fg-secondary-light-strong-alt: #000000;
+  --sem-color-fg-secondary-light-muted-alt: #6b6b6b;
+  --sem-color-fg-secondary-light-strong-subtle: #ffffff;
+  --sem-color-fg-secondary-dark-default: #ffffff;
+  --sem-color-fg-secondary-dark-muted: #e3e3e3;
+  --sem-color-fg-secondary-dark-strong: #c8c8c8;
+  --sem-color-fg-secondary-dark-subtle: #949494;
+  --sem-color-fg-secondary-dark-subtle-alt: #949494;
+  --sem-color-fg-secondary-dark-minimal: #6b6b6b;
+  --sem-color-fg-secondary-dark-minimal-alt: #000000;
+  --sem-color-fg-secondary-dark-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: #fa9590;
+  --sem-color-text-primary-light-default: #5514b4;
+  --sem-color-text-primary-light-hover: #2a1c4a;
+  --sem-color-text-primary-light-default-alt: #ffffff;
+  --sem-color-text-primary-light-default-strong: #ffffff;
+  --sem-color-text-primary-light-emphasis: #ff80ff;
+  --sem-color-text-primary-light-subtle: #6b6b6b;
+  --sem-color-text-primary-light-strong: #2a2a2a;
+  --sem-color-text-primary-dark-default: #ffffff;
+  --sem-color-text-primary-dark-default-alt: #efe5f7;
+  --sem-color-text-primary-dark-strong: #ffffff;
+  --sem-color-text-primary-dark-strong-alt: #ffe4ff;
+  --sem-color-text-secondary-light-default: #5514b4;
+  --sem-color-text-secondary-light-hover: #2a1c4a;
+  --sem-color-text-secondary-light-default-alt: #ffffff;
+  --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: #efe5f7;
+  --sem-color-text-secondary-dark-strong: #ffffff;
+  --sem-color-text-secondary-dark-strong-alt: #ffe4ff;
+  --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: 0;
+  --sem-scale-modifier-2: 0;
+  --sem-scale-modifier-3: 0;
+  --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: 4px;
+  --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: #ffffff;
+  --select-colors-light-bg-disabled: #f0f0f0;
+  --select-colors-light-bg-error: #ffe9ec;
+  --select-colors-light-bg-hover-alt: #ffffff;
+  --select-colors-light-bg-selected: #efe5f7;
+  --select-colors-light-border-default: #2a2a2a;
+  --select-colors-light-border-hover: #3f187f;
+  --select-colors-light-border-focus: #8449cc;
+  --select-colors-light-border-disabled: #949494;
+  --select-colors-light-border-error: #da020f;
+  --select-colors-light-border-subtle: #c8c8c8;
+  --select-colors-light-fg-default: #2a2a2a;
+  --select-colors-light-fg-disabled: #6b6b6b;
+  --select-colors-light-fg-subtle: #c8c8c8;
+  --select-colors-light-fg-error: #da020f;
+  --select-colors-light-text-default: #2a2a2a;
+  --select-colors-light-text-default-alt: #ffffff;
+  --select-colors-light-text-disabled: #6b6b6b;
+  --select-colors-light-text-error: #da020f;
+  --select-colors-dark-bg-default: #000000;
+  --select-colors-dark-bg-hover: #000000;
+  --select-colors-dark-bg-disabled: #434343;
+  --select-colors-dark-bg-error: #401313;
+  --select-colors-dark-bg-hover-alt: #ffb7fe;
+  --select-colors-dark-bg-selected: #fbf1f8;
+  --select-colors-dark-border-strong: #ffffff;
+  --select-colors-dark-border-hover: #ffb7fe;
+  --select-colors-dark-border-focus: #fd51ff;
+  --select-colors-dark-border-disabled: #808080;
+  --select-colors-dark-border-error: #fa9590;
+  --select-colors-dark-border-subtle: #6b6b6b;
+  --select-colors-dark-text-default: #ffffff;
+  --select-colors-dark-text-disabled: #c8c8c8;
+  --select-colors-dark-text-error: #fa9590;
+  --select-colors-dark-fg-default: #ffffff;
+  --select-colors-dark-fg-disabled: #c8c8c8;
+  --select-colors-dark-fg-subtle: #6b6b6b;
+  --select-colors-dark-fg-error: #fa9590;
+  --select-border-radius-test-s: 0px;
+  --select-border-radius-test-m: 0px;
+  --select-border-radius-test-l: 0px;
+  --checkbox-size-s: 24px;
+  --checkbox-size-l: 36px;
+  --checkbox-padding-s: 2px;
+  --checkbox-gap-s: 8px;
+  --checkbox-gap-m: 12px;
+  --checkbox-border-radius-xs: 4px;
+  --checkbox-border-radius-s: 4px;
+  --checkbox-border-weight-s: 2px;
+  --checkbox-size-icon-s: 20px;
+  --checkbox-size-icon-m: 32px;
+  --checkbox-colors-light-bg-default: #5514b4;
+  --checkbox-colors-light-bg-default-alt: #ffffff;
+  --checkbox-colors-light-bg-disabled: #f0f0f0;
+  --checkbox-colors-light-bg-error: #ffe9ec;
+  --checkbox-colors-light-fg-default: #ffffff;
+  --checkbox-colors-light-fg-disabled: #6b6b6b;
+  --checkbox-colors-light-border-default: #2a2a2a;
+  --checkbox-colors-light-border-disabled: #949494;
+  --checkbox-colors-light-border-error: #da020f;
+  --checkbox-colors-light-text-default: #2a2a2a;
+  --checkbox-colors-light-text-disabled: #6b6b6b;
+  --checkbox-colors-dark-bg-default: #ff80ff;
+  --checkbox-colors-dark-bg-default-alt: #000000;
+  --checkbox-colors-dark-bg-disabled: #434343;
+  --checkbox-colors-dark-bg-error: #401313;
+  --checkbox-colors-dark-fg-default: #2a2a2a;
+  --checkbox-colors-dark-fg-disabled: #c8c8c8;
+  --checkbox-colors-dark-border-default: #ffffff;
+  --checkbox-colors-dark-border-disabled: #808080;
+  --checkbox-colors-dark-border-error: #fa9590;
+  --checkbox-colors-dark-text-default: #ffffff;
+  --checkbox-colors-dark-text-disabled: #c8c8c8;
+  --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: #f0f0f0;
+  --radio-colors-light-border-default: #2a2a2a;
+  --radio-colors-light-border-disabled: #949494;
+  --radio-colors-light-fg-default: #5514b4;
+  --radio-colors-light-fg-disabled: #6b6b6b;
+  --radio-colors-light-text-default: #2a2a2a;
+  --radio-colors-light-text-disabled: #6b6b6b;
+  --radio-colors-dark-bg-default: #000000;
+  --radio-colors-dark-bg-disabled: #434343;
+  --radio-colors-dark-border-default: #ffffff;
+  --radio-colors-dark-border-disabled: #808080;
+  --radio-colors-dark-fg-default: #ff80ff;
+  --radio-colors-dark-fg-disabled: #c8c8c8;
+  --radio-colors-dark-text-default: #ffffff;
+  --radio-colors-dark-text-disabled: #c8c8c8;
+  --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: 4px;
+  --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: #3f187f;
+  --date-picker-colors-light-bg-selected: #2a1c4a;
+  --date-picker-colors-light-bg-pressed: #2a1c4a;
+  --date-picker-colors-light-bg-disabled: #f0f0f0;
+  --date-picker-colors-light-bg-error: #ffe9ec;
+  --date-picker-colors-light-bg-subtle: #efe5f7;
+  --date-picker-colors-light-bg-hover-alt: #f0f0f0;
+  --date-picker-colors-light-border-hover: #3f187f;
+  --date-picker-colors-light-border-focus: #8449cc;
+  --date-picker-colors-light-border-selected: #2a1c4a;
+  --date-picker-colors-light-border-disabled: #949494;
+  --date-picker-colors-light-border-error: #da020f;
+  --date-picker-colors-light-border-strong: #2a2a2a;
+  --date-picker-colors-light-fg-default-alt: #ffffff;
+  --date-picker-colors-light-fg-hover: #3f187f;
+  --date-picker-colors-light-fg-strong: #2a2a2a;
+  --date-picker-colors-light-fg-disabled: #6b6b6b;
+  --date-picker-colors-light-fg-error: #da020f;
+  --date-picker-colors-light-text-default: #5514b4;
+  --date-picker-colors-light-text-default-alt: #ffffff;
+  --date-picker-colors-light-text-strong: #2a2a2a;
+  --date-picker-colors-light-text-disabled: #6b6b6b;
+  --date-picker-colors-light-text-error: #da020f;
+  --date-picker-colors-light-text-hint: #6b6b6b;
+  --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: #5514b4;
+  --switch-colors-light-bg-disabled: #f0f0f0;
+  --switch-colors-light-bg-strong: #ffffff;
+  --switch-colors-light-bg-subtle: #f0f0f0;
+  --switch-colors-light-border-default: #5514b4;
+  --switch-colors-light-border-disabled: #949494;
+  --switch-colors-light-border-strong: #2a2a2a;
+  --switch-colors-light-fg-default: #5514b4;
+  --switch-colors-light-fg-disabled: #6b6b6b;
+  --switch-colors-light-text-default: #2a2a2a;
+  --switch-colors-light-text-disabled: #6b6b6b;
+  --switch-colors-dark-bg-default: #ff80ff;
+  --switch-colors-dark-bg-disabled: #434343;
+  --switch-colors-dark-bg-strong: #000000;
+  --switch-colors-dark-bg-subtle: #2a2a2a;
+  --switch-colors-dark-border-default: #ff80ff;
+  --switch-colors-dark-border-disabled: #808080;
+  --switch-colors-dark-border-strong: #ffffff;
+  --switch-colors-dark-fg-default: #ff80ff;
+  --switch-colors-dark-fg-disabled: #c8c8c8;
+  --switch-colors-dark-text-default: #ffffff;
+  --switch-colors-dark-text-disabled: #c8c8c8;
+  --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: 4px;
+  --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: #ffffff;
+  --textinput-colors-light-bg-disabled: #f0f0f0;
+  --textinput-colors-light-bg-error: #ffe9ec;
+  --textinput-colors-light-border-default: #2a2a2a;
+  --textinput-colors-light-border-hover: #3f187f;
+  --textinput-colors-light-border-focus: #8449cc;
+  --textinput-colors-light-border-disabled: #949494;
+  --textinput-colors-light-border-error: #da020f;
+  --textinput-colors-light-text-default: #2a2a2a;
+  --textinput-colors-light-text-disabled: #6b6b6b;
+  --textinput-colors-light-text-error: #da020f;
+  --textinput-colors-light-fg-default: #2a2a2a;
+  --textinput-colors-light-fg-error: #da020f;
+  --textinput-colors-dark-bg-default: #000000;
+  --textinput-colors-dark-bg-hover: #000000;
+  --textinput-colors-dark-bg-disabled: #434343;
+  --textinput-colors-dark-bg-error: #401313;
+  --textinput-colors-dark-border-default: #ffffff;
+  --textinput-colors-dark-border-hover: #ffb7fe;
+  --textinput-colors-dark-border-focus: #fd51ff;
+  --textinput-colors-dark-border-disabled: #808080;
+  --textinput-colors-dark-border-error: #fa9590;
+  --textinput-colors-dark-text-default: #ffffff;
+  --textinput-colors-dark-text-disabled: #c8c8c8;
+  --textinput-colors-dark-text-error: #fa9590;
+  --textinput-colors-dark-fg-default: #ffffff;
+  --textinput-colors-dark-fg-error: #fa9590;
+  --textarea-padding-s: 10px;
+  --textarea-padding-m: 12px;
+  --textarea-size-icon-s: 16px;
+  --textarea-border-radius-s: 4px;
+  --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: #ffffff;
+  --textarea-colors-light-bg-disabled: #f0f0f0;
+  --textarea-colors-light-bg-error: #ffe9ec;
+  --textarea-colors-light-border-default: #2a2a2a;
+  --textarea-colors-light-border-hover: #3f187f;
+  --textarea-colors-light-border-focus: #8449cc;
+  --textarea-colors-light-border-error: #da020f;
+  --textarea-colors-light-border-disabled: #949494;
+  --textarea-colors-light-fg-default: #2a2a2a;
+  --textarea-colors-light-fg-disabled: #6b6b6b;
+  --textarea-colors-light-fg-error: #da020f;
+  --textarea-colors-light-text-default: #2a2a2a;
+  --textarea-colors-light-text-disabled: #6b6b6b;
+  --textarea-colors-light-text-error: #da020f;
+  --textarea-colors-dark-fg-default: #ffffff;
+  --textarea-colors-dark-fg-disabled: #c8c8c8;
+  --textarea-colors-dark-fg-error: #fa9590;
+  --textarea-colors-dark-bg-default: #000000;
+  --textarea-colors-dark-bg-hover: #000000;
+  --textarea-colors-dark-bg-disabled: #434343;
+  --textarea-colors-dark-bg-error: #401313;
+  --textarea-colors-dark-border-strong: #ffffff;
+  --textarea-colors-dark-border-hover: #ffb7fe;
+  --textarea-colors-dark-border-focus: #fd51ff;
+  --textarea-colors-dark-border-disabled: #808080;
+  --textarea-colors-dark-border-error: #fa9590;
+  --textarea-colors-dark-text-strong: #ffffff;
+  --textarea-colors-dark-text-disabled: #c8c8c8;
+  --textarea-colors-dark-text-error: #fa9590;
+  --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: #5514b4;
+  --backtotop-colors-light-bg-hover: #3f187f;
+  --backtotop-colors-light-bg-selected: #2a1c4a;
+  --backtotop-colors-light-bg-strong: #ffffff;
+  --backtotop-colors-light-bg-subtle: #f0f0f0;
+  --backtotop-colors-light-border-default: #5514b4;
+  --backtotop-colors-light-border-hover: #3f187f;
+  --backtotop-colors-light-border-selected: #2a1c4a;
+  --backtotop-colors-light-border-strong: #ffffff;
+  --backtotop-colors-light-border-focus: #8449cc;
+  --backtotop-colors-light-fg-default: #5514b4;
+  --backtotop-colors-light-fg-default-alt: #ffffff;
+  --backtotop-colors-light-text-default: #5514b4;
+  --backtotop-colors-light-text-default-alt: #ffffff;
+  --backtotop-colors-dark-bg-default: #ff80ff;
+  --backtotop-colors-dark-bg-hover: #ffb7fe;
+  --backtotop-colors-dark-bg-selected: #fbf1f8;
+  --backtotop-colors-dark-bg-strong: #000000;
+  --backtotop-colors-dark-bg-subtle: #2a2a2a;
+  --backtotop-colors-dark-border-default: #ff80ff;
+  --backtotop-colors-dark-border-hover: #ffb7fe;
+  --backtotop-colors-dark-border-selected: #fbf1f8;
+  --backtotop-colors-dark-border-strong: #2a2a2a;
+  --backtotop-colors-dark-border-focus: #fd51ff;
+  --backtotop-colors-dark-fg-default: #2a2a2a;
+  --backtotop-colors-dark-fg-default-alt: #ffffff;
+  --backtotop-colors-dark-text-default: #2a2a2a;
+  --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: #f0f0f0;
+  --tabs-colors-light-bg-error: #ffc8cb;
+  --tabs-colors-light-border-subtle: #c8c8c8;
+  --tabs-colors-light-border-selected: #2a1c4a;
+  --tabs-colors-light-border-focus: #8449cc;
+  --tabs-colors-light-border-error: #da020f;
+  --tabs-colors-light-fg-default: #5514b4;
+  --tabs-colors-light-fg-hover: #3f187f;
+  --tabs-colors-light-fg-selected: #2a1c4a;
+  --tabs-colors-light-text-default: #5514b4;
+  --tabs-colors-light-text-hover: #3f187f;
+  --tabs-colors-light-text-selected: #2a1c4a;
+  --tabs-colors-light-text-strong: #2a2a2a;
+  --tabs-colors-dark-bg-default: #000000;
+  --tabs-colors-dark-bg-subtle: #2a2a2a;
+  --tabs-colors-dark-bg-error: #ab0000;
+  --tabs-colors-dark-border-subtle: #6b6b6b;
+  --tabs-colors-dark-border-selected: #fbf1f8;
+  --tabs-colors-dark-border-focus: #fd51ff;
+  --tabs-colors-dark-border-error: #da020f;
+  --tabs-colors-dark-fg-default: #ff80ff;
+  --tabs-colors-dark-fg-hover: #ffb7fe;
+  --tabs-colors-dark-fg-selected: #fbf1f8;
+  --tabs-colors-dark-fg-strong: #ffffff;
+  --tabs-colors-dark-text-default: #ffffff;
+  --tabs-colors-dark-text-hover: #ffb7fe;
+  --tabs-colors-dark-text-selected: #fbf1f8;
+  --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: #3f187f;
+  --pagination-colors-light-bg-selected: #2a1c4a;
+  --pagination-colors-light-bg-pressed: #2a1c4a;
+  --pagination-colors-light-bg-subtle: #c8c8c8;
+  --pagination-colors-light-border-focus: #8449cc;
+  --pagination-colors-light-text-default: #ffffff;
+  --pagination-colors-light-text-strong: #2a2a2a;
+  --pagination-colors-light-fg-default: #5514b4;
+  --pagination-colors-light-fg-default-alt: #ffffff;
+  --pagination-colors-dark-bg-hover: #ffb7fe;
+  --pagination-colors-dark-bg-selected: #fbf1f8;
+  --pagination-colors-dark-bg-pressed: #fbf1f8;
+  --pagination-colors-dark-border-focus: #fd51ff;
+  --pagination-colors-dark-text-default: #2a2a2a;
+  --pagination-colors-dark-text-strong: #ffffff;
+  --pagination-colors-dark-fg-default: #ff80ff;
+  --pagination-colors-dark-fg-default-alt: #2a2a2a;
+  --pagination-size-icon-m: 32px;
+  --pagination-gap-s: 4px;
+  --pagination-gap-m: 16px;
+  --breadcrumb-size-icon-s: 12px;
+  --breadcrumb-colors-light-fg-strong: #2a2a2a;
+  --breadcrumb-colors-light-text-default: #5514b4;
+  --breadcrumb-colors-light-text-hover: #3f187f;
+  --breadcrumb-colors-light-text-strong: #2a2a2a;
+  --breadcrumb-colors-dark-fg-strong: #ffffff;
+  --breadcrumb-colors-dark-text-default: #ff80ff;
+  --breadcrumb-colors-dark-text-hover: #ffb7fe;
+  --breadcrumb-colors-dark-text-strong: #ffffff;
+  --breadcrumb-gap-xs: 6px;
+  --breadcrumb-gap-s: 8px;
+  --box-padding-s: 16px;
+  --box-border-radius-s: 8px;
+  --box-border-weight-xs: 1px;
+  --box-border-weight-s: 2px;
+  --box-colors-light-bg-default: #ffffff;
+  --box-colors-light-bg-subtle: #f0f0f0;
+  --box-colors-light-bg-error-subtle: #ffc8cb;
+  --box-colors-light-bg-minimal: #f7f7f7;
+  --box-colors-light-bg-error: #da020f;
+  --box-colors-light-fg-strong: #2a2a2a;
+  --box-colors-light-border-subtle: #c8c8c8;
+  --box-colors-light-border-error: #da020f;
+  --box-colors-light-text-strong: #2a2a2a;
+  --box-colors-dark-bg-default: #000000;
+  --box-colors-dark-bg-subtle: #434343;
+  --box-colors-dark-bg-minimal: #2a2a2a;
+  --box-colors-dark-bg-default-alt: #5514b4;
+  --box-colors-dark-border-subtle: #6b6b6b;
+  --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: #5514b4;
+  --disclosure-mini-colors-light-text-default: #5514b4;
+  --disclosure-mini-colors-light-text-strong: #2a2a2a;
+  --disclosure-mini-colors-dark-fg-default: #ff80ff;
+  --disclosure-mini-colors-dark-text-default: #ff80ff;
+  --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: #f0f0f0;
+  --disclosure-colors-light-border-subtle: #c8c8c8;
+  --disclosure-colors-light-fg-default: #5514b4;
+  --disclosure-colors-light-fg-hover: #3f187f;
+  --disclosure-colors-light-text-default: #5514b4;
+  --disclosure-colors-light-text-hover: #3f187f;
+  --disclosure-colors-dark-bg-hover: #2a2a2a;
+  --disclosure-colors-dark-border-subtle: #6b6b6b;
+  --disclosure-colors-dark-fg-default: #ff80ff;
+  --disclosure-colors-dark-fg-hover: #ffb7fe;
+  --disclosure-colors-dark-text-default: #ff80ff;
+  --disclosure-colors-dark-text-hover: #ffb7fe;
+  --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: #5514b4;
+  --avatar-colors-light-fg-default-alt: #ffffff;
+  --avatar-colors-light-text-default-alt: #ffffff;
+  --modal-size-s: 288px;
+  --modal-size-m: 384px;
+  --modal-size-l: 472px;
+  --modal-size-xl: 591px;
+  --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: 8px;
+  --modal-colors-light-bg-default: #ffffff;
+  --modal-colors-light-text-default: #2a2a2a;
+  --modal-colors-light-fg-default: #2a2a2a;
+  --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: #5514b4;
+  --stepper-colors-light-bg-subtle: #c8c8c8;
+  --stepper-colors-light-bg-error: #da020f;
+  --stepper-colors-light-bg-warning: #ffa200;
+  --stepper-colors-light-bg-error-subtle: #ffe9ec;
+  --stepper-colors-light-bg-warning-subtle: #fef6de;
+  --stepper-colors-light-border-default: #5514b4;
+  --stepper-colors-light-border-subtle: #c8c8c8;
+  --stepper-colors-light-border-error: #da020f;
+  --stepper-colors-light-border-warning: #ffa200;
+  --stepper-colors-light-border-variant: #5514b4;
+  --stepper-colors-light-fg-default: #5514b4;
+  --stepper-colors-light-fg-default-alt: #ffffff;
+  --stepper-colors-light-fg-error: #da020f;
+  --stepper-colors-light-fg-warning: #ffa200;
+  --stepper-colors-light-fg-variant: #5514b4;
+  --stepper-colors-light-text-default: #2a2a2a;
+  --stepper-colors-light-text-hover: #3f187f;
+  --stepper-colors-light-text-subtle: #6b6b6b;
+  --stepper-colors-dark-bg-default: #ff80ff;
+  --stepper-colors-dark-bg-subtle: #6b6b6b;
+  --stepper-colors-dark-bg-strong: #ffffff;
+  --stepper-colors-dark-bg-error: #fa9590;
+  --stepper-colors-dark-bg-warning: #ffc501;
+  --stepper-colors-dark-bg-error-subtle: #401313;
+  --stepper-colors-dark-bg-warning-subtle: #332700;
+  --stepper-colors-dark-border-default: #ff80ff;
+  --stepper-colors-dark-border-subtle: #6b6b6b;
+  --stepper-colors-dark-border-strong: #ffffff;
+  --stepper-colors-dark-border-error: #fa9590;
+  --stepper-colors-dark-border-warning: #ffc501;
+  --stepper-colors-dark-border-variant: #ff80ff;
+  --stepper-colors-dark-fg-default: #ff80ff;
+  --stepper-colors-dark-fg-default-alt: #2a2a2a;
+  --stepper-colors-dark-fg-strong: #ffffff;
+  --stepper-colors-dark-fg-error: #fa9590;
+  --stepper-colors-dark-fg-warning: #ffc501;
+  --stepper-colors-dark-fg-variant: #ff80ff;
+  --stepper-colors-dark-text-default: #ffffff;
+  --stepper-colors-dark-text-hover: #ffb7fe;
+  --stepper-colors-dark-text-subtle: #c8c8c8;
+  --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: #5514b4;
+  --progress-bar-colors-light-bg-default-alt: #f0f0f0;
+  --progress-bar-colors-light-bg-muted: #e3e3e3;
+  --progress-bar-colors-light-bg-error: #da020f;
+  --progress-bar-colors-light-bg-success: #088003;
+  --progress-bar-colors-light-text-default: #2a2a2a;
+  --progress-bar-colors-light-text-default-alt: #5514b4;
+  --progress-bar-colors-light-text-default-alt-hover: hsl(264 80% 31.4%);
+  --progress-bar-colors-light-text-error: #da020f;
+  --progress-bar-colors-light-text-error-hover: hsl(356 98.2% 30.2%);
+  --progress-bar-colors-light-text-success: #088003;
+  --progress-bar-colors-light-text-success-hover: hsl(118 95.4% 18%);
+  --progress-bar-colors-light-fg-default: #5514b4;
+  --progress-bar-colors-light-fg-default-hover: hsl(264 80% 31.4%);
+  --progress-bar-colors-light-fg-error: #da020f;
+  --progress-bar-colors-light-fg-error-hover: hsl(356 98.2% 30.2%);
+  --progress-bar-colors-light-fg-success: #088003;
+  --progress-bar-colors-light-fg-success-hover: hsl(118 95.4% 18%);
+  --progress-bar-colors-dark-bg-default: #ff80ff;
+  --progress-bar-colors-dark-bg-default-alt: #2a2a2a;
+  --progress-bar-colors-dark-bg-error: #fa9590;
+  --progress-bar-colors-dark-bg-success: #75c26c;
+  --progress-bar-colors-dark-fg-default: #ff80ff;
+  --progress-bar-colors-dark-fg-default-hover: hsl(300 100% 82.6%);
+  --progress-bar-colors-dark-fg-error: #fa9590;
+  --progress-bar-colors-dark-fg-error-hover: hsl(2.83 91.4% 88.6%);
+  --progress-bar-colors-dark-fg-success: #75c26c;
+  --progress-bar-colors-dark-fg-success-hover: hsl(114 41.3% 64.3%);
+  --progress-bar-colors-dark-text-default: #ffffff;
+  --progress-bar-colors-dark-text-default-alt: #ff80ff;
+  --progress-bar-colors-dark-text-default-alt-hover: hsl(300 100% 87.5%);
+  --progress-bar-colors-dark-text-error: #fa9590;
+  --progress-bar-colors-dark-text-error-hover: hsl(2.83 91.4% 88.6%);
+  --progress-bar-colors-dark-text-success: #75c26c;
+  --progress-bar-colors-dark-text-success-hover: hsl(114 41.3% 64.3%);
+  --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: #ffffff;
+  --toast-colors-status-light-border-error: #fa9590;
+  --toast-colors-status-light-border-warning: #ffc501;
+  --toast-colors-status-light-border-success: #75c26c;
+  --toast-colors-status-light-fg-default: #ffffff;
+  --toast-colors-status-light-fg-error: #fa9590;
+  --toast-colors-status-light-fg-warning: #ffa200;
+  --toast-colors-status-light-fg-success: #75c26c;
+  --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: #2a2a2a;
+  --toast-colors-status-dark-border-error: #da020f;
+  --toast-colors-status-dark-border-warning: #ffa200;
+  --toast-colors-status-dark-border-success: #088003;
+  --toast-colors-status-dark-fg-default: #2a2a2a;
+  --toast-colors-status-dark-fg-error: #da020f;
+  --toast-colors-status-dark-fg-warning: #2a2a2a;
+  --toast-colors-status-dark-fg-success: #088003;
+  --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: #ffffff;
+  --tag-colors-light-bg-hover: #ffffff;
+  --tag-colors-light-border-default: #c8c8c8;
+  --tag-colors-light-border-default-alt: #c8c8c8;
+  --tag-colors-light-border-hover: #c8c8c8;
+  --tag-colors-light-fg-default: #2a2a2a;
+  --tag-colors-light-fg-hover: #3f187f;
+  --tag-colors-light-text-default: #2a2a2a;
+  --tag-colors-light-text-hover: #3f187f;
+  --tag-size-icon-s: 16px;
+  --tag-size-icon-m: 20px;
+  --badge-size-s: 24px;
+  --badge-padding-s: 8px;
+  --badge-border-radius-s: 1000px;
+  --badge-colors-bg-default: #2a2a2a;
+  --badge-colors-bg-error: #da020f;
+  --badge-colors-bg-warning: #ffa200;
+  --badge-colors-bg-success: #088003;
+  --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: 8px;
+  --alert-padding-m: 10px;
+  --alert-border-radius-s: 4px;
+  --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: #f7f7f7;
+  --alert-colors-status-light-bg-subtle-error: #ffe9ec;
+  --alert-colors-status-light-bg-subtle-warning: #fef6de;
+  --alert-colors-status-light-bg-subtle-success: #e6f4e5;
+  --alert-colors-status-light-border-default: #2a2a2a;
+  --alert-colors-status-light-border-error: #da020f;
+  --alert-colors-status-light-border-warning: #ffa200;
+  --alert-colors-status-light-border-success: #088003;
+  --alert-colors-status-light-fg-default: #2a2a2a;
+  --alert-colors-status-light-text-default: #2a2a2a;
+  --alert-colors-status-dark-bg-subtle-default: #2a2a2a;
+  --alert-colors-status-dark-bg-subtle-error: #401313;
+  --alert-colors-status-dark-bg-subtle-warning: #332700;
+  --alert-colors-status-dark-bg-subtle-success: #233A20;
+  --alert-colors-status-dark-border-default: #f0f0f0;
+  --alert-colors-status-dark-border-error: #f91f14;
+  --alert-colors-status-dark-border-warning: #ffc501;
+  --alert-colors-status-dark-border-success: #75c26c;
+  --alert-colors-status-dark-fg-default: #f0f0f0;
+  --alert-colors-status-dark-text-default: #f0f0f0;
+  --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: #3f187f;
+  --segmented-control-colors-light-bg-selected: #2a1c4a;
+  --segmented-control-colors-light-fg-default: #5514b4;
+  --segmented-control-colors-light-fg-default-alt: #ffffff;
+  --segmented-control-colors-light-fg-focus: #8449cc;
+  --segmented-control-colors-light-border-focus: #8449cc;
+  --segmented-control-colors-light-border-subtle: #c8c8c8;
+  --segmented-control-colors-light-text-default: #5514b4;
+  --segmented-control-colors-light-text-default-alt: #ffffff;
+  --segmented-control-colors-light-text-focus: #8449cc;
+  --rule-colors-light-border-subtle: #c8c8c8;
+  --rule-colors-dark-border-subtle: #6b6b6b;
+  --rule-border-weight-s: 1px;
+  --logos-size-m: 40px;
+  --logos-colors-light-fg-default: #5514b4;
+  --logos-colors-light-fg-strong: #2a2a2a;
+  --logos-colors-light-fg-variant: linear-gradient(90deg, #5514b4 8.33%, #7e2ec6 100%);
+  --logos-colors-dark-fg-default: #ff80ff;
+  --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: #5514b4;
+  --textlink-colors-light-fg-hover: #3f187f;
+  --textlink-colors-light-fg-visited: #8449cc;
+  --textlink-colors-light-text-default: #5514b4;
+  --textlink-colors-light-text-hover: #3f187f;
+  --textlink-colors-light-text-visited: #8449cc;
+  --textlink-colors-dark-fg-default: #ff80ff;
+  --textlink-colors-dark-fg-hover: #ffb7fe;
+  --textlink-colors-dark-fg-visited: #fd51ff;
+  --textlink-colors-dark-text-default: #ff80ff;
+  --textlink-colors-dark-text-hover: #ffb7fe;
+  --textlink-colors-dark-text-visited: #fd51ff;
+  --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: #5514b4;
+  --siteheader-colors-light-fg-default: #ffffff;
+  --siteheader-colors-light-fg-default-alt: #2a2a2a;
+  --siteheader-colors-light-text-default: #ffffff;
+  --siteheader-colors-light-text-default-alt: #2a2a2a;
+  --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: #5514b4;
+  --sitefooter-colors-light-fg-default: #ffffff;
+  --sitefooter-colors-light-fg-default-alt: #ffffff;
+  --sitefooter-colors-light-border-subtle: #996cd5;
+  --sitefooter-colors-light-text-default: #ff80ff;
+  --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: 8px;
+  --header-menu-border-radius-l: 8px;
+  --header-menu-border-radius-xl: 8px;
+  --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: #2a2a2a;
+  --header-menu-colors-light-bg-default-alt: #ffffff;
+  --header-menu-colors-light-fg-default: #5514b4;
+  --header-menu-colors-light-fg-default-alt: #ffffff;
+  --header-menu-colors-light-fg-strong: #2a2a2a;
+  --header-menu-colors-light-border-strong-alt-copy: #2a2a2a;
+  --header-menu-colors-light-text-default: #5514b4;
+  --header-menu-colors-light-text-default-alt: #ffffff;
+  --header-menu-colors-light-text-strong: #2a2a2a;
+  --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: 8px;
+  --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: #5514b4;
+  --button-v2-colors-light-bg-hover: #3f187f;
+  --button-v2-colors-light-bg-pressed: #2a1c4a;
+  --button-v2-colors-light-bg-disabled: #f0f0f0;
+  --button-v2-colors-light-bg-strong: #f0f0f0;
+  --button-v2-colors-light-bg-subtle: #e3e3e3;
+  --button-v2-colors-light-bg-minimal: #ffffff;
+  --button-v2-colors-light-border-default: #5514b4;
+  --button-v2-colors-light-border-pressed: #2a1c4a;
+  --button-v2-colors-light-border-disabled: #949494;
+  --button-v2-colors-light-fg-default: #5514b4;
+  --button-v2-colors-light-fg-default-alt: #ffffff;
+  --button-v2-colors-light-fg-default-strong: #5514b4;
+  --button-v2-colors-light-fg-hover: #3f187f;
+  --button-v2-colors-light-fg-pressed: #2a1c4a;
+  --button-v2-colors-light-fg-disabled: #6b6b6b;
+  --button-v2-colors-light-fg-strong-subtle: #949494;
+  --button-v2-colors-light-text-default: #5514b4;
+  --button-v2-colors-light-text-default-alt: #ffffff;
+  --button-v2-colors-light-text-hover: #3f187f;
+  --button-v2-colors-light-text-pressed: #2a1c4a;
+  --button-v2-colors-light-text-disabled: #6b6b6b;
+  --button-v2-colors-light-status-text-default: #ffffff;
+  --button-v2-colors-light-status-bg-default: #da020f;
+  --button-v2-colors-light-status-bg-hover: #c90104;
+  --button-v2-colors-light-status-bg-pressed: #ab0000;
+  --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: #ff80ff;
+  --button-v2-colors-dark-bg-hover: #ffb7fe;
+  --button-v2-colors-dark-bg-pressed: #fbf1f8;
+  --button-v2-colors-dark-bg-disabled: #434343;
+  --button-v2-colors-dark-bg-strong: #434343;
+  --button-v2-colors-dark-bg-hover-alt: #2a2a2a;
+  --button-v2-colors-dark-bg-subtle: #6b6b6b;
+  --button-v2-colors-dark-bg-minimal: #6b6b6b;
+  --button-v2-colors-dark-border-default: #ff80ff;
+  --button-v2-colors-dark-border-pressed: #fbf1f8;
+  --button-v2-colors-dark-border-disabled: #808080;
+  --button-v2-colors-dark-border-subtle: #6b6b6b;
+  --button-v2-colors-dark-fg-default: #ff80ff;
+  --button-v2-colors-dark-fg-default-alt: #2a2a2a;
+  --button-v2-colors-dark-fg-hover: #ffb7fe;
+  --button-v2-colors-dark-fg-pressed: #fbf1f8;
+  --button-v2-colors-dark-fg-disabled: #c8c8c8;
+  --button-v2-colors-dark-fg-strong: #c8c8c8;
+  --button-v2-colors-dark-fg-strong-subtle: #949494;
+  --button-v2-colors-dark-status-fg-default: #ffffff;
+  --button-v2-colors-dark-status-text-default: #ffffff;
+  --button-v2-colors-dark-status-bg-default: #ab0000;
+  --button-v2-colors-dark-status-bg-hover: #c90104;
+  --button-v2-colors-dark-status-bg-pressed: #da020f;
+  --button-v2-colors-dark-text-default: #ff80ff;
+  --button-v2-colors-dark-text-default-alt: #2a2a2a;
+  --button-v2-colors-dark-text-hover: #ffb7fe;
+  --button-v2-colors-dark-text-pressed: #fbf1f8;
+  --button-v2-colors-dark-text-disabled: #c8c8c8;
+  --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: 8px;
+  --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: #5514b4;
+  --hero-button-colors-light-bg-hover: #3f187f;
+  --hero-button-colors-light-bg-pressed: #2a1c4a;
+  --hero-button-colors-light-bg-disabled: #f0f0f0;
+  --hero-button-colors-light-bg-strong: #f0f0f0;
+  --hero-button-colors-light-bg-subtle: #e3e3e3;
+  --hero-button-colors-light-bg-minimal: #ffffff;
+  --hero-button-colors-light-border-default: #5514b4;
+  --hero-button-colors-light-border-pressed: #2a1c4a;
+  --hero-button-colors-light-border-disabled: #949494;
+  --hero-button-colors-light-fg-default: #5514b4;
+  --hero-button-colors-light-fg-default-alt: #ffffff;
+  --hero-button-colors-light-fg-default-strong: #5514b4;
+  --hero-button-colors-light-fg-hover: #3f187f;
+  --hero-button-colors-light-fg-pressed: #2a1c4a;
+  --hero-button-colors-light-fg-disabled: #6b6b6b;
+  --hero-button-colors-light-fg-strong-subtle: #949494;
+  --hero-button-colors-light-text-default: #5514b4;
+  --hero-button-colors-light-text-default-alt: #ffffff;
+  --hero-button-colors-light-text-hover: #3f187f;
+  --hero-button-colors-light-text-pressed: #2a1c4a;
+  --hero-button-colors-light-text-disabled: #6b6b6b;
+  --hero-button-colors-light-status-text-default: #ffffff;
+  --hero-button-colors-light-status-bg-default: #da020f;
+  --hero-button-colors-light-status-bg-hover: #c90104;
+  --hero-button-colors-light-status-bg-pressed: #ab0000;
+  --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: #ff80ff;
+  --hero-button-colors-dark-bg-hover: #ffb7fe;
+  --hero-button-colors-dark-bg-pressed: #fbf1f8;
+  --hero-button-colors-dark-bg-disabled: #434343;
+  --hero-button-colors-dark-bg-strong: #434343;
+  --hero-button-colors-dark-bg-hover-alt: #2a2a2a;
+  --hero-button-colors-dark-bg-subtle: #6b6b6b;
+  --hero-button-colors-dark-bg-minimal: #6b6b6b;
+  --hero-button-colors-dark-border-default: #ff80ff;
+  --hero-button-colors-dark-border-pressed: #fbf1f8;
+  --hero-button-colors-dark-border-disabled: #808080;
+  --hero-button-colors-dark-border-subtle: #6b6b6b;
+  --hero-button-colors-dark-fg-default: #ff80ff;
+  --hero-button-colors-dark-fg-default-alt: #2a2a2a;
+  --hero-button-colors-dark-fg-hover: #ffb7fe;
+  --hero-button-colors-dark-fg-pressed: #fbf1f8;
+  --hero-button-colors-dark-fg-disabled: #c8c8c8;
+  --hero-button-colors-dark-fg-strong: #c8c8c8;
+  --hero-button-colors-dark-fg-strong-subtle: #949494;
+  --hero-button-colors-dark-status-fg-default: #ffffff;
+  --hero-button-colors-dark-status-text-default: #ffffff;
+  --hero-button-colors-dark-status-bg-default: #ab0000;
+  --hero-button-colors-dark-status-bg-hover: #c90104;
+  --hero-button-colors-dark-status-bg-pressed: #da020f;
+  --hero-button-colors-dark-text-default: #ff80ff;
+  --hero-button-colors-dark-text-default-alt: #2a2a2a;
+  --hero-button-colors-dark-text-hover: #ffb7fe;
+  --hero-button-colors-dark-text-pressed: #fbf1f8;
+  --hero-button-colors-dark-text-disabled: #c8c8c8;
+  --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: 8px;
+  --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: #5514b4;
+  --button-colors-light-bg-hover: #3f187f;
+  --button-colors-light-bg-pressed: #2a1c4a;
+  --button-colors-light-bg-disabled: #f0f0f0;
+  --button-colors-light-border-default: #5514b4;
+  --button-colors-light-border-pressed: #2a1c4a;
+  --button-colors-light-border-disabled: #949494;
+  --button-colors-light-fg-default: #5514b4;
+  --button-colors-light-fg-default-alt: #ffffff;
+  --button-colors-light-fg-hover: #3f187f;
+  --button-colors-light-fg-pressed: #2a1c4a;
+  --button-colors-light-fg-disabled: #6b6b6b;
+  --button-colors-light-text-default: #5514b4;
+  --button-colors-light-text-default-alt: #ffffff;
+  --button-colors-light-text-hover: #3f187f;
+  --button-colors-light-text-pressed: #2a1c4a;
+  --button-colors-light-text-disabled: #6b6b6b;
+  --button-colors-dark-bg-default: #ff80ff;
+  --button-colors-dark-bg-hover: #ffb7fe;
+  --button-colors-dark-bg-pressed: #fbf1f8;
+  --button-colors-dark-bg-disabled: #434343;
+  --button-colors-dark-border-default: #ff80ff;
+  --button-colors-dark-border-pressed: #fbf1f8;
+  --button-colors-dark-border-disabled: #808080;
+  --button-colors-dark-fg-default: #ff80ff;
+  --button-colors-dark-fg-default-alt: #2a2a2a;
+  --button-colors-dark-fg-hover: #ffb7fe;
+  --button-colors-dark-fg-pressed: #fbf1f8;
+  --button-colors-dark-fg-disabled: #c8c8c8;
+  --button-colors-dark-text-default: #ff80ff;
+  --button-colors-dark-text-default-alt: #2a2a2a;
+  --button-colors-dark-text-hover: #ffb7fe;
+  --button-colors-dark-text-pressed: #fbf1f8;
+  --button-colors-dark-text-disabled: #c8c8c8;
+  --button-border-weight-s: 2px;
+  --focus-colors-light-border-subtle: #8449cc;
+  --focus-colors-dark-border-subtle: #fd51ff;
+  --focus-border-weight-s: 2px;
+  --focus-border-radius-s: 8px;
+  --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: #f0f0f0;
+  --universal-header-colors-light-fg-default: #2a2a2a;
+  --universal-header-colors-light-text-default: #2a2a2a;
+  --universal-header-colors-light-text-hover: #3f187f;
+  --card-colors-light-bg-default: #5514b4;
+  --card-colors-light-bg-default-alt: #ffffff;
+  --card-colors-light-bg-emphasis: linear-gradient(90deg, #fcf9ff 0%, #f9f9ff 100%);
+  --card-colors-light-fg-default: #5514b4;
+  --card-colors-light-fg-default-alt: #ffffff;
+  --card-colors-light-fg-hover: #3f187f;
+  --card-colors-light-border-default: #c8c8c8;
+  --card-colors-light-border-hover: #3f187f;
+  --card-colors-light-border-minimal: #d4bfec;
+  --card-colors-light-text-default: #2a2a2a;
+  --card-colors-light-text-hover: #3f187f;
+  --card-colors-light-text-support: #6b6b6b;
+  --card-colors-dark-bg-default: #ff80ff;
+  --card-colors-dark-bg-default-alt: #000000;
+  --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: #ffb7fe;
+  --card-colors-dark-text-default: #ffffff;
+  --card-colors-dark-text-hover: #ffb7fe;
+  --card-colors-dark-text-support: #e3e3e3;
+  --card-padding-s: 24px;
+  --card-padding-m: 32px;
+  --card-border-weight-s: 1px;
+  --card-border-weight-m: 2px;
+  --card-border-radius-s: 8px;
+  --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: #5514b4;
+  --surface-colors-bg-dark-neutral-01: #434343;
+  --surface-colors-bg-dark-neutral-02: #2a2a2a;
+  --surface-colors-bg-light-white: #ffffff;
+  --surface-colors-bg-light-neutral-01: #f7f7f7;
+  --surface-colors-bg-light-neutral-02: #f0f0f0;
+  --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: #000000;
+  --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: #d4bfec;
+  --filter-colors-light-border-hover: #3f187f;
+  --filter-colors-light-bg-default: #ffffff;
+  --filter-colors-light-bg-selected: #5514b4;
+  --filter-colors-light-text-default: #5514b4;
+  --filter-colors-light-text-default-alt: #ffffff;
+  --filter-colors-light-text-hover: #2a1c4a;
+  --filter-colors-dark-border-default: #996cd5;
+  --filter-colors-dark-border-hover: #3f187f;
+  --filter-colors-dark-bg-selected: #ffffff;
+  --filter-colors-dark-bg-default: #000000;
+  --filter-colors-dark-text-default: #5514b4;
+  --filter-colors-dark-text-default-alt: #efe5f7;
+  --filter-colors-dark-text-hover: #ffe4ff;
+  --filter-colors-dark-text-seleced: #2a1c4a;
+  --filter-gap-l: 16px;
+  --filter-margin-m: 16px;
+}