npm - @dialpad/dialtone - Versions diffs - 9.79.0 → 9.79.2-beta.1 - Mend

@dialpad/dialtone 9.79.0 → 9.79.2-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3098) hide show

package/dist/css/dialtone.css CHANGED Viewed

@@ -4573,10 +4573,10 @@ legend .d-label--md {
 .d-scrollbar .os-scrollbar .os-scrollbar-handle:active {
   opacity: var(--dt-opacity-900);
 }
-:root.d-scrollbar-disabled {
+.d-scrollbar-disabled {
   overflow: hidden !important;
 }
-:root.d-scrollbar-disabled .os-scrollbar {
+.d-scrollbar-disabled .os-scrollbar {
   display: none;
 }
 .d-emoji {
@@ -5246,78 +5246,6 @@ legend .d-label--md {
 .d-divide-x-reverse > * + * {
   --divide-x-reverse: 1;
 }
-.d-fc-primary, .h\:d-fc-primary:hover, .f\:d-fc-primary:focus, .f\:d-fc-primary:focus-within, .fv\:d-fc-primary:focus-visible {
-  color: var(--dt-color-foreground-primary) !important;
-}
-.d-fc-primary-inverted, .h\:d-fc-primary-inverted:hover, .f\:d-fc-primary-inverted:focus, .f\:d-fc-primary-inverted:focus-within, .fv\:d-fc-primary-inverted:focus-visible {
-  color: var(--dt-color-foreground-primary-inverted) !important;
-}
-.d-fc-secondary, .h\:d-fc-secondary:hover, .f\:d-fc-secondary:focus, .f\:d-fc-secondary:focus-within, .fv\:d-fc-secondary:focus-visible {
-  color: var(--dt-color-foreground-secondary) !important;
-}
-.d-fc-secondary-inverted, .h\:d-fc-secondary-inverted:hover, .f\:d-fc-secondary-inverted:focus, .f\:d-fc-secondary-inverted:focus-within, .fv\:d-fc-secondary-inverted:focus-visible {
-  color: var(--dt-color-foreground-secondary-inverted) !important;
-}
-.d-fc-tertiary, .h\:d-fc-tertiary:hover, .f\:d-fc-tertiary:focus, .f\:d-fc-tertiary:focus-within, .fv\:d-fc-tertiary:focus-visible {
-  color: var(--dt-color-foreground-tertiary) !important;
-}
-.d-fc-tertiary-inverted, .h\:d-fc-tertiary-inverted:hover, .f\:d-fc-tertiary-inverted:focus, .f\:d-fc-tertiary-inverted:focus-within, .fv\:d-fc-tertiary-inverted:focus-visible {
-  color: var(--dt-color-foreground-tertiary-inverted) !important;
-}
-.d-fc-muted, .h\:d-fc-muted:hover, .f\:d-fc-muted:focus, .f\:d-fc-muted:focus-within, .fv\:d-fc-muted:focus-visible {
-  color: var(--dt-color-foreground-muted) !important;
-}
-.d-fc-muted-inverted, .h\:d-fc-muted-inverted:hover, .f\:d-fc-muted-inverted:focus, .f\:d-fc-muted-inverted:focus-within, .fv\:d-fc-muted-inverted:focus-visible {
-  color: var(--dt-color-foreground-muted-inverted) !important;
-}
-.d-fc-placeholder, .h\:d-fc-placeholder:hover, .f\:d-fc-placeholder:focus, .f\:d-fc-placeholder:focus-within, .fv\:d-fc-placeholder:focus-visible {
-  color: var(--dt-color-foreground-placeholder) !important;
-}
-.d-fc-placeholder-inverted, .h\:d-fc-placeholder-inverted:hover, .f\:d-fc-placeholder-inverted:focus, .f\:d-fc-placeholder-inverted:focus-within, .fv\:d-fc-placeholder-inverted:focus-visible {
-  color: var(--dt-color-foreground-placeholder-inverted) !important;
-}
-.d-fc-disabled, .h\:d-fc-disabled:hover, .f\:d-fc-disabled:focus, .f\:d-fc-disabled:focus-within, .fv\:d-fc-disabled:focus-visible {
-  color: var(--dt-color-foreground-disabled) !important;
-}
-.d-fc-disabled-inverted, .h\:d-fc-disabled-inverted:hover, .f\:d-fc-disabled-inverted:focus, .f\:d-fc-disabled-inverted:focus-within, .fv\:d-fc-disabled-inverted:focus-visible {
-  color: var(--dt-color-foreground-disabled-inverted) !important;
-}
-.d-fc-success, .h\:d-fc-success:hover, .f\:d-fc-success:focus, .f\:d-fc-success:focus-within, .fv\:d-fc-success:focus-visible {
-  color: var(--dt-color-foreground-success) !important;
-}
-.d-fc-success-inverted, .h\:d-fc-success-inverted:hover, .f\:d-fc-success-inverted:focus, .f\:d-fc-success-inverted:focus-within, .fv\:d-fc-success-inverted:focus-visible {
-  color: var(--dt-color-foreground-success-inverted) !important;
-}
-.d-fc-success-strong, .h\:d-fc-success-strong:hover, .f\:d-fc-success-strong:focus, .f\:d-fc-success-strong:focus-within, .fv\:d-fc-success-strong:focus-visible {
-  color: var(--dt-color-foreground-success-strong) !important;
-}
-.d-fc-success-strong-inverted, .h\:d-fc-success-strong-inverted:hover, .f\:d-fc-success-strong-inverted:focus, .f\:d-fc-success-strong-inverted:focus-within, .fv\:d-fc-success-strong-inverted:focus-visible {
-  color: var(--dt-color-foreground-success-strong-inverted) !important;
-}
-.d-fc-warning, .h\:d-fc-warning:hover, .f\:d-fc-warning:focus, .f\:d-fc-warning:focus-within, .fv\:d-fc-warning:focus-visible {
-  color: var(--dt-color-foreground-warning) !important;
-}
-.d-fc-warning-inverted, .h\:d-fc-warning-inverted:hover, .f\:d-fc-warning-inverted:focus, .f\:d-fc-warning-inverted:focus-within, .fv\:d-fc-warning-inverted:focus-visible {
-  color: var(--dt-color-foreground-warning-inverted) !important;
-}
-.d-fc-error, .h\:d-fc-error:hover, .f\:d-fc-error:focus, .f\:d-fc-error:focus-within, .fv\:d-fc-error:focus-visible {
-  color: var(--dt-color-foreground-critical) !important;
-}
-.d-fc-error-strong, .h\:d-fc-error-strong:hover, .f\:d-fc-error-strong:focus, .f\:d-fc-error-strong:focus-within, .fv\:d-fc-error-strong:focus-visible {
-  color: var(--dt-color-foreground-critical-strong) !important;
-}
-.d-fc-critical, .h\:d-fc-critical:hover, .f\:d-fc-critical:focus, .f\:d-fc-critical:focus-within, .fv\:d-fc-critical:focus-visible {
-  color: var(--dt-color-foreground-critical) !important;
-}
-.d-fc-critical-inverted, .h\:d-fc-critical-inverted:hover, .f\:d-fc-critical-inverted:focus, .f\:d-fc-critical-inverted:focus-within, .fv\:d-fc-critical-inverted:focus-visible {
-  color: var(--dt-color-foreground-critical-inverted) !important;
-}
-.d-fc-critical-strong, .h\:d-fc-critical-strong:hover, .f\:d-fc-critical-strong:focus, .f\:d-fc-critical-strong:focus-within, .fv\:d-fc-critical-strong:focus-visible {
-  color: var(--dt-color-foreground-critical-strong) !important;
-}
-.d-fc-critical-strong-inverted, .h\:d-fc-critical-strong-inverted:hover, .f\:d-fc-critical-strong-inverted:focus, .f\:d-fc-critical-strong-inverted:focus-within, .fv\:d-fc-critical-strong-inverted:focus-visible {
-  color: var(--dt-color-foreground-critical-strong-inverted) !important;
-}
 .d-fc-current, .h\:d-fc-current:hover, .f\:d-fc-current:focus, .f\:d-fc-current:focus-within, .fv\:d-fc-current:focus-visible {
   color: currentColor !important;
 }
@@ -5327,102 +5255,6 @@ legend .d-label--md {
 .d-fc-unset, .h\:d-fc-unset:hover, .f\:d-fc-unset:focus, .f\:d-fc-unset:focus-within, .fv\:d-fc-unset:focus-visible {
   color: unset !important;
 }
-.d-bgc-primary, .h\:d-bgc-primary:hover, .f\:d-bgc-primary:focus, .f\:d-bgc-primary:focus-within, .fv\:d-bgc-primary:focus-visible {
-  background-color: var(--dt-color-surface-primary) !important;
-}
-.d-bgc-secondary, .h\:d-bgc-secondary:hover, .f\:d-bgc-secondary:focus, .f\:d-bgc-secondary:focus-within, .fv\:d-bgc-secondary:focus-visible {
-  background-color: var(--dt-color-surface-secondary) !important;
-}
-.d-bgc-secondary-opaque, .h\:d-bgc-secondary-opaque:hover, .f\:d-bgc-secondary-opaque:focus, .f\:d-bgc-secondary-opaque:focus-within, .fv\:d-bgc-secondary-opaque:focus-visible {
-  background-color: var(--dt-color-surface-secondary-opaque) !important;
-}
-.d-bgc-moderate, .h\:d-bgc-moderate:hover, .f\:d-bgc-moderate:focus, .f\:d-bgc-moderate:focus-within, .fv\:d-bgc-moderate:focus-visible {
-  background-color: var(--dt-color-surface-moderate) !important;
-}
-.d-bgc-moderate-opaque, .h\:d-bgc-moderate-opaque:hover, .f\:d-bgc-moderate-opaque:focus, .f\:d-bgc-moderate-opaque:focus-within, .fv\:d-bgc-moderate-opaque:focus-visible {
-  background-color: var(--dt-color-surface-moderate-opaque) !important;
-}
-.d-bgc-strong-opaque, .h\:d-bgc-strong-opaque:hover, .f\:d-bgc-strong-opaque:focus, .f\:d-bgc-strong-opaque:focus-within, .fv\:d-bgc-strong-opaque:focus-visible {
-  background-color: var(--dt-color-surface-strong-opaque) !important;
-}
-.d-bgc-contrast-opaque, .h\:d-bgc-contrast-opaque:hover, .f\:d-bgc-contrast-opaque:focus, .f\:d-bgc-contrast-opaque:focus-within, .fv\:d-bgc-contrast-opaque:focus-visible {
-  background-color: var(--dt-color-surface-contrast-opaque) !important;
-}
-.d-bgc-bold, .h\:d-bgc-bold:hover, .f\:d-bgc-bold:focus, .f\:d-bgc-bold:focus-within, .fv\:d-bgc-bold:focus-visible {
-  background-color: var(--dt-color-surface-bold) !important;
-}
-.d-bgc-bold-opaque, .h\:d-bgc-bold-opaque:hover, .f\:d-bgc-bold-opaque:focus, .f\:d-bgc-bold-opaque:focus-within, .fv\:d-bgc-bold-opaque:focus-visible {
-  background-color: var(--dt-color-surface-bold-opaque) !important;
-}
-.d-bgc-strong, .h\:d-bgc-strong:hover, .f\:d-bgc-strong:focus, .f\:d-bgc-strong:focus-within, .fv\:d-bgc-strong:focus-visible {
-  background-color: var(--dt-color-surface-strong) !important;
-}
-.d-bgc-contrast, .h\:d-bgc-contrast:hover, .f\:d-bgc-contrast:focus, .f\:d-bgc-contrast:focus-within, .fv\:d-bgc-contrast:focus-visible {
-  background-color: var(--dt-color-surface-contrast) !important;
-}
-.d-bgc-backdrop, .h\:d-bgc-backdrop:hover, .f\:d-bgc-backdrop:focus, .f\:d-bgc-backdrop:focus-within, .fv\:d-bgc-backdrop:focus-visible {
-  background-color: var(--dt-color-surface-backdrop) !important;
-}
-.d-bgc-success, .h\:d-bgc-success:hover, .f\:d-bgc-success:focus, .f\:d-bgc-success:focus-within, .fv\:d-bgc-success:focus-visible {
-  background-color: var(--dt-color-surface-success) !important;
-}
-.d-bgc-success-opaque, .h\:d-bgc-success-opaque:hover, .f\:d-bgc-success-opaque:focus, .f\:d-bgc-success-opaque:focus-within, .fv\:d-bgc-success-opaque:focus-visible {
-  background-color: var(--dt-color-surface-success-opaque) !important;
-}
-.d-bgc-success-subtle, .h\:d-bgc-success-subtle:hover, .f\:d-bgc-success-subtle:focus, .f\:d-bgc-success-subtle:focus-within, .fv\:d-bgc-success-subtle:focus-visible {
-  background-color: var(--dt-color-surface-success-subtle) !important;
-}
-.d-bgc-success-subtle-opaque, .h\:d-bgc-success-subtle-opaque:hover, .f\:d-bgc-success-subtle-opaque:focus, .f\:d-bgc-success-subtle-opaque:focus-within, .fv\:d-bgc-success-subtle-opaque:focus-visible {
-  background-color: var(--dt-color-surface-success-subtle-opaque) !important;
-}
-.d-bgc-success-strong, .h\:d-bgc-success-strong:hover, .f\:d-bgc-success-strong:focus, .f\:d-bgc-success-strong:focus-within, .fv\:d-bgc-success-strong:focus-visible {
-  background-color: var(--dt-color-surface-success-strong) !important;
-}
-.d-bgc-warning, .h\:d-bgc-warning:hover, .f\:d-bgc-warning:focus, .f\:d-bgc-warning:focus-within, .fv\:d-bgc-warning:focus-visible {
-  background-color: var(--dt-color-surface-warning) !important;
-}
-.d-bgc-warning-opaque, .h\:d-bgc-warning-opaque:hover, .f\:d-bgc-warning-opaque:focus, .f\:d-bgc-warning-opaque:focus-within, .fv\:d-bgc-warning-opaque:focus-visible {
-  background-color: var(--dt-color-surface-warning-opaque) !important;
-}
-.d-bgc-warning-subtle, .h\:d-bgc-warning-subtle:hover, .f\:d-bgc-warning-subtle:focus, .f\:d-bgc-warning-subtle:focus-within, .fv\:d-bgc-warning-subtle:focus-visible {
-  background-color: var(--dt-color-surface-warning-subtle) !important;
-}
-.d-bgc-warning-subtle-opaque, .h\:d-bgc-warning-subtle-opaque:hover, .f\:d-bgc-warning-subtle-opaque:focus, .f\:d-bgc-warning-subtle-opaque:focus-within, .fv\:d-bgc-warning-subtle-opaque:focus-visible {
-  background-color: var(--dt-color-surface-warning-subtle-opaque) !important;
-}
-.d-bgc-warning-strong, .h\:d-bgc-warning-strong:hover, .f\:d-bgc-warning-strong:focus, .f\:d-bgc-warning-strong:focus-within, .fv\:d-bgc-warning-strong:focus-visible {
-  background-color: var(--dt-color-surface-warning-strong) !important;
-}
-.d-bgc-info, .h\:d-bgc-info:hover, .f\:d-bgc-info:focus, .f\:d-bgc-info:focus-within, .fv\:d-bgc-info:focus-visible {
-  background-color: var(--dt-color-surface-info) !important;
-}
-.d-bgc-info-opaque, .h\:d-bgc-info-opaque:hover, .f\:d-bgc-info-opaque:focus, .f\:d-bgc-info-opaque:focus-within, .fv\:d-bgc-info-opaque:focus-visible {
-  background-color: var(--dt-color-surface-info-opaque) !important;
-}
-.d-bgc-info-subtle, .h\:d-bgc-info-subtle:hover, .f\:d-bgc-info-subtle:focus, .f\:d-bgc-info-subtle:focus-within, .fv\:d-bgc-info-subtle:focus-visible {
-  background-color: var(--dt-color-surface-info-subtle) !important;
-}
-.d-bgc-info-subtle-opaque, .h\:d-bgc-info-subtle-opaque:hover, .f\:d-bgc-info-subtle-opaque:focus, .f\:d-bgc-info-subtle-opaque:focus-within, .fv\:d-bgc-info-subtle-opaque:focus-visible {
-  background-color: var(--dt-color-surface-info-subtle-opaque) !important;
-}
-.d-bgc-info-strong, .h\:d-bgc-info-strong:hover, .f\:d-bgc-info-strong:focus, .f\:d-bgc-info-strong:focus-within, .fv\:d-bgc-info-strong:focus-visible {
-  background-color: var(--dt-color-surface-info-strong) !important;
-}
-.d-bgc-critical, .h\:d-bgc-critical:hover, .f\:d-bgc-critical:focus, .f\:d-bgc-critical:focus-within, .fv\:d-bgc-critical:focus-visible, .d-bgc-error, .h\:d-bgc-error:hover, .f\:d-bgc-error:focus, .f\:d-bgc-error:focus-within, .fv\:d-bgc-error:focus-visible, .d-bgc-danger, .h\:d-bgc-danger:hover, .f\:d-bgc-danger:focus, .f\:d-bgc-danger:focus-within, .fv\:d-bgc-danger:focus-visible {
-  background-color: var(--dt-color-surface-critical) !important;
-}
-.d-bgc-critical-opaque, .h\:d-bgc-critical-opaque:hover, .f\:d-bgc-critical-opaque:focus, .f\:d-bgc-critical-opaque:focus-within, .fv\:d-bgc-critical-opaque:focus-visible {
-  background-color: var(--dt-color-surface-critical-opaque) !important;
-}
-.d-bgc-critical-subtle, .h\:d-bgc-critical-subtle:hover, .f\:d-bgc-critical-subtle:focus, .f\:d-bgc-critical-subtle:focus-within, .fv\:d-bgc-critical-subtle:focus-visible {
-  background-color: var(--dt-color-surface-critical-subtle) !important;
-}
-.d-bgc-critical-subtle-opaque, .h\:d-bgc-critical-subtle-opaque:hover, .f\:d-bgc-critical-subtle-opaque:focus, .f\:d-bgc-critical-subtle-opaque:focus-within, .fv\:d-bgc-critical-subtle-opaque:focus-visible {
-  background-color: var(--dt-color-surface-critical-subtle-opaque) !important;
-}
-.d-bgc-critical-strong, .h\:d-bgc-critical-strong:hover, .f\:d-bgc-critical-strong:focus, .f\:d-bgc-critical-strong:focus-within, .fv\:d-bgc-critical-strong:focus-visible {
-  background-color: var(--dt-color-surface-critical-strong) !important;
-}
 .d-bgc-transparent, .h\:d-bgc-transparent:hover, .f\:d-bgc-transparent:focus, .f\:d-bgc-transparent:focus-within, .fv\:d-bgc-transparent:focus-visible {
   background-color: transparent !important;
   background-image: none !important;
@@ -5431,117 +5263,15 @@ legend .d-label--md {
   background-color: unset !important;
   background-image: unset !important;
 }
-.d-bc-transparent {
+.d-bc-transparent, .h\:d-bc-transparent:hover, .f\:d-bc-transparent:focus, .f\:d-bc-transparent:focus-within, .fv\:d-bc-transparent:focus-visible {
   border-color: transparent !important;
 }
-.d-bc-current {
+.d-bc-current, .h\:d-bc-current:hover, .f\:d-bc-current:focus, .f\:d-bc-current:focus-within, .fv\:d-bc-current:focus-visible {
   border-color: currentColor !important;
 }
-.d-bc-unset {
+.d-bc-unset, .h\:d-bc-unset:hover, .f\:d-bc-unset:focus, .f\:d-bc-unset:focus-within, .fv\:d-bc-unset:focus-visible {
   border-color: unset !important;
 }
-.d-bc-subtle, .h\:d-bc-subtle:hover, .f\:d-bc-subtle:focus, .f\:d-bc-subtle:focus-within, .fv\:d-bc-subtle:focus-visible {
-  border-color: var(--dt-color-border-subtle) !important;
-}
-.d-bc-default, .h\:d-bc-default:hover, .f\:d-bc-default:focus, .f\:d-bc-default:focus-within, .fv\:d-bc-default:focus-visible {
-  border-color: var(--dt-color-border-default) !important;
-}
-.d-bc-moderate, .h\:d-bc-moderate:hover, .f\:d-bc-moderate:focus, .f\:d-bc-moderate:focus-within, .fv\:d-bc-moderate:focus-visible {
-  border-color: var(--dt-color-border-moderate) !important;
-}
-.d-bc-bold, .h\:d-bc-bold:hover, .f\:d-bc-bold:focus, .f\:d-bc-bold:focus-within, .fv\:d-bc-bold:focus-visible {
-  border-color: var(--dt-color-border-bold) !important;
-}
-.d-bc-subtle-inverted, .h\:d-bc-subtle-inverted:hover, .f\:d-bc-subtle-inverted:focus, .f\:d-bc-subtle-inverted:focus-within, .fv\:d-bc-subtle-inverted:focus-visible {
-  border-color: var(--dt-color-border-subtle-inverted) !important;
-}
-.d-bc-default-inverted, .h\:d-bc-default-inverted:hover, .f\:d-bc-default-inverted:focus, .f\:d-bc-default-inverted:focus-within, .fv\:d-bc-default-inverted:focus-visible {
-  border-color: var(--dt-color-border-default-inverted) !important;
-}
-.d-bc-moderate-inverted, .h\:d-bc-moderate-inverted:hover, .f\:d-bc-moderate-inverted:focus, .f\:d-bc-moderate-inverted:focus-within, .fv\:d-bc-moderate-inverted:focus-visible {
-  border-color: var(--dt-color-border-moderate-inverted) !important;
-}
-.d-bc-bold-inverted, .h\:d-bc-bold-inverted:hover, .f\:d-bc-bold-inverted:focus, .f\:d-bc-bold-inverted:focus-within, .fv\:d-bc-bold-inverted:focus-visible {
-  border-color: var(--dt-color-border-bold-inverted) !important;
-}
-.d-bc-focus, .h\:d-bc-focus:hover, .f\:d-bc-focus:focus, .f\:d-bc-focus:focus-within, .fv\:d-bc-focus:focus-visible {
-  border-color: var(--dt-color-border-focus) !important;
-}
-.d-bc-critical, .h\:d-bc-critical:hover, .f\:d-bc-critical:focus, .f\:d-bc-critical:focus-within, .fv\:d-bc-critical:focus-visible {
-  border-color: var(--dt-color-border-critical) !important;
-}
-.d-bc-critical-inverted, .h\:d-bc-critical-inverted:hover, .f\:d-bc-critical-inverted:focus, .f\:d-bc-critical-inverted:focus-within, .fv\:d-bc-critical-inverted:focus-visible {
-  border-color: var(--dt-color-border-critical-inverted) !important;
-}
-.d-bc-critical-subtle, .h\:d-bc-critical-subtle:hover, .f\:d-bc-critical-subtle:focus, .f\:d-bc-critical-subtle:focus-within, .fv\:d-bc-critical-subtle:focus-visible {
-  border-color: var(--dt-color-border-critical-subtle) !important;
-}
-.d-bc-critical-subtle-inverted, .h\:d-bc-critical-subtle-inverted:hover, .f\:d-bc-critical-subtle-inverted:focus, .f\:d-bc-critical-subtle-inverted:focus-within, .fv\:d-bc-critical-subtle-inverted:focus-visible {
-  border-color: var(--dt-color-border-critical-subtle-inverted) !important;
-}
-.d-bc-critical-strong, .h\:d-bc-critical-strong:hover, .f\:d-bc-critical-strong:focus, .f\:d-bc-critical-strong:focus-within, .fv\:d-bc-critical-strong:focus-visible {
-  border-color: var(--dt-color-border-critical-strong) !important;
-}
-.d-bc-critical-strong-inverted, .h\:d-bc-critical-strong-inverted:hover, .f\:d-bc-critical-strong-inverted:focus, .f\:d-bc-critical-strong-inverted:focus-within, .fv\:d-bc-critical-strong-inverted:focus-visible {
-  border-color: var(--dt-color-border-critical-strong-inverted) !important;
-}
-.d-bc-success, .h\:d-bc-success:hover, .f\:d-bc-success:focus, .f\:d-bc-success:focus-within, .fv\:d-bc-success:focus-visible {
-  border-color: var(--dt-color-border-success) !important;
-}
-.d-bc-success-inverted, .h\:d-bc-success-inverted:hover, .f\:d-bc-success-inverted:focus, .f\:d-bc-success-inverted:focus-within, .fv\:d-bc-success-inverted:focus-visible {
-  border-color: var(--dt-color-border-success-inverted) !important;
-}
-.d-bc-success-subtle, .h\:d-bc-success-subtle:hover, .f\:d-bc-success-subtle:focus, .f\:d-bc-success-subtle:focus-within, .fv\:d-bc-success-subtle:focus-visible {
-  border-color: var(--dt-color-border-success-subtle) !important;
-}
-.d-bc-success-subtle-inverted, .h\:d-bc-success-subtle-inverted:hover, .f\:d-bc-success-subtle-inverted:focus, .f\:d-bc-success-subtle-inverted:focus-within, .fv\:d-bc-success-subtle-inverted:focus-visible {
-  border-color: var(--dt-color-border-success-subtle-inverted) !important;
-}
-.d-bc-success-strong, .h\:d-bc-success-strong:hover, .f\:d-bc-success-strong:focus, .f\:d-bc-success-strong:focus-within, .fv\:d-bc-success-strong:focus-visible {
-  border-color: var(--dt-color-border-success-strong) !important;
-}
-.d-bc-success-strong-inverted, .h\:d-bc-success-strong-inverted:hover, .f\:d-bc-success-strong-inverted:focus, .f\:d-bc-success-strong-inverted:focus-within, .fv\:d-bc-success-strong-inverted:focus-visible {
-  border-color: var(--dt-color-border-success-strong-inverted) !important;
-}
-.d-bc-warning, .h\:d-bc-warning:hover, .f\:d-bc-warning:focus, .f\:d-bc-warning:focus-within, .fv\:d-bc-warning:focus-visible {
-  border-color: var(--dt-color-border-warning) !important;
-}
-.d-bc-warning-inverted, .h\:d-bc-warning-inverted:hover, .f\:d-bc-warning-inverted:focus, .f\:d-bc-warning-inverted:focus-within, .fv\:d-bc-warning-inverted:focus-visible {
-  border-color: var(--dt-color-border-warning-inverted) !important;
-}
-.d-bc-warning-subtle, .h\:d-bc-warning-subtle:hover, .f\:d-bc-warning-subtle:focus, .f\:d-bc-warning-subtle:focus-within, .fv\:d-bc-warning-subtle:focus-visible {
-  border-color: var(--dt-color-border-warning-subtle) !important;
-}
-.d-bc-warning-subtle-inverted, .h\:d-bc-warning-subtle-inverted:hover, .f\:d-bc-warning-subtle-inverted:focus, .f\:d-bc-warning-subtle-inverted:focus-within, .fv\:d-bc-warning-subtle-inverted:focus-visible {
-  border-color: var(--dt-color-border-warning-subtle-inverted) !important;
-}
-.d-bc-warning-strong, .h\:d-bc-warning-strong:hover, .f\:d-bc-warning-strong:focus, .f\:d-bc-warning-strong:focus-within, .fv\:d-bc-warning-strong:focus-visible {
-  border-color: var(--dt-color-border-warning-strong) !important;
-}
-.d-bc-warning-strong-inverted, .h\:d-bc-warning-strong-inverted:hover, .f\:d-bc-warning-strong-inverted:focus, .f\:d-bc-warning-strong-inverted:focus-within, .fv\:d-bc-warning-strong-inverted:focus-visible {
-  border-color: var(--dt-color-border-warning-strong-inverted) !important;
-}
-.d-bc-brand, .h\:d-bc-brand:hover, .f\:d-bc-brand:focus, .f\:d-bc-brand:focus-within, .fv\:d-bc-brand:focus-visible {
-  border-color: var(--dt-color-border-brand) !important;
-}
-.d-bc-brand-inverted, .h\:d-bc-brand-inverted:hover, .f\:d-bc-brand-inverted:focus, .f\:d-bc-brand-inverted:focus-within, .fv\:d-bc-brand-inverted:focus-visible {
-  border-color: var(--dt-color-border-brand-inverted) !important;
-}
-.d-bc-brand-subtle, .h\:d-bc-brand-subtle:hover, .f\:d-bc-brand-subtle:focus, .f\:d-bc-brand-subtle:focus-within, .fv\:d-bc-brand-subtle:focus-visible {
-  border-color: var(--dt-color-border-brand-subtle) !important;
-}
-.d-bc-brand-subtle-inverted, .h\:d-bc-brand-subtle-inverted:hover, .f\:d-bc-brand-subtle-inverted:focus, .f\:d-bc-brand-subtle-inverted:focus-within, .fv\:d-bc-brand-subtle-inverted:focus-visible {
-  border-color: var(--dt-color-border-brand-subtle-inverted) !important;
-}
-.d-bc-brand-strong, .h\:d-bc-brand-strong:hover, .f\:d-bc-brand-strong:focus, .f\:d-bc-brand-strong:focus-within, .fv\:d-bc-brand-strong:focus-visible {
-  border-color: var(--dt-color-border-brand-strong) !important;
-}
-.d-bc-brand-strong-inverted, .h\:d-bc-brand-strong-inverted:hover, .f\:d-bc-brand-strong-inverted:focus, .f\:d-bc-brand-strong-inverted:focus-within, .fv\:d-bc-brand-strong-inverted:focus-visible {
-  border-color: var(--dt-color-border-brand-strong-inverted) !important;
-}
-.d-bc-accent, .h\:d-bc-accent:hover, .f\:d-bc-accent:focus, .f\:d-bc-accent:focus-within, .fv\:d-bc-accent:focus-visible {
-  border-color: var(--dt-color-border-accent) !important;
-}
 @-webkit-keyframes d-loading-circle {
   from {
     -webkit-transform: rotate(0deg);
@@ -8016,1179 +7746,1535 @@ body {
   font-size: 10px;
 }
 .d-fc-neutral-white, .h\:d-fc-neutral-white:hover, .f\:d-fc-neutral-white:focus, .f\:d-fc-neutral-white:focus-within, .fv\:d-fc-neutral-white:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--fco)) !important;
+  --fco: var(--dt-color-neutral-white-a);
+  color: hsl(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--fco)) !important;
 }
 .d-fc-neutral-black, .h\:d-fc-neutral-black:hover, .f\:d-fc-neutral-black:focus, .f\:d-fc-neutral-black:focus-within, .fv\:d-fc-neutral-black:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--fco)) !important;
+  --fco: var(--dt-color-neutral-black-a);
+  color: hsl(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--fco)) !important;
 }
 .d-fc-black-100, .h\:d-fc-black-100:hover, .f\:d-fc-black-100:focus, .f\:d-fc-black-100:focus-within, .fv\:d-fc-black-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-100-a);
+  color: hsl(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--fco)) !important;
 }
 .d-fc-black-200, .h\:d-fc-black-200:hover, .f\:d-fc-black-200:focus, .f\:d-fc-black-200:focus-within, .fv\:d-fc-black-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-200-a);
