@adobe/react-spectrum 3.47.0 → 3.47.2

package/dist/private/button_vars.css

@@ -1,85 +1,94 @@
-.CqADjq_i18nFontFamily {
+._VbXxq_i18nFontFamily {
   font-synthesis: weight;
   font-family: adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
-}
 
-.CqADjq_i18nFontFamily:lang(ar) {
-  font-family: myriad-arabic, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
-}
+  &:lang(ar) {
+    font-family: myriad-arabic, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
+  }
 
-.CqADjq_i18nFontFamily:lang(he) {
-  font-family: myriad-hebrew, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
-}
+  &:lang(he) {
+    font-family: myriad-hebrew, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
+  }
 
-.CqADjq_i18nFontFamily:lang(zh) {
-  font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
-}
+  &:lang(zh) {
+    font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
+  }
 
-.CqADjq_i18nFontFamily:lang(zh-Hans) {
-  font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
-}
+  &:lang(zh-Hans) {
+    font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
+  }
 
-.CqADjq_i18nFontFamily:lang(zh-Hant) {
-  font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
-}
+  &:lang(zh-Hant) {
+    font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
+  }
 
-.CqADjq_i18nFontFamily:lang(zh-SG), .CqADjq_i18nFontFamily:lang(zh-CN) {
-  font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
-}
+  &:lang(zh-SG), &:lang(zh-CN) {
+    font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
+  }
 
-.CqADjq_i18nFontFamily:lang(ko) {
-  font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
-}
+  &:lang(ko) {
+    font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
+  }
 
-.CqADjq_i18nFontFamily:lang(ja) {
-  font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif;
+  &:lang(ja) {
+    font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif;
+  }
 }
 
-.CqADjq_spectrum-FocusRing-ring {
+._VbXxq_spectrum-FocusRing-ring {
   --spectrum-focus-ring-border-radius: var(--spectrum-textfield-border-radius, var(--spectrum-alias-border-radius-regular));
   --spectrum-focus-ring-gap: var(--spectrum-alias-input-focusring-gap);
   --spectrum-focus-ring-size: var(--spectrum-alias-input-focusring-size);
   --spectrum-focus-ring-border-size: 0px;
   --spectrum-focus-ring-color: var(--spectrum-high-contrast-focus-ring-color, var(--spectrum-alias-focus-ring-color, var(--spectrum-alias-focus-color)));
-}
 
-.CqADjq_spectrum-FocusRing-ring:after {
-  border-radius: calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));
-  content: "";
-  margin: calc(-1 * var(--spectrum-focus-ring-border-size));
-  pointer-events: none;
-  transition: box-shadow var(--spectrum-global-animation-duration-100, .13s) ease-out,
-                margin var(--spectrum-global-animation-duration-100, .13s) ease-out;
-  display: block;
-  position: absolute;
-  inset: 0;
+  &:after {
+    border-radius: calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));
+    content: "";
+    margin: calc(-1 * var(--spectrum-focus-ring-border-size));
+    pointer-events: none;
+    transition: box-shadow var(--spectrum-global-animation-duration-100, .13s) ease-out,
+      margin var(--spectrum-global-animation-duration-100, .13s) ease-out;
+    display: block;
+    position: absolute;
+    inset: 0;
+  }
 }
 
-.CqADjq_spectrum-FocusRing.CqADjq_focus-ring:after {
-  margin: calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size));
-  box-shadow: 0 0 0 var(--spectrum-focus-ring-size) var(--spectrum-focus-ring-color);
+._VbXxq_spectrum-FocusRing {
+  &._VbXxq_focus-ring {
+    &:after {
+      margin: calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size));
+      box-shadow: 0 0 0 var(--spectrum-focus-ring-size) var(--spectrum-focus-ring-color);
+    }
+  }
 }
 
