genesys-spark 4.80.0 → 4.81.0

package/dist/css/legacy/ui.css

@@ -1,12 +1,25 @@
 :root {
-  --gse-ui-color-focus: #aac9ff; /* Created to support the legacy border focus token */
-  --gse-ui-formControl-input-contentText: 400 12px/18px Roboto;
-  --gse-ui-formControl-input-default-border: 1px solid #6b7585;
-  --gse-ui-formControl-input-hover-border: 1px solid #2754ac;
-  --gse-ui-formControl-input-active-border: 1px solid #2a60c8;
-  --gse-ui-formControl-input-error-border: 1px solid #ea0b0b;
-  --gse-ui-formControl-input-disabled-border: 1px solid #6b7585;
-  --gse-ui-formControl-input-disabled-opacity: 0.5;
+  --gse-ui-color-focus: #aac9ff;
+  --gse-ui-formControl-input-contentText-fontFamily: Roboto;
+  --gse-ui-formControl-input-contentText-fontWeight: 400;
+  --gse-ui-formControl-input-contentText-fontSize: 12px;
+  --gse-ui-formControl-input-contentText-lineHeight: 18px;
+  --gse-ui-formControl-input-default-border-color: #6b7585;
+  --gse-ui-formControl-input-default-border-width: 1px;
+  --gse-ui-formControl-input-default-border-style: solid;
+  --gse-ui-formControl-input-hover-border-color: #2754ac;
+  --gse-ui-formControl-input-hover-border-width: 1px;
+  --gse-ui-formControl-input-hover-border-style: solid;
+  --gse-ui-formControl-input-active-border-color: #2a60c8;
+  --gse-ui-formControl-input-active-border-width: 1px;
+  --gse-ui-formControl-input-active-border-style: solid;
+  --gse-ui-formControl-input-error-border-color: #ea0b0b;
+  --gse-ui-formControl-input-error-border-width: 1px;
+  --gse-ui-formControl-input-error-border-style: solid;
+  --gse-ui-formControl-input-disabled-border-color: #6b7585;
+  --gse-ui-formControl-input-disabled-border-width: 1px;
+  --gse-ui-formControl-input-disabled-border-style: solid;
+  --gse-ui-formControl-input-disabled-opacity: .5;
   --gse-ui-formControl-input-borderRadius: 4px;
   --gse-ui-formControl-input-backgroundColor: #f6f7f9;
   --gse-ui-formControl-input-placeholderColor: #4c5667;
@@ -17,7 +30,10 @@
   --gse-ui-formControl-input-gap: 12px;
   --gse-ui-formControl-input-top: 8px;
   --gse-ui-formControl-input-padding: 8px 12px;
-  --gse-ui-formControl-input-prefixSufix-text: 700 14px/20px Roboto;
+  --gse-ui-formControl-input-prefixSufix-text-fontFamily: Roboto;
+  --gse-ui-formControl-input-prefixSufix-text-fontWeight: 700;
+  --gse-ui-formControl-input-prefixSufix-text-fontSize: 14px;
+  --gse-ui-formControl-input-prefixSufix-text-lineHeight: 20px;
   --gse-ui-formControl-input-prefixSufix-height: 32px;
   --gse-ui-formControl-input-prefixSufix-defaultColor: #4c5667;
   --gse-ui-formControl-input-textfield-height: 32px;
@@ -28,14 +44,25 @@
   --gse-ui-formControl-input-inputIcon-iconEndColor: #4c5667;
   --gse-ui-formControl-input-focusRing-defaultColor: #aac9ff;
   --gse-ui-formControl-input-textarea-height: 98px;
-  --gse-ui-formControl-input-focus-border: 2px solid #aac9ff;
+  --gse-ui-formControl-input-focus-border-color: #aac9ff;
+  --gse-ui-formControl-input-focus-border-width: 2px;
+  --gse-ui-formControl-input-focus-border-style: solid;
   --gse-ui-formControl-input-spinbuttonIcon-size: 16px;
   --gse-ui-formControl-input-focusSelection-backgroundColor: #aac9ff;
   --gse-ui-formControl-label-padding: 0 0 8px 0;
-  --gse-ui-formControl-label-text: 400 12px/18px Roboto;
-  --gse-ui-formControl-label-textBold: 600 12px/18px Roboto;
+  --gse-ui-formControl-label-text-fontFamily: Roboto;
+  --gse-ui-formControl-label-text-fontWeight: 400;
+  --gse-ui-formControl-label-text-fontSize: 12px;
+  --gse-ui-formControl-label-text-lineHeight: 18px;
+  --gse-ui-formControl-label-textBold-fontFamily: Roboto;
+  --gse-ui-formControl-label-textBold-fontWeight: 600;
+  --gse-ui-formControl-label-textBold-fontSize: 12px;
+  --gse-ui-formControl-label-textBold-lineHeight: 18px;
   --gse-ui-formControl-label-labelColor: #2e394c;
-  --gse-ui-formControl-label-indicator-text: 400 12px/18px Roboto;
+  --gse-ui-formControl-label-indicator-text-fontFamily: Roboto;
+  --gse-ui-formControl-label-indicator-text-fontWeight: 400;
+  --gse-ui-formControl-label-indicator-text-fontSize: 12px;
+  --gse-ui-formControl-label-indicator-text-lineHeight: 18px;
   --gse-ui-formControl-label-indicator-requiredColor: #ea0b0b;
   --gse-ui-formControl-label-indicator-optionalColor: #3e4a5b;
   --gse-ui-formControl-label-iconSize: 16px;
@@ -44,7 +71,10 @@
   --gse-ui-formControl-formField-gap: 4px;
   --gse-ui-formControl-group-gapItems: 8px;
   --gse-ui-formControl-helper-gap: 4px;
-  --gse-ui-formControl-helper-helperText: 400 12px/18px Roboto;
+  --gse-ui-formControl-helper-helperText-fontFamily: Roboto;
+  --gse-ui-formControl-helper-helperText-fontWeight: 400;
+  --gse-ui-formControl-helper-helperText-fontSize: 12px;
+  --gse-ui-formControl-helper-helperText-lineHeight: 18px;
   --gse-ui-formControl-helper-padding: 8px 0 0 0;
   --gse-ui-formControl-helper-icon-padding: 1px 0 1px 0;
   --gse-ui-formControl-helper-paddingSmall: 4px 0 0 0;
@@ -60,100 +90,129 @@
   --gse-ui-card-backgroundColor: #ffffff;
   --gse-ui-card-borderRadius: 4px;
   --gse-ui-card-borderRadiusCopy: 4px;
-  --gse-ui-card-default-border: 1px solid #b4bccb;
-  --gse-ui-card-raised-border: 1px solid #b4bccb;
-  --gse-ui-card-raised-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
+  --gse-ui-card-default-border-color: #b4bccb;
+  --gse-ui-card-default-border-width: 1px;
+  --gse-ui-card-default-border-style: solid;
+  --gse-ui-card-raised-border-color: #b4bccb;
+  --gse-ui-card-raised-border-width: 1px;
+  --gse-ui-card-raised-border-style: solid;
+  --gse-ui-card-raised-boxShadow-blur: 6px;
+  --gse-ui-card-raised-boxShadow-spread: 1px;
+  --gse-ui-card-raised-boxShadow-color: rgba(35, 57, 92, 0.12);
+  --gse-ui-card-raised-boxShadow-type: dropShadow;
+  --gse-ui-card-raised-boxShadow-offsetX: 0;
+  --gse-ui-card-raised-boxShadow-offsetY: 0;
   --gse-ui-card-padding: 24px;
-  --gse-ui-card-borderless-border: 1px solid transparent;
-  --gse-ui-tooltip-light-border: 1px solid #b4bccb;
+  --gse-ui-card-borderless-border-color: rgba(0, 0, 0, 0);
+  --gse-ui-card-borderless-border-width: 1px;
+  --gse-ui-card-borderless-border-style: solid;
+  --gse-ui-tooltip-light-border-color: #b4bccb;
+  --gse-ui-tooltip-light-border-width: 1px;
+  --gse-ui-tooltip-light-border-style: solid;
   --gse-ui-tooltip-light-backgroundColor: #ffffff;
   --gse-ui-tooltip-light-foregroundColor: #2e394c;
-  --gse-ui-tooltip-dark-border: 1px solid #2e394c;
+  --gse-ui-tooltip-dark-border-color: #2e394c;
+  --gse-ui-tooltip-dark-border-width: 1px;
+  --gse-ui-tooltip-dark-border-style: solid;
   --gse-ui-tooltip-dark-backgroundColor: #283243;
   --gse-ui-tooltip-dark-foregroundColor: #ffffff;
   --gse-ui-tooltip-dark-iconColor: #ffffff;
-  --gse-ui-tooltip-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
+  --gse-ui-tooltip-boxShadow-blur: 6px;
+  --gse-ui-tooltip-boxShadow-spread: 1px;
+  --gse-ui-tooltip-boxShadow-color: rgba(35, 57, 92, 0.12);
+  --gse-ui-tooltip-boxShadow-type: dropShadow;
+  --gse-ui-tooltip-boxShadow-offsetX: 0;
+  --gse-ui-tooltip-boxShadow-offsetY: 0;
   --gse-ui-tooltip-padding: 8px 12px;
   --gse-ui-tooltip-height: 32px;
   --gse-ui-tooltip-gap: 8px;
   --gse-ui-tooltip-borderRadius: 4px;
-  --gse-ui-tooltip-text: 400 12px/18px Roboto;
+  --gse-ui-tooltip-text-fontFamily: Roboto;
+  --gse-ui-tooltip-text-fontWeight: 400;
+  --gse-ui-tooltip-text-fontSize: 12px;
+  --gse-ui-tooltip-text-lineHeight: 18px;
   --gse-ui-tag-borderRadius: 4px;
-  --gse-ui-tag-default-backgroundColor: #23395d; /* To be deprecated in V5 */
-  --gse-ui-tag-default-foregroundColor: #ffffff; /* To be deprecated in V5 */
+  --gse-ui-tag-default-backgroundColor: #23395d;
+  --gse-ui-tag-default-foregroundColor: #ffffff;
   --gse-ui-tag-default-bold-backgroundColor: #203b73;
   --gse-ui-tag-default-bold-foregroundColor: #ffffff;
-  --gse-ui-tag-default-subtle-backgroundColor: lch(77.6 10.9 279);
+  --gse-ui-tag-default-subtle-backgroundColor: #bbbfd4;
   --gse-ui-tag-default-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent1-backgroundColor: #e4e5e7; /* To be deprecated in V5 */
-  --gse-ui-tag-accent1-foregroundColor: #1b2c48; /* To be deprecated in V5 */
+  --gse-ui-tag-accent1-backgroundColor: #e4e5e7;
+  --gse-ui-tag-accent1-foregroundColor: #1b2c48;
   --gse-ui-tag-accent1-bold-backgroundColor: #23478f;
   --gse-ui-tag-accent1-bold-foregroundColor: #ffffff;
-  --gse-ui-tag-accent1-subtle-backgroundColor: lch(90.4 14.8 272);
+  --gse-ui-tag-accent1-subtle-backgroundColor: #d9e4ff;
   --gse-ui-tag-accent1-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent2-backgroundColor: #90d3dd; /* To be deprecated in V5 */
-  --gse-ui-tag-accent2-foregroundColor: #1b2c48; /* To be deprecated in V5 */
+  --gse-ui-tag-accent2-backgroundColor: #90d3dd;
+  --gse-ui-tag-accent2-foregroundColor: #1b2c48;
   --gse-ui-tag-accent2-bold-backgroundColor: #b5b5eb;
   --gse-ui-tag-accent2-bold-foregroundColor: #2e394c;
-  --gse-ui-tag-accent2-subtle-backgroundColor: lch(92.5 8.53 288);
+  --gse-ui-tag-accent2-subtle-backgroundColor: #e9e8f9;
   --gse-ui-tag-accent2-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent3-backgroundColor: #0c6d7e; /* To be deprecated in V5 */
-  --gse-ui-tag-accent3-foregroundColor: #ffffff; /* To be deprecated in V5 */
+  --gse-ui-tag-accent3-backgroundColor: #0c6d7e;
+  --gse-ui-tag-accent3-foregroundColor: #ffffff;
   --gse-ui-tag-accent3-bold-backgroundColor: #205a10;
   --gse-ui-tag-accent3-bold-foregroundColor: #ffffff;
   --gse-ui-tag-accent3-subtle-backgroundColor: #c2deb9;
   --gse-ui-tag-accent3-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent4-backgroundColor: #547688; /* To be deprecated in V5 */
-  --gse-ui-tag-accent4-foregroundColor: #ffffff; /* To be deprecated in V5 */
+  --gse-ui-tag-accent4-backgroundColor: #547688;
+  --gse-ui-tag-accent4-foregroundColor: #ffffff;
   --gse-ui-tag-accent4-bold-backgroundColor: #151d28;
   --gse-ui-tag-accent4-bold-foregroundColor: #ffffff;
   --gse-ui-tag-accent4-subtle-backgroundColor: #c8cfda;
   --gse-ui-tag-accent4-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent5-backgroundColor: #a5cae0; /* To be deprecated in V5 */
-  --gse-ui-tag-accent5-foregroundColor: #1b2c48; /* To be deprecated in V5 */
+  --gse-ui-tag-accent5-backgroundColor: #a5cae0;
+  --gse-ui-tag-accent5-foregroundColor: #1b2c48;
   --gse-ui-tag-accent5-bold-backgroundColor: #75a8ff;
   --gse-ui-tag-accent5-bold-foregroundColor: #2e394c;
-  --gse-ui-tag-accent5-subtle-backgroundColor: lch(90.4 14.8 272);
+  --gse-ui-tag-accent5-subtle-backgroundColor: #d9e4ff;
   --gse-ui-tag-accent5-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent6-backgroundColor: #b5bfe6; /* To be deprecated in V5 */
-  --gse-ui-tag-accent6-foregroundColor: #1b2c48; /* To be deprecated in V5 */
-  --gse-ui-tag-accent6-subtle-backgroundColor: lch(83.7 21.4 305);
+  --gse-ui-tag-accent6-backgroundColor: #b5bfe6;
+  --gse-ui-tag-accent6-foregroundColor: #1b2c48;
+  --gse-ui-tag-accent6-subtle-backgroundColor: #dcc9f2;
   --gse-ui-tag-accent6-subtle-foregroundColor: #2e394c;
   --gse-ui-tag-accent6-bold-backgroundColor: #8452cf;
   --gse-ui-tag-accent6-bold-foregroundColor: #ffffff;
-  --gse-ui-tag-text: 600 14px/20px Roboto;
+  --gse-ui-tag-text-fontFamily: Roboto;
+  --gse-ui-tag-text-fontWeight: 600;
+  --gse-ui-tag-text-fontSize: 14px;
+  --gse-ui-tag-text-lineHeight: 20px;
   --gse-ui-tag-padding: 0 12px;
   --gse-ui-tag-removable-padding: 0 8px 0 12px;
   --gse-ui-tag-removable-gap: 4px;
-  --gse-ui-tag-accent7-backgroundColor: #a05195; /* To be deprecated in V5 */
-  --gse-ui-tag-accent7-foregroundColor: #ffffff; /* To be deprecated in V5 */
+  --gse-ui-tag-accent7-backgroundColor: #a05195;
+  --gse-ui-tag-accent7-foregroundColor: #ffffff;
   --gse-ui-tag-accent7-bold-backgroundColor: #5e5782;
   --gse-ui-tag-accent7-bold-foregroundColor: #ffffff;
-  --gse-ui-tag-accent7-subtle-backgroundColor: lch(81.7 7.69 295);
+  --gse-ui-tag-accent7-subtle-backgroundColor: #cdc9d8;
   --gse-ui-tag-accent7-subtle-foregroundColor: #2e394c;
   --gse-ui-tag-height: 20px;
-  --gse-ui-tag-accent8-backgroundColor: #f95d6a; /* To be deprecated in V5 */
-  --gse-ui-tag-accent8-foregroundColor: #1b2c48; /* To be deprecated in V5 */
+  --gse-ui-tag-accent8-backgroundColor: #f95d6a;
+  --gse-ui-tag-accent8-foregroundColor: #1b2c48;
   --gse-ui-tag-accent8-bold-backgroundColor: #ff8fdd;
   --gse-ui-tag-accent8-bold-foregroundColor: #2e394c;
-  --gse-ui-tag-accent8-subtle-backgroundColor: lch(92.1 16.4 338);
+  --gse-ui-tag-accent8-subtle-backgroundColor: #ffdff5;
   --gse-ui-tag-accent8-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent9-backgroundColor: #fe8f85; /* To be deprecated in V5 */
-  --gse-ui-tag-accent9-foregroundColor: #1b2c48; /* To be deprecated in V5 */
+  --gse-ui-tag-accent9-backgroundColor: #fe8f85;
+  --gse-ui-tag-accent9-foregroundColor: #1b2c48;
   --gse-ui-tag-accent9-bold-backgroundColor: #755000;
   --gse-ui-tag-accent9-bold-foregroundColor: #ffffff;
   --gse-ui-tag-accent9-subtle-backgroundColor: #fcd276;
   --gse-ui-tag-accent9-subtle-foregroundColor: #2e394c;
-  --gse-ui-tag-accent10-backgroundColor: #ffc650; /* To be deprecated in V5 */
-  --gse-ui-tag-accent10-foregroundColor: #1b2c48; /* To be deprecated in V5 */
+  --gse-ui-tag-accent10-backgroundColor: #ffc650;
+  --gse-ui-tag-accent10-foregroundColor: #1b2c48;
   --gse-ui-tag-accent10-bold-backgroundColor: #ddd933;
   --gse-ui-tag-accent10-bold-foregroundColor: #2e394c;
-  --gse-ui-tag-accent10-subtle-backgroundColor: lch(95.5 22.7 98.8);
+  --gse-ui-tag-accent10-subtle-backgroundColor: #f8f3c6;
   --gse-ui-tag-accent10-subtle-foregroundColor: #2e394c;
   --gse-ui-tag-button-size: 16px;
-  --gse-ui-tag-disabled-opacity: 0.5;
+  --gse-ui-tag-disabled-opacity: .5;
   --gse-ui-badge-borderRadius: 16px;
-  --gse-ui-badge-text: 600 12px/18px Roboto;
+  --gse-ui-badge-text-fontFamily: Roboto;
+  --gse-ui-badge-text-fontWeight: 600;
+  --gse-ui-badge-text-fontSize: 12px;
+  --gse-ui-badge-text-lineHeight: 18px;
   --gse-ui-badge-height: 20px;
   --gse-ui-badge-padding: 2px 12px;
   --gse-ui-badge-gap: 4px;
@@ -182,43 +241,63 @@
   --gse-ui-alert-info-backgroundColor: #deeaff;
   --gse-ui-alert-info-foregroundColor: #2e394c;
   --gse-ui-alert-info-iconColor: #2a60c8;
-  --gse-ui-alert-info-border: 1px solid #75a8ff;
+  --gse-ui-alert-info-border-color: #75a8ff;
+  --gse-ui-alert-info-border-width: 1px;
+  --gse-ui-alert-info-border-style: solid;
   --gse-ui-alert-success-backgroundColor: #eefcea;
   --gse-ui-alert-success-foregroundColor: #2e394c;
   --gse-ui-alert-success-iconColor: #3c8527;
-  --gse-ui-alert-success-border: 1px solid #95c189;
+  --gse-ui-alert-success-border-color: #95c189;
+  --gse-ui-alert-success-border-width: 1px;
+  --gse-ui-alert-success-border-style: solid;
   --gse-ui-alert-warning-backgroundColor: #fdf8ec;
   --gse-ui-alert-warning-foregroundColor: #2e394c;
   --gse-ui-alert-warning-iconColor: #ffae00;
-  --gse-ui-alert-warning-border: 1px solid #fcd276;
+  --gse-ui-alert-warning-border-color: #fcd276;
+  --gse-ui-alert-warning-border-width: 1px;
+  --gse-ui-alert-warning-border-style: solid;
   --gse-ui-alert-error-backgroundColor: #fceaea;
   --gse-ui-alert-error-foregroundColor: #2e394c;
   --gse-ui-alert-error-iconColor: #ea0b0b;
-  --gse-ui-alert-error-border: 1px solid #f37a7a;
-  --gse-ui-alert-text: 400 12px/18px Roboto;
-  --gse-ui-alert-emphasisText: 700 12px/18px Roboto;
+  --gse-ui-alert-error-border-color: #f37a7a;
+  --gse-ui-alert-error-border-width: 1px;
+  --gse-ui-alert-error-border-style: solid;
+  --gse-ui-alert-text-fontFamily: Roboto;
+  --gse-ui-alert-text-fontWeight: 400;
+  --gse-ui-alert-text-fontSize: 12px;
+  --gse-ui-alert-text-lineHeight: 18px;
+  --gse-ui-alert-emphasisText-fontFamily: Roboto;
+  --gse-ui-alert-emphasisText-fontWeight: 700;
+  --gse-ui-alert-emphasisText-fontSize: 12px;
+  --gse-ui-alert-emphasisText-lineHeight: 18px;
   --gse-ui-alert-borderRadius: 4px;
   --gse-ui-rating-default-color: #6b7585;
   --gse-ui-rating-active-color: #2a60c8;
   --gse-ui-rating-hover-color: #2754ac;
   --gse-ui-rating-disabled-color: #6b7585;
-  --gse-ui-rating-disabled-opacity: 0.5;
+  --gse-ui-rating-disabled-opacity: .5;
   --gse-ui-rating-size: 16px;
   --gse-ui-rating-star-gap: 8px;
   --gse-ui-breadcrumbs-primary-height: 20px;
   --gse-ui-breadcrumbs-primary-separator-padding: 0 12px;
-  --gse-ui-breadcrumbs-primary-separator-typography: 700 14px/20px Roboto;
+  --gse-ui-breadcrumbs-primary-separator-typography-fontFamily: Roboto;
+  --gse-ui-breadcrumbs-primary-separator-typography-fontWeight: 700;
+  --gse-ui-breadcrumbs-primary-separator-typography-fontSize: 14px;
+  --gse-ui-breadcrumbs-primary-separator-typography-lineHeight: 20px;
   --gse-ui-breadcrumbs-secondary-height: 16px;
   --gse-ui-breadcrumbs-secondary-separator-padding: 0 8px;
-  --gse-ui-breadcrumbs-secondary-separator-typography: 700 14px/20px Roboto;
+  --gse-ui-breadcrumbs-secondary-separator-typography-fontFamily: Roboto;
+  --gse-ui-breadcrumbs-secondary-separator-typography-fontWeight: 700;
+  --gse-ui-breadcrumbs-secondary-separator-typography-fontSize: 14px;
+  --gse-ui-breadcrumbs-secondary-separator-typography-lineHeight: 20px;
   --gse-ui-breadcrumbs-separator-color: #b4bccb;
-  --gse-ui-breadcrumbs-borderRadius: 0rem;
+  --gse-ui-breadcrumbs-borderRadius: 0;
   --gse-ui-segmentedControl-button-padding: 0 12px;
   --gse-ui-segmentedControl-button-gap: 8px;
   --gse-ui-segmentedControl-button-start-borderRadius: 4px 0 0 4px;
-  --gse-ui-segmentedControl-button-middle-borderRadius: 0rem;
+  --gse-ui-segmentedControl-button-middle-borderRadius: 0;
   --gse-ui-segmentedControl-button-end-borderRadius: 0 4px 4px 0;
-  --gse-ui-segmentedControl-button-disabled-opacity: 0.5;
+  --gse-ui-segmentedControl-button-disabled-opacity: .5;
   --gse-ui-segmentedControl-button-disabled-backgroundColor: rgba(0, 0, 0, 0);
   --gse-ui-segmentedControl-button-disabled-foregroundColor: #2a60c8;
   --gse-ui-segmentedControl-button-default-backgroundColor: rgba(0, 0, 0, 0);
@@ -229,34 +308,46 @@
   --gse-ui-segmentedControl-button-active-foregroundColor: #ffffff;
   --gse-ui-segmentedControl-borderRadius: 4px;
   --gse-ui-segmentedControl-height: 32px;
-  --gse-ui-segmentedControl-border: 1px solid #2a60c8;
-  --gse-ui-segmentedControl-divider: 1px solid #2a60c8;
+  --gse-ui-segmentedControl-border-color: #2a60c8;
+  --gse-ui-segmentedControl-border-width: 1px;
+  --gse-ui-segmentedControl-border-style: solid;
+  --gse-ui-segmentedControl-divider-color: #2a60c8;
+  --gse-ui-segmentedControl-divider-width: 1px;
+  --gse-ui-segmentedControl-divider-style: solid;
   --gse-ui-segmentedControl-iconOnly-padding: 0 8px;
-  --gse-ui-segmentedControl-focus-offset: 0rem;
-  --gse-ui-formFooter-page-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-page-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-page-desktop-horizontalPadding: 32px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-page-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-page-mobile-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-page-mobile-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-page-mobile-horizontalPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-page-mobile-gap: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-separator: 1px solid #b4bccb; /* This is the recommended style for the form fotter separator/divider. */
-  --gse-ui-formFooter-sideSheet-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-sideSheet-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-sideSheet-desktop-horizontalPadding: 24px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-sideSheet-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-modal-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-modal-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-modal-desktop-horizontalPadding: 32px; /* The recommended vertical padding for the form footer content. */
-  --gse-ui-formFooter-modal-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
+  --gse-ui-segmentedControl-focus-offset: 0;
+  --gse-ui-formFooter-page-desktop-bottomPadding: 16px;
+  --gse-ui-formFooter-page-desktop-topPadding: 16px;
+  --gse-ui-formFooter-page-desktop-horizontalPadding: 32px;
+  --gse-ui-formFooter-page-desktop-gap: 16px;
+  --gse-ui-formFooter-page-mobile-bottomPadding: 16px;
+  --gse-ui-formFooter-page-mobile-topPadding: 16px;
+  --gse-ui-formFooter-page-mobile-horizontalPadding: 16px;
+  --gse-ui-formFooter-page-mobile-gap: 16px;
+  --gse-ui-formFooter-separator-color: #b4bccb;
+  --gse-ui-formFooter-separator-width: 1px;
+  --gse-ui-formFooter-separator-style: solid;
+  --gse-ui-formFooter-sideSheet-desktop-bottomPadding: 16px;
+  --gse-ui-formFooter-sideSheet-desktop-topPadding: 16px;
+  --gse-ui-formFooter-sideSheet-desktop-horizontalPadding: 24px;
+  --gse-ui-formFooter-sideSheet-desktop-gap: 16px;
+  --gse-ui-formFooter-modal-desktop-bottomPadding: 16px;
+  --gse-ui-formFooter-modal-desktop-topPadding: 16px;
+  --gse-ui-formFooter-modal-desktop-horizontalPadding: 32px;
+  --gse-ui-formFooter-modal-desktop-gap: 16px;
   --gse-ui-formFooter-backgroundColor: #ffffff;
-  --gse-ui-formFooter-border: 1px solid #2a60c8;
+  --gse-ui-formFooter-border-color: #2a60c8;
+  --gse-ui-formFooter-border-width: 1px;
+  --gse-ui-formFooter-border-style: solid;
   --gse-ui-copyToClipboard-label-active-backgroundColor: #e2e6ee;
   --gse-ui-copyToClipboard-label-foregroundColor: #283243;
   --gse-ui-copyToClipboard-label-padding: 2px 4px;
   --gse-ui-copyToClipboard-label-borderRadius: 4px;
-  --gse-ui-copyToClipboard-label-text: 600 14px/20px Roboto;
+  --gse-ui-copyToClipboard-label-text-fontFamily: Roboto;
+  --gse-ui-copyToClipboard-label-text-fontWeight: 600;
+  --gse-ui-copyToClipboard-label-text-fontSize: 14px;
+  --gse-ui-copyToClipboard-label-text-lineHeight: 20px;
+  --gse-ui-copyToClipboard-label-text-textDecoration: underline;
   --gse-ui-copyToClipboard-gap: 8px;
   --gse-ui-copyToClipboard-contentContainer-gap: 4px;
   --gse-ui-copyToClipboard-iconContainer-padding: 4px;
@@ -286,7 +377,9 @@
   --gse-ui-button-secondary-active-foregroundColor: #2e394c;
   --gse-ui-button-tertiary-default-backgroundColor: rgba(0, 0, 0, 0);
   --gse-ui-button-tertiary-default-foregroundColor: #2e394c;
-  --gse-ui-button-tertiary-default-border: 1px solid #2e394c;
+  --gse-ui-button-tertiary-default-border-color: #2e394c;
+  --gse-ui-button-tertiary-default-border-width: 1px;
+  --gse-ui-button-tertiary-default-border-style: solid;
   --gse-ui-button-tertiary-hover-backgroundColor: #2754ac;
   --gse-ui-button-tertiary-hover-foregroundColor: #ffffff;
   --gse-ui-button-tertiary-active-backgroundColor: #23478f;
@@ -304,8 +397,11 @@
   --gse-ui-button-danger-active-backgroundColor: #520404;
   --gse-ui-button-danger-active-foregroundColor: #ffffff;
   --gse-ui-button-borderRadius: 4px;
-  --gse-ui-button-disabled-opacity: 0.5;
-  --gse-ui-button-text: 700 12px/18px Roboto;
+  --gse-ui-button-disabled-opacity: .5;
+  --gse-ui-button-text-fontFamily: Roboto;
+  --gse-ui-button-text-fontWeight: 700;
+  --gse-ui-button-text-fontSize: 12px;
+  --gse-ui-button-text-lineHeight: 18px;
   --gse-ui-actionButton-rightSegment-size: 32px;
   --gse-ui-actionButton-rightSegment-padding: 0 8px;
   --gse-ui-actionButton-rightSegment-borderRadius: 0 4px 4px 0;
@@ -317,21 +413,50 @@
   --gse-ui-actionButton-leftSegment-focusBorderRadius: 8px 0 0 8px;
   --gse-ui-actionButton-leftSegment-borderRadius: 4px 0 0 4px;
   --gse-ui-actionButton-borderRadius: 4px;
-  --gse-ui-actionButton-tertiary-divider: 2px solid #2a60c8;
-  --gse-ui-actionButton-primary-divider: 2px solid #ffffff;
-  --gse-ui-actionButton-secondary-divider: 2px solid #ffffff;
-  --gse-ui-actionButton-danger-divider: 2px solid #ffffff;
+  --gse-ui-actionButton-tertiary-divider-color: #2a60c8;
+  --gse-ui-actionButton-tertiary-divider-width: 2px;
+  --gse-ui-actionButton-tertiary-divider-style: solid;
+  --gse-ui-actionButton-primary-divider-color: #ffffff;
+  --gse-ui-actionButton-primary-divider-width: 2px;
+  --gse-ui-actionButton-primary-divider-style: solid;
+  --gse-ui-actionButton-secondary-divider-color: #ffffff;
+  --gse-ui-actionButton-secondary-divider-width: 2px;
+  --gse-ui-actionButton-secondary-divider-style: solid;
+  --gse-ui-actionButton-danger-divider-color: #ffffff;
+  --gse-ui-actionButton-danger-divider-width: 2px;
+  --gse-ui-actionButton-danger-divider-style: solid;
   --gse-ui-links-asButton-height: 32px;
   --gse-ui-links-asButton-padding: 12px;
   --gse-ui-links-asButton-gap: 8px;
-  --gse-ui-links-asButton-text: 600 14px/20px Roboto;
-  --gse-ui-links-asButton-underlinedText: 600 14px/20px Roboto;
+  --gse-ui-links-asButton-text-fontFamily: Roboto;
+  --gse-ui-links-asButton-text-fontWeight: 600;
+  --gse-ui-links-asButton-text-fontSize: 14px;
+  --gse-ui-links-asButton-text-lineHeight: 20px;
+  --gse-ui-links-asButton-underlinedText-fontFamily: Roboto;
+  --gse-ui-links-asButton-underlinedText-fontWeight: 600;
+  --gse-ui-links-asButton-underlinedText-fontSize: 14px;
+  --gse-ui-links-asButton-underlinedText-lineHeight: 20px;
+  --gse-ui-links-asButton-underlinedText-textDecoration: underline;
   --gse-ui-links-inLine-medium-height: 24px;
-  --gse-ui-links-inLine-medium-text: 600 14px/20px Roboto;
-  --gse-ui-links-inLine-medium-underlinedText: 600 14px/20px Roboto;
+  --gse-ui-links-inLine-medium-text-fontFamily: Roboto;
+  --gse-ui-links-inLine-medium-text-fontWeight: 600;
+  --gse-ui-links-inLine-medium-text-fontSize: 14px;
+  --gse-ui-links-inLine-medium-text-lineHeight: 20px;
+  --gse-ui-links-inLine-medium-underlinedText-fontFamily: Roboto;
+  --gse-ui-links-inLine-medium-underlinedText-fontWeight: 600;
+  --gse-ui-links-inLine-medium-underlinedText-fontSize: 14px;
+  --gse-ui-links-inLine-medium-underlinedText-lineHeight: 20px;
+  --gse-ui-links-inLine-medium-underlinedText-textDecoration: underline;
   --gse-ui-links-inLine-small-height: 20px;
-  --gse-ui-links-inLine-small-text: 600 12px/18px Roboto;
-  --gse-ui-links-inLine-small-underlinedText: 600 12px/18px Roboto;
+  --gse-ui-links-inLine-small-text-fontFamily: Roboto;
+  --gse-ui-links-inLine-small-text-fontWeight: 600;
+  --gse-ui-links-inLine-small-text-fontSize: 12px;
+  --gse-ui-links-inLine-small-text-lineHeight: 18px;
+  --gse-ui-links-inLine-small-underlinedText-fontFamily: Roboto;
+  --gse-ui-links-inLine-small-underlinedText-fontWeight: 600;
+  --gse-ui-links-inLine-small-underlinedText-fontSize: 12px;
+  --gse-ui-links-inLine-small-underlinedText-lineHeight: 18px;
+  --gse-ui-links-inLine-small-underlinedText-textDecoration: underline;
   --gse-ui-links-inLine-padding: 4px;
   --gse-ui-links-icon: 16px;
   --gse-ui-links-default-foregroundColor: #2a60c8;
@@ -339,7 +464,7 @@
   --gse-ui-links-hover-foregroundColor: #2754ac;
   --gse-ui-links-active-foregroundColor: #23478f;
   --gse-ui-links-visited-foregroundColor: #8452cf;
-  --gse-ui-links-borderRadius: 0rem;
+  --gse-ui-links-borderRadius: 0;
   --gse-ui-radioButton-icon-default-unselectedForegroundColor: #6b7585;
   --gse-ui-radioButton-icon-default-selectedForegroundColor: #2a60c8;
   --gse-ui-radioButton-icon-hover-foregroundColor: #2754ac;
@@ -348,12 +473,17 @@
   --gse-ui-radioButton-icon-height: 16px;
   --gse-ui-radioButton-icon-width: 16px;
   --gse-ui-radioButton-label-foregroundColor: #2e394c;
-  --gse-ui-radioButton-label-text: 400 12px/18px Roboto;
+  --gse-ui-radioButton-label-text-fontFamily: Roboto;
+  --gse-ui-radioButton-label-text-fontWeight: 400;
+  --gse-ui-radioButton-label-text-fontSize: 12px;
+  --gse-ui-radioButton-label-text-lineHeight: 18px;
   --gse-ui-radioButton-gap: 8px;
   --gse-ui-radioButton-helper-padding: 4px 0 0 24px;
   --gse-ui-radioButton-helper-gap: 8px;
-  --gse-ui-radioButton-disabled-opacity: 0.5;
-  --gse-ui-radioButton-focus-border: 2px solid #aac9ff;
+  --gse-ui-radioButton-disabled-opacity: .5;
+  --gse-ui-radioButton-focus-border-color: #aac9ff;
+  --gse-ui-radioButton-focus-border-width: 2px;
+  --gse-ui-radioButton-focus-border-style: solid;
   --gse-ui-radioButton-focus-borderRadius: 100%;
   --gse-ui-radioButton-focus-offset: 1px;
   --gse-ui-checkbox-icon-default-unselectedForegroundColor: #6b7585;
@@ -364,12 +494,17 @@
   --gse-ui-checkbox-icon-height: 16px;
   --gse-ui-checkbox-icon-width: 16px;
   --gse-ui-checkbox-label-foregroundColor: #2e394c;
-  --gse-ui-checkbox-label-text: 400 12px/18px Roboto;
+  --gse-ui-checkbox-label-text-fontFamily: Roboto;
+  --gse-ui-checkbox-label-text-fontWeight: 400;
+  --gse-ui-checkbox-label-text-fontSize: 12px;
+  --gse-ui-checkbox-label-text-lineHeight: 18px;
   --gse-ui-checkbox-helper-padding: 4px 0 0 24px;
   --gse-ui-checkbox-helper-gap: 8px;
   --gse-ui-checkbox-gap: 8px;
-  --gse-ui-checkbox-disabled-opacity: 0.5;
-  --gse-ui-checkbox-focus-border: 2px solid #aac9ff;
+  --gse-ui-checkbox-disabled-opacity: .5;
+  --gse-ui-checkbox-focus-border-color: #aac9ff;
+  --gse-ui-checkbox-focus-border-width: 2px;
+  --gse-ui-checkbox-focus-border-style: solid;
   --gse-ui-checkbox-focus-borderRadius: 4px;
   --gse-ui-checkbox-focus-borderRadiusSmall: 4px;
   --gse-ui-checkbox-focus-offset: 1px;
@@ -379,15 +514,24 @@
   --gse-ui-menu-option-height: 32px;
   --gse-ui-menu-option-startIcon-height: 16px;
   --gse-ui-menu-option-startIcon-width: 16px;
-  --gse-ui-menu-option-label-default-text: 400 12px/18px Roboto;
-  --gse-ui-menu-option-label-active-text: 700 12px/18px Roboto;
+  --gse-ui-menu-option-label-default-text-fontFamily: Roboto;
+  --gse-ui-menu-option-label-default-text-fontWeight: 400;
+  --gse-ui-menu-option-label-default-text-fontSize: 12px;
+  --gse-ui-menu-option-label-default-text-lineHeight: 18px;
+  --gse-ui-menu-option-label-active-text-fontFamily: Roboto;
+  --gse-ui-menu-option-label-active-text-fontWeight: 700;
+  --gse-ui-menu-option-label-active-text-fontSize: 12px;
+  --gse-ui-menu-option-label-active-text-lineHeight: 18px;
   --gse-ui-menu-option-label-foregroundColor: #2e394c;
-  --gse-ui-menu-option-shortcut-text: 400 14px/20px Roboto;
+  --gse-ui-menu-option-shortcut-text-fontFamily: Roboto;
+  --gse-ui-menu-option-shortcut-text-fontWeight: 400;
+  --gse-ui-menu-option-shortcut-text-fontSize: 14px;
+  --gse-ui-menu-option-shortcut-text-lineHeight: 20px;
   --gse-ui-menu-option-shortcut-default-foregroundColor: #4c5667;
   --gse-ui-menu-option-shortcut-selected-foregroundColor: #2e394c;
   --gse-ui-menu-option-hover-backgroundColor: #e8ecf2;
   --gse-ui-menu-option-selected-backgroundColor: #e2e6ee;
-  --gse-ui-menu-option-disabled-opacity: 0.5;
+  --gse-ui-menu-option-disabled-opacity: .5;
   --gse-ui-menu-option-checkbox-unchecked-default-foregroundColor: #6b7585;
   --gse-ui-menu-option-checkbox-unchecked-hover-foregroundColor: #2754ac;
   --gse-ui-menu-option-checkbox-unchecked-selected-foregroundColor: #23478f;
@@ -399,36 +543,59 @@
   --gse-ui-menu-option-parentIcon-default-foregroundColor: #3e4a5b;
   --gse-ui-menu-option-parentIcon-hover-foregroundColor: #2e394c;
   --gse-ui-menu-option-parentIcon-selected-foregroundColor: #2e394c;
-  --gse-ui-menu-option-focus-border: 1px solid #aac9ff;
+  --gse-ui-menu-option-focus-border-color: #aac9ff;
+  --gse-ui-menu-option-focus-border-width: 1px;
+  --gse-ui-menu-option-focus-border-style: solid;
   --gse-ui-menu-option-default-backgroundColor: #ffffff;
   --gse-ui-menu-maxHeight: 344px;
   --gse-ui-menu-borderRadius: 4px;
-  --gse-ui-menu-border: 1px solid #b4bccb;
-  --gse-ui-menu-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
+  --gse-ui-menu-border-color: #b4bccb;
+  --gse-ui-menu-border-width: 1px;
+  --gse-ui-menu-border-style: solid;
+  --gse-ui-menu-boxShadow-blur: 4px;
+  --gse-ui-menu-boxShadow-spread: 1px;
+  --gse-ui-menu-boxShadow-color: rgba(35, 57, 92, 0.1);
+  --gse-ui-menu-boxShadow-type: dropShadow;
+  --gse-ui-menu-boxShadow-offsetX: 0;
+  --gse-ui-menu-boxShadow-offsetY: 0;
   --gse-ui-menu-padding: 8px 1px;
   --gse-ui-menu-backgroundColor: #ffffff;
   --gse-ui-menu-scrollbar-foregroundColor: #3e4a5b;
-  --gse-ui-menu-divider-backgroundColor: #b4bccb; /* Color for the divider that separates the day picker and the time picker inside the calendar menu. */
+  --gse-ui-menu-divider-backgroundColor: #b4bccb;
   --gse-ui-menu-divider-margin: 4px 0 8px 0;
   --gse-ui-menu-divider-height: 1px;
   --gse-ui-menu-groupedMenu-title-padding: 8px 12px 4px;
   --gse-ui-menu-groupedMenu-title-height: 32px;
   --gse-ui-menu-groupedMenu-title-foregroundColor: #4c5667;
-  --gse-ui-menu-groupedMenu-title-text: 600 12px/16px Roboto;
+  --gse-ui-menu-groupedMenu-title-text-fontFamily: Roboto;
+  --gse-ui-menu-groupedMenu-title-text-fontWeight: 600;
+  --gse-ui-menu-groupedMenu-title-text-fontSize: 12px;
+  --gse-ui-menu-groupedMenu-title-text-lineHeight: 16px;
+  --gse-ui-menu-groupedMenu-title-text-textCase: uppercase;
+  --gse-ui-menu-groupedMenu-title-text-letterSpacing: 1px;
   --gse-ui-menu-groupedMenu-padding: 8px 2px;
   --gse-ui-menu-groupedMenu-divider-padding: 4px 0px 8px;
   --gse-ui-menu-groupedMenu-divider-height: 13px;
   --gse-ui-menu-groupedMenu-subtext-foregroundColor: #4c5667;
-  --gse-ui-dropdown-menu-emptyState-header-text: 700 12px/18px Roboto;
+  --gse-ui-dropdown-menu-emptyState-header-text-fontFamily: Roboto;
+  --gse-ui-dropdown-menu-emptyState-header-text-fontWeight: 700;
+  --gse-ui-dropdown-menu-emptyState-header-text-lineHeight: 18px;
+  --gse-ui-dropdown-menu-emptyState-header-text-fontSize: 12px;
   --gse-ui-dropdown-menu-emptyState-header-foregroundColor: #23395d;
-  --gse-ui-dropdown-menu-emptyState-subheader-text: 400 12px/18px Roboto;
+  --gse-ui-dropdown-menu-emptyState-subheader-text-fontFamily: Roboto;
+  --gse-ui-dropdown-menu-emptyState-subheader-text-fontWeight: 400;
+  --gse-ui-dropdown-menu-emptyState-subheader-text-lineHeight: 18px;
+  --gse-ui-dropdown-menu-emptyState-subheader-text-fontSize: 12px;
   --gse-ui-dropdown-menu-emptyState-subheader-foregroundColor: #626e84;
   --gse-ui-dropdown-gap: 4px;
   --gse-ui-calendarMenu-day-range-width: 16px;
   --gse-ui-calendarMenu-day-range-height: 32px;
   --gse-ui-calendarMenu-day-input-height: 32px;
   --gse-ui-calendarMenu-day-input-width: 160px;
-  --gse-ui-calendarMenu-day-headerText: 700 12px/18px Roboto;
+  --gse-ui-calendarMenu-day-headerText-fontFamily: Roboto;
+  --gse-ui-calendarMenu-day-headerText-fontWeight: 700;
+  --gse-ui-calendarMenu-day-headerText-fontSize: 12px;
+  --gse-ui-calendarMenu-day-headerText-lineHeight: 18px;
   --gse-ui-calendarMenu-day-date-size: 32px;
   --gse-ui-calendarMenu-height: 234px;
   --gse-ui-calendarMenu-width: 250px;
@@ -438,11 +605,20 @@
   --gse-ui-calendarMenu-month-single-header-height: 48px;
   --gse-ui-calendarMenu-month-monthCell-width: 66px;
   --gse-ui-calendarMenu-month-monthCell-height: 48px;
-  --gse-ui-calendarMenu-month-headerText: 400 16px/24px Roboto;
+  --gse-ui-calendarMenu-month-headerText-fontFamily: Roboto;
+  --gse-ui-calendarMenu-month-headerText-fontWeight: 400;
+  --gse-ui-calendarMenu-month-headerText-fontSize: 16px;
+  --gse-ui-calendarMenu-month-headerText-lineHeight: 24px;
   --gse-ui-calendarMenu-month-range-vertical-width: 272px;
   --gse-ui-calendarMenu-month-range-vertical-height: 652px;
-  --gse-ui-calendarMenu-month-defaultText: 400 12px/18px Roboto;
-  --gse-ui-calendarMenu-month-currentText: 700 12px/18px Roboto;
+  --gse-ui-calendarMenu-month-defaultText-fontFamily: Roboto;
+  --gse-ui-calendarMenu-month-defaultText-fontWeight: 400;
+  --gse-ui-calendarMenu-month-defaultText-fontSize: 12px;
+  --gse-ui-calendarMenu-month-defaultText-lineHeight: 18px;
+  --gse-ui-calendarMenu-month-currentText-fontFamily: Roboto;
+  --gse-ui-calendarMenu-month-currentText-fontWeight: 700;
+  --gse-ui-calendarMenu-month-currentText-fontSize: 12px;
+  --gse-ui-calendarMenu-month-currentText-lineHeight: 18px;
   --gse-ui-calendarMenu-month-focusBorderRadius: 16px;
   --gse-ui-calendarMenu-month-borderRadius: 4px;
   --gse-ui-calendarMenu-month-calendarButton-focusBorderRadius: 4px;
@@ -458,8 +634,14 @@
   --gse-ui-calendarMenu-header-padding: 12px 16px;
   --gse-ui-calendarMenu-header-arrow-padding: 8px;
   --gse-ui-calendarMenu-backgroundColor: #ffffff;
-  --gse-ui-calendarMenu-date-defaultText: 400 12px/18px Roboto;
-  --gse-ui-calendarMenu-date-currentText: 700 12px/18px Roboto;
+  --gse-ui-calendarMenu-date-defaultText-fontFamily: Roboto;
+  --gse-ui-calendarMenu-date-defaultText-fontWeight: 400;
+  --gse-ui-calendarMenu-date-defaultText-fontSize: 12px;
+  --gse-ui-calendarMenu-date-defaultText-lineHeight: 18px;
+  --gse-ui-calendarMenu-date-currentText-fontFamily: Roboto;
+  --gse-ui-calendarMenu-date-currentText-fontWeight: 700;
+  --gse-ui-calendarMenu-date-currentText-fontSize: 12px;
+  --gse-ui-calendarMenu-date-currentText-lineHeight: 18px;
   --gse-ui-calendarMenu-date-selected-foregroundColor: #ffffff;
   --gse-ui-calendarMenu-date-selected-backgroundColor: #2a60c8;
   --gse-ui-calendarMenu-date-selected-hoverBackgroundColor: #2754ac;
@@ -474,19 +656,27 @@
   --gse-ui-calendarMenu-range-body-secondMonth-borderRadius: 0 0 4px 0;
   --gse-ui-calendarMenu-range-date-endDate-borderRadius: 0 4px 4px 0;
   --gse-ui-calendarMenu-range-date-startDate-borderRadius: 4px 0 0 4px;
-  --gse-ui-calendarMenu-disabled-opacity: 0.5;
+  --gse-ui-calendarMenu-disabled-opacity: .5;
   --gse-ui-calendarMenu-monthBody-padding: 16px 24px;
   --gse-ui-calendarMenu-monthBody-gap: 2px;
-  --gse-ui-calendarMenu-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
+  --gse-ui-calendarMenu-boxShadow-blur: 4px;
+  --gse-ui-calendarMenu-boxShadow-spread: 1px;
+  --gse-ui-calendarMenu-boxShadow-color: rgba(35, 57, 92, 0.1);
+  --gse-ui-calendarMenu-boxShadow-type: dropShadow;
+  --gse-ui-calendarMenu-boxShadow-offsetX: 0;
+  --gse-ui-calendarMenu-boxShadow-offsetY: 0;
   --gse-ui-datePicker-range-gap: 24px;
   --gse-ui-datePicker-startEndInput-gap: 8px;
   --gse-ui-datePicker-dateTyped-gap: 10px;
   --gse-ui-datePicker-dateTyped-backgroundColor: #dee1fd;
-  --gse-ui-datePicker-disabled-opacity: 0.5;
+  --gse-ui-datePicker-disabled-opacity: .5;
   --gse-ui-datePicker-focusCalendar-gap: 2px;
   --gse-ui-datePicker-iconHover: #3742a2;
   --gse-ui-datePicker-iconFocus: #3742a2;
-  --gse-ui-toggle-label: 400 12px/18px Roboto;
+  --gse-ui-toggle-label-fontFamily: Roboto;
+  --gse-ui-toggle-label-fontWeight: 400;
+  --gse-ui-toggle-label-fontSize: 12px;
+  --gse-ui-toggle-label-lineHeight: 18px;
   --gse-ui-toggle-gap: 8px;
   --gse-ui-toggle-padding: 8px;
   --gse-ui-toggle-track-width: 32px;
@@ -502,32 +692,51 @@
   --gse-ui-toggle-track-borderRadius: 100%;
   --gse-ui-toggle-handle-width: 16px;
   --gse-ui-toggle-handle-height: 16px;
-  --gse-ui-toggle-handle-hover-border: 2px solid #75a8ff;
-  --gse-ui-toggle-handle-enabled-border: 2px solid #2a60c8;
-  --gse-ui-toggle-handle-disabled-border: 2px solid #2a60c8;
-  --gse-ui-toggle-handle-error-border: 2px solid #ea0b0b;
+  --gse-ui-toggle-handle-hover-border-width: 2px;
+  --gse-ui-toggle-handle-hover-border-style: solid;
+  --gse-ui-toggle-handle-hover-border-color: #75a8ff;
+  --gse-ui-toggle-handle-enabled-border-width: 2px;
+  --gse-ui-toggle-handle-enabled-border-color: #2a60c8;
+  --gse-ui-toggle-handle-enabled-border-style: solid;
+  --gse-ui-toggle-handle-disabled-border-width: 2px;
+  --gse-ui-toggle-handle-disabled-border-color: #2a60c8;
+  --gse-ui-toggle-handle-disabled-border-style: solid;
+  --gse-ui-toggle-handle-error-border-color: #ea0b0b;
+  --gse-ui-toggle-handle-error-border-width: 2px;
+  --gse-ui-toggle-handle-error-border-style: solid;
   --gse-ui-toggle-handle-backgroundColor: #ffffff;
   --gse-ui-toggle-handle-foregroundColor: #2a60c8;
   --gse-ui-toggle-handle-borderRadius: 4px;
-  --gse-ui-toggle-disabled-opacity: 0.5;
-  --gse-ui-toggle-focus-border: 2px solid #aac9ff;
+  --gse-ui-toggle-disabled-opacity: .5;
+  --gse-ui-toggle-focus-border-color: #aac9ff;
+  --gse-ui-toggle-focus-border-width: 2px;
+  --gse-ui-toggle-focus-border-style: solid;
   --gse-ui-toggle-focus-borderRadius: 100%;
   --gse-ui-toggle-focus-offset: 1px;
   --gse-ui-timePicker-clock-padding: 2px;
   --gse-ui-timePicker-clockStates-defaultColor: #3e4a5b;
   --gse-ui-timePicker-clockStates-hoverColor: #2e394c;
   --gse-ui-timePicker-clockStates-activeColor: #2e394c;
-  --gse-ui-timePicker-clockStates-disabledColor: lch(30.9 11.9 263 / 0.5);
-  --gse-ui-timePicker-focusClock-border: 2px solid #aac9ff;
+  --gse-ui-timePicker-clockStates-disabledColor: #3e4a5b80;
+  --gse-ui-timePicker-focusClock-border-color: #aac9ff;
+  --gse-ui-timePicker-focusClock-border-width: 2px;
+  --gse-ui-timePicker-focusClock-border-style: solid;
   --gse-ui-timePicker-focusClock-borderRadius: 4px;
-  --gse-ui-timePicker-focusAmpm-border: 2px solid #aac9ff;
+  --gse-ui-timePicker-focusAmpm-border-color: #aac9ff;
+  --gse-ui-timePicker-focusAmpm-border-width: 2px;
+  --gse-ui-timePicker-focusAmpm-border-style: solid;
   --gse-ui-timePicker-focusAmpm-borderRadius: 4px;
-  --gse-ui-timePicker-focusTime-border: 2px solid #aac9ff;
+  --gse-ui-timePicker-focusTime-border-color: #aac9ff;
+  --gse-ui-timePicker-focusTime-border-width: 2px;
+  --gse-ui-timePicker-focusTime-border-style: solid;
   --gse-ui-timePicker-focusTime-borderRadius: 4px;
   --gse-ui-timePicker-ampm-padding: 2px;
   --gse-ui-colorPicker-label-requiredSymbolColor: #ea0b0b;
   --gse-ui-colorPicker-label-textColor: #2e394c;
-  --gse-ui-colorPicker-label-text: 400 12px/18px Roboto;
+  --gse-ui-colorPicker-label-text-fontFamily: Roboto;
+  --gse-ui-colorPicker-label-text-fontWeight: 400;
+  --gse-ui-colorPicker-label-text-fontSize: 12px;
+  --gse-ui-colorPicker-label-text-lineHeight: 18px;
   --gse-ui-colorPicker-inputContainer-backgroundColor: #f6f7f9;
   --gse-ui-colorPicker-inputContainer-border-defaultColor: #6b7585;
   --gse-ui-colorPicker-inputContainer-border-hoverColor: #2754ac;
@@ -544,8 +753,11 @@
   --gse-ui-slider-handle-active-backgroundColor: #23478f;
   --gse-ui-slider-handle-disabled-backgroundColor: #2a60c8;
   --gse-ui-slider-handle-borderRadius: 100%;
-  --gse-ui-slider-disabled-opacity: 0.5;
-  --gse-ui-slider-label-text: 600 14px/20px Roboto;
+  --gse-ui-slider-disabled-opacity: .5;
+  --gse-ui-slider-label-text-fontFamily: Roboto;
+  --gse-ui-slider-label-text-fontWeight: 600;
+  --gse-ui-slider-label-text-fontSize: 14px;
+  --gse-ui-slider-label-text-lineHeight: 20px;
   --gse-ui-slider-label-foregroundColor: #2e394c;
   --gse-ui-slider-bar-selected-backgroundColor: #2a60c8;
   --gse-ui-slider-bar-default-backgroundColor: #6b7585;
@@ -583,8 +795,10 @@
   --gse-ui-monthPicker-calendarStates-defaultColor: #3e4a5b;
   --gse-ui-monthPicker-calendarStates-hoverColor: #2e394c;
   --gse-ui-monthPicker-calendarStates-activeColor: #2e394c;
-  --gse-ui-monthPicker-calendarStates-disabledColor: lch(30.9 11.9 263 / 0.5);
-  --gse-ui-monthPicker-calendarStates-focus-border: 2px solid #aac9ff;
+  --gse-ui-monthPicker-calendarStates-disabledColor: #3e4a5b80;
+  --gse-ui-monthPicker-calendarStates-focus-border-color: #aac9ff;
+  --gse-ui-monthPicker-calendarStates-focus-border-width: 2px;
+  --gse-ui-monthPicker-calendarStates-focus-border-style: solid;
   --gse-ui-selectorCard-ilustrativeIcon-foregroundColor: #3e4a5b;
   --gse-ui-selectorCard-text-foregroundColor: #2e394c;
   --gse-ui-selectorCard-default-backgroundColor: #ffffff;
@@ -596,7 +810,9 @@
   --gse-ui-selectorCard-active-selectedIndicator-foregroundColor: #23478f;
   --gse-ui-selectorCard-error-backgroundColor: #fceaea;
   --gse-ui-selectorCard-error-selectedIndicator-foregroundColor: #ea0b0b;
-  --gse-ui-selectorCard-error-border: 1px solid #ea0b0b;
+  --gse-ui-selectorCard-error-border-color: #ea0b0b;
+  --gse-ui-selectorCard-error-border-width: 1px;
+  --gse-ui-selectorCard-error-border-style: solid;
   --gse-ui-selectorCard-simple-minWidth: 108px;
   --gse-ui-selectorCard-simple-maxWidth: 316px;
   --gse-ui-selectorCard-simple-minHeight: 76px;
@@ -604,7 +820,10 @@
   --gse-ui-selectorCard-simple-padding: 12px;
   --gse-ui-selectorCard-simple-gap: 8px;
   --gse-ui-selectorCard-simple-borderRadius: 4px;
-  --gse-ui-selectorCard-simple-label: 700 14px/24px Roboto;
+  --gse-ui-selectorCard-simple-label-fontFamily: Roboto;
+  --gse-ui-selectorCard-simple-label-fontWeight: 700;
+  --gse-ui-selectorCard-simple-label-fontSize: 14px;
+  --gse-ui-selectorCard-simple-label-lineHeight: 24px;
   --gse-ui-selectorCard-descriptive-minWidth: 216px;
   --gse-ui-selectorCard-descriptive-maxWidth: 316px;
   --gse-ui-selectorCard-descriptive-minHeight: 118px;
@@ -614,20 +833,35 @@
   --gse-ui-selectorCard-descriptive-text-gap: 4px;
   --gse-ui-selectorCard-descriptive-badge-marginTop: 8px;
   --gse-ui-selectorCard-descriptive-borderRadius: 4px;
-  --gse-ui-selectorCard-descriptive-label: 700 16px/24px Roboto;
-  --gse-ui-selectorCard-descriptive-description: 400 12px/18px Roboto;
-  --gse-ui-selectorCard-unselected-border: 1px solid #b4bccb;
-  --gse-ui-selectorCard-selected-border: 1px solid #2a60c8;
-  --gse-ui-selectorCard-disabled-opacity: 0.5;
+  --gse-ui-selectorCard-descriptive-label-fontFamily: Roboto;
+  --gse-ui-selectorCard-descriptive-label-fontWeight: 700;
+  --gse-ui-selectorCard-descriptive-label-fontSize: 16px;
+  --gse-ui-selectorCard-descriptive-label-lineHeight: 24px;
+  --gse-ui-selectorCard-descriptive-description-fontFamily: Roboto;
+  --gse-ui-selectorCard-descriptive-description-fontWeight: 400;
+  --gse-ui-selectorCard-descriptive-description-fontSize: 12px;
+  --gse-ui-selectorCard-descriptive-description-lineHeight: 18px;
+  --gse-ui-selectorCard-unselected-border-color: #b4bccb;
+  --gse-ui-selectorCard-unselected-border-width: 1px;
+  --gse-ui-selectorCard-unselected-border-style: solid;
+  --gse-ui-selectorCard-selected-border-color: #2a60c8;
+  --gse-ui-selectorCard-selected-border-width: 1px;
+  --gse-ui-selectorCard-selected-border-style: solid;
+  --gse-ui-selectorCard-disabled-opacity: .5;
   --gse-ui-selectorCard-disabled-backgroundColor: #ffffff;
   --gse-ui-selectorCard-disabled-selectedIndicator-selected-foregroundColor: #2a60c8;
   --gse-ui-selectorCard-disabled-selectedIndicator-unselected-foregroundColor: #6b7585;
   --gse-ui-ctaGroup-gap: 8px;
   --gse-ui-search-counter-default-foregroundColor: #4c5667;
   --gse-ui-search-counter-hover-foregroundColor: #2754ac;
-  --gse-ui-search-counter-divider-border: 1px solid #6b7585;
+  --gse-ui-search-counter-divider-border-color: #6b7585;
+  --gse-ui-search-counter-divider-border-width: 1px;
+  --gse-ui-search-counter-divider-border-style: solid;
   --gse-ui-search-counter-divider-foregroundColor: #6b7585;
-  --gse-ui-search-counter-text: 400 12px/18px Roboto;
+  --gse-ui-search-counter-text-fontFamily: Roboto;
+  --gse-ui-search-counter-text-fontWeight: 400;
+  --gse-ui-search-counter-text-fontSize: 12px;
+  --gse-ui-search-counter-text-lineHeight: 18px;
   --gse-ui-search-counter-gap: 4px;
   --gse-ui-search-counter-icon-height: 16px;
   --gse-ui-search-counter-icon-width: 16px;
@@ -637,7 +871,10 @@
   --gse-ui-search-match-subsequentLevel-foregroundColour: #2e394c;
   --gse-ui-search-match-subsequentLevel-backgroundColor: #fff793;
   --gse-ui-simpleFilter-gap: 16px;
-  --gse-ui-dataTableItems-header-text: 700 12px/18px Roboto;
+  --gse-ui-dataTableItems-header-text-fontFamily: Roboto;
+  --gse-ui-dataTableItems-header-text-fontWeight: 700;
+  --gse-ui-dataTableItems-header-text-fontSize: 12px;
+  --gse-ui-dataTableItems-header-text-lineHeight: 18px;
   --gse-ui-dataTableItems-header-multiselect-default-height: 40px;
   --gse-ui-dataTableItems-header-multiselect-default-width: 41px;
   --gse-ui-dataTableItems-header-multiselect-default-selectedBar-height: 3px;
@@ -659,7 +896,9 @@
   --gse-ui-dataTableItems-header-gap: 8px;
   --gse-ui-dataTableItems-header-selectedBar-height: 3px;
   --gse-ui-dataTableItems-header-selectedBar-width: 229px;
-  --gse-ui-dataTableItems-divider: 1px solid #e2e6ee;
+  --gse-ui-dataTableItems-divider-color: #e2e6ee;
+  --gse-ui-dataTableItems-divider-width: 1px;
+  --gse-ui-dataTableItems-divider-style: solid;
   --gse-ui-dataTableItems-scrollbar-borderRadius: 45px;
   --gse-ui-dataTableItems-scrollbar-foregroundColor: #4c5667;
   --gse-ui-dataTableItems-cell-altBackgroundColor: #f6f7f9;
@@ -682,7 +921,10 @@
   --gse-ui-dataTableItems-cell-padding: 0 12px;
   --gse-ui-dataTableItems-cell-gap: 8px;
   --gse-ui-dataTableItems-cell-icon-foregroundColor: #2e394c;
-  --gse-ui-dataTableItems-cell-text: 400 12px/18px Roboto;
+  --gse-ui-dataTableItems-cell-text-fontFamily: Roboto;
+  --gse-ui-dataTableItems-cell-text-fontWeight: 400;
+  --gse-ui-dataTableItems-cell-text-fontSize: 12px;
+  --gse-ui-dataTableItems-cell-text-lineHeight: 18px;
   --gse-ui-dataTableItems-cell-tablePagination-width: 727px;
   --gse-ui-dataTableItems-cell-tablePagination-height: 56px;
   --gse-ui-dataTableItems-cell-contextMenu-default-height: 40px;
@@ -702,9 +944,17 @@
   --gse-ui-dataTableItems-tableToolbar-height: 32px;
   --gse-ui-dataTableItems-tablePagination-recordsetControls-gap: 10px;
   --gse-ui-dataTableItems-tablePagination-padding: 12px;
-  --gse-ui-dataTableItems-tablePagination-divider: 1px solid #b4bccb;
-  --gse-ui-dataTableItems-tablePagination-defaultText: 400 12px/18px Roboto;
-  --gse-ui-dataTableItems-tablePagination-currentResultText: 700 12px/18px Roboto;
+  --gse-ui-dataTableItems-tablePagination-divider-color: #b4bccb;
+  --gse-ui-dataTableItems-tablePagination-divider-width: 1px;
+  --gse-ui-dataTableItems-tablePagination-divider-style: solid;
+  --gse-ui-dataTableItems-tablePagination-defaultText-fontFamily: Roboto;
+  --gse-ui-dataTableItems-tablePagination-defaultText-fontWeight: 400;
+  --gse-ui-dataTableItems-tablePagination-defaultText-fontSize: 12px;
+  --gse-ui-dataTableItems-tablePagination-defaultText-lineHeight: 18px;
+  --gse-ui-dataTableItems-tablePagination-currentResultText-fontFamily: Roboto;
+  --gse-ui-dataTableItems-tablePagination-currentResultText-fontWeight: 700;
+  --gse-ui-dataTableItems-tablePagination-currentResultText-fontSize: 12px;
+  --gse-ui-dataTableItems-tablePagination-currentResultText-lineHeight: 18px;
   --gse-ui-dataTableItems-tablePagination-defaultBackgroundColor: #ffffff;
   --gse-ui-dataTableItems-tablePagination-foregroundColor: #1b2c48;
   --gse-ui-dataTableItems-tablePagination-countDisplay-gap: 4px;
@@ -713,7 +963,10 @@
   --gse-ui-avatar-large-badge-size: 24px;
   --gse-ui-avatar-large-focusRing-size: 98px;
   --gse-ui-avatar-large-content-size: 84px;
-  --gse-ui-avatar-large-initials: 600 36px/1 Roboto;
+  --gse-ui-avatar-large-initials-fontFamily: Roboto;
+  --gse-ui-avatar-large-initials-fontWeight: 600;
+  --gse-ui-avatar-large-initials-fontSize: 36px;
+  --gse-ui-avatar-large-initials-lineHeight: 1;
   --gse-ui-avatar-large-presenceRing-width: 4px;
   --gse-ui-avatar-large-ucIntegration-size: 32px;
   --gse-ui-avatar-presenceRing-available: linear-gradient(135deg, #3c8527 0%, #95c189 100%);
@@ -726,19 +979,28 @@
   --gse-ui-avatar-medium-badge-size: 16px;
   --gse-ui-avatar-medium-focusRing-size: 50px;
   --gse-ui-avatar-medium-content-size: 40px;
-  --gse-ui-avatar-medium-initials: 600 18px/1 Roboto;
+  --gse-ui-avatar-medium-initials-fontFamily: Roboto;
+  --gse-ui-avatar-medium-initials-lineHeight: 1;
+  --gse-ui-avatar-medium-initials-fontSize: 18px;
+  --gse-ui-avatar-medium-initials-fontWeight: 600;
   --gse-ui-avatar-medium-presenceRing-width: 3px;
   --gse-ui-avatar-small-size: 32px;
   --gse-ui-avatar-small-badge-size: 8px;
   --gse-ui-avatar-small-focusRing-size: 34px;
   --gse-ui-avatar-small-content-size: 26px;
-  --gse-ui-avatar-small-initials: 600 12px/1 Roboto;
+  --gse-ui-avatar-small-initials-fontFamily: Roboto;
+  --gse-ui-avatar-small-initials-lineHeight: 1;
+  --gse-ui-avatar-small-initials-fontSize: 12px;
+  --gse-ui-avatar-small-initials-fontWeight: 600;
   --gse-ui-avatar-small-substract-size: 30px;
   --gse-ui-avatar-small-presenceRing-width: 2px;
   --gse-ui-avatar-xsmall-size: 24px;
   --gse-ui-avatar-xsmall-focusRing-size: 26px;
   --gse-ui-avatar-xsmall-content-size: 18px;
-  --gse-ui-avatar-xsmall-initials: 600 8px/1 Roboto;
+  --gse-ui-avatar-xsmall-initials-fontFamily: Roboto;
+  --gse-ui-avatar-xsmall-initials-lineHeight: 1;
+  --gse-ui-avatar-xsmall-initials-fontSize: 8px;
+  --gse-ui-avatar-xsmall-initials-fontWeight: 600;
   --gse-ui-avatar-xsmall-presenceRing-width: 2px;
   --gse-ui-avatar-badge-available-color: #09b581;
   --gse-ui-avatar-badge-busy-color: #e22245;
@@ -757,11 +1019,11 @@
   --gse-ui-avatar-media-initialsBackground-accent2: #c2deb9;
   --gse-ui-avatar-media-initialsBackground-accent3: #205a10;
   --gse-ui-avatar-media-initialsBackground-accent4: #75a8ff;
-  --gse-ui-avatar-media-initialsBackground-accent5: lch(90.4 14.8 272);
-  --gse-ui-avatar-media-initialsBackground-accent6: lch(90.4 14.8 272);
+  --gse-ui-avatar-media-initialsBackground-accent5: #d9e4ff;
+  --gse-ui-avatar-media-initialsBackground-accent6: #d9e4ff;
   --gse-ui-avatar-media-initialsBackground-accent7: #5e5782;
   --gse-ui-avatar-media-initialsBackground-accent8: #ff8fdd;
-  --gse-ui-avatar-media-initialsBackground-accent9: lch(92.1 16.4 338);
+  --gse-ui-avatar-media-initialsBackground-accent9: #ffdff5;
   --gse-ui-avatar-media-initialsBackground-accent10: #ddd933;
   --gse-ui-avatar-media-initialsBackground-accent11: #fcd276;
   --gse-ui-avatar-media-initialsBackground-accent12: #755000;
@@ -770,28 +1032,51 @@
   --gse-ui-avatar-media-initialsForeground-default: #1b2c48;
   --gse-ui-avatar-media-initialsForeground-inverse: #ffffff;
   --gse-ui-avatar-media-initialsForeground-add: #2e394c;
-  --gse-ui-avatar-hoverModal-shroudColor: rgb(12.5% 16.1% 21.6% / 0.8);
+  --gse-ui-avatar-hoverModal-shroudColor: #202937cc;
   --gse-ui-avatar-hoverModal-foregroundColor: #ffffff;
-  --gse-ui-avatar-hoverModal-opacity: 0.8;
+  --gse-ui-avatar-hoverModal-opacity: .8;
   --gse-ui-avatar-content-borderRadius: 100%;
-  --gse-ui-avatar-content-default-border: 1px solid #ffffff;
-  --gse-ui-avatar-content-large-border: 2px solid #ffffff;
+  --gse-ui-avatar-content-default-border-color: #ffffff;
+  --gse-ui-avatar-content-default-border-width: 1px;
+  --gse-ui-avatar-content-default-border-style: solid;
+  --gse-ui-avatar-content-large-border-color: #ffffff;
+  --gse-ui-avatar-content-large-border-width: 2px;
+  --gse-ui-avatar-content-large-border-style: solid;
   --gse-ui-avatar-groupSet-gap: -2px;
   --gse-ui-avatar-focusRing-large-borderRadius: 100%;
-  --gse-ui-avatar-focusRing-large-border: 2px solid #aac9ff;
+  --gse-ui-avatar-focusRing-large-border-color: #aac9ff;
+  --gse-ui-avatar-focusRing-large-border-width: 2px;
+  --gse-ui-avatar-focusRing-large-border-style: solid;
   --gse-ui-avatar-focusRing-mediumSmall-borderRadius: 100%;
-  --gse-ui-avatar-focusRing-medium-border: 2px solid #aac9ff;
-  --gse-ui-avatar-focusRing-small-border: 2px solid #aac9ff;
-  --gse-ui-avatar-focusRing-xsmall-border: 2px solid #aac9ff;
+  --gse-ui-avatar-focusRing-medium-border-color: #aac9ff;
+  --gse-ui-avatar-focusRing-medium-border-width: 2px;
+  --gse-ui-avatar-focusRing-medium-border-style: solid;
+  --gse-ui-avatar-focusRing-small-border-color: #aac9ff;
+  --gse-ui-avatar-focusRing-small-border-width: 2px;
+  --gse-ui-avatar-focusRing-small-border-style: solid;
+  --gse-ui-avatar-focusRing-xsmall-border-color: #aac9ff;
+  --gse-ui-avatar-focusRing-xsmall-border-width: 2px;
+  --gse-ui-avatar-focusRing-xsmall-border-style: solid;
   --gse-ui-avatar-focus: #aac9ff;
   --gse-ui-avatar-addChangeImage-hoverModal-shroudSize: 84px;
   --gse-ui-avatar-addChangeImage-icon-size: 16px;
   --gse-ui-globalNav-sideMenu: linear-gradient(135deg, #09b581 0%, #9de1cd 100%);
-  --gse-ui-globalNav-text: 700 12px/16px Roboto;
-  --gse-ui-globalNav-toggle-onQueue-text: 600 12px/16px Roboto;
+  --gse-ui-globalNav-text-fontFamily: Roboto;
+  --gse-ui-globalNav-text-lineHeight: 16px;
+  --gse-ui-globalNav-text-fontSize: 12px;
+  --gse-ui-globalNav-text-fontWeight: 700;
+  --gse-ui-globalNav-toggle-onQueue-text-fontFamily: Roboto;
+  --gse-ui-globalNav-toggle-onQueue-text-lineHeight: 16px;
+  --gse-ui-globalNav-toggle-onQueue-text-fontSize: 12px;
+  --gse-ui-globalNav-toggle-onQueue-text-fontWeight: 600;
   --gse-ui-globalNav-toggle-gap: 16px;
-  --gse-ui-globalNav-toggle-offQueue-text: 400 12px/16px Roboto;
-  --gse-ui-globalNav-focus-border: 3px solid #7b88f7;
+  --gse-ui-globalNav-toggle-offQueue-text-fontFamily: Roboto;
+  --gse-ui-globalNav-toggle-offQueue-text-lineHeight: 16px;
+  --gse-ui-globalNav-toggle-offQueue-text-fontSize: 12px;
+  --gse-ui-globalNav-toggle-offQueue-text-fontWeight: 400;
+  --gse-ui-globalNav-focus-border-color: #7b88f7;
+  --gse-ui-globalNav-focus-border-width: 3px;
+  --gse-ui-globalNav-focus-border-style: solid;
   --gse-ui-globalNav-menuOption-height: 32px;
   --gse-ui-globalNav-menuOption-width: 248px;
   --gse-ui-globalNav-menuOption-padding: 0px 12px;
@@ -818,7 +1103,9 @@
   --gse-ui-globalNav-buttonReturn-width: 280px;
   --gse-ui-globalNav-buttonReturn-padding: 16px 28px;
   --gse-ui-globalNav-buttonReturn-gap: 12px;
-  --gse-ui-globalNav-treeView-border: 2px solid #3e5374;
+  --gse-ui-globalNav-treeView-border-color: #3e5374;
+  --gse-ui-globalNav-treeView-border-width: 2px;
+  --gse-ui-globalNav-treeView-border-style: solid;
   --gse-ui-globalNav-treeView-gap: 8px;
   --gse-ui-globalNav-treeView-width: 224px;
   --gse-ui-globalNav-bar-padding: 8px 12px;
@@ -827,7 +1114,7 @@
   --gse-ui-globalNav-topBar-height: 64px;
   --gse-ui-globalNav-topBar-frame-backgroundColor: #ffffff;
   --gse-ui-globalNav-topBar-frame-stroke: #c6ceec;
-  --gse-ui-globalNav-topBar-logo: #ff4f1f; /* Brand Orange from Spark 1.0 */
+  --gse-ui-globalNav-topBar-logo: #ff4f1f;
   --gse-ui-globalNav-topBar-menuButton-closed-default-foregroundColor: #4856cb;
   --gse-ui-globalNav-topBar-menuButton-closed-hover-backgroundColor: #3742a2;
   --gse-ui-globalNav-topBar-menuButton-closed-hover-foregroundColorStroke: #4856cb;
@@ -838,14 +1125,24 @@
   --gse-ui-globalNav-panel-panelTitle: #ffffff;
   --gse-ui-globalNav-panel-primary: linear-gradient(127deg, #23395d 3.19%, #3e5374 225.06%);
   --gse-ui-globalNav-panel-secondary: linear-gradient(358deg, #1b2b48 0.16%, #23395d 98.45%);
-  --gse-ui-dataTableComposed-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
+  --gse-ui-dataTableComposed-boxShadow-blur: 4px;
+  --gse-ui-dataTableComposed-boxShadow-spread: 1px;
+  --gse-ui-dataTableComposed-boxShadow-color: rgba(35, 57, 92, 0.1);
+  --gse-ui-dataTableComposed-boxShadow-type: dropShadow;
+  --gse-ui-dataTableComposed-boxShadow-offsetX: 0;
+  --gse-ui-dataTableComposed-boxShadow-offsetY: 0;
   --gse-ui-dataTableComposed-width: 1440px;
-  --gse-ui-focus: 2px solid #aac9ff;
+  --gse-ui-focus-color: #aac9ff;
+  --gse-ui-focus-width: 2px;
+  --gse-ui-focus-style: solid;
   --gse-ui-tabs-item-height: 40px;
   --gse-ui-tabs-item-horizontal-fixedHeight: 40px;
   --gse-ui-tabs-item-horizontal-padding: 11px 12px 10px;
-  --gse-ui-tabs-item-disableOpacity: 0.5;
-  --gse-ui-tabs-item-itemText: 400 12px/18px Roboto;
+  --gse-ui-tabs-item-disableOpacity: .5;
+  --gse-ui-tabs-item-itemText-fontFamily: Roboto;
+  --gse-ui-tabs-item-itemText-fontWeight: 400;
+  --gse-ui-tabs-item-itemText-fontSize: 12px;
+  --gse-ui-tabs-item-itemText-lineHeight: 18px;
   --gse-ui-tabs-item-itemTextColor: #2e394c;
   --gse-ui-tabs-item-divider-horizontal-height: 1px;
   --gse-ui-tabs-item-divider-vertical-height: 40px;
@@ -871,13 +1168,17 @@
   --gse-ui-tabs-set-gap: -1px;
   --gse-ui-tabs-set-divider-horizontal-height: 1px;
   --gse-ui-tabs-set-divider-vertical-width: 1px;
-  --gse-ui-tabs-focusRing-border: 2px solid #aac9ff;
+  --gse-ui-tabs-focusRing-border-color: #aac9ff;
+  --gse-ui-tabs-focusRing-border-width: 2px;
+  --gse-ui-tabs-focusRing-border-style: solid;
   --gse-ui-tabs-focusRing-borderRadius: 4px;
   --gse-ui-advancedTabs-divider-dividerColor: #b4bccb;
   --gse-ui-advancedTabs-item-padding: 11px 12px 10px;
   --gse-ui-advancedTabs-item-gap: 8px;
   --gse-ui-advancedTabs-item-focus-borderRadius: 8px;
-  --gse-ui-advancedTabs-item-focus-border: 2px solid #aac9ff;
+  --gse-ui-advancedTabs-item-focus-border-color: #aac9ff;
+  --gse-ui-advancedTabs-item-focus-border-width: 2px;
+  --gse-ui-advancedTabs-item-focus-border-style: solid;
   --gse-ui-advancedTabs-item-focus-borderCopy: 4px;
   --gse-ui-advancedTabs-item-backgroundColor: #ffffff;
   --gse-ui-advancedTabs-item-borderRadius: 4px 4px 0 0;
@@ -902,7 +1203,10 @@
   --gse-ui-advancedTabs-item-menuButton-activeColor: #2e394c;
   --gse-ui-advancedTabs-item-menuButton-focus-height: 53px;
   --gse-ui-advancedTabs-item-menuButton-focus-width: 40px;
-  --gse-ui-advancedTabs-item-itemText: 400 12px/18px Roboto;
+  --gse-ui-advancedTabs-item-itemText-fontFamily: Roboto;
+  --gse-ui-advancedTabs-item-itemText-fontWeight: 400;
+  --gse-ui-advancedTabs-item-itemText-fontSize: 12px;
+  --gse-ui-advancedTabs-item-itemText-lineHeight: 18px;
   --gse-ui-advancedTabs-button-add-height: 45px;
   --gse-ui-advancedTabs-button-arrow-height: 48px;
   --gse-ui-advancedTabs-set-backgroundColor: #f6f7f9;
@@ -923,38 +1227,62 @@
   --gse-ui-toast-error-backgroundColor: #ffffff;
   --gse-ui-toast-error-foregroundColor: #2e394c;
   --gse-ui-toast-error-iconColor: #ea0b0b;
-  --gse-ui-toast-heading: 700 16px/24px Roboto;
-  --gse-ui-toast-text: 400 14px/20px Roboto;
+  --gse-ui-toast-heading-fontFamily: Roboto;
+  --gse-ui-toast-heading-fontWeight: 700;
+  --gse-ui-toast-heading-fontSize: 16px;
+  --gse-ui-toast-heading-lineHeight: 24px;
+  --gse-ui-toast-text-fontFamily: Roboto;
+  --gse-ui-toast-text-fontWeight: 400;
+  --gse-ui-toast-text-fontSize: 14px;
+  --gse-ui-toast-text-lineHeight: 20px;
   --gse-ui-toast-margin: 16px;
   --gse-ui-toast-gap: 12px;
   --gse-ui-toast-gapText: 4px;
   --gse-ui-toast-gapButton: 16px;
   --gse-ui-toast-buttonBar-gap: 8px;
   --gse-ui-toast-borderRadius: 4px;
-  --gse-ui-toast-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
+  --gse-ui-toast-boxShadow-blur: 4px;
+  --gse-ui-toast-boxShadow-spread: 1px;
+  --gse-ui-toast-boxShadow-color: rgba(35, 57, 92, 0.1);
+  --gse-ui-toast-boxShadow-type: dropShadow;
+  --gse-ui-toast-boxShadow-offsetX: 0;
+  --gse-ui-toast-boxShadow-offsetY: 0;
   --gse-ui-toast-icon: 24px;
   --gse-ui-toast-wrappingWidth: 320px;
   --gse-ui-toast-stacking-gap: 4px;
   --gse-ui-modal-closeButtonColor: #3e4a5b;
   --gse-ui-modal-headerColor: #2e394c;
   --gse-ui-modal-backgroundColor: #ffffff;
-  --gse-ui-modal-shroudColor: rgb(12.5% 16.1% 21.6% / 0.8);
+  --gse-ui-modal-shroudColor: #202937cc;
   --gse-ui-modal-header-gap: 12px;
   --gse-ui-modal-padding: 32px;
   --gse-ui-modal-gap: 16px;
-  --gse-ui-modal-heading: 700 24px/32px Roboto;
+  --gse-ui-modal-heading-fontFamily: Roboto;
+  --gse-ui-modal-heading-fontWeight: 700;
+  --gse-ui-modal-heading-fontSize: 24px;
+  --gse-ui-modal-heading-lineHeight: 32px;
   --gse-ui-modal-icon: 32px;
   --gse-ui-modal-small-width: 420px;
   --gse-ui-modal-medium-width: 680px;
   --gse-ui-modal-large-width: 800px;
   --gse-ui-modal-buttonBar-gap: 8px;
-  --gse-ui-modal-boxShadow: 0 0 8px 1px rgba(35,57,92,0.15);
+  --gse-ui-modal-boxShadow-blur: 8px;
+  --gse-ui-modal-boxShadow-spread: 1px;
+  --gse-ui-modal-boxShadow-color: rgba(35, 57, 92, 0.15);
+  --gse-ui-modal-boxShadow-type: dropShadow;
+  --gse-ui-modal-boxShadow-offsetX: 0;
+  --gse-ui-modal-boxShadow-offsetY: 0;
   --gse-ui-modal-borderRadius: 4px;
-  --gse-ui-modal-shroud-opacity: 0.8;
+  --gse-ui-modal-shroud-opacity: .8;
   --gse-ui-modal-dismissButton-paddingTop: 16px;
   --gse-ui-modal-dismissButton-paddingRight: 8px;
   --gse-ui-popover-borderRadius: 4px;
-  --gse-ui-popover-boxShadow: 0 0 8px 1px rgba(35,57,92,0.15);
+  --gse-ui-popover-boxShadow-blur: 8px;
+  --gse-ui-popover-boxShadow-spread: 1px;
+  --gse-ui-popover-boxShadow-color: rgba(35, 57, 92, 0.15);
+  --gse-ui-popover-boxShadow-type: dropShadow;
+  --gse-ui-popover-boxShadow-offsetX: 0;
+  --gse-ui-popover-boxShadow-offsetY: 0;
   --gse-ui-popover-closeButtonColor: #3e4a5b;
   --gse-ui-popover-headerColor: #2e394c;
   --gse-ui-popover-backgroundColor: #ffffff;
@@ -963,24 +1291,51 @@
   --gse-ui-popover-buttonsBar-gap: 8px;
   --gse-ui-popover-header-gap: 4px;
   --gse-ui-popover-spacer-height: 16px;
-  --gse-ui-popover-body-text: 400 14px/20px Roboto;
-  --gse-ui-popover-title-text: 700 16px/24px Roboto;
+  --gse-ui-popover-body-text-fontFamily: Roboto;
+  --gse-ui-popover-body-text-fontWeight: 400;
+  --gse-ui-popover-body-text-fontSize: 14px;
+  --gse-ui-popover-body-text-lineHeight: 20px;
+  --gse-ui-popover-title-text-fontFamily: Roboto;
+  --gse-ui-popover-title-text-fontWeight: 700;
+  --gse-ui-popover-title-text-fontSize: 16px;
+  --gse-ui-popover-title-text-lineHeight: 24px;
   --gse-ui-popover-anchor-width: 20px;
   --gse-ui-popover-anchor-height: 8px;
   --gse-ui-progressAndLoading-spinner-foreground: #2a60c8;
   --gse-ui-progressAndLoading-spinner-base: #deeaff;
-  --gse-ui-progressAndLoading-spinner-large: 48px; /* keeping hard code as it cant have "px" */
-  --gse-ui-progressAndLoading-spinner-small: 16px; /* keeping hard code as it cant have "px" */
-  --gse-ui-progressAndLoading-spinner-text: 600 12px/18px Roboto;
+  --gse-ui-progressAndLoading-spinner-large: 48px;
+  --gse-ui-progressAndLoading-spinner-small: 16px;
+  --gse-ui-progressAndLoading-spinner-text-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-spinner-text-fontWeight: 600;
+  --gse-ui-progressAndLoading-spinner-text-fontSize: 12px;
+  --gse-ui-progressAndLoading-spinner-text-lineHeight: 18px;
   --gse-ui-progressAndLoading-textColor: #2e394c;
-  --gse-ui-progressAndLoading-loadingState-large-header: 700 24px/32px Roboto;
-  --gse-ui-progressAndLoading-loadingState-large-subheader: 600 16px/24px Roboto;
+  --gse-ui-progressAndLoading-loadingState-large-header-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-loadingState-large-header-fontWeight: 700;
+  --gse-ui-progressAndLoading-loadingState-large-header-fontSize: 24px;
+  --gse-ui-progressAndLoading-loadingState-large-header-lineHeight: 32px;
+  --gse-ui-progressAndLoading-loadingState-large-subheader-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-loadingState-large-subheader-fontWeight: 600;
+  --gse-ui-progressAndLoading-loadingState-large-subheader-fontSize: 16px;
+  --gse-ui-progressAndLoading-loadingState-large-subheader-lineHeight: 24px;
   --gse-ui-progressAndLoading-loadingState-large-width: 600px;
-  --gse-ui-progressAndLoading-loadingState-medium-header: 700 18px/27px Roboto;
-  --gse-ui-progressAndLoading-loadingState-medium-subheader: 600 14px/20px Roboto;
+  --gse-ui-progressAndLoading-loadingState-medium-header-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-loadingState-medium-header-fontWeight: 700;
+  --gse-ui-progressAndLoading-loadingState-medium-header-fontSize: 18px;
+  --gse-ui-progressAndLoading-loadingState-medium-header-lineHeight: 27px;
+  --gse-ui-progressAndLoading-loadingState-medium-subheader-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-loadingState-medium-subheader-fontWeight: 600;
+  --gse-ui-progressAndLoading-loadingState-medium-subheader-fontSize: 14px;
+  --gse-ui-progressAndLoading-loadingState-medium-subheader-lineHeight: 20px;
   --gse-ui-progressAndLoading-loadingState-medium-width: 400px;
-  --gse-ui-progressAndLoading-loadingState-small-header: 700 16px/24px Roboto;
-  --gse-ui-progressAndLoading-loadingState-small-subheader: 600 12px/18px Roboto;
+  --gse-ui-progressAndLoading-loadingState-small-header-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-loadingState-small-header-fontWeight: 700;
+  --gse-ui-progressAndLoading-loadingState-small-header-fontSize: 16px;
+  --gse-ui-progressAndLoading-loadingState-small-header-lineHeight: 24px;
+  --gse-ui-progressAndLoading-loadingState-small-subheader-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-loadingState-small-subheader-fontWeight: 600;
+  --gse-ui-progressAndLoading-loadingState-small-subheader-fontSize: 12px;
+  --gse-ui-progressAndLoading-loadingState-small-subheader-lineHeight: 18px;
   --gse-ui-progressAndLoading-loadingState-small-width: 200px;
   --gse-ui-progressAndLoading-large-gap: 24px;
   --gse-ui-progressAndLoading-large-gapText: 4px;
@@ -989,13 +1344,25 @@
   --gse-ui-progressAndLoading-medium-gapText: 4px;
   --gse-ui-progressAndLoading-small-gap: 12px;
   --gse-ui-progressAndLoading-small-gapText: 4px;
-  --gse-ui-progressAndLoading-blankState-large-header: 700 18px/27px Roboto;
-  --gse-ui-progressAndLoading-blankState-large-subheader: 600 14px/20px Roboto;
-  --gse-ui-progressAndLoading-blankState-small-header: 700 14px/24px Roboto;
-  --gse-ui-progressAndLoading-blankState-small-subheader: 600 12px/18px Roboto;
-  --gse-ui-progressAndLoading-largeBorder: 4px; /* Remove px because of SVG issues from COMUI-2226 */
-  --gse-ui-progressAndLoading-smallBorder: 2px; /* Remove px because of SVG issues from COMUI-2226 */
-  --gse-ui-progressAndLoading-thinBorder: 1px; /* Remove px because of SVG issues from COMUI-2226 */
+  --gse-ui-progressAndLoading-blankState-large-header-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-blankState-large-header-fontWeight: 700;
+  --gse-ui-progressAndLoading-blankState-large-header-fontSize: 18px;
+  --gse-ui-progressAndLoading-blankState-large-header-lineHeight: 27px;
+  --gse-ui-progressAndLoading-blankState-large-subheader-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-blankState-large-subheader-fontWeight: 600;
+  --gse-ui-progressAndLoading-blankState-large-subheader-fontSize: 14px;
+  --gse-ui-progressAndLoading-blankState-large-subheader-lineHeight: 20px;
+  --gse-ui-progressAndLoading-blankState-small-header-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-blankState-small-header-fontWeight: 700;
+  --gse-ui-progressAndLoading-blankState-small-header-fontSize: 14px;
+  --gse-ui-progressAndLoading-blankState-small-header-lineHeight: 24px;
+  --gse-ui-progressAndLoading-blankState-small-subheader-fontFamily: Roboto;
+  --gse-ui-progressAndLoading-blankState-small-subheader-fontWeight: 600;
+  --gse-ui-progressAndLoading-blankState-small-subheader-fontSize: 12px;
+  --gse-ui-progressAndLoading-blankState-small-subheader-lineHeight: 18px;
+  --gse-ui-progressAndLoading-largeBorder: 4px;
+  --gse-ui-progressAndLoading-smallBorder: 2px;
+  --gse-ui-progressAndLoading-thinBorder: 1px;
   --gse-ui-blankState-small-width: 250px;
   --gse-ui-blankState-small-maxWidth: 569px;
   --gse-ui-blankState-large-minWidth: 570px;
@@ -1013,11 +1380,17 @@
   --gse-ui-modalSideSheet-headerColor: #2e394c;
   --gse-ui-modalSideSheet-closeColor: #3e4a5b;
   --gse-ui-modalSideSheet-dividerColor: #b4bccb;
-  --gse-ui-modalSideSheet-shroudColor: rgb(12.5% 16.1% 21.6% / 0.8);
-  --gse-ui-modalSideSheet-shroud-opacity: 0.8;
+  --gse-ui-modalSideSheet-shroudColor: #202937cc;
+  --gse-ui-modalSideSheet-shroud-opacity: .8;
   --gse-ui-modalSideSheet-descriptionColor: #3e4a5b;
-  --gse-ui-modalSideSheet-heading: 600 18px/27px Roboto;
-  --gse-ui-modalSideSheet-description: 400 12px/18px Roboto;
+  --gse-ui-modalSideSheet-heading-fontFamily: Roboto;
+  --gse-ui-modalSideSheet-heading-fontWeight: 600;
+  --gse-ui-modalSideSheet-heading-fontSize: 18px;
+  --gse-ui-modalSideSheet-heading-lineHeight: 27px;
+  --gse-ui-modalSideSheet-description-fontFamily: Roboto;
+  --gse-ui-modalSideSheet-description-fontWeight: 400;
+  --gse-ui-modalSideSheet-description-fontSize: 12px;
+  --gse-ui-modalSideSheet-description-lineHeight: 18px;
   --gse-ui-modalSideSheet-header-interiorGap: 12px;
   --gse-ui-modalSideSheet-header-paddingTop: 24px;
   --gse-ui-modalSideSheet-header-paddingLeft: 24px;
@@ -1034,10 +1407,21 @@
   --gse-ui-dynamicSideSheet-headerColor: #2e394c;
   --gse-ui-dynamicSideSheet-closeColor: #3e4a5b;
   --gse-ui-dynamicSideSheet-dividerColor: #b4bccb;
-  --gse-ui-dynamicSideSheet-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
+  --gse-ui-dynamicSideSheet-boxShadow-blur: 6px;
+  --gse-ui-dynamicSideSheet-boxShadow-spread: 1px;
+  --gse-ui-dynamicSideSheet-boxShadow-color: rgba(35, 57, 92, 0.12);
+  --gse-ui-dynamicSideSheet-boxShadow-type: dropShadow;
+  --gse-ui-dynamicSideSheet-boxShadow-offsetX: 0;
+  --gse-ui-dynamicSideSheet-boxShadow-offsetY: 0;
   --gse-ui-dynamicSideSheet-descriptionColor: #3e4a5b;
-  --gse-ui-dynamicSideSheet-heading: 600 18px/27px Roboto;
-  --gse-ui-dynamicSideSheet-description: 400 12px/18px Roboto;
+  --gse-ui-dynamicSideSheet-heading-fontFamily: Roboto;
+  --gse-ui-dynamicSideSheet-heading-fontWeight: 600;
+  --gse-ui-dynamicSideSheet-heading-fontSize: 18px;
+  --gse-ui-dynamicSideSheet-heading-lineHeight: 27px;
+  --gse-ui-dynamicSideSheet-description-fontFamily: Roboto;
+  --gse-ui-dynamicSideSheet-description-fontWeight: 400;
+  --gse-ui-dynamicSideSheet-description-fontSize: 12px;
+  --gse-ui-dynamicSideSheet-description-lineHeight: 18px;
   --gse-ui-dynamicSideSheet-header-interiorGap: 12px;
   --gse-ui-dynamicSideSheet-header-paddingTop: 24px;
   --gse-ui-dynamicSideSheet-header-paddingLeft: 24px;
@@ -1057,7 +1441,10 @@
   --gse-ui-accordion-header-default-foreground-chevronIcon-closed: #3e4a5b;
   --gse-ui-accordion-header-default-foreground-chevronIcon-open: #2e394c;
   --gse-ui-accordion-header-default-foreground-chevronIcon-hover: #2e394c;
-  --gse-ui-accordion-header-label-defaultText: 700 14px/20px Roboto;
+  --gse-ui-accordion-header-label-defaultText-fontFamily: Roboto;
+  --gse-ui-accordion-header-label-defaultText-fontWeight: 700;
+  --gse-ui-accordion-header-label-defaultText-fontSize: 14px;
+  --gse-ui-accordion-header-label-defaultText-lineHeight: 20px;
   --gse-ui-accordion-reversedHeader-padding: 2px;
   --gse-ui-accordion-menuItem-height: 32px;
   --gse-ui-accordion-menuItem-padding: 0 12px 0 24px;
@@ -1079,19 +1466,35 @@
   --gse-ui-accordion-menuItem-selected-foreground-parentIconColor: #2e394c;
   --gse-ui-accordion-menuItem-selected-backgroundColor: #e2e6ee;
   --gse-ui-accordion-menuItem-focus-borderRadius: 4px;
-  --gse-ui-accordion-menuItem-label-defaultText: 400 12px/18px Roboto;
-  --gse-ui-accordion-menuItem-label-selectedText: 600 12px/18px Roboto;
-  --gse-ui-accordion-menuItem-shortcut-text: 400 14px/20px Roboto;
-  --gse-ui-accordion-focusBorder: 2px solid #aac9ff;
+  --gse-ui-accordion-menuItem-label-defaultText-fontFamily: Roboto;
+  --gse-ui-accordion-menuItem-label-defaultText-fontWeight: 400;
+  --gse-ui-accordion-menuItem-label-defaultText-fontSize: 12px;
+  --gse-ui-accordion-menuItem-label-defaultText-lineHeight: 18px;
+  --gse-ui-accordion-menuItem-label-selectedText-fontFamily: Roboto;
+  --gse-ui-accordion-menuItem-label-selectedText-fontWeight: 600;
+  --gse-ui-accordion-menuItem-label-selectedText-fontSize: 12px;
+  --gse-ui-accordion-menuItem-label-selectedText-lineHeight: 18px;
+  --gse-ui-accordion-menuItem-shortcut-text-fontFamily: Roboto;
+  --gse-ui-accordion-menuItem-shortcut-text-fontWeight: 400;
+  --gse-ui-accordion-menuItem-shortcut-text-fontSize: 14px;
+  --gse-ui-accordion-menuItem-shortcut-text-lineHeight: 20px;
+  --gse-ui-accordion-focusBorder-color: #aac9ff;
+  --gse-ui-accordion-focusBorder-style: solid;
+  --gse-ui-accordion-focusBorder-width: 2px;
   --gse-ui-accordion-contentItem-padding: 16px;
   --gse-ui-accordion-contentItem-gap: 16px;
   --gse-ui-accordion-contentItem-foregroundColor: #2e394c;
   --gse-ui-accordion-contentItem-backgroundColor: #ffffff;
-  --gse-ui-accordion-contentItem-defaultText: 400 12px/18px Roboto;
-  --gse-ui-accordion-wrapper-dividerBorder: 1px solid #b4bccb;
+  --gse-ui-accordion-contentItem-defaultText-fontFamily: Roboto;
+  --gse-ui-accordion-contentItem-defaultText-fontWeight: 400;
+  --gse-ui-accordion-contentItem-defaultText-fontSize: 12px;
+  --gse-ui-accordion-contentItem-defaultText-lineHeight: 18px;
+  --gse-ui-accordion-wrapper-dividerBorder-color: #b4bccb;
+  --gse-ui-accordion-wrapper-dividerBorder-width: 1px;
+  --gse-ui-accordion-wrapper-dividerBorder-style: solid;
   --gse-ui-accordion-focus-offset-gap: 1px;
   --gse-ui-accordion-contentPanel-paddingBottom: 8px;
-  --gse-ui-accordion-label-disabled-opacity: 0.5;
+  --gse-ui-accordion-label-disabled-opacity: .5;
 }
 
 /*# sourceMappingURL=ui.css.map */