+  color: hsl(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--fco)) !important;
 }
 .d-fc-black-300, .h\:d-fc-black-300:hover, .f\:d-fc-black-300:focus, .f\:d-fc-black-300:focus-within, .fv\:d-fc-black-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-300-a);
+  color: hsl(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--fco)) !important;
 }
 .d-fc-black-400, .h\:d-fc-black-400:hover, .f\:d-fc-black-400:focus, .f\:d-fc-black-400:focus-within, .fv\:d-fc-black-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-400-a);
+  color: hsl(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--fco)) !important;
 }
 .d-fc-black-500, .h\:d-fc-black-500:hover, .f\:d-fc-black-500:focus, .f\:d-fc-black-500:focus-within, .fv\:d-fc-black-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-500-a);
+  color: hsl(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--fco)) !important;
 }
 .d-fc-black-600, .h\:d-fc-black-600:hover, .f\:d-fc-black-600:focus, .f\:d-fc-black-600:focus-within, .fv\:d-fc-black-600:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-600-a);
+  color: hsl(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--fco)) !important;
 }
 .d-fc-black-700, .h\:d-fc-black-700:hover, .f\:d-fc-black-700:focus, .f\:d-fc-black-700:focus-within, .fv\:d-fc-black-700:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-700-a);
+  color: hsl(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--fco)) !important;
 }
 .d-fc-black-800, .h\:d-fc-black-800:hover, .f\:d-fc-black-800:focus, .f\:d-fc-black-800:focus-within, .fv\:d-fc-black-800:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-800-a);
+  color: hsl(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--fco)) !important;
 }
 .d-fc-black-900, .h\:d-fc-black-900:hover, .f\:d-fc-black-900:focus, .f\:d-fc-black-900:focus-within, .fv\:d-fc-black-900:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--fco)) !important;
+  --fco: var(--dt-color-black-900-a);
+  color: hsl(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--fco)) !important;
 }
 .d-fc-purple-100, .h\:d-fc-purple-100:hover, .f\:d-fc-purple-100:focus, .f\:d-fc-purple-100:focus-within, .fv\:d-fc-purple-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-purple-100-a);
+  color: hsl(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--fco)) !important;
 }
 .d-fc-purple-200, .h\:d-fc-purple-200:hover, .f\:d-fc-purple-200:focus, .f\:d-fc-purple-200:focus-within, .fv\:d-fc-purple-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-purple-200-a);
+  color: hsl(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--fco)) !important;
 }
 .d-fc-purple-300, .h\:d-fc-purple-300:hover, .f\:d-fc-purple-300:focus, .f\:d-fc-purple-300:focus-within, .fv\:d-fc-purple-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-purple-300-a);
+  color: hsl(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--fco)) !important;
 }
 .d-fc-purple-400, .h\:d-fc-purple-400:hover, .f\:d-fc-purple-400:focus, .f\:d-fc-purple-400:focus-within, .fv\:d-fc-purple-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-purple-400-a);
+  color: hsl(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--fco)) !important;
 }
 .d-fc-purple-500, .h\:d-fc-purple-500:hover, .f\:d-fc-purple-500:focus, .f\:d-fc-purple-500:focus-within, .fv\:d-fc-purple-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-purple-500-a);
+  color: hsl(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--fco)) !important;
 }
 .d-fc-purple-600, .h\:d-fc-purple-600:hover, .f\:d-fc-purple-600:focus, .f\:d-fc-purple-600:focus-within, .fv\:d-fc-purple-600:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--fco)) !important;