-.CqADjq_spectrum-FocusRing--quiet:after {
-  border-radius: 0;
-}
+._VbXxq_spectrum-FocusRing--quiet {
+  &:after {
+    border-radius: 0;
+  }
 
-.CqADjq_spectrum-FocusRing--quiet.CqADjq_focus-ring:after {
-  margin: 0 0 calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size)) 0;
-  box-shadow: 0 var(--spectrum-focus-ring-size) 0 var(--spectrum-focus-ring-color);
+  &._VbXxq_focus-ring {
+    &:after {
+      margin: 0 0 calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size))
+        0;
+      box-shadow: 0 var(--spectrum-focus-ring-size) 0 var(--spectrum-focus-ring-color);
+    }
+  }
 }
 
 @media (forced-colors: active) {
-  .CqADjq_spectrum-FocusRing, .CqADjq_spectrum-FocusRing-ring, .CqADjq_spectrum-FocusRing--quiet {
+  ._VbXxq_spectrum-FocusRing, ._VbXxq_spectrum-FocusRing-ring, ._VbXxq_spectrum-FocusRing--quiet {
     --spectrum-high-contrast-focus-ring-color: Highlight;
-  }
 
-  :is(.CqADjq_spectrum-FocusRing, .CqADjq_spectrum-FocusRing-ring, .CqADjq_spectrum-FocusRing--quiet):after {
-    forced-color-adjust: none;
+    &:after {
+      forced-color-adjust: none;
+    }
   }
 }
 
-.CqADjq_spectrum-BaseButton {
+._VbXxq_spectrum-BaseButton {
   box-sizing: border-box;
   border-radius: var(--spectrum-button-border-radius);
   border-style: solid;
@@ -97,18 +106,16 @@
   display: inline-flex;
   position: relative;
   overflow: visible;
-}
 
-button.CqADjq_spectrum-BaseButton {
-  -webkit-appearance: button;
-}
+  button& {
+    -webkit-appearance: button;
+  }
 
-.CqADjq_spectrum-BaseButton {
   vertical-align: top;
   transition: background var(--spectrum-global-animation-duration-100, .13s) ease-out,
-              border-color var(--spectrum-global-animation-duration-100, .13s) ease-out,
-              color var(--spectrum-global-animation-duration-100, .13s) ease-out,
-              box-shadow var(--spectrum-global-animation-duration-100, .13s) ease-out;
+    border-color var(--spectrum-global-animation-duration-100, .13s) ease-out,
+    color var(--spectrum-global-animation-duration-100, .13s) ease-out,
+    box-shadow var(--spectrum-global-animation-duration-100, .13s) ease-out;
   -webkit-user-select: none;
   user-select: none;
   touch-action: none;
@@ -116,87 +123,90 @@ button.CqADjq_spectrum-BaseButton {
   isolation: isolate;
   line-height: 1.3;
   text-decoration: none;
-}
 
-.CqADjq_spectrum-BaseButton:focus {
-  outline: none;
-}
+  &:focus {
+    outline: none;
+  }
 
-.CqADjq_spectrum-BaseButton.CqADjq_focus-ring {
-  z-index: 3;
-}
+  &._VbXxq_focus-ring {
+    z-index: 3;
+  }
 
-.CqADjq_spectrum-BaseButton::-moz-focus-inner {
-  border: 0;
-  margin-block: -2px;
-  padding: 0;
-}
+  &::-moz-focus-inner {
+    border: 0;
+    margin-block: -2px;
+    padding: 0;
+  }
 
-.CqADjq_spectrum-BaseButton:disabled, .CqADjq_spectrum-BaseButton.CqADjq_is-disabled {
-  cursor: default;
-}
+  &:disabled, &._VbXxq_is-disabled {
+    cursor: default;
+  }
 
-.CqADjq_spectrum-BaseButton .CqADjq_spectrum-Icon {
-  max-block-size: 100%;
-  transition: background var(--spectrum-global-animation-duration-100, .13s) ease-out,
-                fill var(--spectrum-global-animation-duration-100, .13s) ease-out;
-  box-sizing: initial;
-  flex-shrink: 0;
-  order: 0;
+  & ._VbXxq_spectrum-Icon {
+    max-block-size: 100%;
+    transition: background var(--spectrum-global-animation-duration-100, .13s) ease-out,
+      fill var(--spectrum-global-animation-duration-100, .13s) ease-out;
+    box-sizing: initial;
+    flex-shrink: 0;
+    order: 0;
+  }
 }
 
-.CqADjq_spectrum-Button {
+._VbXxq_spectrum-Button {
   --spectrum-button-border-radius: var(--spectrum-button-primary-border-radius, var(--spectrum-alias-border-radius-large));
   --spectrum-button-border-width: var(--spectrum-button-primary-border-size, var(--spectrum-alias-border-size-thick));
   min-block-size: var(--spectrum-button-primary-height, var(--spectrum-alias-single-line-height));
   block-size: 0%;
   min-inline-size: var(--spectrum-button-primary-min-width);
-  padding: var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, var(--spectrum-alias-border-size-thick)));
+  padding: var(--spectrum-global-dimension-size-50)
+    calc(var(--spectrum-button-primary-padding-x, var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, var(--spectrum-alias-border-size-thick)));
   font-size: var(--spectrum-button-primary-text-size, var(--spectrum-alias-pill-button-text-size));
   font-weight: var(--spectrum-button-primary-text-font-weight, var(--spectrum-global-font-weight-bold));
   border-style: solid;
   padding-block-start: calc(var(--spectrum-global-dimension-size-50) - 1px);
   padding-block-end: calc(var(--spectrum-global-dimension-size-50) + 1px);
-}
 
-.CqADjq_spectrum-Button.CqADjq_is-hovered, .CqADjq_spectrum-Button:active {
-  box-shadow: none;
-}
+  &._VbXxq_is-hovered, &:active {
+    box-shadow: none;
+  }
 
-.CqADjq_spectrum-Button .CqADjq_spectrum-Icon + .CqADjq_spectrum-Button-label {
-  margin-inline-start: var(--spectrum-button-primary-text-gap, var(--spectrum-global-dimension-size-100));
-}
+  & ._VbXxq_spectrum-Icon + ._VbXxq_spectrum-Button-label {
+    margin-inline-start: var(--spectrum-button-primary-text-gap, var(--spectrum-global-dimension-size-100));
+  }
 
-.CqADjq_spectrum-Button .CqADjq_spectrum-Button-label + .CqADjq_spectrum-Icon {
-  margin-inline-end: var(--spectrum-button-primary-text-gap, var(--spectrum-global-dimension-size-100));
-}
+  & ._VbXxq_spectrum-Button-label + ._VbXxq_spectrum-Icon {
+    margin-inline-end: var(--spectrum-button-primary-text-gap, var(--spectrum-global-dimension-size-100));
+  }
 
-.CqADjq_spectrum-Button.CqADjq_spectrum-Button--iconOnly {
-  min-inline-size: unset;
-  padding: var(--spectrum-global-dimension-size-65);
-}
+  &._VbXxq_spectrum-Button--iconOnly {
+    min-inline-size: unset;
+    padding: var(--spectrum-global-dimension-size-65);
+  }
 
-.CqADjq_spectrum-Button .CqADjq_spectrum-Button-circleLoader {
-  align-items: center;
-  display: flex;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
+  & ._VbXxq_spectrum-Button-circleLoader {
+    align-items: center;
+    display: flex;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
 
-.CqADjq_spectrum-Button.CqADjq_spectrum-Button--pending .CqADjq_spectrum-Button-label, .CqADjq_spectrum-Button.CqADjq_spectrum-Button--pending .CqADjq_spectrum-Icon {
-  opacity: 0;
+  &._VbXxq_spectrum-Button--pending {
+    & ._VbXxq_spectrum-Button-label, & ._VbXxq_spectrum-Icon {
+      opacity: 0;
+    }
+  }
 }
 
-a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
+a._VbXxq_spectrum-Button, a._VbXxq_spectrum-ActionButton {
   -webkit-appearance: none;
   -webkit-user-select: none;
   user-select: none;
   cursor: pointer;
 }
 
-.CqADjq_spectrum-ActionButton {
+._VbXxq_spectrum-ActionButton {
   block-size: var(--spectrum-actionbutton-height, var(--spectrum-alias-single-line-height));
   min-inline-size: var(--spectrum-actionbutton-min-width, var(--spectrum-global-dimension-size-400));
   --spectrum-button-border-radius: var(--spectrum-actionbutton-border-radius, var(--spectrum-alias-border-radius-regular));
@@ -205,71 +215,71 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
   font-weight: var(--spectrum-actionbutton-text-font-weight, var(--spectrum-alias-body-text-font-weight));
   padding: 0;
   position: relative;
-}
 
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-Icon {
-  padding-inline-start: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
-}
+  & ._VbXxq_spectrum-Icon {
+    padding-inline-start: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
+  }
 
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-ActionButton-label {
-  padding-inline-end: var(--spectrum-actionbutton-text-padding-x, var(--spectrum-global-dimension-size-150));
-}
+  & ._VbXxq_spectrum-ActionButton-label {
+    padding-inline-end: var(--spectrum-actionbutton-text-padding-x, var(--spectrum-global-dimension-size-150));
+  }
 
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-Icon + .CqADjq_spectrum-ActionButton-label {
-  padding-inline-start: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
-}
+  & ._VbXxq_spectrum-Icon + ._VbXxq_spectrum-ActionButton-label {
+    padding-inline-start: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
+  }
 
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-ActionButton-label:not([hidden]) + .CqADjq_spectrum-Icon {
-  padding-inline-end: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
-}
+  & ._VbXxq_spectrum-ActionButton-label:not([hidden]) + ._VbXxq_spectrum-Icon {
+    padding-inline-end: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
+  }
 
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-ActionButton-label:only-child, .CqADjq_spectrum-ActionButton .CqADjq_spectrum-ActionButton-hold + .CqADjq_spectrum-ActionButton-label:last-child {
-  padding-inline-start: var(--spectrum-actionbutton-text-padding-x, var(--spectrum-global-dimension-size-150));
-}
+  & ._VbXxq_spectrum-ActionButton-label:only-child, & ._VbXxq_spectrum-ActionButton-hold + ._VbXxq_spectrum-ActionButton-label:last-child {
+    padding-inline-start: var(--spectrum-actionbutton-text-padding-x, var(--spectrum-global-dimension-size-150));
+  }
 
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-Icon:only-child, .CqADjq_spectrum-ActionButton .CqADjq_spectrum-ActionButton-hold + .CqADjq_spectrum-Icon:last-child {
-  padding-inline-end: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
-}
+  & ._VbXxq_spectrum-Icon:only-child, & ._VbXxq_spectrum-ActionButton-hold + ._VbXxq_spectrum-Icon:last-child {
+    padding-inline-end: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
+  }
 
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-ActionGroup-itemIcon.CqADjq_spectrum-ActionGroup-itemIcon {
-  padding-inline-end: 0;
+  & ._VbXxq_spectrum-ActionGroup-itemIcon._VbXxq_spectrum-ActionGroup-itemIcon {
+    padding-inline-end: 0;
+  }
 }
 
-.CqADjq_spectrum-ActionButton-hold {
+._VbXxq_spectrum-ActionButton-hold {
   position: absolute;
   inset-block-end: var(--spectrum-actionbutton-hold-icon-padding-bottom, var(--spectrum-global-dimension-size-40));
   inset-inline-end: var(--spectrum-actionbutton-hold-icon-padding-right, var(--spectrum-global-dimension-size-40));
 }
 
-[dir="rtl"] .CqADjq_spectrum-ActionButton-hold {
+[dir="rtl"] ._VbXxq_spectrum-ActionButton-hold {
   transform: rotate(90deg);
 }
 
-.CqADjq_spectrum-ActionButton-label, .CqADjq_spectrum-Button-label {
+._VbXxq_spectrum-ActionButton-label, ._VbXxq_spectrum-Button-label {
   text-align: center;
   order: 1;
   place-self: center;
   inline-size: 100%;
-}
 
-:is(.CqADjq_spectrum-ActionButton-label, .CqADjq_spectrum-Button-label):empty {
-  display: none;
+  &:empty {
+    display: none;
+  }
 }
 
-.CqADjq_spectrum-ActionButton-label {
+._VbXxq_spectrum-ActionButton-label {
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
 }
 
-.CqADjq_spectrum-ActionButton--quiet {
+._VbXxq_spectrum-ActionButton--quiet {
   border-width: var(--spectrum-actionbutton-quiet-border-size, var(--spectrum-alias-border-size-thin));
   border-radius: var(--spectrum-actionbutton-quiet-border-radius, var(--spectrum-alias-border-radius-regular));
   font-size: var(--spectrum-actionbutton-quiet-text-size, var(--spectrum-alias-font-size-default));
   font-weight: var(--spectrum-actionbutton-quiet-text-font-weight, var(--spectrum-alias-body-text-font-weight));
 }
 
-.CqADjq_spectrum-LogicButton {
+._VbXxq_spectrum-LogicButton {
   block-size: var(--spectrum-logicbutton-and-height, 24px);
   padding: var(--spectrum-logicbutton-and-padding-x, var(--spectrum-global-dimension-size-100));
   --spectrum-button-border-width: var(--spectrum-logicbutton-and-border-size, var(--spectrum-alias-border-size-thick));
@@ -279,7 +289,7 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
   line-height: 0;
 }
 
-.CqADjq_spectrum-FieldButton {
+._VbXxq_spectrum-FieldButton {
   block-size: var(--spectrum-dropdown-height, var(--spectrum-global-dimension-size-400));
   padding: 0 var(--spectrum-dropdown-padding-x, var(--spectrum-global-dimension-size-150));
   font-family: inherit;
@@ -289,6 +299,12 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
   cursor: default;
   --spectrum-focus-ring-gap: var(--spectrum-alias-input-focusring-gap);
   --spectrum-focus-ring-size: var(--spectrum-alias-input-focusring-size);
+  outline: none;
+  line-height: normal;
+  position: relative;
+}
+
+._VbXxq_spectrum-FieldButton {
   padding-block: 0;
   padding-inline: var(--spectrum-dropdown-padding-x, var(--spectrum-global-dimension-size-150));
   --spectrum-button-border-width: var(--spectrum-dropdown-border-size, var(--spectrum-alias-border-size-thin));
@@ -297,34 +313,33 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
     box-shadow var(--spectrum-global-animation-duration-100, .13s),
     border-color var(--spectrum-global-animation-duration-100, .13s);
   border-style: solid;
-  outline: none;
   margin: 0;
-  line-height: normal;
-  position: relative;
-}
 
-.CqADjq_spectrum-FieldButton:disabled, .CqADjq_spectrum-FieldButton.CqADjq_is-disabled {
-  cursor: default;
-  border-width: 0;
-}
+  &:disabled, &._VbXxq_is-disabled {
+    cursor: default;
+    border-width: 0;
+  }
 
-.CqADjq_spectrum-FieldButton.CqADjq_is-open {
-  border-width: var(--spectrum-dropdown-border-size, var(--spectrum-alias-border-size-thin));
+  &._VbXxq_is-open {
+    border-width: var(--spectrum-dropdown-border-size, var(--spectrum-alias-border-size-thin));
+  }
 }
 
-.CqADjq_spectrum-FieldButton--quiet {
+._VbXxq_spectrum-FieldButton--quiet {
   --spectrum-button-border-width: 0;
   --spectrum-button-border-radius: var(--spectrum-fieldbutton-quiet-border-radius, 0px);
   --spectrum-focus-ring-size: var(--spectrum-alias-focus-ring-size, var(--spectrum-global-dimension-static-size-25));
   margin: 0;
   padding: 0;
-}
 
-:is(.CqADjq_spectrum-FieldButton--quiet:disabled, .CqADjq_spectrum-FieldButton--quiet.CqADjq_is-disabled).CqADjq_focus-ring {
-  box-shadow: none;
+  &:disabled, &._VbXxq_is-disabled {
+    &._VbXxq_focus-ring {
+      box-shadow: none;
+    }
+  }
 }
 
-.CqADjq_spectrum-ClearButton {
+._VbXxq_spectrum-ClearButton {
   inline-size: var(--spectrum-clearbutton-medium-width, var(--spectrum-alias-single-line-height));
   block-size: var(--spectrum-clearbutton-medium-height, var(--spectrum-alias-single-line-height));
   --spectrum-button-border-radius: 100%;
@@ -332,91 +347,95 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
   border: none;
   margin: 0;
   padding: 0;
-}
-
-.CqADjq_spectrum-ClearButton > .CqADjq_spectrum-Icon {
-  margin-block: 0;
-  margin-inline: auto;
-}
 
-.CqADjq_spectrum-ClearButton.CqADjq_spectrum-ClearButton--inset.CqADjq_spectrum-ClearButton--inset {
-  box-sizing: border-box;
-  transition: unset;
-}
-
-.CqADjq_spectrum-ClearButton.CqADjq_spectrum-ClearButton--inset.CqADjq_spectrum-ClearButton--inset:after {
-  aspect-ratio: 1;
-  height: calc(100% - 2px);
-  top: 50%;
-  left: 50%;
-  right: unset;
-  bottom: unset;
-  margin: 0;
-  transition: unset;
-  transform: translate(-50%, -50%);
-}
+  & > ._VbXxq_spectrum-Icon {
+    margin-block: 0;
+    margin-inline: auto;
+  }
 
-.CqADjq_spectrum-ClearButton.CqADjq_spectrum-ClearButton--inset.CqADjq_spectrum-ClearButton--inset.CqADjq_focus-ring:after {
-  box-shadow: inset 0 0 0 var(--spectrum-focus-ring-size) var(--spectrum-focus-ring-color);
+  &._VbXxq_spectrum-ClearButton--inset._VbXxq_spectrum-ClearButton--inset {
+    box-sizing: border-box;
+    transition: unset;
+
+    &:after {
+      aspect-ratio: 1;
+      height: calc(100% - 2px);
+      top: 50%;
+      left: 50%;
+      right: unset;
+      bottom: unset;
+      margin: 0;
+      transition: unset;
+      transform: translate(-50%, -50%);
+    }
+
+    &._VbXxq_focus-ring {
+      &:after {
+        box-shadow: inset 0 0 0 var(--spectrum-focus-ring-size) var(--spectrum-focus-ring-color);
+      }
+    }
+  }
 }
 
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-  .CqADjq_spectrum-ClearButton > .CqADjq_spectrum-Icon {
-    margin: 0;
+  ._VbXxq_spectrum-ClearButton {
+    & > ._VbXxq_spectrum-Icon {
+      margin: 0;
+    }
   }
 }
 
-.CqADjq_spectrum-ClearButton--small {
+._VbXxq_spectrum-ClearButton--small {
   inline-size: var(--spectrum-clearbutton-small-width, var(--spectrum-global-dimension-size-300));
   block-size: var(--spectrum-clearbutton-small-height, var(--spectrum-global-dimension-size-300));
 }
 
-.CqADjq_spectrum-ClearButton {
+._VbXxq_spectrum-ClearButton {
   background-color: var(--spectrum-clearbutton-medium-background-color, var(--spectrum-alias-background-color-transparent));
   color: var(--spectrum-clearbutton-medium-icon-color, var(--spectrum-alias-icon-color));
-}
 
-.CqADjq_spectrum-ClearButton .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-clearbutton-medium-icon-color, var(--spectrum-alias-icon-color));
-}
+  & ._VbXxq_spectrum-Icon {
+    fill: var(--spectrum-clearbutton-medium-icon-color, var(--spectrum-alias-icon-color));
+  }
 
-.CqADjq_spectrum-ClearButton.CqADjq_is-hovered {
-  background-color: var(--spectrum-clearbutton-medium-background-color-hover, var(--spectrum-alias-background-color-transparent));
-  color: var(--spectrum-clearbutton-medium-icon-color-hover, var(--spectrum-alias-icon-color-hover));
-}
+  &._VbXxq_is-hovered {
+    background-color: var(--spectrum-clearbutton-medium-background-color-hover, var(--spectrum-alias-background-color-transparent));
+    color: var(--spectrum-clearbutton-medium-icon-color-hover, var(--spectrum-alias-icon-color-hover));
 
-.CqADjq_spectrum-ClearButton.CqADjq_is-hovered .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-clearbutton-medium-icon-color-hover, var(--spectrum-alias-icon-color-hover));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-clearbutton-medium-icon-color-hover, var(--spectrum-alias-icon-color-hover));
+    }
+  }
 
-.CqADjq_spectrum-ClearButton.CqADjq_is-active {
-  background-color: var(--spectrum-clearbutton-medium-background-color-down, var(--spectrum-alias-background-color-transparent));
-  color: var(--spectrum-clearbutton-medium-icon-color-down, var(--spectrum-alias-icon-color-down));
-}
+  &._VbXxq_is-active {
+    background-color: var(--spectrum-clearbutton-medium-background-color-down, var(--spectrum-alias-background-color-transparent));
+    color: var(--spectrum-clearbutton-medium-icon-color-down, var(--spectrum-alias-icon-color-down));
 
-.CqADjq_spectrum-ClearButton.CqADjq_is-active .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-clearbutton-medium-icon-color-down, var(--spectrum-alias-icon-color-down));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-clearbutton-medium-icon-color-down, var(--spectrum-alias-icon-color-down));
+    }
+  }
 
-.CqADjq_spectrum-ClearButton.CqADjq_focus-ring {
-  background-color: var(--spectrum-clearbutton-medium-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
-  color: var(--spectrum-clearbutton-medium-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
-}
+  &._VbXxq_focus-ring {
+    background-color: var(--spectrum-clearbutton-medium-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
+    color: var(--spectrum-clearbutton-medium-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
 
-.CqADjq_spectrum-ClearButton.CqADjq_focus-ring .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-clearbutton-medium-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-clearbutton-medium-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
+    }
+  }
 
-.CqADjq_spectrum-ClearButton:disabled, .CqADjq_spectrum-ClearButton.CqADjq_is-disabled {
-  background-color: var(--spectrum-clearbutton-medium-background-color-disabled, var(--spectrum-alias-background-color-transparent));
-  color: var(--spectrum-clearbutton-medium-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
-}
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-clearbutton-medium-background-color-disabled, var(--spectrum-alias-background-color-transparent));
+    color: var(--spectrum-clearbutton-medium-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
 
-:is(.CqADjq_spectrum-ClearButton:disabled, .CqADjq_spectrum-ClearButton.CqADjq_is-disabled) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-clearbutton-medium-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-clearbutton-medium-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
+    }
+  }
 }
 
-.CqADjq_spectrum-ClearButton--overBackground {
+._VbXxq_spectrum-ClearButton--overBackground {
   --spectrum-clearbutton-medium-background-color: transparent;
   --spectrum-clearbutton-medium-background-color-hover: #ffffff1a;
   --spectrum-clearbutton-medium-background-color-key-focus: #ffffff1a;
@@ -430,263 +449,281 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
   --spectrum-focus-ring-color: white;
 }
 
-.CqADjq_spectrum-Button[data-style="fill"] {
-  --spectrum-button-text-color: white;
-  --spectrum-button-text-color-hover: var(--spectrum-button-text-color);
-  --spectrum-button-text-color-down: var(--spectrum-button-text-color);
-  --spectrum-button-text-color-key-focus: var(--spectrum-button-text-color);
-  --spectrum-button-text-color-disabled: var(--spectrum-alias-text-color-disabled, var(--spectrum-global-color-gray-500));
-  --spectrum-button-color-disabled: var(--spectrum-alias-background-color-disabled);
-  background-color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-color));
-  color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color));
-  border-color: #0000;
-}
-
-.CqADjq_spectrum-Button[data-style="fill"].CqADjq_is-hovered {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-hover));
-  color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-hover));
-}
-
-.CqADjq_spectrum-Button[data-style="fill"].CqADjq_focus-ring {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-key-focus));
-  color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-key-focus));
-}
-
-.CqADjq_spectrum-Button[data-style="fill"].CqADjq_is-active {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-down));
-  color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-down));
-}
-
-.CqADjq_spectrum-Button[data-style="fill"]:disabled, .CqADjq_spectrum-Button[data-style="fill"].CqADjq_is-disabled {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-color-disabled));
-  color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-text-color-disabled));
-}
-
-.CqADjq_spectrum-Button[data-style="outline"] {
-  --spectrum-button-text-color: var(--spectrum-button-color);
-  --spectrum-button-text-color-hover: var(--spectrum-button-color-hover);
-  --spectrum-button-text-color-down: var(--spectrum-button-color-down);
-  --spectrum-button-text-color-key-focus: var(--spectrum-button-color-key-focus);
-  --spectrum-button-text-color-disabled: var(--spectrum-alias-text-color-disabled, var(--spectrum-global-color-gray-500));
-  --spectrum-button-color-disabled: var(--spectrum-alias-background-color-disabled);
-  border-color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-color));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color));
-  background-color: #0000;
-}
-
-.CqADjq_spectrum-Button[data-style="outline"].CqADjq_is-hovered {
-  background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-hover));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-hover));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-hover));
-}
-
-.CqADjq_spectrum-Button[data-style="outline"].CqADjq_focus-ring {
-  background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-key-focus));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-key-focus));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-key-focus));
-}
-
-.CqADjq_spectrum-Button[data-style="outline"].CqADjq_is-active {
-  background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-down));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-down));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-down));
-}
-
-.CqADjq_spectrum-Button[data-style="outline"]:disabled, .CqADjq_spectrum-Button[data-style="outline"].CqADjq_is-disabled {
-  border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-color-disabled));
-  color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-text-color-disabled));
-  background-color: #0000;
-}
-
-.CqADjq_spectrum-Button[data-static-color="white"] {
-  --spectrum-focus-ring-color: white;
-}
-
-:is(.CqADjq_spectrum-Button[data-static-color="white"][data-variant="accent"], .CqADjq_spectrum-Button[data-static-color="white"][data-variant="negative"], .CqADjq_spectrum-Button[data-static-color="white"][data-variant="primary"])[data-style="fill"] {
-  --spectrum-button-color: #ffffffe6;
-  --spectrum-button-color-hover: white;
-  --spectrum-button-color-down: white;
-  --spectrum-button-color-key-focus: white;
-  --spectrum-button-color-disabled: #ffffff1a;
-  --spectrum-button-text-color: black;
-  --spectrum-button-text-color-disabled: #ffffff8c;
-}
-
-:is(.CqADjq_spectrum-Button[data-static-color="white"][data-variant="accent"], .CqADjq_spectrum-Button[data-static-color="white"][data-variant="negative"], .CqADjq_spectrum-Button[data-static-color="white"][data-variant="primary"])[data-style="outline"] {
-  --spectrum-button-color: #ffffffe6;
-  --spectrum-button-color-hover: white;
-  --spectrum-button-color-down: white;
-  --spectrum-button-color-key-focus: white;
-  --spectrum-button-color-disabled: #ffffff40;
-  --spectrum-button-text-color: white;
-  --spectrum-button-text-color-hover: white;
-  --spectrum-button-text-color-down: white;
-  --spectrum-button-text-color-key-focus: white;
-  --spectrum-button-text-color-disabled: #ffffff8c;
-  --spectrum-button-background-color-hover: #ffffff1a;
-  --spectrum-button-background-color-down: #ffffff26;
-  --spectrum-button-background-color-key-focus: #ffffff1a;
-}
-
-.CqADjq_spectrum-Button[data-static-color="white"][data-variant="secondary"][data-style="fill"] {
-  --spectrum-button-color: #ffffff12;
-  --spectrum-button-color-hover: #ffffff1a;
-  --spectrum-button-color-down: #ffffff26;
-  --spectrum-button-color-key-focus: #ffffff1a;
-  --spectrum-button-color-disabled: #ffffff1a;
-  --spectrum-button-text-color: white;
-  --spectrum-button-text-color-disabled: #ffffff8c;
-}
-
-.CqADjq_spectrum-Button[data-static-color="white"][data-variant="secondary"][data-style="outline"] {
-  --spectrum-button-color: #ffffff40;
-  --spectrum-button-color-hover: #fff6;
-  --spectrum-button-color-down: #ffffff8c;
-  --spectrum-button-color-key-focus: #fff6;
-  --spectrum-button-color-disabled: #ffffff40;
-  --spectrum-button-text-color: white;
-  --spectrum-button-text-color-hover: white;
-  --spectrum-button-text-color-down: white;
-  --spectrum-button-text-color-key-focus: white;
-  --spectrum-button-text-color-disabled: #ffffff8c;
-  --spectrum-button-background-color-hover: #ffffff1a;
-  --spectrum-button-background-color-down: #ffffff26;
-  --spectrum-button-background-color-key-focus: #ffffff1a;
-}
-
-.CqADjq_spectrum-Button[data-static-color="black"] {
-  --spectrum-focus-ring-color: black;
-}
-
-:is(.CqADjq_spectrum-Button[data-static-color="black"][data-variant="accent"], .CqADjq_spectrum-Button[data-static-color="black"][data-variant="negative"], .CqADjq_spectrum-Button[data-static-color="black"][data-variant="primary"])[data-style="fill"] {
-  --spectrum-button-color: #000000e6;
-  --spectrum-button-color-hover: black;
-  --spectrum-button-color-down: black;
-  --spectrum-button-color-key-focus: black;
-  --spectrum-button-color-disabled: #0000001a;
-  --spectrum-button-text-color: white;
-  --spectrum-button-text-color-disabled: #0000008c;
-}
-
-:is(.CqADjq_spectrum-Button[data-static-color="black"][data-variant="accent"], .CqADjq_spectrum-Button[data-static-color="black"][data-variant="negative"], .CqADjq_spectrum-Button[data-static-color="black"][data-variant="primary"])[data-style="outline"] {
-  --spectrum-button-color: #000000e6;
-  --spectrum-button-color-hover: black;
-  --spectrum-button-color-down: black;
-  --spectrum-button-color-key-focus: black;
-  --spectrum-button-color-disabled: #00000040;
-  --spectrum-button-text-color: black;
-  --spectrum-button-text-color-hover: black;
-  --spectrum-button-text-color-down: black;
-  --spectrum-button-text-color-key-focus: black;
-  --spectrum-button-text-color-disabled: #0000008c;
-  --spectrum-button-background-color-hover: #0000001a;
-  --spectrum-button-background-color-down: #00000026;
-  --spectrum-button-background-color-key-focus: #0000001a;
-}
-
-.CqADjq_spectrum-Button[data-static-color="black"][data-variant="secondary"][data-style="fill"] {
-  --spectrum-button-color: #00000012;
-  --spectrum-button-color-hover: #0000001a;
-  --spectrum-button-color-down: #00000026;
-  --spectrum-button-color-key-focus: #0000001a;
-  --spectrum-button-color-disabled: #0000001a;
-  --spectrum-button-text-color: black;
-  --spectrum-button-text-color-disabled: #0000008c;
-}
-
-.CqADjq_spectrum-Button[data-static-color="black"][data-variant="secondary"][data-style="outline"] {
-  --spectrum-button-color: #00000040;
-  --spectrum-button-color-hover: #0006;
-  --spectrum-button-color-down: #0000008c;
-  --spectrum-button-color-key-focus: #0006;
-  --spectrum-button-color-disabled: #00000040;
-  --spectrum-button-text-color: black;
-  --spectrum-button-text-color-hover: black;
-  --spectrum-button-text-color-down: black;
-  --spectrum-button-text-color-key-focus: black;
-  --spectrum-button-text-color-disabled: #0000008c;
-  --spectrum-button-background-color-hover: #0000001a;
-  --spectrum-button-background-color-down: #00000026;
-  --spectrum-button-background-color-key-focus: #0000001a;
-}
-
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="accent"][data-style="fill"] {
-  --spectrum-button-color: var(--spectrum-accent-background-color-default);
-  --spectrum-button-color-hover: var(--spectrum-accent-background-color-hover);
-  --spectrum-button-color-down: var(--spectrum-accent-background-color-down);
-  --spectrum-button-color-key-focus: var(--spectrum-accent-background-color-key-focus);
-}
-
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="accent"][data-style="outline"] {
-  --spectrum-button-color: var(--spectrum-accent-color-900);
-  --spectrum-button-color-hover: var(--spectrum-accent-color-1000);
-  --spectrum-button-color-down: var(--spectrum-accent-color-1100);
-  --spectrum-button-color-key-focus: var(--spectrum-accent-color-1000);
-  --spectrum-button-background-color-hover: var(--spectrum-accent-color-200);
-  --spectrum-button-background-color-down: var(--spectrum-accent-color-300);
-  --spectrum-button-background-color-key-focus: var(--spectrum-accent-color-200);
-}
-
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="negative"][data-style="fill"] {
-  --spectrum-button-color: var(--spectrum-negative-background-color-default);
-  --spectrum-button-color-hover: var(--spectrum-negative-background-color-hover);
-  --spectrum-button-color-down: var(--spectrum-negative-background-color-down);
-  --spectrum-button-color-key-focus: var(--spectrum-negative-background-color-key-focus);
-}
-
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="negative"][data-style="outline"] {
-  --spectrum-button-color: var(--spectrum-red-900);
-  --spectrum-button-color-hover: var(--spectrum-red-1000);
-  --spectrum-button-color-down: var(--spectrum-red-1100);
-  --spectrum-button-color-key-focus: var(--spectrum-red-1000);
-  --spectrum-button-background-color-hover: var(--spectrum-red-200);
-  --spectrum-button-background-color-down: var(--spectrum-red-300);
-  --spectrum-button-background-color-key-focus: var(--spectrum-red-200);
-}
-
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="primary"][data-style="fill"] {
-  --spectrum-button-color: var(--spectrum-neutral-background-color-default);
-  --spectrum-button-color-hover: var(--spectrum-neutral-background-color-hover);
-  --spectrum-button-color-down: var(--spectrum-neutral-background-color-down);
-  --spectrum-button-color-key-focus: var(--spectrum-neutral-background-color-key-focus);
-}
+._VbXxq_spectrum-Button {
+  &[data-style="fill"] {
+    --spectrum-button-text-color: white;
+    --spectrum-button-text-color-hover: var(--spectrum-button-text-color);
+    --spectrum-button-text-color-down: var(--spectrum-button-text-color);
+    --spectrum-button-text-color-key-focus: var(--spectrum-button-text-color);
+    --spectrum-button-text-color-disabled: var(--spectrum-alias-text-color-disabled, var(--spectrum-global-color-gray-500));
+    --spectrum-button-color-disabled: var(--spectrum-alias-background-color-disabled);
+    background-color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-color));
+    color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color));
+    border-color: #0000;
+
+    &._VbXxq_is-hovered {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-hover));
+      color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-hover));
+    }
+
+    &._VbXxq_focus-ring {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-key-focus));
+      color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-key-focus));
+    }
+
+    &._VbXxq_is-active {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-down));
+      color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-down));
+    }
+
+    &:disabled, &._VbXxq_is-disabled {
+      background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-color-disabled));
+      color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-text-color-disabled));
+    }
+  }
 
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="primary"][data-style="outline"] {
-  --spectrum-button-color: var(--spectrum-gray-800);
-  --spectrum-button-color-hover: var(--spectrum-gray-900);
-  --spectrum-button-color-down: var(--spectrum-gray-900);
-  --spectrum-button-color-key-focus: var(--spectrum-gray-900);
-  --spectrum-button-background-color-hover: var(--spectrum-gray-300);
-  --spectrum-button-background-color-down: var(--spectrum-gray-400);
-  --spectrum-button-background-color-key-focus: var(--spectrum-gray-300);
-}
+  &[data-style="outline"] {
+    --spectrum-button-text-color: var(--spectrum-button-color);
+    --spectrum-button-text-color-hover: var(--spectrum-button-color-hover);
+    --spectrum-button-text-color-down: var(--spectrum-button-color-down);
+    --spectrum-button-text-color-key-focus: var(--spectrum-button-color-key-focus);
+    --spectrum-button-text-color-disabled: var(--spectrum-alias-text-color-disabled, var(--spectrum-global-color-gray-500));
+    --spectrum-button-color-disabled: var(--spectrum-alias-background-color-disabled);
+    border-color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-color));
+    color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color));
+    background-color: #0000;
+
+    &._VbXxq_is-hovered {
+      background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-hover));
+      border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-hover));
+      color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-hover));
+    }
+
+    &._VbXxq_focus-ring {
+      background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-key-focus));
+      border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-key-focus));
+      color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-key-focus));
+    }
+
+    &._VbXxq_is-active {
+      background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-down));
+      border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-down));
+      color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-down));
+    }
+
+    &:disabled, &._VbXxq_is-disabled {
+      border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-color-disabled));
+      color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-text-color-disabled));
+      background-color: #0000;
+    }
+  }
 
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="secondary"] {
-  --spectrum-button-text-color: var(--spectrum-gray-800);
-  --spectrum-button-text-color-hover: var(--spectrum-gray-900);
-  --spectrum-button-text-color-down: var(--spectrum-gray-900);
-  --spectrum-button-text-color-key-focus: var(--spectrum-gray-900);
-}
+  &[data-static-color="white"] {
+    --spectrum-focus-ring-color: white;
+
+    &[data-variant="accent"], &[data-variant="negative"], &[data-variant="primary"] {
+      &[data-style="fill"] {
+        --spectrum-button-color: #ffffffe6;
+        --spectrum-button-color-hover: white;
+        --spectrum-button-color-down: white;
+        --spectrum-button-color-key-focus: white;
+        --spectrum-button-color-disabled: #ffffff1a;
+        --spectrum-button-text-color: black;
+        --spectrum-button-text-color-disabled: #ffffff8c;
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: #ffffffe6;
+        --spectrum-button-color-hover: white;
+        --spectrum-button-color-down: white;
+        --spectrum-button-color-key-focus: white;
+        --spectrum-button-color-disabled: #ffffff40;
+        --spectrum-button-text-color: white;
+        --spectrum-button-text-color-hover: white;
+        --spectrum-button-text-color-down: white;
+        --spectrum-button-text-color-key-focus: white;
+        --spectrum-button-text-color-disabled: #ffffff8c;
+        --spectrum-button-background-color-hover: #ffffff1a;
+        --spectrum-button-background-color-down: #ffffff26;
+        --spectrum-button-background-color-key-focus: #ffffff1a;
+      }
+    }
+
+    &[data-variant="secondary"] {
+      &[data-style="fill"] {
+        --spectrum-button-color: #ffffff12;
+        --spectrum-button-color-hover: #ffffff1a;
+        --spectrum-button-color-down: #ffffff26;
+        --spectrum-button-color-key-focus: #ffffff1a;
+        --spectrum-button-color-disabled: #ffffff1a;
+        --spectrum-button-text-color: white;
+        --spectrum-button-text-color-disabled: #ffffff8c;
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: #ffffff40;
+        --spectrum-button-color-hover: #fff6;
+        --spectrum-button-color-down: #ffffff8c;
+        --spectrum-button-color-key-focus: #fff6;
+        --spectrum-button-color-disabled: #ffffff40;
+        --spectrum-button-text-color: white;
+        --spectrum-button-text-color-hover: white;
+        --spectrum-button-text-color-down: white;
+        --spectrum-button-text-color-key-focus: white;
+        --spectrum-button-text-color-disabled: #ffffff8c;
+        --spectrum-button-background-color-hover: #ffffff1a;
+        --spectrum-button-background-color-down: #ffffff26;
+        --spectrum-button-background-color-key-focus: #ffffff1a;
+      }
+    }
+  }
 
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="secondary"][data-style="fill"] {
-  --spectrum-button-color: var(--spectrum-gray-200);
-  --spectrum-button-color-hover: var(--spectrum-gray-300);
-  --spectrum-button-color-down: var(--spectrum-gray-400);
-  --spectrum-button-color-key-focus: var(--spectrum-gray-300);
-}
+  &[data-static-color="black"] {
+    --spectrum-focus-ring-color: black;
+
+    &[data-variant="accent"], &[data-variant="negative"], &[data-variant="primary"] {
+      &[data-style="fill"] {
+        --spectrum-button-color: #000000e6;
+        --spectrum-button-color-hover: black;
+        --spectrum-button-color-down: black;
+        --spectrum-button-color-key-focus: black;
+        --spectrum-button-color-disabled: #0000001a;
+        --spectrum-button-text-color: white;
+        --spectrum-button-text-color-disabled: #0000008c;
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: #000000e6;
+        --spectrum-button-color-hover: black;
+        --spectrum-button-color-down: black;
+        --spectrum-button-color-key-focus: black;
+        --spectrum-button-color-disabled: #00000040;
+        --spectrum-button-text-color: black;
+        --spectrum-button-text-color-hover: black;
+        --spectrum-button-text-color-down: black;
+        --spectrum-button-text-color-key-focus: black;
+        --spectrum-button-text-color-disabled: #0000008c;
+        --spectrum-button-background-color-hover: #0000001a;
+        --spectrum-button-background-color-down: #00000026;
+        --spectrum-button-background-color-key-focus: #0000001a;
+      }
+    }
+
+    &[data-variant="secondary"] {
+      &[data-style="fill"] {
+        --spectrum-button-color: #00000012;
+        --spectrum-button-color-hover: #0000001a;
+        --spectrum-button-color-down: #00000026;
+        --spectrum-button-color-key-focus: #0000001a;
+        --spectrum-button-color-disabled: #0000001a;
+        --spectrum-button-text-color: black;
+        --spectrum-button-text-color-disabled: #0000008c;
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: #00000040;
+        --spectrum-button-color-hover: #0006;
+        --spectrum-button-color-down: #0000008c;
+        --spectrum-button-color-key-focus: #0006;
+        --spectrum-button-color-disabled: #00000040;
+        --spectrum-button-text-color: black;
+        --spectrum-button-text-color-hover: black;
+        --spectrum-button-text-color-down: black;
+        --spectrum-button-text-color-key-focus: black;
+        --spectrum-button-text-color-disabled: #0000008c;
+        --spectrum-button-background-color-hover: #0000001a;
+        --spectrum-button-background-color-down: #00000026;
+        --spectrum-button-background-color-key-focus: #0000001a;
+      }
+    }
+  }
 