+  --fco: var(--dt-color-purple-600-a);
+  color: hsl(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--fco)) !important;
 }
 .d-fc-blue-100, .h\:d-fc-blue-100:hover, .f\:d-fc-blue-100:focus, .f\:d-fc-blue-100:focus-within, .fv\:d-fc-blue-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-blue-100-a);
+  color: hsl(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--fco)) !important;
 }
 .d-fc-blue-200, .h\:d-fc-blue-200:hover, .f\:d-fc-blue-200:focus, .f\:d-fc-blue-200:focus-within, .fv\:d-fc-blue-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-blue-200-a);
+  color: hsl(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--fco)) !important;
 }
 .d-fc-blue-300, .h\:d-fc-blue-300:hover, .f\:d-fc-blue-300:focus, .f\:d-fc-blue-300:focus-within, .fv\:d-fc-blue-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-blue-300-a);
+  color: hsl(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--fco)) !important;
 }
 .d-fc-blue-400, .h\:d-fc-blue-400:hover, .f\:d-fc-blue-400:focus, .f\:d-fc-blue-400:focus-within, .fv\:d-fc-blue-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-blue-400-a);
+  color: hsl(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--fco)) !important;
 }
 .d-fc-blue-500, .h\:d-fc-blue-500:hover, .f\:d-fc-blue-500:focus, .f\:d-fc-blue-500:focus-within, .fv\:d-fc-blue-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-blue-500-a);
+  color: hsl(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--fco)) !important;
 }
 .d-fc-magenta-100, .h\:d-fc-magenta-100:hover, .f\:d-fc-magenta-100:focus, .f\:d-fc-magenta-100:focus-within, .fv\:d-fc-magenta-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-magenta-100-a);
+  color: hsl(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--fco)) !important;
 }
 .d-fc-magenta-200, .h\:d-fc-magenta-200:hover, .f\:d-fc-magenta-200:focus, .f\:d-fc-magenta-200:focus-within, .fv\:d-fc-magenta-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-magenta-200-a);
+  color: hsl(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--fco)) !important;
 }
 .d-fc-magenta-300, .h\:d-fc-magenta-300:hover, .f\:d-fc-magenta-300:focus, .f\:d-fc-magenta-300:focus-within, .fv\:d-fc-magenta-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-magenta-300-a);
+  color: hsl(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--fco)) !important;
 }
 .d-fc-magenta-400, .h\:d-fc-magenta-400:hover, .f\:d-fc-magenta-400:focus, .f\:d-fc-magenta-400:focus-within, .fv\:d-fc-magenta-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-magenta-400-a);
+  color: hsl(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--fco)) !important;
 }
 .d-fc-magenta-500, .h\:d-fc-magenta-500:hover, .f\:d-fc-magenta-500:focus, .f\:d-fc-magenta-500:focus-within, .fv\:d-fc-magenta-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-magenta-500-a);
+  color: hsl(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--fco)) !important;
 }
 .d-fc-gold-100, .h\:d-fc-gold-100:hover, .f\:d-fc-gold-100:focus, .f\:d-fc-gold-100:focus-within, .fv\:d-fc-gold-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-gold-100-a);
+  color: hsl(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--fco)) !important;
 }
 .d-fc-gold-200, .h\:d-fc-gold-200:hover, .f\:d-fc-gold-200:focus, .f\:d-fc-gold-200:focus-within, .fv\:d-fc-gold-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-gold-200-a);
+  color: hsl(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--fco)) !important;
 }
 .d-fc-gold-300, .h\:d-fc-gold-300:hover, .f\:d-fc-gold-300:focus, .f\:d-fc-gold-300:focus-within, .fv\:d-fc-gold-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-gold-300-a);
+  color: hsl(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--fco)) !important;
 }
 .d-fc-gold-400, .h\:d-fc-gold-400:hover, .f\:d-fc-gold-400:focus, .f\:d-fc-gold-400:focus-within, .fv\:d-fc-gold-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-gold-400-a);
+  color: hsl(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--fco)) !important;
 }
 .d-fc-gold-500, .h\:d-fc-gold-500:hover, .f\:d-fc-gold-500:focus, .f\:d-fc-gold-500:focus-within, .fv\:d-fc-gold-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-gold-500-a);
+  color: hsl(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--fco)) !important;
 }
 .d-fc-green-100, .h\:d-fc-green-100:hover, .f\:d-fc-green-100:focus, .f\:d-fc-green-100:focus-within, .fv\:d-fc-green-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-green-100-a);
+  color: hsl(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--fco)) !important;
 }
 .d-fc-green-200, .h\:d-fc-green-200:hover, .f\:d-fc-green-200:focus, .f\:d-fc-green-200:focus-within, .fv\:d-fc-green-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-green-200-a);
+  color: hsl(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--fco)) !important;
 }
 .d-fc-green-300, .h\:d-fc-green-300:hover, .f\:d-fc-green-300:focus, .f\:d-fc-green-300:focus-within, .fv\:d-fc-green-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-green-300-a);
+  color: hsl(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--fco)) !important;
 }
 .d-fc-green-400, .h\:d-fc-green-400:hover, .f\:d-fc-green-400:focus, .f\:d-fc-green-400:focus-within, .fv\:d-fc-green-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-green-400-a);
+  color: hsl(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--fco)) !important;
 }
 .d-fc-green-500, .h\:d-fc-green-500:hover, .f\:d-fc-green-500:focus, .f\:d-fc-green-500:focus-within, .fv\:d-fc-green-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-green-500-a);
+  color: hsl(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--fco)) !important;
 }
 .d-fc-red-100, .h\:d-fc-red-100:hover, .f\:d-fc-red-100:focus, .f\:d-fc-red-100:focus-within, .fv\:d-fc-red-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-red-100-a);
+  color: hsl(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--fco)) !important;
 }
 .d-fc-red-200, .h\:d-fc-red-200:hover, .f\:d-fc-red-200:focus, .f\:d-fc-red-200:focus-within, .fv\:d-fc-red-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-red-200-a);
+  color: hsl(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--fco)) !important;
 }
 .d-fc-red-300, .h\:d-fc-red-300:hover, .f\:d-fc-red-300:focus, .f\:d-fc-red-300:focus-within, .fv\:d-fc-red-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-red-300-a);
+  color: hsl(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--fco)) !important;
 }
 .d-fc-red-400, .h\:d-fc-red-400:hover, .f\:d-fc-red-400:focus, .f\:d-fc-red-400:focus-within, .fv\:d-fc-red-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-red-400-a);
+  color: hsl(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--fco)) !important;
 }
 .d-fc-red-500, .h\:d-fc-red-500:hover, .f\:d-fc-red-500:focus, .f\:d-fc-red-500:focus-within, .fv\:d-fc-red-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-red-500-a);
+  color: hsl(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--fco)) !important;
 }
 .d-fc-tan-100, .h\:d-fc-tan-100:hover, .f\:d-fc-tan-100:focus, .f\:d-fc-tan-100:focus-within, .fv\:d-fc-tan-100:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--fco)) !important;
+  --fco: var(--dt-color-tan-100-a);
+  color: hsl(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--fco)) !important;
 }
 .d-fc-tan-200, .h\:d-fc-tan-200:hover, .f\:d-fc-tan-200:focus, .f\:d-fc-tan-200:focus-within, .fv\:d-fc-tan-200:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--fco)) !important;
+  --fco: var(--dt-color-tan-200-a);
+  color: hsl(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--fco)) !important;
 }
 .d-fc-tan-300, .h\:d-fc-tan-300:hover, .f\:d-fc-tan-300:focus, .f\:d-fc-tan-300:focus-within, .fv\:d-fc-tan-300:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--fco)) !important;
+  --fco: var(--dt-color-tan-300-a);
+  color: hsl(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--fco)) !important;
 }
 .d-fc-tan-400, .h\:d-fc-tan-400:hover, .f\:d-fc-tan-400:focus, .f\:d-fc-tan-400:focus-within, .fv\:d-fc-tan-400:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--fco)) !important;
+  --fco: var(--dt-color-tan-400-a);
+  color: hsl(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--fco)) !important;
 }
 .d-fc-tan-500, .h\:d-fc-tan-500:hover, .f\:d-fc-tan-500:focus, .f\:d-fc-tan-500:focus-within, .fv\:d-fc-tan-500:focus-visible {
-  --fco: 100%;
-  color: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--fco)) !important;
+  --fco: var(--dt-color-tan-500-a);
+  color: hsl(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--fco)) !important;
+}
+.d-fc-primary, .h\:d-fc-primary:hover, .f\:d-fc-primary:focus, .f\:d-fc-primary:focus-within, .fv\:d-fc-primary:focus-visible {
+  --fco: var(--dt-color-foreground-primary-a);
+  color: hsl(var(--dt-color-foreground-primary-h) var(--dt-color-foreground-primary-s) var(--dt-color-foreground-primary-l) / var(--fco)) !important;
+}
+.d-fc-secondary, .h\:d-fc-secondary:hover, .f\:d-fc-secondary:focus, .f\:d-fc-secondary:focus-within, .fv\:d-fc-secondary:focus-visible {
+  --fco: var(--dt-color-foreground-secondary-a);
+  color: hsl(var(--dt-color-foreground-secondary-h) var(--dt-color-foreground-secondary-s) var(--dt-color-foreground-secondary-l) / var(--fco)) !important;
+}
+.d-fc-tertiary, .h\:d-fc-tertiary:hover, .f\:d-fc-tertiary:focus, .f\:d-fc-tertiary:focus-within, .fv\:d-fc-tertiary:focus-visible {
+  --fco: var(--dt-color-foreground-tertiary-a);
+  color: hsl(var(--dt-color-foreground-tertiary-h) var(--dt-color-foreground-tertiary-s) var(--dt-color-foreground-tertiary-l) / var(--fco)) !important;
+}
+.d-fc-muted, .h\:d-fc-muted:hover, .f\:d-fc-muted:focus, .f\:d-fc-muted:focus-within, .fv\:d-fc-muted:focus-visible {
+  --fco: var(--dt-color-foreground-muted-a);
+  color: hsl(var(--dt-color-foreground-muted-h) var(--dt-color-foreground-muted-s) var(--dt-color-foreground-muted-l) / var(--fco)) !important;
+}
+.d-fc-placeholder, .h\:d-fc-placeholder:hover, .f\:d-fc-placeholder:focus, .f\:d-fc-placeholder:focus-within, .fv\:d-fc-placeholder:focus-visible {
+  --fco: var(--dt-color-foreground-placeholder-a);
+  color: hsl(var(--dt-color-foreground-placeholder-h) var(--dt-color-foreground-placeholder-s) var(--dt-color-foreground-placeholder-l) / var(--fco)) !important;
+}
+.d-fc-disabled, .h\:d-fc-disabled:hover, .f\:d-fc-disabled:focus, .f\:d-fc-disabled:focus-within, .fv\:d-fc-disabled:focus-visible {
+  --fco: var(--dt-color-foreground-disabled-a);
+  color: hsl(var(--dt-color-foreground-disabled-h) var(--dt-color-foreground-disabled-s) var(--dt-color-foreground-disabled-l) / var(--fco)) !important;
+}
+.d-fc-critical, .h\:d-fc-critical:hover, .f\:d-fc-critical:focus, .f\:d-fc-critical:focus-within, .fv\:d-fc-critical:focus-visible {
+  --fco: var(--dt-color-foreground-critical-a);
+  color: hsl(var(--dt-color-foreground-critical-h) var(--dt-color-foreground-critical-s) var(--dt-color-foreground-critical-l) / var(--fco)) !important;
+}
+.d-fc-critical-strong, .h\:d-fc-critical-strong:hover, .f\:d-fc-critical-strong:focus, .f\:d-fc-critical-strong:focus-within, .fv\:d-fc-critical-strong:focus-visible {
+  --fco: var(--dt-color-foreground-critical-strong-a);
+  color: hsl(var(--dt-color-foreground-critical-strong-h) var(--dt-color-foreground-critical-strong-s) var(--dt-color-foreground-critical-strong-l) / var(--fco)) !important;
+}
+.d-fc-success, .h\:d-fc-success:hover, .f\:d-fc-success:focus, .f\:d-fc-success:focus-within, .fv\:d-fc-success:focus-visible {
+  --fco: var(--dt-color-foreground-success-a);
+  color: hsl(var(--dt-color-foreground-success-h) var(--dt-color-foreground-success-s) var(--dt-color-foreground-success-l) / var(--fco)) !important;
+}
+.d-fc-success-strong, .h\:d-fc-success-strong:hover, .f\:d-fc-success-strong:focus, .f\:d-fc-success-strong:focus-within, .fv\:d-fc-success-strong:focus-visible {
+  --fco: var(--dt-color-foreground-success-strong-a);
+  color: hsl(var(--dt-color-foreground-success-strong-h) var(--dt-color-foreground-success-strong-s) var(--dt-color-foreground-success-strong-l) / var(--fco)) !important;
+}
+.d-fc-warning, .h\:d-fc-warning:hover, .f\:d-fc-warning:focus, .f\:d-fc-warning:focus-within, .fv\:d-fc-warning:focus-visible {
+  --fco: var(--dt-color-foreground-warning-a);
+  color: hsl(var(--dt-color-foreground-warning-h) var(--dt-color-foreground-warning-s) var(--dt-color-foreground-warning-l) / var(--fco)) !important;
+}
+.d-fc-primary-inverted, .h\:d-fc-primary-inverted:hover, .f\:d-fc-primary-inverted:focus, .f\:d-fc-primary-inverted:focus-within, .fv\:d-fc-primary-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-primary-inverted-a);
+  color: hsl(var(--dt-color-foreground-primary-inverted-h) var(--dt-color-foreground-primary-inverted-s) var(--dt-color-foreground-primary-inverted-l) / var(--fco)) !important;
+}
+.d-fc-secondary-inverted, .h\:d-fc-secondary-inverted:hover, .f\:d-fc-secondary-inverted:focus, .f\:d-fc-secondary-inverted:focus-within, .fv\:d-fc-secondary-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-secondary-inverted-a);
+  color: hsl(var(--dt-color-foreground-secondary-inverted-h) var(--dt-color-foreground-secondary-inverted-s) var(--dt-color-foreground-secondary-inverted-l) / var(--fco)) !important;
+}
+.d-fc-tertiary-inverted, .h\:d-fc-tertiary-inverted:hover, .f\:d-fc-tertiary-inverted:focus, .f\:d-fc-tertiary-inverted:focus-within, .fv\:d-fc-tertiary-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-tertiary-inverted-a);
+  color: hsl(var(--dt-color-foreground-tertiary-inverted-h) var(--dt-color-foreground-tertiary-inverted-s) var(--dt-color-foreground-tertiary-inverted-l) / var(--fco)) !important;
+}
+.d-fc-muted-inverted, .h\:d-fc-muted-inverted:hover, .f\:d-fc-muted-inverted:focus, .f\:d-fc-muted-inverted:focus-within, .fv\:d-fc-muted-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-muted-inverted-a);
+  color: hsl(var(--dt-color-foreground-muted-inverted-h) var(--dt-color-foreground-muted-inverted-s) var(--dt-color-foreground-muted-inverted-l) / var(--fco)) !important;
+}
+.d-fc-placeholder-inverted, .h\:d-fc-placeholder-inverted:hover, .f\:d-fc-placeholder-inverted:focus, .f\:d-fc-placeholder-inverted:focus-within, .fv\:d-fc-placeholder-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-placeholder-inverted-a);
+  color: hsl(var(--dt-color-foreground-placeholder-inverted-h) var(--dt-color-foreground-placeholder-inverted-s) var(--dt-color-foreground-placeholder-inverted-l) / var(--fco)) !important;
+}
+.d-fc-disabled-inverted, .h\:d-fc-disabled-inverted:hover, .f\:d-fc-disabled-inverted:focus, .f\:d-fc-disabled-inverted:focus-within, .fv\:d-fc-disabled-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-disabled-inverted-a);
+  color: hsl(var(--dt-color-foreground-disabled-inverted-h) var(--dt-color-foreground-disabled-inverted-s) var(--dt-color-foreground-disabled-inverted-l) / var(--fco)) !important;
+}
+.d-fc-critical-inverted, .h\:d-fc-critical-inverted:hover, .f\:d-fc-critical-inverted:focus, .f\:d-fc-critical-inverted:focus-within, .fv\:d-fc-critical-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-critical-inverted-a);
+  color: hsl(var(--dt-color-foreground-critical-inverted-h) var(--dt-color-foreground-critical-inverted-s) var(--dt-color-foreground-critical-inverted-l) / var(--fco)) !important;
+}
+.d-fc-critical-strong-inverted, .h\:d-fc-critical-strong-inverted:hover, .f\:d-fc-critical-strong-inverted:focus, .f\:d-fc-critical-strong-inverted:focus-within, .fv\:d-fc-critical-strong-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-critical-strong-inverted-a);
+  color: hsl(var(--dt-color-foreground-critical-strong-inverted-h) var(--dt-color-foreground-critical-strong-inverted-s) var(--dt-color-foreground-critical-strong-inverted-l) / var(--fco)) !important;
+}
+.d-fc-success-inverted, .h\:d-fc-success-inverted:hover, .f\:d-fc-success-inverted:focus, .f\:d-fc-success-inverted:focus-within, .fv\:d-fc-success-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-success-inverted-a);
+  color: hsl(var(--dt-color-foreground-success-inverted-h) var(--dt-color-foreground-success-inverted-s) var(--dt-color-foreground-success-inverted-l) / var(--fco)) !important;
+}
+.d-fc-success-strong-inverted, .h\:d-fc-success-strong-inverted:hover, .f\:d-fc-success-strong-inverted:focus, .f\:d-fc-success-strong-inverted:focus-within, .fv\:d-fc-success-strong-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-success-strong-inverted-a);
+  color: hsl(var(--dt-color-foreground-success-strong-inverted-h) var(--dt-color-foreground-success-strong-inverted-s) var(--dt-color-foreground-success-strong-inverted-l) / var(--fco)) !important;
+}
+.d-fc-warning-inverted, .h\:d-fc-warning-inverted:hover, .f\:d-fc-warning-inverted:focus, .f\:d-fc-warning-inverted:focus-within, .fv\:d-fc-warning-inverted:focus-visible {
+  --fco: var(--dt-color-foreground-warning-inverted-a);
+  color: hsl(var(--dt-color-foreground-warning-inverted-h) var(--dt-color-foreground-warning-inverted-s) var(--dt-color-foreground-warning-inverted-l) / var(--fco)) !important;
 }
 .d-bc-neutral-white, .h\:d-bc-neutral-white:hover, .f\:d-bc-neutral-white:focus, .f\:d-bc-neutral-white:focus-within, .fv\:d-bc-neutral-white:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bco)) !important;
+  --bco: var(--dt-color-neutral-white-a);
+  border-color: hsl(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bco)) !important;
 }
 .d-bc-neutral-black, .h\:d-bc-neutral-black:hover, .f\:d-bc-neutral-black:focus, .f\:d-bc-neutral-black:focus-within, .fv\:d-bc-neutral-black:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bco)) !important;
+  --bco: var(--dt-color-neutral-black-a);
+  border-color: hsl(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bco)) !important;
 }
 .d-bc-black-100, .h\:d-bc-black-100:hover, .f\:d-bc-black-100:focus, .f\:d-bc-black-100:focus-within, .fv\:d-bc-black-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-100-a);
+  border-color: hsl(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bco)) !important;
 }
 .d-bc-black-200, .h\:d-bc-black-200:hover, .f\:d-bc-black-200:focus, .f\:d-bc-black-200:focus-within, .fv\:d-bc-black-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-200-a);
+  border-color: hsl(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bco)) !important;
 }
 .d-bc-black-300, .h\:d-bc-black-300:hover, .f\:d-bc-black-300:focus, .f\:d-bc-black-300:focus-within, .fv\:d-bc-black-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-300-a);
+  border-color: hsl(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bco)) !important;
 }
 .d-bc-black-400, .h\:d-bc-black-400:hover, .f\:d-bc-black-400:focus, .f\:d-bc-black-400:focus-within, .fv\:d-bc-black-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-400-a);
+  border-color: hsl(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bco)) !important;
 }
 .d-bc-black-500, .h\:d-bc-black-500:hover, .f\:d-bc-black-500:focus, .f\:d-bc-black-500:focus-within, .fv\:d-bc-black-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-500-a);
+  border-color: hsl(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bco)) !important;
 }
 .d-bc-black-600, .h\:d-bc-black-600:hover, .f\:d-bc-black-600:focus, .f\:d-bc-black-600:focus-within, .fv\:d-bc-black-600:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-600-a);
+  border-color: hsl(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bco)) !important;
 }
 .d-bc-black-700, .h\:d-bc-black-700:hover, .f\:d-bc-black-700:focus, .f\:d-bc-black-700:focus-within, .fv\:d-bc-black-700:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-700-a);
+  border-color: hsl(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bco)) !important;
 }
 .d-bc-black-800, .h\:d-bc-black-800:hover, .f\:d-bc-black-800:focus, .f\:d-bc-black-800:focus-within, .fv\:d-bc-black-800:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-800-a);
+  border-color: hsl(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bco)) !important;
 }
 .d-bc-black-900, .h\:d-bc-black-900:hover, .f\:d-bc-black-900:focus, .f\:d-bc-black-900:focus-within, .fv\:d-bc-black-900:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bco)) !important;
+  --bco: var(--dt-color-black-900-a);
+  border-color: hsl(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bco)) !important;
 }
 .d-bc-purple-100, .h\:d-bc-purple-100:hover, .f\:d-bc-purple-100:focus, .f\:d-bc-purple-100:focus-within, .fv\:d-bc-purple-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-purple-100-a);
+  border-color: hsl(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bco)) !important;
 }
 .d-bc-purple-200, .h\:d-bc-purple-200:hover, .f\:d-bc-purple-200:focus, .f\:d-bc-purple-200:focus-within, .fv\:d-bc-purple-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-purple-200-a);
+  border-color: hsl(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bco)) !important;
 }
 .d-bc-purple-300, .h\:d-bc-purple-300:hover, .f\:d-bc-purple-300:focus, .f\:d-bc-purple-300:focus-within, .fv\:d-bc-purple-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-purple-300-a);
+  border-color: hsl(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bco)) !important;
 }
 .d-bc-purple-400, .h\:d-bc-purple-400:hover, .f\:d-bc-purple-400:focus, .f\:d-bc-purple-400:focus-within, .fv\:d-bc-purple-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-purple-400-a);
+  border-color: hsl(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bco)) !important;
 }
 .d-bc-purple-500, .h\:d-bc-purple-500:hover, .f\:d-bc-purple-500:focus, .f\:d-bc-purple-500:focus-within, .fv\:d-bc-purple-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-purple-500-a);
+  border-color: hsl(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bco)) !important;
 }
 .d-bc-purple-600, .h\:d-bc-purple-600:hover, .f\:d-bc-purple-600:focus, .f\:d-bc-purple-600:focus-within, .fv\:d-bc-purple-600:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bco)) !important;
+  --bco: var(--dt-color-purple-600-a);
+  border-color: hsl(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bco)) !important;
 }
 .d-bc-blue-100, .h\:d-bc-blue-100:hover, .f\:d-bc-blue-100:focus, .f\:d-bc-blue-100:focus-within, .fv\:d-bc-blue-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-blue-100-a);
+  border-color: hsl(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bco)) !important;
 }
 .d-bc-blue-200, .h\:d-bc-blue-200:hover, .f\:d-bc-blue-200:focus, .f\:d-bc-blue-200:focus-within, .fv\:d-bc-blue-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-blue-200-a);
+  border-color: hsl(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bco)) !important;
 }
 .d-bc-blue-300, .h\:d-bc-blue-300:hover, .f\:d-bc-blue-300:focus, .f\:d-bc-blue-300:focus-within, .fv\:d-bc-blue-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-blue-300-a);
+  border-color: hsl(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bco)) !important;
 }
 .d-bc-blue-400, .h\:d-bc-blue-400:hover, .f\:d-bc-blue-400:focus, .f\:d-bc-blue-400:focus-within, .fv\:d-bc-blue-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-blue-400-a);
+  border-color: hsl(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bco)) !important;
 }
 .d-bc-blue-500, .h\:d-bc-blue-500:hover, .f\:d-bc-blue-500:focus, .f\:d-bc-blue-500:focus-within, .fv\:d-bc-blue-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-blue-500-a);
+  border-color: hsl(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bco)) !important;
 }
 .d-bc-magenta-100, .h\:d-bc-magenta-100:hover, .f\:d-bc-magenta-100:focus, .f\:d-bc-magenta-100:focus-within, .fv\:d-bc-magenta-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-magenta-100-a);
+  border-color: hsl(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bco)) !important;
 }
 .d-bc-magenta-200, .h\:d-bc-magenta-200:hover, .f\:d-bc-magenta-200:focus, .f\:d-bc-magenta-200:focus-within, .fv\:d-bc-magenta-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-magenta-200-a);
+  border-color: hsl(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bco)) !important;
 }
 .d-bc-magenta-300, .h\:d-bc-magenta-300:hover, .f\:d-bc-magenta-300:focus, .f\:d-bc-magenta-300:focus-within, .fv\:d-bc-magenta-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-magenta-300-a);
+  border-color: hsl(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bco)) !important;
 }
 .d-bc-magenta-400, .h\:d-bc-magenta-400:hover, .f\:d-bc-magenta-400:focus, .f\:d-bc-magenta-400:focus-within, .fv\:d-bc-magenta-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-magenta-400-a);
+  border-color: hsl(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bco)) !important;
 }
 .d-bc-magenta-500, .h\:d-bc-magenta-500:hover, .f\:d-bc-magenta-500:focus, .f\:d-bc-magenta-500:focus-within, .fv\:d-bc-magenta-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-magenta-500-a);
+  border-color: hsl(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bco)) !important;
 }
 .d-bc-gold-100, .h\:d-bc-gold-100:hover, .f\:d-bc-gold-100:focus, .f\:d-bc-gold-100:focus-within, .fv\:d-bc-gold-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-gold-100-a);
+  border-color: hsl(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bco)) !important;
 }
 .d-bc-gold-200, .h\:d-bc-gold-200:hover, .f\:d-bc-gold-200:focus, .f\:d-bc-gold-200:focus-within, .fv\:d-bc-gold-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-gold-200-a);
+  border-color: hsl(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bco)) !important;
 }
 .d-bc-gold-300, .h\:d-bc-gold-300:hover, .f\:d-bc-gold-300:focus, .f\:d-bc-gold-300:focus-within, .fv\:d-bc-gold-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-gold-300-a);
+  border-color: hsl(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bco)) !important;
 }
 .d-bc-gold-400, .h\:d-bc-gold-400:hover, .f\:d-bc-gold-400:focus, .f\:d-bc-gold-400:focus-within, .fv\:d-bc-gold-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-gold-400-a);
+  border-color: hsl(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bco)) !important;
 }
 .d-bc-gold-500, .h\:d-bc-gold-500:hover, .f\:d-bc-gold-500:focus, .f\:d-bc-gold-500:focus-within, .fv\:d-bc-gold-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-gold-500-a);
+  border-color: hsl(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bco)) !important;
 }
 .d-bc-green-100, .h\:d-bc-green-100:hover, .f\:d-bc-green-100:focus, .f\:d-bc-green-100:focus-within, .fv\:d-bc-green-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-green-100-a);
+  border-color: hsl(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bco)) !important;
 }
 .d-bc-green-200, .h\:d-bc-green-200:hover, .f\:d-bc-green-200:focus, .f\:d-bc-green-200:focus-within, .fv\:d-bc-green-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-green-200-a);
+  border-color: hsl(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bco)) !important;
 }
 .d-bc-green-300, .h\:d-bc-green-300:hover, .f\:d-bc-green-300:focus, .f\:d-bc-green-300:focus-within, .fv\:d-bc-green-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-green-300-a);
+  border-color: hsl(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bco)) !important;
 }
 .d-bc-green-400, .h\:d-bc-green-400:hover, .f\:d-bc-green-400:focus, .f\:d-bc-green-400:focus-within, .fv\:d-bc-green-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-green-400-a);
+  border-color: hsl(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bco)) !important;
 }
 .d-bc-green-500, .h\:d-bc-green-500:hover, .f\:d-bc-green-500:focus, .f\:d-bc-green-500:focus-within, .fv\:d-bc-green-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-green-500-a);
+  border-color: hsl(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bco)) !important;
 }
 .d-bc-red-100, .h\:d-bc-red-100:hover, .f\:d-bc-red-100:focus, .f\:d-bc-red-100:focus-within, .fv\:d-bc-red-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-red-100-a);
+  border-color: hsl(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bco)) !important;
 }
 .d-bc-red-200, .h\:d-bc-red-200:hover, .f\:d-bc-red-200:focus, .f\:d-bc-red-200:focus-within, .fv\:d-bc-red-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-red-200-a);
+  border-color: hsl(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bco)) !important;
 }
 .d-bc-red-300, .h\:d-bc-red-300:hover, .f\:d-bc-red-300:focus, .f\:d-bc-red-300:focus-within, .fv\:d-bc-red-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-red-300-a);
+  border-color: hsl(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bco)) !important;
 }
 .d-bc-red-400, .h\:d-bc-red-400:hover, .f\:d-bc-red-400:focus, .f\:d-bc-red-400:focus-within, .fv\:d-bc-red-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-red-400-a);
+  border-color: hsl(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bco)) !important;
 }
 .d-bc-red-500, .h\:d-bc-red-500:hover, .f\:d-bc-red-500:focus, .f\:d-bc-red-500:focus-within, .fv\:d-bc-red-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-red-500-a);
+  border-color: hsl(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bco)) !important;
 }
 .d-bc-tan-100, .h\:d-bc-tan-100:hover, .f\:d-bc-tan-100:focus, .f\:d-bc-tan-100:focus-within, .fv\:d-bc-tan-100:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bco)) !important;
+  --bco: var(--dt-color-tan-100-a);
+  border-color: hsl(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bco)) !important;
 }
 .d-bc-tan-200, .h\:d-bc-tan-200:hover, .f\:d-bc-tan-200:focus, .f\:d-bc-tan-200:focus-within, .fv\:d-bc-tan-200:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bco)) !important;
+  --bco: var(--dt-color-tan-200-a);
+  border-color: hsl(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bco)) !important;
 }
 .d-bc-tan-300, .h\:d-bc-tan-300:hover, .f\:d-bc-tan-300:focus, .f\:d-bc-tan-300:focus-within, .fv\:d-bc-tan-300:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bco)) !important;
+  --bco: var(--dt-color-tan-300-a);
+  border-color: hsl(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bco)) !important;
 }
 .d-bc-tan-400, .h\:d-bc-tan-400:hover, .f\:d-bc-tan-400:focus, .f\:d-bc-tan-400:focus-within, .fv\:d-bc-tan-400:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bco)) !important;