-.CqADjq_spectrum-Button:not([data-static-color])[data-variant="secondary"][data-style="outline"] {
-  --spectrum-button-color: var(--spectrum-gray-300);
-  --spectrum-button-color-hover: var(--spectrum-gray-400);
-  --spectrum-button-color-down: var(--spectrum-gray-500);
-  --spectrum-button-color-key-focus: var(--spectrum-gray-400);
-  --spectrum-button-background-color-hover: var(--spectrum-gray-300);
-  --spectrum-button-background-color-down: var(--spectrum-gray-400);
-  --spectrum-button-background-color-key-focus: var(--spectrum-gray-300);
+  &:not([data-static-color]) {
+    &[data-variant="accent"] {
+      &[data-style="fill"] {
+        --spectrum-button-color: var(--spectrum-accent-background-color-default);
+        --spectrum-button-color-hover: var(--spectrum-accent-background-color-hover);
+        --spectrum-button-color-down: var(--spectrum-accent-background-color-down);
+        --spectrum-button-color-key-focus: var(--spectrum-accent-background-color-key-focus);
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: var(--spectrum-accent-color-900);
+        --spectrum-button-color-hover: var(--spectrum-accent-color-1000);
+        --spectrum-button-color-down: var(--spectrum-accent-color-1100);
+        --spectrum-button-color-key-focus: var(--spectrum-accent-color-1000);
+        --spectrum-button-background-color-hover: var(--spectrum-accent-color-200);
+        --spectrum-button-background-color-down: var(--spectrum-accent-color-300);
+        --spectrum-button-background-color-key-focus: var(--spectrum-accent-color-200);
+      }
+    }
+
+    &[data-variant="negative"] {
+      &[data-style="fill"] {
+        --spectrum-button-color: var(--spectrum-negative-background-color-default);
+        --spectrum-button-color-hover: var(--spectrum-negative-background-color-hover);
+        --spectrum-button-color-down: var(--spectrum-negative-background-color-down);
+        --spectrum-button-color-key-focus: var(--spectrum-negative-background-color-key-focus);
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: var(--spectrum-red-900);
+        --spectrum-button-color-hover: var(--spectrum-red-1000);
+        --spectrum-button-color-down: var(--spectrum-red-1100);
+        --spectrum-button-color-key-focus: var(--spectrum-red-1000);
+        --spectrum-button-background-color-hover: var(--spectrum-red-200);
+        --spectrum-button-background-color-down: var(--spectrum-red-300);
+        --spectrum-button-background-color-key-focus: var(--spectrum-red-200);
+      }
+    }
+
+    &[data-variant="primary"] {
+      &[data-style="fill"] {
+        --spectrum-button-color: var(--spectrum-neutral-background-color-default);
+        --spectrum-button-color-hover: var(--spectrum-neutral-background-color-hover);
+        --spectrum-button-color-down: var(--spectrum-neutral-background-color-down);
+        --spectrum-button-color-key-focus: var(--spectrum-neutral-background-color-key-focus);
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: var(--spectrum-gray-800);
+        --spectrum-button-color-hover: var(--spectrum-gray-900);
+        --spectrum-button-color-down: var(--spectrum-gray-900);
+        --spectrum-button-color-key-focus: var(--spectrum-gray-900);
+        --spectrum-button-background-color-hover: var(--spectrum-gray-300);
+        --spectrum-button-background-color-down: var(--spectrum-gray-400);
+        --spectrum-button-background-color-key-focus: var(--spectrum-gray-300);
+      }
+    }
+
+    &[data-variant="secondary"] {
+      --spectrum-button-text-color: var(--spectrum-gray-800);
+      --spectrum-button-text-color-hover: var(--spectrum-gray-900);
+      --spectrum-button-text-color-down: var(--spectrum-gray-900);
+      --spectrum-button-text-color-key-focus: var(--spectrum-gray-900);
+
+      &[data-style="fill"] {
+        --spectrum-button-color: var(--spectrum-gray-200);
+        --spectrum-button-color-hover: var(--spectrum-gray-300);
+        --spectrum-button-color-down: var(--spectrum-gray-400);
+        --spectrum-button-color-key-focus: var(--spectrum-gray-300);
+      }
+
+      &[data-style="outline"] {
+        --spectrum-button-color: var(--spectrum-gray-300);
+        --spectrum-button-color-hover: var(--spectrum-gray-400);
+        --spectrum-button-color-down: var(--spectrum-gray-500);
+        --spectrum-button-color-key-focus: var(--spectrum-gray-400);
+        --spectrum-button-background-color-hover: var(--spectrum-gray-300);
+        --spectrum-button-background-color-down: var(--spectrum-gray-400);
+        --spectrum-button-background-color-key-focus: var(--spectrum-gray-300);
+      }
+    }
+  }
 }
 
 @media (forced-colors: active) {
-  .CqADjq_spectrum-Button, .CqADjq_spectrum-ActionButton, .CqADjq_spectrum-FieldButton {
+  ._VbXxq_spectrum-Button, ._VbXxq_spectrum-ActionButton, ._VbXxq_spectrum-FieldButton {
     forced-color-adjust: none;
     --spectrum-high-contrast-transparent: transparent;
     --spectrum-high-contrast-button-face: ButtonFace;
@@ -696,216 +733,218 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
     --spectrum-high-contrast-gray-text: GrayText;
   }
 
-  .CqADjq_spectrum-Button, .CqADjq_spectrum-ActionButton {
+  ._VbXxq_spectrum-Button, ._VbXxq_spectrum-ActionButton {
     --spectrum-high-contrast-focus-ring-color: ButtonText;
   }
 
-  .CqADjq_spectrum-FieldButton {
+  ._VbXxq_spectrum-FieldButton {
     --spectrum-high-contrast-focus-ring-color: Highlight;
   }
 
-  .CqADjq_spectrum-Button--pending.CqADjq_is-disabled {
+  ._VbXxq_spectrum-Button--pending._VbXxq_is-disabled {
     border-color: var(--spectrum-high-contrast-gray-text);
   }
 }
 
-.CqADjq_spectrum-ActionButton {
+._VbXxq_spectrum-ActionButton {
   background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color, var(--spectrum-global-color-gray-75)));
   border-color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-border-color, var(--spectrum-alias-border-color)));
   color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color, var(--spectrum-alias-text-color)));