+  --bco: var(--dt-color-tan-400-a);
+  border-color: hsl(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bco)) !important;
 }
 .d-bc-tan-500, .h\:d-bc-tan-500:hover, .f\:d-bc-tan-500:focus, .f\:d-bc-tan-500:focus-within, .fv\:d-bc-tan-500:focus-visible {
-  --bco: 100%;
-  border-color: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bco)) !important;
+  --bco: var(--dt-color-tan-500-a);
+  border-color: hsl(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bco)) !important;
+}
+.d-bc-subtle, .h\:d-bc-subtle:hover, .f\:d-bc-subtle:focus, .f\:d-bc-subtle:focus-within, .fv\:d-bc-subtle:focus-visible {
+  --bco: var(--dt-color-border-subtle-a);
+  border-color: hsl(var(--dt-color-border-subtle-h) var(--dt-color-border-subtle-s) var(--dt-color-border-subtle-l) / var(--bco)) !important;
+}
+.d-bc-default, .h\:d-bc-default:hover, .f\:d-bc-default:focus, .f\:d-bc-default:focus-within, .fv\:d-bc-default:focus-visible {
+  --bco: var(--dt-color-border-default-a);
+  border-color: hsl(var(--dt-color-border-default-h) var(--dt-color-border-default-s) var(--dt-color-border-default-l) / var(--bco)) !important;
+}
+.d-bc-moderate, .h\:d-bc-moderate:hover, .f\:d-bc-moderate:focus, .f\:d-bc-moderate:focus-within, .fv\:d-bc-moderate:focus-visible {
+  --bco: var(--dt-color-border-moderate-a);
+  border-color: hsl(var(--dt-color-border-moderate-h) var(--dt-color-border-moderate-s) var(--dt-color-border-moderate-l) / var(--bco)) !important;
+}
+.d-bc-bold, .h\:d-bc-bold:hover, .f\:d-bc-bold:focus, .f\:d-bc-bold:focus-within, .fv\:d-bc-bold:focus-visible {
+  --bco: var(--dt-color-border-bold-a);
+  border-color: hsl(var(--dt-color-border-bold-h) var(--dt-color-border-bold-s) var(--dt-color-border-bold-l) / var(--bco)) !important;
+}
+.d-bc-subtle-inverted, .h\:d-bc-subtle-inverted:hover, .f\:d-bc-subtle-inverted:focus, .f\:d-bc-subtle-inverted:focus-within, .fv\:d-bc-subtle-inverted:focus-visible {
+  --bco: var(--dt-color-border-subtle-inverted-a);
+  border-color: hsl(var(--dt-color-border-subtle-inverted-h) var(--dt-color-border-subtle-inverted-s) var(--dt-color-border-subtle-inverted-l) / var(--bco)) !important;
+}
+.d-bc-default-inverted, .h\:d-bc-default-inverted:hover, .f\:d-bc-default-inverted:focus, .f\:d-bc-default-inverted:focus-within, .fv\:d-bc-default-inverted:focus-visible {
+  --bco: var(--dt-color-border-default-inverted-a);
+  border-color: hsl(var(--dt-color-border-default-inverted-h) var(--dt-color-border-default-inverted-s) var(--dt-color-border-default-inverted-l) / var(--bco)) !important;
+}
+.d-bc-moderate-inverted, .h\:d-bc-moderate-inverted:hover, .f\:d-bc-moderate-inverted:focus, .f\:d-bc-moderate-inverted:focus-within, .fv\:d-bc-moderate-inverted:focus-visible {
+  --bco: var(--dt-color-border-moderate-inverted-a);
+  border-color: hsl(var(--dt-color-border-moderate-inverted-h) var(--dt-color-border-moderate-inverted-s) var(--dt-color-border-moderate-inverted-l) / var(--bco)) !important;
+}
+.d-bc-bold-inverted, .h\:d-bc-bold-inverted:hover, .f\:d-bc-bold-inverted:focus, .f\:d-bc-bold-inverted:focus-within, .fv\:d-bc-bold-inverted:focus-visible {
+  --bco: var(--dt-color-border-bold-inverted-a);
+  border-color: hsl(var(--dt-color-border-bold-inverted-h) var(--dt-color-border-bold-inverted-s) var(--dt-color-border-bold-inverted-l) / var(--bco)) !important;
+}
+.d-bc-focus, .h\:d-bc-focus:hover, .f\:d-bc-focus:focus, .f\:d-bc-focus:focus-within, .fv\:d-bc-focus:focus-visible {
+  --bco: var(--dt-color-border-focus-a);
+  border-color: hsl(var(--dt-color-border-focus-h) var(--dt-color-border-focus-s) var(--dt-color-border-focus-l) / var(--bco)) !important;
+}
+.d-bc-critical, .h\:d-bc-critical:hover, .f\:d-bc-critical:focus, .f\:d-bc-critical:focus-within, .fv\:d-bc-critical:focus-visible {
+  --bco: var(--dt-color-border-critical-a);
+  border-color: hsl(var(--dt-color-border-critical-h) var(--dt-color-border-critical-s) var(--dt-color-border-critical-l) / var(--bco)) !important;
+}
+.d-bc-success, .h\:d-bc-success:hover, .f\:d-bc-success:focus, .f\:d-bc-success:focus-within, .fv\:d-bc-success:focus-visible {
+  --bco: var(--dt-color-border-success-a);
+  border-color: hsl(var(--dt-color-border-success-h) var(--dt-color-border-success-s) var(--dt-color-border-success-l) / var(--bco)) !important;
+}
+.d-bc-warning, .h\:d-bc-warning:hover, .f\:d-bc-warning:focus, .f\:d-bc-warning:focus-within, .fv\:d-bc-warning:focus-visible {
+  --bco: var(--dt-color-border-warning-a);
+  border-color: hsl(var(--dt-color-border-warning-h) var(--dt-color-border-warning-s) var(--dt-color-border-warning-l) / var(--bco)) !important;
+}
+.d-bc-brand, .h\:d-bc-brand:hover, .f\:d-bc-brand:focus, .f\:d-bc-brand:focus-within, .fv\:d-bc-brand:focus-visible {
+  --bco: var(--dt-color-border-brand-a);
+  border-color: hsl(var(--dt-color-border-brand-h) var(--dt-color-border-brand-s) var(--dt-color-border-brand-l) / var(--bco)) !important;
+}
+.d-bc-ai, .h\:d-bc-ai:hover, .f\:d-bc-ai:focus, .f\:d-bc-ai:focus-within, .fv\:d-bc-ai:focus-visible {
+  --bco: var(--dt-color-border-ai-a);
+  border-color: hsl(var(--dt-color-border-ai-h) var(--dt-color-border-ai-s) var(--dt-color-border-ai-l) / var(--bco)) !important;
+}
+.d-bc-accent, .h\:d-bc-accent:hover, .f\:d-bc-accent:focus, .f\:d-bc-accent:focus-within, .fv\:d-bc-accent:focus-visible {
+  --bco: var(--dt-color-border-accent-a);
+  border-color: hsl(var(--dt-color-border-accent-h) var(--dt-color-border-accent-s) var(--dt-color-border-accent-l) / var(--bco)) !important;
+}
+.d-bc-critical-subtle, .h\:d-bc-critical-subtle:hover, .f\:d-bc-critical-subtle:focus, .f\:d-bc-critical-subtle:focus-within, .fv\:d-bc-critical-subtle:focus-visible {
+  --bco: var(--dt-color-border-critical-subtle-a);
+  border-color: hsl(var(--dt-color-border-critical-subtle-h) var(--dt-color-border-critical-subtle-s) var(--dt-color-border-critical-subtle-l) / var(--bco)) !important;
+}
+.d-bc-critical-strong, .h\:d-bc-critical-strong:hover, .f\:d-bc-critical-strong:focus, .f\:d-bc-critical-strong:focus-within, .fv\:d-bc-critical-strong:focus-visible {
+  --bco: var(--dt-color-border-critical-strong-a);
+  border-color: hsl(var(--dt-color-border-critical-strong-h) var(--dt-color-border-critical-strong-s) var(--dt-color-border-critical-strong-l) / var(--bco)) !important;
+}
+.d-bc-success-subtle, .h\:d-bc-success-subtle:hover, .f\:d-bc-success-subtle:focus, .f\:d-bc-success-subtle:focus-within, .fv\:d-bc-success-subtle:focus-visible {
+  --bco: var(--dt-color-border-success-subtle-a);
+  border-color: hsl(var(--dt-color-border-success-subtle-h) var(--dt-color-border-success-subtle-s) var(--dt-color-border-success-subtle-l) / var(--bco)) !important;
+}
+.d-bc-success-strong, .h\:d-bc-success-strong:hover, .f\:d-bc-success-strong:focus, .f\:d-bc-success-strong:focus-within, .fv\:d-bc-success-strong:focus-visible {
+  --bco: var(--dt-color-border-success-strong-a);
+  border-color: hsl(var(--dt-color-border-success-strong-h) var(--dt-color-border-success-strong-s) var(--dt-color-border-success-strong-l) / var(--bco)) !important;
+}
+.d-bc-warning-subtle, .h\:d-bc-warning-subtle:hover, .f\:d-bc-warning-subtle:focus, .f\:d-bc-warning-subtle:focus-within, .fv\:d-bc-warning-subtle:focus-visible {
+  --bco: var(--dt-color-border-warning-subtle-a);
+  border-color: hsl(var(--dt-color-border-warning-subtle-h) var(--dt-color-border-warning-subtle-s) var(--dt-color-border-warning-subtle-l) / var(--bco)) !important;
+}
+.d-bc-warning-strong, .h\:d-bc-warning-strong:hover, .f\:d-bc-warning-strong:focus, .f\:d-bc-warning-strong:focus-within, .fv\:d-bc-warning-strong:focus-visible {
+  --bco: var(--dt-color-border-warning-strong-a);
+  border-color: hsl(var(--dt-color-border-warning-strong-h) var(--dt-color-border-warning-strong-s) var(--dt-color-border-warning-strong-l) / var(--bco)) !important;
+}
+.d-bc-brand-subtle, .h\:d-bc-brand-subtle:hover, .f\:d-bc-brand-subtle:focus, .f\:d-bc-brand-subtle:focus-within, .fv\:d-bc-brand-subtle:focus-visible {
+  --bco: var(--dt-color-border-brand-subtle-a);
+  border-color: hsl(var(--dt-color-border-brand-subtle-h) var(--dt-color-border-brand-subtle-s) var(--dt-color-border-brand-subtle-l) / var(--bco)) !important;
+}
+.d-bc-brand-strong, .h\:d-bc-brand-strong:hover, .f\:d-bc-brand-strong:focus, .f\:d-bc-brand-strong:focus-within, .fv\:d-bc-brand-strong:focus-visible {
+  --bco: var(--dt-color-border-brand-strong-a);
+  border-color: hsl(var(--dt-color-border-brand-strong-h) var(--dt-color-border-brand-strong-s) var(--dt-color-border-brand-strong-l) / var(--bco)) !important;
+}
+.d-bc-critical-inverted, .h\:d-bc-critical-inverted:hover, .f\:d-bc-critical-inverted:focus, .f\:d-bc-critical-inverted:focus-within, .fv\:d-bc-critical-inverted:focus-visible {
+  --bco: var(--dt-color-border-critical-inverted-a);
+  border-color: hsl(var(--dt-color-border-critical-inverted-h) var(--dt-color-border-critical-inverted-s) var(--dt-color-border-critical-inverted-l) / var(--bco)) !important;
+}
+.d-bc-success-inverted, .h\:d-bc-success-inverted:hover, .f\:d-bc-success-inverted:focus, .f\:d-bc-success-inverted:focus-within, .fv\:d-bc-success-inverted:focus-visible {
+  --bco: var(--dt-color-border-success-inverted-a);
+  border-color: hsl(var(--dt-color-border-success-inverted-h) var(--dt-color-border-success-inverted-s) var(--dt-color-border-success-inverted-l) / var(--bco)) !important;
+}
+.d-bc-warning-inverted, .h\:d-bc-warning-inverted:hover, .f\:d-bc-warning-inverted:focus, .f\:d-bc-warning-inverted:focus-within, .fv\:d-bc-warning-inverted:focus-visible {
+  --bco: var(--dt-color-border-warning-inverted-a);
+  border-color: hsl(var(--dt-color-border-warning-inverted-h) var(--dt-color-border-warning-inverted-s) var(--dt-color-border-warning-inverted-l) / var(--bco)) !important;
+}
+.d-bc-brand-inverted, .h\:d-bc-brand-inverted:hover, .f\:d-bc-brand-inverted:focus, .f\:d-bc-brand-inverted:focus-within, .fv\:d-bc-brand-inverted:focus-visible {
+  --bco: var(--dt-color-border-brand-inverted-a);
+  border-color: hsl(var(--dt-color-border-brand-inverted-h) var(--dt-color-border-brand-inverted-s) var(--dt-color-border-brand-inverted-l) / var(--bco)) !important;
+}
+.d-bc-critical-subtle-inverted, .h\:d-bc-critical-subtle-inverted:hover, .f\:d-bc-critical-subtle-inverted:focus, .f\:d-bc-critical-subtle-inverted:focus-within, .fv\:d-bc-critical-subtle-inverted:focus-visible {
+  --bco: var(--dt-color-border-critical-subtle-inverted-a);
+  border-color: hsl(var(--dt-color-border-critical-subtle-inverted-h) var(--dt-color-border-critical-subtle-inverted-s) var(--dt-color-border-critical-subtle-inverted-l) / var(--bco)) !important;
+}
+.d-bc-critical-strong-inverted, .h\:d-bc-critical-strong-inverted:hover, .f\:d-bc-critical-strong-inverted:focus, .f\:d-bc-critical-strong-inverted:focus-within, .fv\:d-bc-critical-strong-inverted:focus-visible {
+  --bco: var(--dt-color-border-critical-strong-inverted-a);
+  border-color: hsl(var(--dt-color-border-critical-strong-inverted-h) var(--dt-color-border-critical-strong-inverted-s) var(--dt-color-border-critical-strong-inverted-l) / var(--bco)) !important;
+}
+.d-bc-success-subtle-inverted, .h\:d-bc-success-subtle-inverted:hover, .f\:d-bc-success-subtle-inverted:focus, .f\:d-bc-success-subtle-inverted:focus-within, .fv\:d-bc-success-subtle-inverted:focus-visible {
+  --bco: var(--dt-color-border-success-subtle-inverted-a);
+  border-color: hsl(var(--dt-color-border-success-subtle-inverted-h) var(--dt-color-border-success-subtle-inverted-s) var(--dt-color-border-success-subtle-inverted-l) / var(--bco)) !important;
+}
+.d-bc-success-strong-inverted, .h\:d-bc-success-strong-inverted:hover, .f\:d-bc-success-strong-inverted:focus, .f\:d-bc-success-strong-inverted:focus-within, .fv\:d-bc-success-strong-inverted:focus-visible {
+  --bco: var(--dt-color-border-success-strong-inverted-a);
+  border-color: hsl(var(--dt-color-border-success-strong-inverted-h) var(--dt-color-border-success-strong-inverted-s) var(--dt-color-border-success-strong-inverted-l) / var(--bco)) !important;
+}
+.d-bc-warning-subtle-inverted, .h\:d-bc-warning-subtle-inverted:hover, .f\:d-bc-warning-subtle-inverted:focus, .f\:d-bc-warning-subtle-inverted:focus-within, .fv\:d-bc-warning-subtle-inverted:focus-visible {
+  --bco: var(--dt-color-border-warning-subtle-inverted-a);
+  border-color: hsl(var(--dt-color-border-warning-subtle-inverted-h) var(--dt-color-border-warning-subtle-inverted-s) var(--dt-color-border-warning-subtle-inverted-l) / var(--bco)) !important;
+}
+.d-bc-warning-strong-inverted, .h\:d-bc-warning-strong-inverted:hover, .f\:d-bc-warning-strong-inverted:focus, .f\:d-bc-warning-strong-inverted:focus-within, .fv\:d-bc-warning-strong-inverted:focus-visible {
+  --bco: var(--dt-color-border-warning-strong-inverted-a);
+  border-color: hsl(var(--dt-color-border-warning-strong-inverted-h) var(--dt-color-border-warning-strong-inverted-s) var(--dt-color-border-warning-strong-inverted-l) / var(--bco)) !important;
+}
+.d-bc-brand-subtle-inverted, .h\:d-bc-brand-subtle-inverted:hover, .f\:d-bc-brand-subtle-inverted:focus, .f\:d-bc-brand-subtle-inverted:focus-within, .fv\:d-bc-brand-subtle-inverted:focus-visible {
+  --bco: var(--dt-color-border-brand-subtle-inverted-a);
+  border-color: hsl(var(--dt-color-border-brand-subtle-inverted-h) var(--dt-color-border-brand-subtle-inverted-s) var(--dt-color-border-brand-subtle-inverted-l) / var(--bco)) !important;
+}
+.d-bc-brand-strong-inverted, .h\:d-bc-brand-strong-inverted:hover, .f\:d-bc-brand-strong-inverted:focus, .f\:d-bc-brand-strong-inverted:focus-within, .fv\:d-bc-brand-strong-inverted:focus-visible {
+  --bco: var(--dt-color-border-brand-strong-inverted-a);
+  border-color: hsl(var(--dt-color-border-brand-strong-inverted-h) var(--dt-color-border-brand-strong-inverted-s) var(--dt-color-border-brand-strong-inverted-l) / var(--bco)) !important;
 }
 .d-bgc-neutral-white, .h\:d-bgc-neutral-white:hover, .f\:d-bgc-neutral-white:focus, .f\:d-bgc-neutral-white:focus-within, .fv\:d-bgc-neutral-white:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-neutral-white-a);
+  background-color: hsl(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bgo)) !important;
 }
 .d-bgc-neutral-black, .h\:d-bgc-neutral-black:hover, .f\:d-bgc-neutral-black:focus, .f\:d-bgc-neutral-black:focus-within, .fv\:d-bgc-neutral-black:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-neutral-black-a);
+  background-color: hsl(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bgo)) !important;
 }
 .d-bgc-black-100, .h\:d-bgc-black-100:hover, .f\:d-bgc-black-100:focus, .f\:d-bgc-black-100:focus-within, .fv\:d-bgc-black-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-100-a);
+  background-color: hsl(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bgo)) !important;
 }
 .d-bgc-black-200, .h\:d-bgc-black-200:hover, .f\:d-bgc-black-200:focus, .f\:d-bgc-black-200:focus-within, .fv\:d-bgc-black-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-200-a);
+  background-color: hsl(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bgo)) !important;
 }
 .d-bgc-black-300, .h\:d-bgc-black-300:hover, .f\:d-bgc-black-300:focus, .f\:d-bgc-black-300:focus-within, .fv\:d-bgc-black-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-300-a);
+  background-color: hsl(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bgo)) !important;
 }
 .d-bgc-black-400, .h\:d-bgc-black-400:hover, .f\:d-bgc-black-400:focus, .f\:d-bgc-black-400:focus-within, .fv\:d-bgc-black-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-400-a);
+  background-color: hsl(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bgo)) !important;
 }
 .d-bgc-black-500, .h\:d-bgc-black-500:hover, .f\:d-bgc-black-500:focus, .f\:d-bgc-black-500:focus-within, .fv\:d-bgc-black-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-500-a);
+  background-color: hsl(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bgo)) !important;
 }
 .d-bgc-black-600, .h\:d-bgc-black-600:hover, .f\:d-bgc-black-600:focus, .f\:d-bgc-black-600:focus-within, .fv\:d-bgc-black-600:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-600-a);
+  background-color: hsl(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bgo)) !important;
 }
 .d-bgc-black-700, .h\:d-bgc-black-700:hover, .f\:d-bgc-black-700:focus, .f\:d-bgc-black-700:focus-within, .fv\:d-bgc-black-700:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-700-a);
+  background-color: hsl(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bgo)) !important;
 }
 .d-bgc-black-800, .h\:d-bgc-black-800:hover, .f\:d-bgc-black-800:focus, .f\:d-bgc-black-800:focus-within, .fv\:d-bgc-black-800:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-800-a);
+  background-color: hsl(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bgo)) !important;
 }
 .d-bgc-black-900, .h\:d-bgc-black-900:hover, .f\:d-bgc-black-900:focus, .f\:d-bgc-black-900:focus-within, .fv\:d-bgc-black-900:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-black-900-a);
+  background-color: hsl(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bgo)) !important;
 }
 .d-bgc-purple-100, .h\:d-bgc-purple-100:hover, .f\:d-bgc-purple-100:focus, .f\:d-bgc-purple-100:focus-within, .fv\:d-bgc-purple-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-purple-100-a);
+  background-color: hsl(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bgo)) !important;
 }
 .d-bgc-purple-200, .h\:d-bgc-purple-200:hover, .f\:d-bgc-purple-200:focus, .f\:d-bgc-purple-200:focus-within, .fv\:d-bgc-purple-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-purple-200-a);
+  background-color: hsl(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bgo)) !important;
 }
 .d-bgc-purple-300, .h\:d-bgc-purple-300:hover, .f\:d-bgc-purple-300:focus, .f\:d-bgc-purple-300:focus-within, .fv\:d-bgc-purple-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-purple-300-a);
+  background-color: hsl(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bgo)) !important;
 }
 .d-bgc-purple-400, .h\:d-bgc-purple-400:hover, .f\:d-bgc-purple-400:focus, .f\:d-bgc-purple-400:focus-within, .fv\:d-bgc-purple-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-purple-400-a);
+  background-color: hsl(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bgo)) !important;
 }
 .d-bgc-purple-500, .h\:d-bgc-purple-500:hover, .f\:d-bgc-purple-500:focus, .f\:d-bgc-purple-500:focus-within, .fv\:d-bgc-purple-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-purple-500-a);
+  background-color: hsl(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bgo)) !important;
 }
 .d-bgc-purple-600, .h\:d-bgc-purple-600:hover, .f\:d-bgc-purple-600:focus, .f\:d-bgc-purple-600:focus-within, .fv\:d-bgc-purple-600:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-purple-600-a);
+  background-color: hsl(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bgo)) !important;
 }
 .d-bgc-blue-100, .h\:d-bgc-blue-100:hover, .f\:d-bgc-blue-100:focus, .f\:d-bgc-blue-100:focus-within, .fv\:d-bgc-blue-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-blue-100-a);
+  background-color: hsl(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bgo)) !important;
 }
 .d-bgc-blue-200, .h\:d-bgc-blue-200:hover, .f\:d-bgc-blue-200:focus, .f\:d-bgc-blue-200:focus-within, .fv\:d-bgc-blue-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-blue-200-a);
+  background-color: hsl(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bgo)) !important;
 }
 .d-bgc-blue-300, .h\:d-bgc-blue-300:hover, .f\:d-bgc-blue-300:focus, .f\:d-bgc-blue-300:focus-within, .fv\:d-bgc-blue-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-blue-300-a);
+  background-color: hsl(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bgo)) !important;
 }
 .d-bgc-blue-400, .h\:d-bgc-blue-400:hover, .f\:d-bgc-blue-400:focus, .f\:d-bgc-blue-400:focus-within, .fv\:d-bgc-blue-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-blue-400-a);
+  background-color: hsl(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bgo)) !important;
 }
 .d-bgc-blue-500, .h\:d-bgc-blue-500:hover, .f\:d-bgc-blue-500:focus, .f\:d-bgc-blue-500:focus-within, .fv\:d-bgc-blue-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-blue-500-a);
+  background-color: hsl(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bgo)) !important;
 }
 .d-bgc-magenta-100, .h\:d-bgc-magenta-100:hover, .f\:d-bgc-magenta-100:focus, .f\:d-bgc-magenta-100:focus-within, .fv\:d-bgc-magenta-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-magenta-100-a);
+  background-color: hsl(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bgo)) !important;
 }
 .d-bgc-magenta-200, .h\:d-bgc-magenta-200:hover, .f\:d-bgc-magenta-200:focus, .f\:d-bgc-magenta-200:focus-within, .fv\:d-bgc-magenta-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-magenta-200-a);
+  background-color: hsl(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bgo)) !important;
 }
 .d-bgc-magenta-300, .h\:d-bgc-magenta-300:hover, .f\:d-bgc-magenta-300:focus, .f\:d-bgc-magenta-300:focus-within, .fv\:d-bgc-magenta-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-magenta-300-a);
+  background-color: hsl(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bgo)) !important;
 }
 .d-bgc-magenta-400, .h\:d-bgc-magenta-400:hover, .f\:d-bgc-magenta-400:focus, .f\:d-bgc-magenta-400:focus-within, .fv\:d-bgc-magenta-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-magenta-400-a);
+  background-color: hsl(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bgo)) !important;
 }
 .d-bgc-magenta-500, .h\:d-bgc-magenta-500:hover, .f\:d-bgc-magenta-500:focus, .f\:d-bgc-magenta-500:focus-within, .fv\:d-bgc-magenta-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-magenta-500-a);
+  background-color: hsl(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bgo)) !important;
 }
 .d-bgc-gold-100, .h\:d-bgc-gold-100:hover, .f\:d-bgc-gold-100:focus, .f\:d-bgc-gold-100:focus-within, .fv\:d-bgc-gold-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-gold-100-a);
+  background-color: hsl(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bgo)) !important;
 }
 .d-bgc-gold-200, .h\:d-bgc-gold-200:hover, .f\:d-bgc-gold-200:focus, .f\:d-bgc-gold-200:focus-within, .fv\:d-bgc-gold-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-gold-200-a);
+  background-color: hsl(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bgo)) !important;
 }
 .d-bgc-gold-300, .h\:d-bgc-gold-300:hover, .f\:d-bgc-gold-300:focus, .f\:d-bgc-gold-300:focus-within, .fv\:d-bgc-gold-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-gold-300-a);
+  background-color: hsl(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bgo)) !important;
 }
 .d-bgc-gold-400, .h\:d-bgc-gold-400:hover, .f\:d-bgc-gold-400:focus, .f\:d-bgc-gold-400:focus-within, .fv\:d-bgc-gold-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-gold-400-a);
+  background-color: hsl(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bgo)) !important;
 }
 .d-bgc-gold-500, .h\:d-bgc-gold-500:hover, .f\:d-bgc-gold-500:focus, .f\:d-bgc-gold-500:focus-within, .fv\:d-bgc-gold-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-gold-500-a);
+  background-color: hsl(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bgo)) !important;
 }
 .d-bgc-green-100, .h\:d-bgc-green-100:hover, .f\:d-bgc-green-100:focus, .f\:d-bgc-green-100:focus-within, .fv\:d-bgc-green-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-green-100-a);
+  background-color: hsl(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bgo)) !important;
 }
 .d-bgc-green-200, .h\:d-bgc-green-200:hover, .f\:d-bgc-green-200:focus, .f\:d-bgc-green-200:focus-within, .fv\:d-bgc-green-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-green-200-a);
+  background-color: hsl(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bgo)) !important;
 }
 .d-bgc-green-300, .h\:d-bgc-green-300:hover, .f\:d-bgc-green-300:focus, .f\:d-bgc-green-300:focus-within, .fv\:d-bgc-green-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-green-300-a);
+  background-color: hsl(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bgo)) !important;
 }
 .d-bgc-green-400, .h\:d-bgc-green-400:hover, .f\:d-bgc-green-400:focus, .f\:d-bgc-green-400:focus-within, .fv\:d-bgc-green-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-green-400-a);
+  background-color: hsl(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bgo)) !important;
 }
 .d-bgc-green-500, .h\:d-bgc-green-500:hover, .f\:d-bgc-green-500:focus, .f\:d-bgc-green-500:focus-within, .fv\:d-bgc-green-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-green-500-a);
+  background-color: hsl(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bgo)) !important;
 }
 .d-bgc-red-100, .h\:d-bgc-red-100:hover, .f\:d-bgc-red-100:focus, .f\:d-bgc-red-100:focus-within, .fv\:d-bgc-red-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-red-100-a);
+  background-color: hsl(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bgo)) !important;
 }
 .d-bgc-red-200, .h\:d-bgc-red-200:hover, .f\:d-bgc-red-200:focus, .f\:d-bgc-red-200:focus-within, .fv\:d-bgc-red-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-red-200-a);
+  background-color: hsl(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bgo)) !important;
 }
 .d-bgc-red-300, .h\:d-bgc-red-300:hover, .f\:d-bgc-red-300:focus, .f\:d-bgc-red-300:focus-within, .fv\:d-bgc-red-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-red-300-a);
+  background-color: hsl(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bgo)) !important;
 }
 .d-bgc-red-400, .h\:d-bgc-red-400:hover, .f\:d-bgc-red-400:focus, .f\:d-bgc-red-400:focus-within, .fv\:d-bgc-red-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-red-400-a);
+  background-color: hsl(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bgo)) !important;
 }
 .d-bgc-red-500, .h\:d-bgc-red-500:hover, .f\:d-bgc-red-500:focus, .f\:d-bgc-red-500:focus-within, .fv\:d-bgc-red-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-red-500-a);
+  background-color: hsl(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bgo)) !important;
 }
 .d-bgc-tan-100, .h\:d-bgc-tan-100:hover, .f\:d-bgc-tan-100:focus, .f\:d-bgc-tan-100:focus-within, .fv\:d-bgc-tan-100:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-tan-100-a);
+  background-color: hsl(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bgo)) !important;
 }
 .d-bgc-tan-200, .h\:d-bgc-tan-200:hover, .f\:d-bgc-tan-200:focus, .f\:d-bgc-tan-200:focus-within, .fv\:d-bgc-tan-200:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-tan-200-a);
+  background-color: hsl(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bgo)) !important;
 }
 .d-bgc-tan-300, .h\:d-bgc-tan-300:hover, .f\:d-bgc-tan-300:focus, .f\:d-bgc-tan-300:focus-within, .fv\:d-bgc-tan-300:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-tan-300-a);
+  background-color: hsl(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bgo)) !important;
 }
 .d-bgc-tan-400, .h\:d-bgc-tan-400:hover, .f\:d-bgc-tan-400:focus, .f\:d-bgc-tan-400:focus-within, .fv\:d-bgc-tan-400:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-tan-400-a);
+  background-color: hsl(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bgo)) !important;
 }
 .d-bgc-tan-500, .h\:d-bgc-tan-500:hover, .f\:d-bgc-tan-500:focus, .f\:d-bgc-tan-500:focus-within, .fv\:d-bgc-tan-500:focus-visible {
-  --bgo: 100%;
-  background-color: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bgo)) !important;
+  --bgo: var(--dt-color-tan-500-a);
+  background-color: hsl(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bgo)) !important;
+}
+.d-bgc-secondary-opaque, .h\:d-bgc-secondary-opaque:hover, .f\:d-bgc-secondary-opaque:focus, .f\:d-bgc-secondary-opaque:focus-within, .fv\:d-bgc-secondary-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-secondary-opaque-a);
+  background-color: hsl(var(--dt-color-surface-secondary-opaque-h) var(--dt-color-surface-secondary-opaque-s) var(--dt-color-surface-secondary-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-moderate-opaque, .h\:d-bgc-moderate-opaque:hover, .f\:d-bgc-moderate-opaque:focus, .f\:d-bgc-moderate-opaque:focus-within, .fv\:d-bgc-moderate-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-moderate-opaque-a);
+  background-color: hsl(var(--dt-color-surface-moderate-opaque-h) var(--dt-color-surface-moderate-opaque-s) var(--dt-color-surface-moderate-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-bold-opaque, .h\:d-bgc-bold-opaque:hover, .f\:d-bgc-bold-opaque:focus, .f\:d-bgc-bold-opaque:focus-within, .fv\:d-bgc-bold-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-bold-opaque-a);
+  background-color: hsl(var(--dt-color-surface-bold-opaque-h) var(--dt-color-surface-bold-opaque-s) var(--dt-color-surface-bold-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-strong-opaque, .h\:d-bgc-strong-opaque:hover, .f\:d-bgc-strong-opaque:focus, .f\:d-bgc-strong-opaque:focus-within, .fv\:d-bgc-strong-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-strong-opaque-a);
+  background-color: hsl(var(--dt-color-surface-strong-opaque-h) var(--dt-color-surface-strong-opaque-s) var(--dt-color-surface-strong-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-contrast-opaque, .h\:d-bgc-contrast-opaque:hover, .f\:d-bgc-contrast-opaque:focus, .f\:d-bgc-contrast-opaque:focus-within, .fv\:d-bgc-contrast-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-contrast-opaque-a);
+  background-color: hsl(var(--dt-color-surface-contrast-opaque-h) var(--dt-color-surface-contrast-opaque-s) var(--dt-color-surface-contrast-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-backdrop, .h\:d-bgc-backdrop:hover, .f\:d-bgc-backdrop:focus, .f\:d-bgc-backdrop:focus-within, .fv\:d-bgc-backdrop:focus-visible {
+  --bgo: var(--dt-color-surface-backdrop-a);
+  background-color: hsl(var(--dt-color-surface-backdrop-h) var(--dt-color-surface-backdrop-s) var(--dt-color-surface-backdrop-l) / var(--bgo)) !important;
+}
+.d-bgc-critical-opaque, .h\:d-bgc-critical-opaque:hover, .f\:d-bgc-critical-opaque:focus, .f\:d-bgc-critical-opaque:focus-within, .fv\:d-bgc-critical-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-critical-opaque-a);
+  background-color: hsl(var(--dt-color-surface-critical-opaque-h) var(--dt-color-surface-critical-opaque-s) var(--dt-color-surface-critical-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-critical-subtle-opaque, .h\:d-bgc-critical-subtle-opaque:hover, .f\:d-bgc-critical-subtle-opaque:focus, .f\:d-bgc-critical-subtle-opaque:focus-within, .fv\:d-bgc-critical-subtle-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-critical-subtle-opaque-a);
+  background-color: hsl(var(--dt-color-surface-critical-subtle-opaque-h) var(--dt-color-surface-critical-subtle-opaque-s) var(--dt-color-surface-critical-subtle-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-warning-opaque, .h\:d-bgc-warning-opaque:hover, .f\:d-bgc-warning-opaque:focus, .f\:d-bgc-warning-opaque:focus-within, .fv\:d-bgc-warning-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-warning-opaque-a);
+  background-color: hsl(var(--dt-color-surface-warning-opaque-h) var(--dt-color-surface-warning-opaque-s) var(--dt-color-surface-warning-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-warning-subtle-opaque, .h\:d-bgc-warning-subtle-opaque:hover, .f\:d-bgc-warning-subtle-opaque:focus, .f\:d-bgc-warning-subtle-opaque:focus-within, .fv\:d-bgc-warning-subtle-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-warning-subtle-opaque-a);
+  background-color: hsl(var(--dt-color-surface-warning-subtle-opaque-h) var(--dt-color-surface-warning-subtle-opaque-s) var(--dt-color-surface-warning-subtle-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-success-opaque, .h\:d-bgc-success-opaque:hover, .f\:d-bgc-success-opaque:focus, .f\:d-bgc-success-opaque:focus-within, .fv\:d-bgc-success-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-success-opaque-a);
+  background-color: hsl(var(--dt-color-surface-success-opaque-h) var(--dt-color-surface-success-opaque-s) var(--dt-color-surface-success-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-success-subtle-opaque, .h\:d-bgc-success-subtle-opaque:hover, .f\:d-bgc-success-subtle-opaque:focus, .f\:d-bgc-success-subtle-opaque:focus-within, .fv\:d-bgc-success-subtle-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-success-subtle-opaque-a);
+  background-color: hsl(var(--dt-color-surface-success-subtle-opaque-h) var(--dt-color-surface-success-subtle-opaque-s) var(--dt-color-surface-success-subtle-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-info-opaque, .h\:d-bgc-info-opaque:hover, .f\:d-bgc-info-opaque:focus, .f\:d-bgc-info-opaque:focus-within, .fv\:d-bgc-info-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-info-opaque-a);
+  background-color: hsl(var(--dt-color-surface-info-opaque-h) var(--dt-color-surface-info-opaque-s) var(--dt-color-surface-info-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-info-subtle-opaque, .h\:d-bgc-info-subtle-opaque:hover, .f\:d-bgc-info-subtle-opaque:focus, .f\:d-bgc-info-subtle-opaque:focus-within, .fv\:d-bgc-info-subtle-opaque:focus-visible {
+  --bgo: var(--dt-color-surface-info-subtle-opaque-a);
+  background-color: hsl(var(--dt-color-surface-info-subtle-opaque-h) var(--dt-color-surface-info-subtle-opaque-s) var(--dt-color-surface-info-subtle-opaque-l) / var(--bgo)) !important;
+}
+.d-bgc-primary, .h\:d-bgc-primary:hover, .f\:d-bgc-primary:focus, .f\:d-bgc-primary:focus-within, .fv\:d-bgc-primary:focus-visible {
+  --bgo: var(--dt-color-surface-primary-a);
+  background-color: hsl(var(--dt-color-surface-primary-h) var(--dt-color-surface-primary-s) var(--dt-color-surface-primary-l) / var(--bgo)) !important;
+}
+.d-bgc-secondary, .h\:d-bgc-secondary:hover, .f\:d-bgc-secondary:focus, .f\:d-bgc-secondary:focus-within, .fv\:d-bgc-secondary:focus-visible {
+  --bgo: var(--dt-color-surface-secondary-a);
+  background-color: hsl(var(--dt-color-surface-secondary-h) var(--dt-color-surface-secondary-s) var(--dt-color-surface-secondary-l) / var(--bgo)) !important;
+}
+.d-bgc-moderate, .h\:d-bgc-moderate:hover, .f\:d-bgc-moderate:focus, .f\:d-bgc-moderate:focus-within, .fv\:d-bgc-moderate:focus-visible {
+  --bgo: var(--dt-color-surface-moderate-a);
+  background-color: hsl(var(--dt-color-surface-moderate-h) var(--dt-color-surface-moderate-s) var(--dt-color-surface-moderate-l) / var(--bgo)) !important;
+}
+.d-bgc-bold, .h\:d-bgc-bold:hover, .f\:d-bgc-bold:focus, .f\:d-bgc-bold:focus-within, .fv\:d-bgc-bold:focus-visible {
+  --bgo: var(--dt-color-surface-bold-a);
+  background-color: hsl(var(--dt-color-surface-bold-h) var(--dt-color-surface-bold-s) var(--dt-color-surface-bold-l) / var(--bgo)) !important;
+}
+.d-bgc-strong, .h\:d-bgc-strong:hover, .f\:d-bgc-strong:focus, .f\:d-bgc-strong:focus-within, .fv\:d-bgc-strong:focus-visible {
+  --bgo: var(--dt-color-surface-strong-a);
+  background-color: hsl(var(--dt-color-surface-strong-h) var(--dt-color-surface-strong-s) var(--dt-color-surface-strong-l) / var(--bgo)) !important;
+}
+.d-bgc-contrast, .h\:d-bgc-contrast:hover, .f\:d-bgc-contrast:focus, .f\:d-bgc-contrast:focus-within, .fv\:d-bgc-contrast:focus-visible {
+  --bgo: var(--dt-color-surface-contrast-a);
+  background-color: hsl(var(--dt-color-surface-contrast-h) var(--dt-color-surface-contrast-s) var(--dt-color-surface-contrast-l) / var(--bgo)) !important;
+}
+.d-bgc-critical, .h\:d-bgc-critical:hover, .f\:d-bgc-critical:focus, .f\:d-bgc-critical:focus-within, .fv\:d-bgc-critical:focus-visible {
+  --bgo: var(--dt-color-surface-critical-a);
+  background-color: hsl(var(--dt-color-surface-critical-h) var(--dt-color-surface-critical-s) var(--dt-color-surface-critical-l) / var(--bgo)) !important;
+}
+.d-bgc-critical-subtle, .h\:d-bgc-critical-subtle:hover, .f\:d-bgc-critical-subtle:focus, .f\:d-bgc-critical-subtle:focus-within, .fv\:d-bgc-critical-subtle:focus-visible {
+  --bgo: var(--dt-color-surface-critical-subtle-a);
+  background-color: hsl(var(--dt-color-surface-critical-subtle-h) var(--dt-color-surface-critical-subtle-s) var(--dt-color-surface-critical-subtle-l) / var(--bgo)) !important;
+}
+.d-bgc-critical-strong, .h\:d-bgc-critical-strong:hover, .f\:d-bgc-critical-strong:focus, .f\:d-bgc-critical-strong:focus-within, .fv\:d-bgc-critical-strong:focus-visible {
+  --bgo: var(--dt-color-surface-critical-strong-a);
+  background-color: hsl(var(--dt-color-surface-critical-strong-h) var(--dt-color-surface-critical-strong-s) var(--dt-color-surface-critical-strong-l) / var(--bgo)) !important;
+}
+.d-bgc-warning, .h\:d-bgc-warning:hover, .f\:d-bgc-warning:focus, .f\:d-bgc-warning:focus-within, .fv\:d-bgc-warning:focus-visible {
+  --bgo: var(--dt-color-surface-warning-a);
+  background-color: hsl(var(--dt-color-surface-warning-h) var(--dt-color-surface-warning-s) var(--dt-color-surface-warning-l) / var(--bgo)) !important;
+}
+.d-bgc-warning-subtle, .h\:d-bgc-warning-subtle:hover, .f\:d-bgc-warning-subtle:focus, .f\:d-bgc-warning-subtle:focus-within, .fv\:d-bgc-warning-subtle:focus-visible {
+  --bgo: var(--dt-color-surface-warning-subtle-a);
+  background-color: hsl(var(--dt-color-surface-warning-subtle-h) var(--dt-color-surface-warning-subtle-s) var(--dt-color-surface-warning-subtle-l) / var(--bgo)) !important;
+}
+.d-bgc-warning-strong, .h\:d-bgc-warning-strong:hover, .f\:d-bgc-warning-strong:focus, .f\:d-bgc-warning-strong:focus-within, .fv\:d-bgc-warning-strong:focus-visible {
+  --bgo: var(--dt-color-surface-warning-strong-a);
+  background-color: hsl(var(--dt-color-surface-warning-strong-h) var(--dt-color-surface-warning-strong-s) var(--dt-color-surface-warning-strong-l) / var(--bgo)) !important;
+}
+.d-bgc-success, .h\:d-bgc-success:hover, .f\:d-bgc-success:focus, .f\:d-bgc-success:focus-within, .fv\:d-bgc-success:focus-visible {
+  --bgo: var(--dt-color-surface-success-a);
+  background-color: hsl(var(--dt-color-surface-success-h) var(--dt-color-surface-success-s) var(--dt-color-surface-success-l) / var(--bgo)) !important;
+}
+.d-bgc-success-subtle, .h\:d-bgc-success-subtle:hover, .f\:d-bgc-success-subtle:focus, .f\:d-bgc-success-subtle:focus-within, .fv\:d-bgc-success-subtle:focus-visible {
+  --bgo: var(--dt-color-surface-success-subtle-a);
+  background-color: hsl(var(--dt-color-surface-success-subtle-h) var(--dt-color-surface-success-subtle-s) var(--dt-color-surface-success-subtle-l) / var(--bgo)) !important;
+}
+.d-bgc-success-strong, .h\:d-bgc-success-strong:hover, .f\:d-bgc-success-strong:focus, .f\:d-bgc-success-strong:focus-within, .fv\:d-bgc-success-strong:focus-visible {
+  --bgo: var(--dt-color-surface-success-strong-a);
+  background-color: hsl(var(--dt-color-surface-success-strong-h) var(--dt-color-surface-success-strong-s) var(--dt-color-surface-success-strong-l) / var(--bgo)) !important;
+}
+.d-bgc-info, .h\:d-bgc-info:hover, .f\:d-bgc-info:focus, .f\:d-bgc-info:focus-within, .fv\:d-bgc-info:focus-visible {
+  --bgo: var(--dt-color-surface-info-a);
+  background-color: hsl(var(--dt-color-surface-info-h) var(--dt-color-surface-info-s) var(--dt-color-surface-info-l) / var(--bgo)) !important;
+}
+.d-bgc-info-subtle, .h\:d-bgc-info-subtle:hover, .f\:d-bgc-info-subtle:focus, .f\:d-bgc-info-subtle:focus-within, .fv\:d-bgc-info-subtle:focus-visible {
+  --bgo: var(--dt-color-surface-info-subtle-a);
+  background-color: hsl(var(--dt-color-surface-info-subtle-h) var(--dt-color-surface-info-subtle-s) var(--dt-color-surface-info-subtle-l) / var(--bgo)) !important;
+}
+.d-bgc-info-strong, .h\:d-bgc-info-strong:hover, .f\:d-bgc-info-strong:focus, .f\:d-bgc-info-strong:focus-within, .fv\:d-bgc-info-strong:focus-visible {
+  --bgo: var(--dt-color-surface-info-strong-a);
+  background-color: hsl(var(--dt-color-surface-info-strong-h) var(--dt-color-surface-info-strong-s) var(--dt-color-surface-info-strong-l) / var(--bgo)) !important;
 }
 .d-divide-neutral-white > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--dco)) !important;
+  --dco: var(--dt-color-neutral-white-a);
+  border-color: hsl(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--dco)) !important;
 }
 .d-divide-neutral-black > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--dco)) !important;
+  --dco: var(--dt-color-neutral-black-a);
+  border-color: hsl(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--dco)) !important;
 }
 .d-divide-black-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-100-a);
+  border-color: hsl(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--dco)) !important;
 }
 .d-divide-black-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-200-a);
+  border-color: hsl(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--dco)) !important;
 }
 .d-divide-black-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-300-a);