-}
-
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color, var(--spectrum-alias-icon-color)));
-}
-
-.CqADjq_spectrum-ActionButton .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color, var(--spectrum-alias-icon-color)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-hovered {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-hover, var(--spectrum-global-color-gray-50)));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-hover, var(--spectrum-alias-border-color-hover)));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-hover, var(--spectrum-alias-text-color-hover)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-hovered .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color-hover, var(--spectrum-alias-icon-color-hover)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-hovered .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-actionbutton-hold-icon-color-hover, var(--spectrum-alias-icon-color-hover));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_focus-ring {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-key-focus, var(--spectrum-global-color-gray-50)));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-hover, var(--spectrum-alias-border-color-hover)));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-key-focus, var(--spectrum-alias-text-color-hover)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_focus-ring .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color-key-focus, var(--spectrum-alias-icon-color-focus)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_focus-ring .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color-key-focus, var(--spectrum-alias-icon-color-hover)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-active {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-down, var(--spectrum-global-color-gray-200)));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-down, var(--spectrum-alias-border-color-down)));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-down, var(--spectrum-alias-text-color-down)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-active .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color-down, var(--spectrum-alias-icon-color-down)));
-}
-
-.CqADjq_spectrum-ActionButton:disabled, .CqADjq_spectrum-ActionButton.CqADjq_is-disabled {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-disabled, var(--spectrum-global-color-gray-200)));
-  border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-border-color-disabled, var(--spectrum-alias-border-color-disabled)));
-  color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled)));
-}
-
-:is(.CqADjq_spectrum-ActionButton:disabled, .CqADjq_spectrum-ActionButton.CqADjq_is-disabled) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-icon-color-disabled, var(--spectrum-alias-icon-color-disabled)));
-}
-
-:is(.CqADjq_spectrum-ActionButton:disabled, .CqADjq_spectrum-ActionButton.CqADjq_is-disabled) .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-hold-icon-color-disabled, var(--spectrum-alias-icon-color-disabled)));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
 
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_is-hovered {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-hover));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-hover));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_is-hovered .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
-
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_focus-ring {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-key-focus));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-key-focus));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
+  & ._VbXxq_spectrum-Icon {
+    fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color, var(--spectrum-alias-icon-color)));
+  }
 
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_focus-ring .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
+  & ._VbXxq_spectrum-ActionButton-hold {
+    fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color, var(--spectrum-alias-icon-color)));
+  }
 
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_is-active {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-down));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-down));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
+  &._VbXxq_is-hovered {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-hover, var(--spectrum-global-color-gray-50)));
+    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-hover, var(--spectrum-alias-border-color-hover)));
+    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-hover, var(--spectrum-alias-text-color-hover)));
 
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_is-active .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color-hover, var(--spectrum-alias-icon-color-hover)));
+    }
 