+  border-color: hsl(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--dco)) !important;
 }
 .d-divide-black-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-400-a);
+  border-color: hsl(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--dco)) !important;
 }
 .d-divide-black-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-500-a);
+  border-color: hsl(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--dco)) !important;
 }
 .d-divide-black-600 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-600-a);
+  border-color: hsl(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--dco)) !important;
 }
 .d-divide-black-700 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-700-a);
+  border-color: hsl(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--dco)) !important;
 }
 .d-divide-black-800 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-800-a);
+  border-color: hsl(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--dco)) !important;
 }
 .d-divide-black-900 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--dco)) !important;
+  --dco: var(--dt-color-black-900-a);
+  border-color: hsl(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--dco)) !important;
 }
 .d-divide-purple-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-purple-100-a);
+  border-color: hsl(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--dco)) !important;
 }
 .d-divide-purple-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-purple-200-a);
+  border-color: hsl(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--dco)) !important;
 }
 .d-divide-purple-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-purple-300-a);
+  border-color: hsl(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--dco)) !important;
 }
 .d-divide-purple-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-purple-400-a);
+  border-color: hsl(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--dco)) !important;
 }
 .d-divide-purple-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-purple-500-a);
+  border-color: hsl(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--dco)) !important;
 }
 .d-divide-purple-600 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--dco)) !important;
+  --dco: var(--dt-color-purple-600-a);
+  border-color: hsl(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--dco)) !important;
 }
 .d-divide-blue-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-blue-100-a);
+  border-color: hsl(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--dco)) !important;
 }
 .d-divide-blue-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-blue-200-a);
+  border-color: hsl(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--dco)) !important;
 }
 .d-divide-blue-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-blue-300-a);
+  border-color: hsl(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--dco)) !important;
 }
 .d-divide-blue-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-blue-400-a);
+  border-color: hsl(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--dco)) !important;
 }
 .d-divide-blue-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-blue-500-a);
+  border-color: hsl(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--dco)) !important;
 }
 .d-divide-magenta-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-magenta-100-a);
+  border-color: hsl(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--dco)) !important;
 }
 .d-divide-magenta-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-magenta-200-a);
+  border-color: hsl(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--dco)) !important;
 }
 .d-divide-magenta-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-magenta-300-a);
+  border-color: hsl(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--dco)) !important;
 }
 .d-divide-magenta-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-magenta-400-a);
+  border-color: hsl(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--dco)) !important;
 }
 .d-divide-magenta-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-magenta-500-a);
+  border-color: hsl(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--dco)) !important;
 }
 .d-divide-gold-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-gold-100-a);
+  border-color: hsl(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--dco)) !important;
 }
 .d-divide-gold-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-gold-200-a);
+  border-color: hsl(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--dco)) !important;
 }
 .d-divide-gold-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-gold-300-a);
+  border-color: hsl(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--dco)) !important;
 }
 .d-divide-gold-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-gold-400-a);
+  border-color: hsl(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--dco)) !important;
 }
 .d-divide-gold-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-gold-500-a);
+  border-color: hsl(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--dco)) !important;
 }
 .d-divide-green-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-green-100-a);
+  border-color: hsl(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--dco)) !important;
 }
 .d-divide-green-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-green-200-a);
+  border-color: hsl(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--dco)) !important;
 }
 .d-divide-green-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-green-300-a);
+  border-color: hsl(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--dco)) !important;
 }
 .d-divide-green-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-green-400-a);
+  border-color: hsl(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--dco)) !important;
 }
 .d-divide-green-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-green-500-a);
+  border-color: hsl(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--dco)) !important;
 }
 .d-divide-red-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-red-100-a);
+  border-color: hsl(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--dco)) !important;
 }
 .d-divide-red-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-red-200-a);
+  border-color: hsl(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--dco)) !important;
 }
 .d-divide-red-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-red-300-a);
+  border-color: hsl(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--dco)) !important;
 }
 .d-divide-red-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-red-400-a);
+  border-color: hsl(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--dco)) !important;
 }
 .d-divide-red-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-red-500-a);
+  border-color: hsl(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--dco)) !important;
 }
 .d-divide-tan-100 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--dco)) !important;
+  --dco: var(--dt-color-tan-100-a);
+  border-color: hsl(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--dco)) !important;
 }
 .d-divide-tan-200 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--dco)) !important;
+  --dco: var(--dt-color-tan-200-a);
+  border-color: hsl(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--dco)) !important;
 }
 .d-divide-tan-300 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--dco)) !important;
+  --dco: var(--dt-color-tan-300-a);
+  border-color: hsl(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--dco)) !important;
 }
 .d-divide-tan-400 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--dco)) !important;