-.CqADjq_spectrum-ActionButton.CqADjq_is-selected:disabled, .CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_is-disabled {
-  background-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-background-color-selected-disabled, var(--spectrum-global-color-gray-200)));
-  border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-border-color-selected-disabled, var(--spectrum-alias-border-color-disabled)));
-  color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-text-color-selected-disabled, var(--spectrum-alias-text-color-disabled)));
-}
+    & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-actionbutton-hold-icon-color-hover, var(--spectrum-alias-icon-color-hover));
+    }
+  }
 
-:is(.CqADjq_spectrum-ActionButton.CqADjq_is-selected:disabled, .CqADjq_spectrum-ActionButton.CqADjq_is-selected.CqADjq_is-disabled) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-icon-color-selected-disabled, var(--spectrum-alias-icon-color-disabled)));
-}
+  &._VbXxq_focus-ring {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-key-focus, var(--spectrum-global-color-gray-50)));
+    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-hover, var(--spectrum-alias-border-color-hover)));
+    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-key-focus, var(--spectrum-alias-text-color-hover)));
 
-.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-default));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-default));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected, var(--spectrum-global-color-static-white)));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color-key-focus, var(--spectrum-alias-icon-color-focus)));
+    }
 
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected, var(--spectrum-global-color-static-white)));
-}
+    & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color-key-focus, var(--spectrum-alias-icon-color-hover)));
+    }
+  }
 
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_focus-ring {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-key-focus));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-hover));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-key-focus, var(--spectrum-global-color-static-white)));
-}
+  &._VbXxq_is-active {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-down, var(--spectrum-global-color-gray-200)));
+    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-down, var(--spectrum-alias-border-color-down)));
+    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-down, var(--spectrum-alias-text-color-down)));
 
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_focus-ring .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-key-focus, var(--spectrum-global-color-static-white)));
-}
+    & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color-down, var(--spectrum-alias-icon-color-down)));
+    }
+  }
 
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_is-hovered {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-hover));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-hover));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-hover, var(--spectrum-global-color-static-white)));
-}
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-disabled, var(--spectrum-global-color-gray-200)));
+    border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-border-color-disabled, var(--spectrum-alias-border-color-disabled)));
+    color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled)));
 
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_is-hovered .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-hover, var(--spectrum-global-color-static-white)));
-}
-
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_is-active {
-  background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-down));
-  border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-down));
-  color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-down, var(--spectrum-global-color-static-white)));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-icon-color-disabled, var(--spectrum-alias-icon-color-disabled)));
+    }
 
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_is-active .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-down, var(--spectrum-global-color-static-white)));
-}
+    & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-hold-icon-color-disabled, var(--spectrum-alias-icon-color-disabled)));
+    }
+  }
 
-:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected):disabled, :is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_is-disabled {
-  background-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-emphasized-background-color-selected-disabled, var(--spectrum-global-color-gray-200)));
-  border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-emphasized-border-color-selected-disabled, var(--spectrum-alias-border-color-disabled)));
-  color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-emphasized-text-color-selected-disabled, var(--spectrum-alias-text-color-disabled)));
+  &._VbXxq_is-selected {
+    background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected));
+    border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected));
+    color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+    }
+
+    &._VbXxq_is-hovered {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-hover));
+      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-hover));
+      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+      }
+    }
+
+    &._VbXxq_focus-ring {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-key-focus));
+      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-key-focus));
+      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+      }
+    }
+
+    &._VbXxq_is-active {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-down));
+      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-down));
+      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
+      }
+    }
+
+    &:disabled, &._VbXxq_is-disabled {
+      background-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-background-color-selected-disabled, var(--spectrum-global-color-gray-200)));
+      border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-border-color-selected-disabled, var(--spectrum-alias-border-color-disabled)));
+      color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-text-color-selected-disabled, var(--spectrum-alias-text-color-disabled)));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-icon-color-selected-disabled, var(--spectrum-alias-icon-color-disabled)));
+      }
+    }
+  }
 }
 
-:is(:is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected):disabled, :is(.CqADjq_spectrum-ActionButton--emphasized.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--emphasized.CqADjq_is-selected).CqADjq_is-disabled) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-emphasized-icon-color-selected-disabled, var(--spectrum-alias-icon-color-disabled)));
+._VbXxq_spectrum-ActionButton--emphasized {
+  &._VbXxq_spectrum-ActionButton--quiet._VbXxq_is-selected, &._VbXxq_is-selected {
+    background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-default));
+    border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-default));
+    color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected, var(--spectrum-global-color-static-white)));
+
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected, var(--spectrum-global-color-static-white)));
+    }
+
+    &._VbXxq_focus-ring {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-key-focus));
+      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-hover));
+      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-key-focus, var(--spectrum-global-color-static-white)));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-key-focus, var(--spectrum-global-color-static-white)));
+      }
+    }
+
+    &._VbXxq_is-hovered {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-hover));
+      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-hover));
+      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-hover, var(--spectrum-global-color-static-white)));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-hover, var(--spectrum-global-color-static-white)));
+      }
+    }
+
+    &._VbXxq_is-active {
+      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-down));
+      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-down));
+      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-down, var(--spectrum-global-color-static-white)));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-down, var(--spectrum-global-color-static-white)));
+      }
+    }
+
+    &:disabled, &._VbXxq_is-disabled {
+      background-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-emphasized-background-color-selected-disabled, var(--spectrum-global-color-gray-200)));
+      border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-emphasized-border-color-selected-disabled, var(--spectrum-alias-border-color-disabled)));
+      color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-emphasized-text-color-selected-disabled, var(--spectrum-alias-text-color-disabled)));
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-emphasized-icon-color-selected-disabled, var(--spectrum-alias-icon-color-disabled)));
+      }
+    }
+  }
 }
 
-.CqADjq_spectrum-ActionButton--quiet {
+._VbXxq_spectrum-ActionButton--quiet {
   background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color, var(--spectrum-alias-background-color-transparent)));
   border-color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-border-color, var(--spectrum-alias-border-color-transparent)));
   color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color, var(--spectrum-alias-text-color)));
-}
 
-.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-hovered {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-hover, var(--spectrum-alias-background-color-transparent)));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-hover, var(--spectrum-alias-border-color-transparent)));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-hover, var(--spectrum-alias-text-color-hover)));
-}
+  &._VbXxq_is-hovered {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-hover, var(--spectrum-alias-background-color-transparent)));
+    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-hover, var(--spectrum-alias-border-color-transparent)));
+    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-hover, var(--spectrum-alias-text-color-hover)));
+  }
 
-.CqADjq_spectrum-ActionButton--quiet.CqADjq_focus-ring {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent)));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-hover, var(--spectrum-alias-border-color-transparent)));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-key-focus, var(--spectrum-alias-text-color-hover)));
-}
+  &._VbXxq_focus-ring {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent)));
+    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-hover, var(--spectrum-alias-border-color-transparent)));
+    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-key-focus, var(--spectrum-alias-text-color-hover)));
+  }
 
-.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-active {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-down, var(--spectrum-global-color-gray-300)));
-  border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-down, var(--spectrum-global-color-gray-300)));
-  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-down, var(--spectrum-alias-text-color-down)));
-}
+  &._VbXxq_is-active {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-down, var(--spectrum-global-color-gray-300)));
+    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-down, var(--spectrum-global-color-gray-300)));
+    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-down, var(--spectrum-alias-text-color-down)));
+  }
 
-.CqADjq_spectrum-ActionButton--quiet:disabled, .CqADjq_spectrum-ActionButton--quiet.CqADjq_is-disabled {
-  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-disabled, var(--spectrum-alias-background-color-transparent)));
-  border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-quiet-border-color-disabled, var(--spectrum-alias-border-color-transparent)));
-  color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-quiet-text-color-disabled, var(--spectrum-alias-text-color-disabled)));
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-disabled, var(--spectrum-alias-background-color-transparent)));
+    border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-quiet-border-color-disabled, var(--spectrum-alias-border-color-transparent)));
+    color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-quiet-text-color-disabled, var(--spectrum-alias-text-color-disabled)));
+  }
 }
 
-.CqADjq_spectrum-ActionButton--staticWhite {
+._VbXxq_spectrum-ActionButton--staticWhite {
   mix-blend-mode: screen;
   --spectrum-actionbutton-static-background-color: var(--spectrum-actionbutton-static-white-background-color);
   --spectrum-actionbutton-static-background-color-hover: #ffffff1a;
@@ -930,14 +969,14 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
   --spectrum-actionbutton-static-color-selected-disabled: var(--spectrum-actionbutton-static-color-disabled);
 }
 
-.CqADjq_spectrum-ActionButton--staticWhite.CqADjq_spectrum-ActionButton--quiet {
+._VbXxq_spectrum-ActionButton--staticWhite._VbXxq_spectrum-ActionButton--quiet {
   --spectrum-actionbutton-static-border-color: transparent;
   --spectrum-actionbutton-static-border-color-hover: transparent;
   --spectrum-actionbutton-static-border-color-active: transparent;
   --spectrum-actionbutton-static-border-color-selected: transparent;
 }
 
-.CqADjq_spectrum-ActionButton--staticBlack {
+._VbXxq_spectrum-ActionButton--staticBlack {
   mix-blend-mode: multiply;
   --spectrum-actionbutton-static-background-color: var(--spectrum-actionbutton-static-black-background-color);
   --spectrum-actionbutton-static-background-color-hover: #0000001a;
@@ -962,264 +1001,264 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
   --spectrum-actionbutton-static-color-selected-disabled: var(--spectrum-actionbutton-static-color-disabled);
 }
 
-.CqADjq_spectrum-ActionButton--staticBlack.CqADjq_spectrum-ActionButton--quiet {
+._VbXxq_spectrum-ActionButton--staticBlack._VbXxq_spectrum-ActionButton--quiet {
   --spectrum-actionbutton-static-border-color: transparent;
   --spectrum-actionbutton-static-border-color-hover: transparent;
   --spectrum-actionbutton-static-border-color-active: transparent;
   --spectrum-actionbutton-static-border-color-selected: transparent;
 }
 
-.CqADjq_spectrum-ActionButton--staticColor {
+._VbXxq_spectrum-ActionButton--staticColor {
   background-color: var(--spectrum-actionbutton-static-background-color);
   border-color: var(--spectrum-actionbutton-static-border-color);
   color: var(--spectrum-actionbutton-static-color);
   --spectrum-focus-ring-color: var(--spectrum-actionbutton-static-color);
-}
 
-.CqADjq_spectrum-ActionButton--staticColor .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-actionbutton-static-color);
-}
-
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-hovered {
-  background-color: var(--spectrum-actionbutton-static-background-color-hover);
-  border-color: var(--spectrum-actionbutton-static-border-color-hover);
-  color: var(--spectrum-actionbutton-static-color);
-}
-
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-hovered .CqADjq_spectrum-Icon, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-hovered .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-actionbutton-static-color);
-}
-
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_focus-ring {
-  background-color: var(--spectrum-actionbutton-static-background-color-focus);
-  border-color: var(--spectrum-actionbutton-static-border-color-focus);
-  box-shadow: none;
-  color: var(--spectrum-actionbutton-static-color);
-}
-
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_focus-ring.CqADjq_is-hovered, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_focus-ring.CqADjq_is-active {
-  border-color: var(--spectrum-actionbutton-static-border-color-focus);
-}
-
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_focus-ring .CqADjq_spectrum-Icon, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_focus-ring .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-actionbutton-static-color);
-}
-
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-active {
-  background-color: var(--spectrum-actionbutton-static-background-color-active);
-  border-color: var(--spectrum-actionbutton-static-border-color-active);
-  color: var(--spectrum-actionbutton-static-color);
-}
+  & ._VbXxq_spectrum-Icon {
+    fill: var(--spectrum-actionbutton-static-color);
+  }
 
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-active .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-actionbutton-static-color);
-}
+  &._VbXxq_is-hovered {
+    background-color: var(--spectrum-actionbutton-static-background-color-hover);
+    border-color: var(--spectrum-actionbutton-static-border-color-hover);
+    color: var(--spectrum-actionbutton-static-color);
 
-.CqADjq_spectrum-ActionButton--staticColor:disabled, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-disabled {
-  background-color: var(--spectrum-actionbutton-static-background-color-disabled);
-  border-color: var(--spectrum-actionbutton-static-border-color-disabled);
-  color: var(--spectrum-actionbutton-static-color-disabled);
-}
-
-:is(.CqADjq_spectrum-ActionButton--staticColor:disabled, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-disabled) .CqADjq_spectrum-Icon, :is(.CqADjq_spectrum-ActionButton--staticColor:disabled, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-disabled) .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-actionbutton-static-color-disabled);
-}
+    & ._VbXxq_spectrum-Icon, & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-actionbutton-static-color);
+    }
+  }
 
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected {
-  background-color: var(--spectrum-actionbutton-static-background-color-selected);
-  border-color: var(--spectrum-actionbutton-static-border-color-selected);
-  color: var(--spectrum-actionbutton-static-color-selected);
-}
+  &._VbXxq_focus-ring {
+    background-color: var(--spectrum-actionbutton-static-background-color-focus);
+    border-color: var(--spectrum-actionbutton-static-border-color-focus);
+    box-shadow: none;
+    color: var(--spectrum-actionbutton-static-color);
 
-:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-actionbutton-static-color-selected);
-}
+    &._VbXxq_is-hovered, &._VbXxq_is-active {
+      border-color: var(--spectrum-actionbutton-static-border-color-focus);
+    }
 
-:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_focus-ring {
-  background-color: var(--spectrum-actionbutton-static-background-color-selected-focus);
-  border-color: var(--spectrum-actionbutton-static-background-color-selected-focus);
-  color: var(--spectrum-actionbutton-static-color-selected);
-  box-shadow: none;
-}
+    & ._VbXxq_spectrum-Icon, & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-actionbutton-static-color);
+    }
+  }
 
-:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_focus-ring .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-actionbutton-static-color-selected);
-}
+  &._VbXxq_is-active {
+    background-color: var(--spectrum-actionbutton-static-background-color-active);
+    border-color: var(--spectrum-actionbutton-static-border-color-active);
+    color: var(--spectrum-actionbutton-static-color);
 
-:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_is-hovered, :is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_is-active {
-  background-color: var(--spectrum-actionbutton-static-background-color-selected-hover);
-  border-color: var(--spectrum-actionbutton-static-background-color-selected-hover);
-  color: var(--spectrum-actionbutton-static-color-selected);
-}
+    & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-actionbutton-static-color);
+    }
+  }
 
-:is(:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_is-hovered, :is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_is-active) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-actionbutton-static-color-selected);
-}
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-actionbutton-static-background-color-disabled);
+    border-color: var(--spectrum-actionbutton-static-border-color-disabled);
+    color: var(--spectrum-actionbutton-static-color-disabled);
 
-:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected):disabled, :is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_is-disabled {
-  background-color: var(--spectrum-actionbutton-static-background-color-selected-disabled);
-  border-color: var(--spectrum-actionbutton-static-border-color-selected-disabled);
-  color: var(--spectrum-actionbutton-static-color-selected-disabled);
-}
-
-:is(:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected):disabled, :is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_is-disabled) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-actionbutton-static-color-selected-disabled);
-}
+    & ._VbXxq_spectrum-Icon, & ._VbXxq_spectrum-ActionButton-hold {
+      fill: var(--spectrum-actionbutton-static-color-disabled);
+    }
+  }
 
-:is(:is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected):disabled, :is(.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet.CqADjq_is-selected, .CqADjq_spectrum-ActionButton--staticColor.CqADjq_is-selected).CqADjq_is-disabled) .CqADjq_spectrum-ActionButton-hold {
-  fill: var(--spectrum-actionbutton-static-color-disabled);
-}
+  &._VbXxq_spectrum-ActionButton--quiet._VbXxq_is-selected, &._VbXxq_is-selected {
+    background-color: var(--spectrum-actionbutton-static-background-color-selected);
+    border-color: var(--spectrum-actionbutton-static-border-color-selected);
+    color: var(--spectrum-actionbutton-static-color-selected);
+
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-actionbutton-static-color-selected);
+    }
+
+    &._VbXxq_focus-ring {
+      background-color: var(--spectrum-actionbutton-static-background-color-selected-focus);
+      border-color: var(--spectrum-actionbutton-static-background-color-selected-focus);
+      color: var(--spectrum-actionbutton-static-color-selected);
+      box-shadow: none;
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-actionbutton-static-color-selected);
+      }
+    }
+
+    &._VbXxq_is-hovered, &._VbXxq_is-active {
+      background-color: var(--spectrum-actionbutton-static-background-color-selected-hover);
+      border-color: var(--spectrum-actionbutton-static-background-color-selected-hover);
+      color: var(--spectrum-actionbutton-static-color-selected);
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-actionbutton-static-color-selected);
+      }
+    }
+
+    &:disabled, &._VbXxq_is-disabled {
+      background-color: var(--spectrum-actionbutton-static-background-color-selected-disabled);
+      border-color: var(--spectrum-actionbutton-static-border-color-selected-disabled);
+      color: var(--spectrum-actionbutton-static-color-selected-disabled);
+
+      & ._VbXxq_spectrum-Icon {
+        fill: var(--spectrum-actionbutton-static-color-selected-disabled);
+      }
+
+      & ._VbXxq_spectrum-ActionButton-hold {
+        fill: var(--spectrum-actionbutton-static-color-disabled);
+      }
+    }
+  }
 
-.CqADjq_spectrum-ActionButton--staticColor.CqADjq_spectrum-ActionButton--quiet {
-  --spectrum-actionbutton-static-background-color: transparent;
-  --spectrum-actionbutton-static-background-color-disabled: transparent;
-  --spectrum-actionbutton-static-border-color: transparent;
-  --spectrum-actionbutton-static-border-color-disabled: transparent;
-  --spectrum-actionbutton-static-border-color-selected-hover: transparent;
-  --spectrum-actionbutton-static-border-color-focus: transparent;
-  --spectrum-actionbutton-static-border-color-active: transparent;
-  --spectrum-actionbutton-static-border-color-selected-disabled: transparent;
+  &._VbXxq_spectrum-ActionButton--quiet {
+    --spectrum-actionbutton-static-background-color: transparent;
+    --spectrum-actionbutton-static-background-color-disabled: transparent;
+    --spectrum-actionbutton-static-border-color: transparent;
+    --spectrum-actionbutton-static-border-color-disabled: transparent;
+    --spectrum-actionbutton-static-border-color-selected-hover: transparent;
+    --spectrum-actionbutton-static-border-color-focus: transparent;
+    --spectrum-actionbutton-static-border-color-active: transparent;
+    --spectrum-actionbutton-static-border-color-selected-disabled: transparent;
+  }
 }
 
-.CqADjq_spectrum-LogicButton--and {
+._VbXxq_spectrum-LogicButton--and {
   background-color: var(--spectrum-global-color-static-blue-600, #1473e6);
   border-color: var(--spectrum-global-color-static-blue-600, #1473e6);
   color: var(--spectrum-logicbutton-and-text-color, var(--spectrum-global-color-static-white));
-}
 
-.CqADjq_spectrum-LogicButton--and.CqADjq_is-hovered {
-  background-color: var(--spectrum-global-color-static-blue-700, #0d66d0);
-  border-color: var(--spectrum-global-color-static-blue-700, #0d66d0);
-  color: var(--spectrum-logicbutton-and-text-color, var(--spectrum-global-color-static-white));
-}
+  &._VbXxq_is-hovered {
+    background-color: var(--spectrum-global-color-static-blue-700, #0d66d0);
+    border-color: var(--spectrum-global-color-static-blue-700, #0d66d0);
+    color: var(--spectrum-logicbutton-and-text-color, var(--spectrum-global-color-static-white));
+  }
 
-.CqADjq_spectrum-LogicButton--and:disabled, .CqADjq_spectrum-LogicButton--and.CqADjq_is-disabled {
-  background-color: var(--spectrum-logicbutton-and-background-color-disabled, var(--spectrum-global-color-gray-200));
-  border-color: var(--spectrum-logicbutton-and-border-color-disabled, var(--spectrum-global-color-gray-200));
-  color: var(--spectrum-logicbutton-and-text-color-disabled, var(--spectrum-alias-text-color-disabled));
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-logicbutton-and-background-color-disabled, var(--spectrum-global-color-gray-200));
+    border-color: var(--spectrum-logicbutton-and-border-color-disabled, var(--spectrum-global-color-gray-200));
+    color: var(--spectrum-logicbutton-and-text-color-disabled, var(--spectrum-alias-text-color-disabled));
+  }
 }
 
-.CqADjq_spectrum-LogicButton--or {
+._VbXxq_spectrum-LogicButton--or {
   background-color: var(--spectrum-global-color-static-magenta-500, #d83790);
   border-color: var(--spectrum-global-color-static-magenta-500, #d83790);
   color: var(--spectrum-logicbutton-or-text-color, var(--spectrum-global-color-static-white));
-}
 
-.CqADjq_spectrum-LogicButton--or.CqADjq_is-hovered {
-  background-color: var(--spectrum-global-color-static-magenta-600, #ca2982);
-  border-color: var(--spectrum-global-color-static-magenta-600, #ca2982);
-  color: var(--spectrum-logicbutton-or-text-color, var(--spectrum-global-color-static-white));
-}
+  &._VbXxq_is-hovered {
+    background-color: var(--spectrum-global-color-static-magenta-600, #ca2982);
+    border-color: var(--spectrum-global-color-static-magenta-600, #ca2982);
+    color: var(--spectrum-logicbutton-or-text-color, var(--spectrum-global-color-static-white));
+  }
 
-.CqADjq_spectrum-LogicButton--or:disabled, .CqADjq_spectrum-LogicButton--or.CqADjq_is-disabled {
-  background-color: var(--spectrum-logicbutton-and-background-color-disabled, var(--spectrum-global-color-gray-200));
-  border-color: var(--spectrum-logicbutton-and-border-color-disabled, var(--spectrum-global-color-gray-200));
-  color: var(--spectrum-logicbutton-and-text-color-disabled, var(--spectrum-alias-text-color-disabled));
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-logicbutton-and-background-color-disabled, var(--spectrum-global-color-gray-200));
+    border-color: var(--spectrum-logicbutton-and-border-color-disabled, var(--spectrum-global-color-gray-200));
+    color: var(--spectrum-logicbutton-and-text-color-disabled, var(--spectrum-alias-text-color-disabled));
+  }
 }
 
-.CqADjq_spectrum-FieldButton {
+._VbXxq_spectrum-FieldButton {
   color: var(--spectrum-fieldbutton-text-color, var(--spectrum-alias-text-color));
   background-color: var(--spectrum-fieldbutton-background-color, var(--spectrum-global-color-gray-75));
   border-color: var(--spectrum-fieldbutton-border-color, var(--spectrum-alias-border-color));
-}
 
-.CqADjq_spectrum-FieldButton .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-fieldbutton-icon-color, var(--spectrum-alias-icon-color));
-}
+  & ._VbXxq_spectrum-Icon {
+    fill: var(--spectrum-fieldbutton-icon-color, var(--spectrum-alias-icon-color));
+  }
 
-.CqADjq_spectrum-FieldButton.CqADjq_is-hovered {
-  color: var(--spectrum-fieldbutton-text-color-hover, var(--spectrum-alias-text-color-hover));
-  background-color: var(--spectrum-fieldbutton-background-color-hover, var(--spectrum-global-color-gray-50));
-  border-color: var(--spectrum-fieldbutton-border-color-hover, var(--spectrum-alias-border-color-hover));
-}
+  &._VbXxq_is-hovered {
+    color: var(--spectrum-fieldbutton-text-color-hover, var(--spectrum-alias-text-color-hover));
+    background-color: var(--spectrum-fieldbutton-background-color-hover, var(--spectrum-global-color-gray-50));
+    border-color: var(--spectrum-fieldbutton-border-color-hover, var(--spectrum-alias-border-color-hover));
 
-.CqADjq_spectrum-FieldButton.CqADjq_is-hovered .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-fieldbutton-icon-color-hover, var(--spectrum-alias-icon-color-hover));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-fieldbutton-icon-color-hover, var(--spectrum-alias-icon-color-hover));
+    }
+  }
 
-.CqADjq_spectrum-FieldButton.CqADjq_is-active, .CqADjq_spectrum-FieldButton.CqADjq_is-selected {
-  background-color: var(--spectrum-fieldbutton-background-color-down, var(--spectrum-global-color-gray-200));
-  border-color: var(--spectrum-fieldbutton-border-color-down, var(--spectrum-alias-border-color-down));
-}
+  &._VbXxq_is-active, &._VbXxq_is-selected {
+    background-color: var(--spectrum-fieldbutton-background-color-down, var(--spectrum-global-color-gray-200));
+    border-color: var(--spectrum-fieldbutton-border-color-down, var(--spectrum-alias-border-color-down));
 
-:is(.CqADjq_spectrum-FieldButton.CqADjq_is-active, .CqADjq_spectrum-FieldButton.CqADjq_is-selected) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-fieldbutton-icon-color-down, var(--spectrum-alias-icon-color-down));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-fieldbutton-icon-color-down, var(--spectrum-alias-icon-color-down));
+    }
+  }
 
-.CqADjq_spectrum-FieldButton.CqADjq_focus-ring, .CqADjq_spectrum-FieldButton.CqADjq_is-focused {
-  background-color: var(--spectrum-fieldbutton-background-color-key-focus, var(--spectrum-global-color-gray-50));
-  border-color: var(--spectrum-fieldbutton-border-color-key-focus, var(--spectrum-alias-border-color-focus));
-  color: var(--spectrum-fieldbutton-text-color-key-focus, var(--spectrum-alias-text-color-hover));
-}
+  &._VbXxq_focus-ring, &._VbXxq_is-focused {
+    background-color: var(--spectrum-fieldbutton-background-color-key-focus, var(--spectrum-global-color-gray-50));
+    border-color: var(--spectrum-fieldbutton-border-color-key-focus, var(--spectrum-alias-border-color-focus));
+    color: var(--spectrum-fieldbutton-text-color-key-focus, var(--spectrum-alias-text-color-hover));
 
-:is(.CqADjq_spectrum-FieldButton.CqADjq_focus-ring, .CqADjq_spectrum-FieldButton.CqADjq_is-focused) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-fieldbutton-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
-}
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-fieldbutton-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
+    }
 
-:is(.CqADjq_spectrum-FieldButton.CqADjq_focus-ring, .CqADjq_spectrum-FieldButton.CqADjq_is-focused).CqADjq_is-placeholder {
-  fill: var(--spectrum-fieldbutton-placeholder-text-color-key-focus, var(--spectrum-alias-placeholder-text-color-hover));
-}
+    &._VbXxq_is-placeholder {
+      fill: var(--spectrum-fieldbutton-placeholder-text-color-key-focus, var(--spectrum-alias-placeholder-text-color-hover));
+    }
+  }
 
-.CqADjq_spectrum-FieldButton.CqADjq_spectrum-FieldButton--invalid {
-  border-color: var(--spectrum-fieldbutton-border-color-error, var(--spectrum-global-color-red-500));
-}
+  &._VbXxq_spectrum-FieldButton--invalid {
+    border-color: var(--spectrum-fieldbutton-border-color-error, var(--spectrum-global-color-red-500));
 
-.CqADjq_spectrum-FieldButton.CqADjq_spectrum-FieldButton--invalid.CqADjq_is-hovered {
-  border-color: var(--spectrum-fieldbutton-border-color-error-hover, var(--spectrum-global-color-red-600));
-}
+    &._VbXxq_is-hovered {
+      border-color: var(--spectrum-fieldbutton-border-color-error-hover, var(--spectrum-global-color-red-600));
+    }
 
-.CqADjq_spectrum-FieldButton.CqADjq_spectrum-FieldButton--invalid.CqADjq_is-active, .CqADjq_spectrum-FieldButton.CqADjq_spectrum-FieldButton--invalid.CqADjq_is-selected {
-  border-color: var(--spectrum-fieldbutton-border-color-error-down, var(--spectrum-global-color-red-600));
-}
+    &._VbXxq_is-active, &._VbXxq_is-selected {
+      border-color: var(--spectrum-fieldbutton-border-color-error-down, var(--spectrum-global-color-red-600));
+    }
 
-.CqADjq_spectrum-FieldButton.CqADjq_spectrum-FieldButton--invalid.CqADjq_focus-ring, .CqADjq_spectrum-FieldButton.CqADjq_spectrum-FieldButton--invalid.CqADjq_is-focused {
-  border-color: var(--spectrum-fieldbutton-border-color-error-key-focus, var(--spectrum-alias-border-color-focus));
-}
+    &._VbXxq_focus-ring, &._VbXxq_is-focused {
+      border-color: var(--spectrum-fieldbutton-border-color-error-key-focus, var(--spectrum-alias-border-color-focus));
+    }
+  }
 
-.CqADjq_spectrum-FieldButton:disabled, .CqADjq_spectrum-FieldButton.CqADjq_is-disabled {
-  background-color: var(--spectrum-fieldbutton-background-color-disabled, var(--spectrum-global-color-gray-200));
-  color: var(--spectrum-fieldbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled));
-}
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-fieldbutton-background-color-disabled, var(--spectrum-global-color-gray-200));
+    color: var(--spectrum-fieldbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled));
 