+  --dco: var(--dt-color-tan-400-a);
+  border-color: hsl(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--dco)) !important;
 }
 .d-divide-tan-500 > * + * {
-  --dco: 100%;
-  border-color: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--dco)) !important;
+  --dco: var(--dt-color-tan-500-a);
+  border-color: hsl(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--dco)) !important;
 }
 .d-bgg-from-neutral-white, .h\:d-bgg-from-neutral-white:hover, .f\:d-bgg-from-neutral-white:focus, .f\:d-bgg-from-neutral-white:focus-within, .fv\:d-bgg-from-neutral-white:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / 0%);
 }
 .d-bgg-from-neutral-black, .h\:d-bgg-from-neutral-black:hover, .f\:d-bgg-from-neutral-black:focus, .f\:d-bgg-from-neutral-black:focus-within, .fv\:d-bgg-from-neutral-black:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / 0%);
 }
 .d-bgg-from-black-100, .h\:d-bgg-from-black-100:hover, .f\:d-bgg-from-black-100:focus, .f\:d-bgg-from-black-100:focus-within, .fv\:d-bgg-from-black-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / 0%);
 }
 .d-bgg-from-black-200, .h\:d-bgg-from-black-200:hover, .f\:d-bgg-from-black-200:focus, .f\:d-bgg-from-black-200:focus-within, .fv\:d-bgg-from-black-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / 0%);
 }
 .d-bgg-from-black-300, .h\:d-bgg-from-black-300:hover, .f\:d-bgg-from-black-300:focus, .f\:d-bgg-from-black-300:focus-within, .fv\:d-bgg-from-black-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / 0%);
 }
 .d-bgg-from-black-400, .h\:d-bgg-from-black-400:hover, .f\:d-bgg-from-black-400:focus, .f\:d-bgg-from-black-400:focus-within, .fv\:d-bgg-from-black-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / 0%);
 }
 .d-bgg-from-black-500, .h\:d-bgg-from-black-500:hover, .f\:d-bgg-from-black-500:focus, .f\:d-bgg-from-black-500:focus-within, .fv\:d-bgg-from-black-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / 0%);
 }
 .d-bgg-from-black-600, .h\:d-bgg-from-black-600:hover, .f\:d-bgg-from-black-600:focus, .f\:d-bgg-from-black-600:focus-within, .fv\:d-bgg-from-black-600:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / 0%);
 }
 .d-bgg-from-black-700, .h\:d-bgg-from-black-700:hover, .f\:d-bgg-from-black-700:focus, .f\:d-bgg-from-black-700:focus-within, .fv\:d-bgg-from-black-700:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / 0%);
 }
 .d-bgg-from-black-800, .h\:d-bgg-from-black-800:hover, .f\:d-bgg-from-black-800:focus, .f\:d-bgg-from-black-800:focus-within, .fv\:d-bgg-from-black-800:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / 0%);
 }
 .d-bgg-from-black-900, .h\:d-bgg-from-black-900:hover, .f\:d-bgg-from-black-900:focus, .f\:d-bgg-from-black-900:focus-within, .fv\:d-bgg-from-black-900:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / 0%);
 }
 .d-bgg-from-purple-100, .h\:d-bgg-from-purple-100:hover, .f\:d-bgg-from-purple-100:focus, .f\:d-bgg-from-purple-100:focus-within, .fv\:d-bgg-from-purple-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / 0%);
 }
 .d-bgg-from-purple-200, .h\:d-bgg-from-purple-200:hover, .f\:d-bgg-from-purple-200:focus, .f\:d-bgg-from-purple-200:focus-within, .fv\:d-bgg-from-purple-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / 0%);
 }
 .d-bgg-from-purple-300, .h\:d-bgg-from-purple-300:hover, .f\:d-bgg-from-purple-300:focus, .f\:d-bgg-from-purple-300:focus-within, .fv\:d-bgg-from-purple-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / 0%);
 }
 .d-bgg-from-purple-400, .h\:d-bgg-from-purple-400:hover, .f\:d-bgg-from-purple-400:focus, .f\:d-bgg-from-purple-400:focus-within, .fv\:d-bgg-from-purple-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / 0%);
 }
 .d-bgg-from-purple-500, .h\:d-bgg-from-purple-500:hover, .f\:d-bgg-from-purple-500:focus, .f\:d-bgg-from-purple-500:focus-within, .fv\:d-bgg-from-purple-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / 0%);
 }
 .d-bgg-from-purple-600, .h\:d-bgg-from-purple-600:hover, .f\:d-bgg-from-purple-600:focus, .f\:d-bgg-from-purple-600:focus-within, .fv\:d-bgg-from-purple-600:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / 0%);
 }
 .d-bgg-from-blue-100, .h\:d-bgg-from-blue-100:hover, .f\:d-bgg-from-blue-100:focus, .f\:d-bgg-from-blue-100:focus-within, .fv\:d-bgg-from-blue-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / 0%);
 }
 .d-bgg-from-blue-200, .h\:d-bgg-from-blue-200:hover, .f\:d-bgg-from-blue-200:focus, .f\:d-bgg-from-blue-200:focus-within, .fv\:d-bgg-from-blue-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / 0%);
 }
 .d-bgg-from-blue-300, .h\:d-bgg-from-blue-300:hover, .f\:d-bgg-from-blue-300:focus, .f\:d-bgg-from-blue-300:focus-within, .fv\:d-bgg-from-blue-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / 0%);
 }
 .d-bgg-from-blue-400, .h\:d-bgg-from-blue-400:hover, .f\:d-bgg-from-blue-400:focus, .f\:d-bgg-from-blue-400:focus-within, .fv\:d-bgg-from-blue-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / 0%);
 }
 .d-bgg-from-blue-500, .h\:d-bgg-from-blue-500:hover, .f\:d-bgg-from-blue-500:focus, .f\:d-bgg-from-blue-500:focus-within, .fv\:d-bgg-from-blue-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / 0%);
 }
 .d-bgg-from-magenta-100, .h\:d-bgg-from-magenta-100:hover, .f\:d-bgg-from-magenta-100:focus, .f\:d-bgg-from-magenta-100:focus-within, .fv\:d-bgg-from-magenta-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / 0%);
 }
 .d-bgg-from-magenta-200, .h\:d-bgg-from-magenta-200:hover, .f\:d-bgg-from-magenta-200:focus, .f\:d-bgg-from-magenta-200:focus-within, .fv\:d-bgg-from-magenta-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / 0%);
 }
 .d-bgg-from-magenta-300, .h\:d-bgg-from-magenta-300:hover, .f\:d-bgg-from-magenta-300:focus, .f\:d-bgg-from-magenta-300:focus-within, .fv\:d-bgg-from-magenta-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / 0%);
 }
 .d-bgg-from-magenta-400, .h\:d-bgg-from-magenta-400:hover, .f\:d-bgg-from-magenta-400:focus, .f\:d-bgg-from-magenta-400:focus-within, .fv\:d-bgg-from-magenta-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / 0%);
 }
 .d-bgg-from-magenta-500, .h\:d-bgg-from-magenta-500:hover, .f\:d-bgg-from-magenta-500:focus, .f\:d-bgg-from-magenta-500:focus-within, .fv\:d-bgg-from-magenta-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / 0%);
 }
 .d-bgg-from-gold-100, .h\:d-bgg-from-gold-100:hover, .f\:d-bgg-from-gold-100:focus, .f\:d-bgg-from-gold-100:focus-within, .fv\:d-bgg-from-gold-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / 0%);
 }
 .d-bgg-from-gold-200, .h\:d-bgg-from-gold-200:hover, .f\:d-bgg-from-gold-200:focus, .f\:d-bgg-from-gold-200:focus-within, .fv\:d-bgg-from-gold-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / 0%);
 }
 .d-bgg-from-gold-300, .h\:d-bgg-from-gold-300:hover, .f\:d-bgg-from-gold-300:focus, .f\:d-bgg-from-gold-300:focus-within, .fv\:d-bgg-from-gold-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / 0%);
 }
 .d-bgg-from-gold-400, .h\:d-bgg-from-gold-400:hover, .f\:d-bgg-from-gold-400:focus, .f\:d-bgg-from-gold-400:focus-within, .fv\:d-bgg-from-gold-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / 0%);
 }
 .d-bgg-from-gold-500, .h\:d-bgg-from-gold-500:hover, .f\:d-bgg-from-gold-500:focus, .f\:d-bgg-from-gold-500:focus-within, .fv\:d-bgg-from-gold-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / 0%);
 }
 .d-bgg-from-green-100, .h\:d-bgg-from-green-100:hover, .f\:d-bgg-from-green-100:focus, .f\:d-bgg-from-green-100:focus-within, .fv\:d-bgg-from-green-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / 0%);
 }
 .d-bgg-from-green-200, .h\:d-bgg-from-green-200:hover, .f\:d-bgg-from-green-200:focus, .f\:d-bgg-from-green-200:focus-within, .fv\:d-bgg-from-green-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / 0%);
 }
 .d-bgg-from-green-300, .h\:d-bgg-from-green-300:hover, .f\:d-bgg-from-green-300:focus, .f\:d-bgg-from-green-300:focus-within, .fv\:d-bgg-from-green-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / 0%);
 }
 .d-bgg-from-green-400, .h\:d-bgg-from-green-400:hover, .f\:d-bgg-from-green-400:focus, .f\:d-bgg-from-green-400:focus-within, .fv\:d-bgg-from-green-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / 0%);
 }
 .d-bgg-from-green-500, .h\:d-bgg-from-green-500:hover, .f\:d-bgg-from-green-500:focus, .f\:d-bgg-from-green-500:focus-within, .fv\:d-bgg-from-green-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / 0%);
 }
 .d-bgg-from-red-100, .h\:d-bgg-from-red-100:hover, .f\:d-bgg-from-red-100:focus, .f\:d-bgg-from-red-100:focus-within, .fv\:d-bgg-from-red-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / 0%);
 }
 .d-bgg-from-red-200, .h\:d-bgg-from-red-200:hover, .f\:d-bgg-from-red-200:focus, .f\:d-bgg-from-red-200:focus-within, .fv\:d-bgg-from-red-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / 0%);
 }
 .d-bgg-from-red-300, .h\:d-bgg-from-red-300:hover, .f\:d-bgg-from-red-300:focus, .f\:d-bgg-from-red-300:focus-within, .fv\:d-bgg-from-red-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / 0%);
 }
 .d-bgg-from-red-400, .h\:d-bgg-from-red-400:hover, .f\:d-bgg-from-red-400:focus, .f\:d-bgg-from-red-400:focus-within, .fv\:d-bgg-from-red-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / 0%);
 }
 .d-bgg-from-red-500, .h\:d-bgg-from-red-500:hover, .f\:d-bgg-from-red-500:focus, .f\:d-bgg-from-red-500:focus-within, .fv\:d-bgg-from-red-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / 0%);
 }
 .d-bgg-from-tan-100, .h\:d-bgg-from-tan-100:hover, .f\:d-bgg-from-tan-100:focus, .f\:d-bgg-from-tan-100:focus-within, .fv\:d-bgg-from-tan-100:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / 0%);
 }
 .d-bgg-from-tan-200, .h\:d-bgg-from-tan-200:hover, .f\:d-bgg-from-tan-200:focus, .f\:d-bgg-from-tan-200:focus-within, .fv\:d-bgg-from-tan-200:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / 0%);
 }
 .d-bgg-from-tan-300, .h\:d-bgg-from-tan-300:hover, .f\:d-bgg-from-tan-300:focus, .f\:d-bgg-from-tan-300:focus-within, .fv\:d-bgg-from-tan-300:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / 0%);
 }
 .d-bgg-from-tan-400, .h\:d-bgg-from-tan-400:hover, .f\:d-bgg-from-tan-400:focus, .f\:d-bgg-from-tan-400:focus-within, .fv\:d-bgg-from-tan-400:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / 0%);
 }
 .d-bgg-from-tan-500, .h\:d-bgg-from-tan-500:hover, .f\:d-bgg-from-tan-500:focus, .f\:d-bgg-from-tan-500:focus-within, .fv\:d-bgg-from-tan-500:focus-visible {
   --bgg-from-opacity: 100%;
-  --bgg-from: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bgg-from-opacity));
-  --bgg-to: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / 0%);
+  --bgg-from: hsl(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bgg-from-opacity));
+  --bgg-to: hsl(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / 0%);
 }
 .d-bgg-to-neutral-white, .h\:d-bgg-to-neutral-white:hover, .f\:d-bgg-to-neutral-white:focus, .f\:d-bgg-to-neutral-white:focus-within, .fv\:d-bgg-to-neutral-white:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-neutral-black, .h\:d-bgg-to-neutral-black:hover, .f\:d-bgg-to-neutral-black:focus, .f\:d-bgg-to-neutral-black:focus-within, .fv\:d-bgg-to-neutral-black:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-100, .h\:d-bgg-to-black-100:hover, .f\:d-bgg-to-black-100:focus, .f\:d-bgg-to-black-100:focus-within, .fv\:d-bgg-to-black-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-200, .h\:d-bgg-to-black-200:hover, .f\:d-bgg-to-black-200:focus, .f\:d-bgg-to-black-200:focus-within, .fv\:d-bgg-to-black-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-300, .h\:d-bgg-to-black-300:hover, .f\:d-bgg-to-black-300:focus, .f\:d-bgg-to-black-300:focus-within, .fv\:d-bgg-to-black-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-400, .h\:d-bgg-to-black-400:hover, .f\:d-bgg-to-black-400:focus, .f\:d-bgg-to-black-400:focus-within, .fv\:d-bgg-to-black-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-500, .h\:d-bgg-to-black-500:hover, .f\:d-bgg-to-black-500:focus, .f\:d-bgg-to-black-500:focus-within, .fv\:d-bgg-to-black-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-600, .h\:d-bgg-to-black-600:hover, .f\:d-bgg-to-black-600:focus, .f\:d-bgg-to-black-600:focus-within, .fv\:d-bgg-to-black-600:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-700, .h\:d-bgg-to-black-700:hover, .f\:d-bgg-to-black-700:focus, .f\:d-bgg-to-black-700:focus-within, .fv\:d-bgg-to-black-700:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-800, .h\:d-bgg-to-black-800:hover, .f\:d-bgg-to-black-800:focus, .f\:d-bgg-to-black-800:focus-within, .fv\:d-bgg-to-black-800:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-black-900, .h\:d-bgg-to-black-900:hover, .f\:d-bgg-to-black-900:focus, .f\:d-bgg-to-black-900:focus-within, .fv\:d-bgg-to-black-900:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-purple-100, .h\:d-bgg-to-purple-100:hover, .f\:d-bgg-to-purple-100:focus, .f\:d-bgg-to-purple-100:focus-within, .fv\:d-bgg-to-purple-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-purple-200, .h\:d-bgg-to-purple-200:hover, .f\:d-bgg-to-purple-200:focus, .f\:d-bgg-to-purple-200:focus-within, .fv\:d-bgg-to-purple-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-purple-300, .h\:d-bgg-to-purple-300:hover, .f\:d-bgg-to-purple-300:focus, .f\:d-bgg-to-purple-300:focus-within, .fv\:d-bgg-to-purple-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-purple-400, .h\:d-bgg-to-purple-400:hover, .f\:d-bgg-to-purple-400:focus, .f\:d-bgg-to-purple-400:focus-within, .fv\:d-bgg-to-purple-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-purple-500, .h\:d-bgg-to-purple-500:hover, .f\:d-bgg-to-purple-500:focus, .f\:d-bgg-to-purple-500:focus-within, .fv\:d-bgg-to-purple-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-purple-600, .h\:d-bgg-to-purple-600:hover, .f\:d-bgg-to-purple-600:focus, .f\:d-bgg-to-purple-600:focus-within, .fv\:d-bgg-to-purple-600:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-blue-100, .h\:d-bgg-to-blue-100:hover, .f\:d-bgg-to-blue-100:focus, .f\:d-bgg-to-blue-100:focus-within, .fv\:d-bgg-to-blue-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-blue-200, .h\:d-bgg-to-blue-200:hover, .f\:d-bgg-to-blue-200:focus, .f\:d-bgg-to-blue-200:focus-within, .fv\:d-bgg-to-blue-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-blue-300, .h\:d-bgg-to-blue-300:hover, .f\:d-bgg-to-blue-300:focus, .f\:d-bgg-to-blue-300:focus-within, .fv\:d-bgg-to-blue-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-blue-400, .h\:d-bgg-to-blue-400:hover, .f\:d-bgg-to-blue-400:focus, .f\:d-bgg-to-blue-400:focus-within, .fv\:d-bgg-to-blue-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-blue-500, .h\:d-bgg-to-blue-500:hover, .f\:d-bgg-to-blue-500:focus, .f\:d-bgg-to-blue-500:focus-within, .fv\:d-bgg-to-blue-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-magenta-100, .h\:d-bgg-to-magenta-100:hover, .f\:d-bgg-to-magenta-100:focus, .f\:d-bgg-to-magenta-100:focus-within, .fv\:d-bgg-to-magenta-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-magenta-200, .h\:d-bgg-to-magenta-200:hover, .f\:d-bgg-to-magenta-200:focus, .f\:d-bgg-to-magenta-200:focus-within, .fv\:d-bgg-to-magenta-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-magenta-300, .h\:d-bgg-to-magenta-300:hover, .f\:d-bgg-to-magenta-300:focus, .f\:d-bgg-to-magenta-300:focus-within, .fv\:d-bgg-to-magenta-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-magenta-400, .h\:d-bgg-to-magenta-400:hover, .f\:d-bgg-to-magenta-400:focus, .f\:d-bgg-to-magenta-400:focus-within, .fv\:d-bgg-to-magenta-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-magenta-500, .h\:d-bgg-to-magenta-500:hover, .f\:d-bgg-to-magenta-500:focus, .f\:d-bgg-to-magenta-500:focus-within, .fv\:d-bgg-to-magenta-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-gold-100, .h\:d-bgg-to-gold-100:hover, .f\:d-bgg-to-gold-100:focus, .f\:d-bgg-to-gold-100:focus-within, .fv\:d-bgg-to-gold-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-gold-200, .h\:d-bgg-to-gold-200:hover, .f\:d-bgg-to-gold-200:focus, .f\:d-bgg-to-gold-200:focus-within, .fv\:d-bgg-to-gold-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-gold-300, .h\:d-bgg-to-gold-300:hover, .f\:d-bgg-to-gold-300:focus, .f\:d-bgg-to-gold-300:focus-within, .fv\:d-bgg-to-gold-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-gold-400, .h\:d-bgg-to-gold-400:hover, .f\:d-bgg-to-gold-400:focus, .f\:d-bgg-to-gold-400:focus-within, .fv\:d-bgg-to-gold-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-gold-500, .h\:d-bgg-to-gold-500:hover, .f\:d-bgg-to-gold-500:focus, .f\:d-bgg-to-gold-500:focus-within, .fv\:d-bgg-to-gold-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-green-100, .h\:d-bgg-to-green-100:hover, .f\:d-bgg-to-green-100:focus, .f\:d-bgg-to-green-100:focus-within, .fv\:d-bgg-to-green-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-green-200, .h\:d-bgg-to-green-200:hover, .f\:d-bgg-to-green-200:focus, .f\:d-bgg-to-green-200:focus-within, .fv\:d-bgg-to-green-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-green-300, .h\:d-bgg-to-green-300:hover, .f\:d-bgg-to-green-300:focus, .f\:d-bgg-to-green-300:focus-within, .fv\:d-bgg-to-green-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-green-400, .h\:d-bgg-to-green-400:hover, .f\:d-bgg-to-green-400:focus, .f\:d-bgg-to-green-400:focus-within, .fv\:d-bgg-to-green-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-green-500, .h\:d-bgg-to-green-500:hover, .f\:d-bgg-to-green-500:focus, .f\:d-bgg-to-green-500:focus-within, .fv\:d-bgg-to-green-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-red-100, .h\:d-bgg-to-red-100:hover, .f\:d-bgg-to-red-100:focus, .f\:d-bgg-to-red-100:focus-within, .fv\:d-bgg-to-red-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-red-200, .h\:d-bgg-to-red-200:hover, .f\:d-bgg-to-red-200:focus, .f\:d-bgg-to-red-200:focus-within, .fv\:d-bgg-to-red-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-red-300, .h\:d-bgg-to-red-300:hover, .f\:d-bgg-to-red-300:focus, .f\:d-bgg-to-red-300:focus-within, .fv\:d-bgg-to-red-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-red-400, .h\:d-bgg-to-red-400:hover, .f\:d-bgg-to-red-400:focus, .f\:d-bgg-to-red-400:focus-within, .fv\:d-bgg-to-red-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-red-500, .h\:d-bgg-to-red-500:hover, .f\:d-bgg-to-red-500:focus, .f\:d-bgg-to-red-500:focus-within, .fv\:d-bgg-to-red-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-tan-100, .h\:d-bgg-to-tan-100:hover, .f\:d-bgg-to-tan-100:focus, .f\:d-bgg-to-tan-100:focus-within, .fv\:d-bgg-to-tan-100:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-tan-200, .h\:d-bgg-to-tan-200:hover, .f\:d-bgg-to-tan-200:focus, .f\:d-bgg-to-tan-200:focus-within, .fv\:d-bgg-to-tan-200:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-tan-300, .h\:d-bgg-to-tan-300:hover, .f\:d-bgg-to-tan-300:focus, .f\:d-bgg-to-tan-300:focus-within, .fv\:d-bgg-to-tan-300:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-tan-400, .h\:d-bgg-to-tan-400:hover, .f\:d-bgg-to-tan-400:focus, .f\:d-bgg-to-tan-400:focus-within, .fv\:d-bgg-to-tan-400:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--bgg-to-opacity)) !important;
 }
 .d-bgg-to-tan-500, .h\:d-bgg-to-tan-500:hover, .f\:d-bgg-to-tan-500:focus, .f\:d-bgg-to-tan-500:focus-within, .fv\:d-bgg-to-tan-500:focus-visible {
   --bgg-to-opacity: 100%;
-  --bgg-to: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bgg-to-opacity)) !important;
+  --bgg-to: hsl(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--bgg-to-opacity)) !important;
 }
 .d-fco100, .h\:d-fco100:hover, .f\:d-fco100:focus, .f\:d-fco100:focus-within, .fv\:d-fco100:focus-visible {
   --fco: 100% !important;