-:is(.CqADjq_spectrum-FieldButton:disabled, .CqADjq_spectrum-FieldButton.CqADjq_is-disabled) .CqADjq_spectrum-Icon {
-  fill: var(--spectrum-fieldbutton-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
+    & ._VbXxq_spectrum-Icon {
+      fill: var(--spectrum-fieldbutton-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
+    }
+  }
 }
 
-.CqADjq_spectrum-FieldButton--quiet {
+._VbXxq_spectrum-FieldButton--quiet {
   color: var(--spectrum-fieldbutton-text-color, var(--spectrum-alias-text-color));
   border-color: var(--spectrum-fieldbutton-quiet-border-color, var(--spectrum-alias-border-color-transparent));
   background-color: var(--spectrum-fieldbutton-quiet-background-color, var(--spectrum-alias-background-color-transparent));
-}
 
-.CqADjq_spectrum-FieldButton--quiet.CqADjq_is-hovered {
-  background-color: var(--spectrum-fieldbutton-quiet-background-color-hover, var(--spectrum-alias-background-color-transparent));
-  color: var(--spectrum-fieldbutton-text-color-hover, var(--spectrum-alias-text-color-hover));
-}
+  &._VbXxq_is-hovered {
+    background-color: var(--spectrum-fieldbutton-quiet-background-color-hover, var(--spectrum-alias-background-color-transparent));
+    color: var(--spectrum-fieldbutton-text-color-hover, var(--spectrum-alias-text-color-hover));
+  }
 
-.CqADjq_spectrum-FieldButton--quiet.CqADjq_focus-ring, .CqADjq_spectrum-FieldButton--quiet.CqADjq_is-focused {
-  background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
-}
+  &._VbXxq_focus-ring, &._VbXxq_is-focused {
+    background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
 
-:is(.CqADjq_spectrum-FieldButton--quiet.CqADjq_focus-ring, .CqADjq_spectrum-FieldButton--quiet.CqADjq_is-focused).CqADjq_is-placeholder {
-  color: var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus, var(--spectrum-alias-placeholder-text-color-hover));
-}
+    &._VbXxq_is-placeholder {
+      color: var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus, var(--spectrum-alias-placeholder-text-color-hover));
+    }
+  }
 
-.CqADjq_spectrum-FieldButton--quiet.CqADjq_is-active, .CqADjq_spectrum-FieldButton--quiet.CqADjq_is-selected {
-  background-color: var(--spectrum-fieldbutton-quiet-background-color-down, var(--spectrum-alias-background-color-transparent));
-  border-color: var(--spectrum-fieldbutton-quiet-border-color-down, var(--spectrum-alias-border-color-transparent));
-}
+  &._VbXxq_is-active, &._VbXxq_is-selected {
+    background-color: var(--spectrum-fieldbutton-quiet-background-color-down, var(--spectrum-alias-background-color-transparent));
+    border-color: var(--spectrum-fieldbutton-quiet-border-color-down, var(--spectrum-alias-border-color-transparent));
 
-:is(.CqADjq_spectrum-FieldButton--quiet.CqADjq_is-active, .CqADjq_spectrum-FieldButton--quiet.CqADjq_is-selected).CqADjq_focus-ring, :is(.CqADjq_spectrum-FieldButton--quiet.CqADjq_is-active, .CqADjq_spectrum-FieldButton--quiet.CqADjq_is-selected).CqADjq_is-focused {
-  background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
-}
+    &._VbXxq_focus-ring, &._VbXxq_is-focused {
+      background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
+    }
+  }
 
-.CqADjq_spectrum-FieldButton--quiet:disabled, .CqADjq_spectrum-FieldButton--quiet.CqADjq_is-disabled {
-  background-color: var(--spectrum-fieldbutton-quiet-background-color-disabled, var(--spectrum-alias-background-color-transparent));
-  color: var(--spectrum-fieldbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled));
+  &:disabled, &._VbXxq_is-disabled {
+    background-color: var(--spectrum-fieldbutton-quiet-background-color-disabled, var(--spectrum-alias-background-color-transparent));
+    color: var(--spectrum-fieldbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled));
+  }
 }
 
 @media (forced-colors: active) {
-  .CqADjq_spectrum-ActionButton, .CqADjq_spectrum-ClearButton, .CqADjq_spectrum-LogicButton, .CqADjq_spectrum-FieldButton {
+  ._VbXxq_spectrum-ActionButton, ._VbXxq_spectrum-ClearButton, ._VbXxq_spectrum-LogicButton, ._VbXxq_spectrum-FieldButton {
     forced-color-adjust: none;
     --spectrum-clearbutton-medium-icon-color: ButtonText;
     --spectrum-clearbutton-medium-icon-color-disabled: GrayText;
@@ -1271,11 +1310,11 @@ a.CqADjq_spectrum-Button, a.CqADjq_spectrum-ActionButton {
     --spectrum-dropdown-border-color-key-focus: Highlight;
   }
 
-  .CqADjq_spectrum-Button--overBackground {
+  ._VbXxq_spectrum-Button--overBackground {
     --spectrum-button-over-background-color: ButtonText;
   }
 
-  .CqADjq_spectrum-ActionButton--staticColor, .CqADjq_spectrum-ActionButton--staticWhite, .CqADjq_spectrum-ActionButton--staticBlack, .CqADjq_spectrum-ActionButton--staticWhite.CqADjq_spectrum-ActionButton--quiet, .CqADjq_spectrum-ActionButton--staticBlack.CqADjq_spectrum-ActionButton--quiet {
+  ._VbXxq_spectrum-ActionButton--staticColor, ._VbXxq_spectrum-ActionButton--staticWhite, ._VbXxq_spectrum-ActionButton--staticBlack, ._VbXxq_spectrum-ActionButton--staticWhite._VbXxq_spectrum-ActionButton--quiet, ._VbXxq_spectrum-ActionButton--staticBlack._VbXxq_spectrum-ActionButton--quiet {
     mix-blend-mode: normal;
     --spectrum-actionbutton-static-background-color: ButtonFace;
     --spectrum-actionbutton-static-background-color-disabled: var(--spectrum-high-contrast-transparent);