@sanity/ui 3.0.0-static.4 → 3.0.0-static.6

package/dist/css.d.ts

@@ -1,5 +1,4 @@
 import {AvatarSize} from '@sanity/ui/theme'
-import {ColorHueKey} from '@sanity/color'
 import {ContainerWidth} from '@sanity/ui/theme'
 import {default as CSS_2} from 'csstype'
 import {FontCodeSize} from '@sanity/ui/theme'
@@ -7,19 +6,18 @@ import {FontHeadingSize} from '@sanity/ui/theme'
 import {FontLabelSize} from '@sanity/ui/theme'
 import {FontTextSize} from '@sanity/ui/theme'
 import {FontWeight} from '@sanity/ui/theme'
-import {Hue as Hue_2} from '@sanity/ui/theme'
+import {Hue} from '@sanity/ui/theme'
 import {Radius} from '@sanity/ui/theme'
 import {RootTheme} from '@sanity/ui/theme'
 import {Shadow} from '@sanity/ui/theme'
 import {Space} from '@sanity/ui/theme'
-import type {StyledObject} from 'styled-components'
-import {ThemeBoxShadow as ThemeBoxShadow_2} from '@sanity/ui/theme'
-import {ThemeColorAvatarColorKey as ThemeColorAvatarColorKey_2} from '@sanity/ui/theme'
-import {ThemeColorButtonModeKey as ThemeColorButtonModeKey_2} from '@sanity/ui/theme'
-import {ThemeColorCardToneKey as ThemeColorCardToneKey_2} from '@sanity/ui/theme'
-import {ThemeColorSchemeKey as ThemeColorSchemeKey_2} from '@sanity/ui/theme'
-import {ThemeColorStateToneKey as ThemeColorStateToneKey_2} from '@sanity/ui/theme'
-import {Tint as Tint_2} from '@sanity/ui/theme'
+import {ThemeBoxShadow} from '@sanity/ui/theme'
+import {ThemeColorAvatarColorKey} from '@sanity/ui/theme'
+import {ThemeColorButtonModeKey} from '@sanity/ui/theme'
+import {ThemeColorCardToneKey} from '@sanity/ui/theme'
+import {ThemeColorSchemeKey} from '@sanity/ui/theme'
+import {ThemeColorStateToneKey} from '@sanity/ui/theme'
+import {Tint} from '@sanity/ui/theme'
 
 export declare function animatedSpinnerIcon(): string | undefined
 
@@ -49,7 +47,7 @@ export declare type AvatarScopedVarName =
 export declare function avatarStack(props: {size?: AvatarStyleProps['size']}): string | undefined
 
 export declare interface AvatarStyleProps {
-  color: ThemeColorAvatarColorKey_2
+  color: ThemeColorAvatarColorKey
   size: ResponsiveProp<AvatarSize>
 }
 
@@ -58,7 +56,7 @@ export declare function badge(props: BadgeStyleProps): string | undefined
 
 /** @public */
 export declare interface BadgeStyleProps extends RadiusStyleProps {
-  tone: ThemeColorStateToneKey_2
+  tone: ThemeColorStateToneKey
 }
 
 /** @public */
@@ -126,91 +124,21 @@ export declare interface ButtonStyleProps
     FlexItemStyleProps,
     RadiusStyleProps,
     WidthStyleProps {
-  mode?: ThemeColorButtonModeKey_2
-  tone?: ThemeColorStateToneKey_2
+  mode?: ThemeColorButtonModeKey
+  tone?: ThemeColorStateToneKey
 }
 
 export declare function card(props: CardStyleProps): string | undefined
 
-/** @public */
-declare interface CardColorTokens {
-  _hue: Hue
-  avatar: Record<
-    Hue,
-    {
-      _hue: Hue
-      bg: [ColorToken, ColorToken]
-      fg: [ColorToken, ColorToken]
-    }
-  >
-  backdrop: [ColorToken, ColorToken]
-  focusRing: [ColorToken, ColorToken]
-  link: {
-    fg: [ColorToken, ColorToken]
-  }
-  shadow: {
-    outline: [ColorToken, ColorToken]
-    umbra: [ColorToken, ColorToken]
-    penumbra: [ColorToken, ColorToken]
-    ambient: [ColorToken, ColorToken]
-  }
-  skeleton: {
-    from: [ColorToken, ColorToken]
-    to: [ColorToken, ColorToken]
-  }
-  token: {
-    atrule: [ColorToken, ColorToken]
-    attrName: [ColorToken, ColorToken]
-    attrValue: [ColorToken, ColorToken]
-    attribute: [ColorToken, ColorToken]
-    boolean: [ColorToken, ColorToken]
-    builtin: [ColorToken, ColorToken]
-    cdata: [ColorToken, ColorToken]
-    char: [ColorToken, ColorToken]
-    class: [ColorToken, ColorToken]
-    className: [ColorToken, ColorToken]
-    comment: [ColorToken, ColorToken]
-    constant: [ColorToken, ColorToken]
-    deleted: [ColorToken, ColorToken]
-    doctype: [ColorToken, ColorToken]
-    entity: [ColorToken, ColorToken]
-    function: [ColorToken, ColorToken]
-    hexcode: [ColorToken, ColorToken]
-    id: [ColorToken, ColorToken]
-    important: [ColorToken, ColorToken]
-    inserted: [ColorToken, ColorToken]
-    keyword: [ColorToken, ColorToken]
-    number: [ColorToken, ColorToken]
-    operator: [ColorToken, ColorToken]
-    prolog: [ColorToken, ColorToken]
-    property: [ColorToken, ColorToken]
-    pseudoClass: [ColorToken, ColorToken]
-    pseudoElement: [ColorToken, ColorToken]
-    punctuation: [ColorToken, ColorToken]
-    regex: [ColorToken, ColorToken]
-    selector: [ColorToken, ColorToken]
-    string: [ColorToken, ColorToken]
-    symbol: [ColorToken, ColorToken]
-    tag: [ColorToken, ColorToken]
-    unit: [ColorToken, ColorToken]
-    url: [ColorToken, ColorToken]
-    variable: [ColorToken, ColorToken]
-  }
-  variant: {
-    solid: Record<'*' | ThemeColorStateToneKey, ElementColorTokens>
-    tinted: Record<'*' | ThemeColorStateToneKey, ElementColorTokens>
-  }
-}
-
 /** @public */
 export declare type CardScopedVarName =
   | `--color-accent-fg`
   | `--color-avatar-bg`
   | `--color-avatar-fg`
-  | `--color-avatar-${ThemeColorAvatarColorKey_2}-bg`
-  | `--color-avatar-${ThemeColorAvatarColorKey_2}-fg`
+  | `--color-avatar-${ThemeColorAvatarColorKey}-bg`
+  | `--color-avatar-${ThemeColorAvatarColorKey}-fg`
   | `--color-backdrop`
-  | `--color-${ElementColorVariant}-${ThemeColorStateToneKey_2}-${ElementColorVariantKey}`
+  | `--color-${ElementColorVariant}-${ThemeColorStateToneKey}-${ElementColorVariantKey}`
   | `--color-bg`
   | `--color-border`
   | `--color-code-bg`
@@ -291,8 +219,8 @@ export declare type CardScopedVarName =
 export declare interface CardStyleProps extends BoxStyleProps, ShadowStyleProps {
   checkered?: boolean
   selectable?: boolean
-  scheme?: ThemeColorSchemeKey_2
-  tone?: ThemeColorCardToneKey_2 | 'inherit'
+  scheme?: ThemeColorSchemeKey
+  tone?: ThemeColorCardToneKey | 'inherit'
 }
 
 export declare function checkbox(): string | undefined
@@ -329,7 +257,7 @@ export declare interface ColorAvatarColorVars {
 }
 
 /** @public */
-export declare type ColorAvatarVars = Record<ThemeColorAvatarColorKey_2, ColorAvatarColorVars>
+export declare type ColorAvatarVars = Record<ThemeColorAvatarColorKey, ColorAvatarColorVars>
 
 /** @public */
 export declare interface ColorBadgeToneVars {
@@ -340,120 +268,120 @@ export declare interface ColorBadgeToneVars {
 }
 
 /** @public */
-export declare type ColorBadgeVars = Record<ThemeColorStateToneKey_2, ColorBadgeToneVars>
+export declare type ColorBadgeVars = Record<ThemeColorStateToneKey, ColorBadgeToneVars>
 
 export declare type ColorCardToneScopedVarName =
-  | `--color-${ThemeColorCardToneKey_2}-accent-fg`
-  | `--color-${ThemeColorCardToneKey_2}-avatar-${ThemeColorAvatarColorKey_2}-bg`
-  | `--color-${ThemeColorCardToneKey_2}-avatar-${ThemeColorAvatarColorKey_2}-fg`
-  | `--color-${ThemeColorCardToneKey_2}-backdrop`
-  | `--color-${ThemeColorCardToneKey_2}-focus-ring`
-  | `--color-${ThemeColorCardToneKey_2}-link-fg`
-  | `--color-${ThemeColorCardToneKey_2}-muted-bg`
-  | `--color-${ThemeColorCardToneKey_2}-muted-fg`
-  | `--color-${ThemeColorCardToneKey_2}-${ElementColorVariant}-${ThemeColorStateToneKey_2}-${ElementColorVariantKey}`
-  | `--color-${ThemeColorCardToneKey_2}-shadow-outline`
-  | `--color-${ThemeColorCardToneKey_2}-shadow-umbra`
-  | `--color-${ThemeColorCardToneKey_2}-shadow-penumbra`
-  | `--color-${ThemeColorCardToneKey_2}-shadow-ambient`
-  | `--color-${ThemeColorCardToneKey_2}-skeleton-from`
-  | `--color-${ThemeColorCardToneKey_2}-skeleton-to`
-  | `--color-${ThemeColorCardToneKey_2}-token-atrule`
-  | `--color-${ThemeColorCardToneKey_2}-token-attr-name`
-  | `--color-${ThemeColorCardToneKey_2}-token-attr-value`
-  | `--color-${ThemeColorCardToneKey_2}-token-attribute`
-  | `--color-${ThemeColorCardToneKey_2}-token-boolean`
-  | `--color-${ThemeColorCardToneKey_2}-token-builtin`
-  | `--color-${ThemeColorCardToneKey_2}-token-cdata`
-  | `--color-${ThemeColorCardToneKey_2}-token-char`
-  | `--color-${ThemeColorCardToneKey_2}-token-class`
-  | `--color-${ThemeColorCardToneKey_2}-token-class-name`
-  | `--color-${ThemeColorCardToneKey_2}-token-comment`
-  | `--color-${ThemeColorCardToneKey_2}-token-constant`
-  | `--color-${ThemeColorCardToneKey_2}-token-deleted`
-  | `--color-${ThemeColorCardToneKey_2}-token-doctype`
-  | `--color-${ThemeColorCardToneKey_2}-token-entity`
-  | `--color-${ThemeColorCardToneKey_2}-token-function`
-  | `--color-${ThemeColorCardToneKey_2}-token-hexcode`
-  | `--color-${ThemeColorCardToneKey_2}-token-id`
-  | `--color-${ThemeColorCardToneKey_2}-token-important`
-  | `--color-${ThemeColorCardToneKey_2}-token-inserted`
-  | `--color-${ThemeColorCardToneKey_2}-token-keyword`
-  | `--color-${ThemeColorCardToneKey_2}-token-number`
-  | `--color-${ThemeColorCardToneKey_2}-token-operator`
-  | `--color-${ThemeColorCardToneKey_2}-token-prolog`
-  | `--color-${ThemeColorCardToneKey_2}-token-property`
-  | `--color-${ThemeColorCardToneKey_2}-token-pseudo-class`
-  | `--color-${ThemeColorCardToneKey_2}-token-pseudo-element`
-  | `--color-${ThemeColorCardToneKey_2}-token-punctuation`
-  | `--color-${ThemeColorCardToneKey_2}-token-regex`
-  | `--color-${ThemeColorCardToneKey_2}-token-selector`
-  | `--color-${ThemeColorCardToneKey_2}-token-string`
-  | `--color-${ThemeColorCardToneKey_2}-token-symbol`
-  | `--color-${ThemeColorCardToneKey_2}-token-tag`
-  | `--color-${ThemeColorCardToneKey_2}-token-unit`
-  | `--color-${ThemeColorCardToneKey_2}-token-url`
-  | `--color-${ThemeColorCardToneKey_2}-token-variable`
+  | `--color-${ThemeColorCardToneKey}-accent-fg`
+  | `--color-${ThemeColorCardToneKey}-avatar-${ThemeColorAvatarColorKey}-bg`
+  | `--color-${ThemeColorCardToneKey}-avatar-${ThemeColorAvatarColorKey}-fg`
+  | `--color-${ThemeColorCardToneKey}-backdrop`
+  | `--color-${ThemeColorCardToneKey}-focus-ring`
+  | `--color-${ThemeColorCardToneKey}-link-fg`
+  | `--color-${ThemeColorCardToneKey}-muted-bg`
+  | `--color-${ThemeColorCardToneKey}-muted-fg`
+  | `--color-${ThemeColorCardToneKey}-${ElementColorVariant}-${ThemeColorStateToneKey}-${ElementColorVariantKey}`
+  | `--color-${ThemeColorCardToneKey}-shadow-outline`
+  | `--color-${ThemeColorCardToneKey}-shadow-umbra`
+  | `--color-${ThemeColorCardToneKey}-shadow-penumbra`
+  | `--color-${ThemeColorCardToneKey}-shadow-ambient`
+  | `--color-${ThemeColorCardToneKey}-skeleton-from`
+  | `--color-${ThemeColorCardToneKey}-skeleton-to`
+  | `--color-${ThemeColorCardToneKey}-token-atrule`
+  | `--color-${ThemeColorCardToneKey}-token-attr-name`
+  | `--color-${ThemeColorCardToneKey}-token-attr-value`
+  | `--color-${ThemeColorCardToneKey}-token-attribute`
+  | `--color-${ThemeColorCardToneKey}-token-boolean`
+  | `--color-${ThemeColorCardToneKey}-token-builtin`
+  | `--color-${ThemeColorCardToneKey}-token-cdata`
+  | `--color-${ThemeColorCardToneKey}-token-char`
+  | `--color-${ThemeColorCardToneKey}-token-class`
+  | `--color-${ThemeColorCardToneKey}-token-class-name`
+  | `--color-${ThemeColorCardToneKey}-token-comment`
+  | `--color-${ThemeColorCardToneKey}-token-constant`
+  | `--color-${ThemeColorCardToneKey}-token-deleted`
+  | `--color-${ThemeColorCardToneKey}-token-doctype`
+  | `--color-${ThemeColorCardToneKey}-token-entity`
+  | `--color-${ThemeColorCardToneKey}-token-function`
+  | `--color-${ThemeColorCardToneKey}-token-hexcode`
+  | `--color-${ThemeColorCardToneKey}-token-id`
+  | `--color-${ThemeColorCardToneKey}-token-important`
+  | `--color-${ThemeColorCardToneKey}-token-inserted`
+  | `--color-${ThemeColorCardToneKey}-token-keyword`
+  | `--color-${ThemeColorCardToneKey}-token-number`
+  | `--color-${ThemeColorCardToneKey}-token-operator`
+  | `--color-${ThemeColorCardToneKey}-token-prolog`
+  | `--color-${ThemeColorCardToneKey}-token-property`
+  | `--color-${ThemeColorCardToneKey}-token-pseudo-class`
+  | `--color-${ThemeColorCardToneKey}-token-pseudo-element`
+  | `--color-${ThemeColorCardToneKey}-token-punctuation`
+  | `--color-${ThemeColorCardToneKey}-token-regex`
+  | `--color-${ThemeColorCardToneKey}-token-selector`
+  | `--color-${ThemeColorCardToneKey}-token-string`
+  | `--color-${ThemeColorCardToneKey}-token-symbol`
+  | `--color-${ThemeColorCardToneKey}-token-tag`
+  | `--color-${ThemeColorCardToneKey}-token-unit`
+  | `--color-${ThemeColorCardToneKey}-token-url`
+  | `--color-${ThemeColorCardToneKey}-token-variable`
 
 export declare type ColorCardVarName =
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-accent-fg`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-avatar-${ThemeColorAvatarColorKey_2}-bg`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-avatar-${ThemeColorAvatarColorKey_2}-fg`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-backdrop`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-focus-ring`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-link-fg`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-muted-bg`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-muted-fg`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-${ElementColorVariant}-${ThemeColorStateToneKey_2}-${ElementColorVariantKey}`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-shadow-outline`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-shadow-umbra`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-shadow-penumbra`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-shadow-ambient`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-skeleton-from`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-skeleton-to`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-atrule`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-attr-name`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-attr-value`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-attribute`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-boolean`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-builtin`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-cdata`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-char`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-class`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-class-name`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-comment`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-constant`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-deleted`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-doctype`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-entity`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-function`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-hexcode`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-id`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-important`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-inserted`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-keyword`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-number`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-operator`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-prolog`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-property`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-pseudo-class`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-pseudo-element`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-punctuation`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-regex`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-selector`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-string`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-symbol`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-tag`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-unit`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-url`
-  | `--color-${ThemeColorSchemeKey_2}-${ThemeColorCardToneKey_2}-token-variable`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-accent-fg`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-avatar-${ThemeColorAvatarColorKey}-bg`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-avatar-${ThemeColorAvatarColorKey}-fg`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-backdrop`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-focus-ring`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-link-fg`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-muted-bg`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-muted-fg`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-${ElementColorVariant}-${ThemeColorStateToneKey}-${ElementColorVariantKey}`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-shadow-outline`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-shadow-umbra`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-shadow-penumbra`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-shadow-ambient`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-skeleton-from`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-skeleton-to`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-atrule`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-attr-name`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-attr-value`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-attribute`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-boolean`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-builtin`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-cdata`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-char`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-class`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-class-name`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-comment`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-constant`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-deleted`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-doctype`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-entity`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-function`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-hexcode`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-id`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-important`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-inserted`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-keyword`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-number`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-operator`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-prolog`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-property`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-pseudo-class`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-pseudo-element`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-punctuation`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-regex`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-selector`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-string`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-symbol`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-tag`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-unit`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-url`
+  | `--color-${ThemeColorSchemeKey}-${ThemeColorCardToneKey}-token-variable`
 
 /** @public */
 export declare interface ColorCardVarNames {
   accent: {
     fg: VarName
   }
-  avatar: Record<ThemeColorAvatarColorKey_2, ColorAvatarColorVarNames>
+  avatar: Record<ThemeColorAvatarColorKey, ColorAvatarColorVarNames>
   backdrop: VarName
   focusRing: VarName
   link: {
@@ -644,40 +572,21 @@ export declare interface ColorInputStateVars {
 }
 
 /** @public */
-export declare type ColorSchemeVarNames = Record<ThemeColorCardToneKey_2, ColorCardVarNames>
-
-/** @public */
-export declare interface ColorSchemeVars extends Record<ThemeColorCardToneKey_2, ColorCardVars> {}
-
-/** @public */
-declare type ColorToken =
-  | `black`
-  | `black/${ColorTokenOpacityValue}`
-  | `white`
-  | `white/${ColorTokenOpacityValue}`
-  | `${Hue}/${Tint}`
-  | `${Hue}/${Tint}/${ColorTokenOpacityValue}`
-  | `${Hue}/${Tint} ${number}%`
-  | `${Tint}`
-  | `${Tint}/${ColorTokenOpacityValue}`
-  | `${Tint} ${number}%`
-
-/** @public */
-declare type ColorTokenOpacityValue = `0` | `0.${number}` | `1`
+export declare type ColorSchemeVarNames = Record<ThemeColorCardToneKey, ColorCardVarNames>
 
 /** @public */
-declare type ColorTokens = Record<'*' | ThemeColorCardToneKey, CardColorTokens>
+export declare interface ColorSchemeVars extends Record<ThemeColorCardToneKey, ColorCardVars> {}
 
 export declare interface ColorVariantVarNames
   extends ColorElementVarNames,
-    Record<ThemeColorStateToneKey_2, ColorElementVarNames> {}
+    Record<ThemeColorStateToneKey, ColorElementVarNames> {}
 
 /** @public */
 export declare interface ColorVariantVars
-  extends Record<ThemeColorStateToneKey_2, ColorElementVars>,
+  extends Record<ThemeColorStateToneKey, ColorElementVars>,
     ColorElementVars {}
 
-export declare type Columns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 12
+export declare type Columns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12
 
 export declare function compilePalette(): string
 
@@ -696,13 +605,6 @@ export declare interface ContainerStyleProps {
   width?: ResponsiveProp<ContainerWidth>
 }
 
-/**
- * Work around types that are missing in `styled-components@6`
- * https://github.com/styled-components/styled-components/issues/4062
- * @internal
- */
-declare type CSSObject = StyledObject<any>
-
 /** @public */
 export declare type CSSVar = `var(${VarName})`
 
@@ -741,23 +643,6 @@ export declare interface DisplayStyleProps {
   display?: ResponsiveProp<Display>
 }
 
-/** @public */
-declare interface ElementColorTokens {
-  _hue: Hue
-  bg: {
-    0: [ColorToken, ColorToken]
-    4: [ColorToken, ColorToken]
-  }
-  border: {
-    0: [ColorToken, ColorToken]
-    4: [ColorToken, ColorToken]
-  }
-  fg: {
-    0: [ColorToken, ColorToken]
-    4: [ColorToken, ColorToken]
-  }
-}
-
 /** @public */
 export declare type ElementColorVariant = 'solid' | 'tinted'
 
@@ -995,20 +880,6 @@ export declare interface HeightStyleProps {
   height?: ResponsiveProp<BoxHeight>
 }
 
-declare type Hue = (typeof HUES)[number]
-
-declare const HUES: readonly [
-  'gray',
-  'blue',
-  'purple',
-  'magenta',
-  'red',
-  'orange',
-  'yellow',
-  'green',
-  'cyan',
-]
-
 /** @internal */
 export declare function _input(props: InputStyleProps): string | undefined
 
@@ -1082,13 +953,13 @@ export declare interface LabelStyleProps extends FontStyleProps {
 
 export declare type LegacyCardScopedVarName =
   | `--card-accent-fg-color`
-  | `--card-avatar-${ThemeColorAvatarColorKey_2}-bg-color`
-  | `--card-avatar-${ThemeColorAvatarColorKey_2}-fg-color`
+  | `--card-avatar-${ThemeColorAvatarColorKey}-bg-color`
+  | `--card-avatar-${ThemeColorAvatarColorKey}-fg-color`
   | `--card-backdrop-color`
-  | `--card-badge-${ThemeColorStateToneKey_2}-bg-color`
-  | `--card-badge-${ThemeColorStateToneKey_2}-dot-color`
-  | `--card-badge-${ThemeColorStateToneKey_2}-fg-color`
-  | `--card-badge-${ThemeColorStateToneKey_2}-icon-color`
+  | `--card-badge-${ThemeColorStateToneKey}-bg-color`
+  | `--card-badge-${ThemeColorStateToneKey}-dot-color`
+  | `--card-badge-${ThemeColorStateToneKey}-fg-color`
+  | `--card-badge-${ThemeColorStateToneKey}-icon-color`
   | `--card-bg-color`
   | `--card-bg-image`
   | `--card-bg2-color`
@@ -1159,7 +1030,7 @@ export declare interface PaddingStyleProps {
 }
 
 /** @public */
-export declare type PaletteVarName = `--black` | `--white` | `--${Hue_2}-${Tint_2}`
+export declare type PaletteVarName = `--black` | `--white` | `--${Hue}-${Tint}`
 
 /** @public */
 export declare type PointerEvents = 'auto' | 'none'
@@ -1216,42 +1087,7 @@ export declare function rem(value: number): string
 /** @public */
 export declare type ResponsiveProp<T> = T | Array<T | null | undefined>
 
-/**
- * @public
- */
-declare interface RootTheme_v2 {
-  _version: 2
-  avatar: ThemeAvatar_v2
-  button: {
-    border: {
-      width: number
-    }
-    focusRing: ThemeFocusRing
-    textWeight: ThemeFontWeightKey
-  }
-  card: {
-    border: {
-      width: number
-    }
-    focusRing: ThemeFocusRing
-    shadow: {
-      outline: number
-    }
-  }
-  color: ThemeColorSchemes_v2
-  container: number[]
-  font: ThemeFonts
-  input: ThemeInput_v2
-  layer: ThemeLayer
-  media: number[]
-  radius: number[]
-  shadow: Array<ThemeShadow | null>
-  space: number[]
-  /** @internal */
-  style?: ThemeStyles
-}
-
-export declare type Rows = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 12
+export declare type Rows = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12
 
 /** @public */
 export declare interface Rules {
@@ -1264,7 +1100,7 @@ export declare interface ScopedColorVarNames extends Omit<ColorCardVarNames, 'av
   accent: {
     fg: VarName
   }
-  avatar: Record<ThemeColorAvatarColorKey_2, ColorAvatarColorVarNames> & ColorAvatarColorVarNames
+  avatar: Record<ThemeColorAvatarColorKey, ColorAvatarColorVarNames> & ColorAvatarColorVarNames
   bg: VarName
   border: VarName
   fg: VarName
@@ -1296,7 +1132,7 @@ export declare function _selectable(props: SelectableStyleProps): string | undef
 
 /** @internal */
 export declare interface SelectableStyleProps extends RadiusStyleProps {
-  tone?: ThemeColorStateToneKey_2
+  tone?: ThemeColorStateToneKey
 }
 
 export declare function selectPresentation(): string | undefined
@@ -1321,6 +1157,9 @@ export declare function spinner(): string | undefined
 
 export declare function srOnly(): string | undefined
 
+/** @public */
+export declare function stack(): string | undefined
+
 /** @public */
 export declare type Style = {
   keyframes?: StyleKeyframes
@@ -1401,542 +1240,6 @@ export declare interface TextStyleProps extends FlexItemStyleProps, FontStylePro
   size?: ResponsiveProp<TextSize>
 }
 
-/** @public */
-declare const THEME_COLOR_AVATAR_COLORS: ColorHueKey[]
-
-/** @public */
-declare const THEME_COLOR_BLEND_MODES: readonly ['multiply', 'screen']
-
-/** @public */
-declare const THEME_COLOR_BUTTON_MODES: readonly ['default', 'ghost', 'bleed']
-
-/** @public */
-declare const THEME_COLOR_CARD_TONES: readonly [
-  'transparent',
-  'default',
-  'neutral',
-  'primary',
-  'suggest',
-  'positive',
-  'caution',
-  'critical',
-]
-
-/** @public */
-declare const THEME_COLOR_INPUT_MODES: readonly ['default', 'invalid']
-
-/** @public */
-declare const THEME_COLOR_INPUT_STATES: readonly ['enabled', 'hovered', 'readOnly', 'disabled']
-
-/** @public */
-declare const THEME_COLOR_SCHEMES: readonly ['light', 'dark']
-
-/** @public */
-declare const THEME_COLOR_STATE_TONES: readonly [
-  'default',
-  'neutral',
-  'primary',
-  'suggest',
-  'positive',
-  'caution',
-  'critical',
-]
-
-/** @public */
-declare const THEME_COLOR_STATES: readonly ['enabled', 'hovered', 'pressed', 'selected', 'disabled']
-
-/**
- * Supersedes `RootTheme` and `RootTheme_v2`.
- *
- * @public
- */
-declare interface Theme_v3 {
-  _version: 3
-  _tokens: Tokens
-  avatar: ThemeAvatar_v2
-  button: {
-    border: {
-      width: number
-    }
-    focusRing: ThemeFocusRing
-    textWeight: ThemeFontWeightKey
-  }
-  card: {
-    border: {
-      width: number
-    }
-    focusRing: ThemeFocusRing
-    shadow: {
-      outline: number
-    }
-  }
-  color: ThemeColor_v3
-  container: number[]
-  font: ThemeFonts
-  input: ThemeInput_v2
-  layer: ThemeLayer
-  media: number[]
-  radius: number[]
-  shadow: Array<ThemeShadow | null>
-  space: number[]
-}
-
-/**
- * @public
- */
-declare interface ThemeAvatar_v2 {
-  sizes: {
-    /** Spacing between avatars in an <AvatarStack> component (px) */
-    distance: number
-    /** Diameter of the avatar (px) */
-    size: number
-  }[]
-  focusRing: ThemeFocusRing
-}
-
-/**
- * @public
- */
-declare type ThemeBoxShadow = [number, number, number, number]
-
-declare type ThemeColor_v3 = Record<ThemeColorSchemeKey, ThemeColorScheme_v3>
-
-/**
- * @public
- */
-declare type ThemeColorAvatar_v2 = Record<ThemeColorAvatarColorKey, ThemeColorAvatarHue_v2>
-
-/** @public */
-declare type ThemeColorAvatarColorKey = (typeof THEME_COLOR_AVATAR_COLORS)[number]
-
-/**
- * @public
- */
-declare interface ThemeColorAvatarHue_v2 {
-  _blend?: ThemeColorBlendModeKey
-  bg: string
-  fg: string
-}
-
-/**
- * @public
- */
-declare type ThemeColorBadge_v2 = Record<ThemeColorStateToneKey, ThemeColorBadgeTone_v2>
-
-/**
- * @public
- */
-declare interface ThemeColorBadgeTone_v2 {
-  bg: string
-  fg: string
-  dot: string
-  icon: string
-}
-
-/** @public */
-declare type ThemeColorBlendModeKey = (typeof THEME_COLOR_BLEND_MODES)[number]
-
-/**
- * @public
- */
-declare type ThemeColorButton_v2 = Record<ThemeColorButtonModeKey, ThemeColorButtonMode_v2>
-
-/**
- * @public
- */
-declare type ThemeColorButtonMode_v2 = Record<ThemeColorStateToneKey, ThemeColorButtonTone_v2>
-
-/** @public */
-declare type ThemeColorButtonModeKey = (typeof THEME_COLOR_BUTTON_MODES)[number]
-
-/**
- * @public
- */
-declare type ThemeColorButtonTone_v2 = Record<ThemeColorStateKey, ThemeColorState_v2>
-
-/**
- * @public
- */
-declare interface ThemeColorCard_v2 extends ThemeColorState_v2 {
-  /** @internal */
-  _blend: ThemeColorBlendModeKey
-  _dark: boolean
-  backdrop: string
-  button: ThemeColorButton_v2
-  focusRing: string
-  input: ThemeColorInput_v2
-  selectable: ThemeColorSelectable_v2
-  shadow: ThemeColorShadow
-  syntax: ThemeColorSyntax
-}
-
-declare interface ThemeColorCard_v3 {
-  _hue: Hue
-  avatar: ThemeColorAvatar_v2
-  backdrop: string
-  focusRing: string
-  shadow: {
-    outline: string
-    umbra: string
-    penumbra: string
-    ambient: string
-  }
-  token: {
-    atrule: string
-    attrName: string
-    attrValue: string
-    attribute: string
-    boolean: string
-    builtin: string
-    cdata: string
-    char: string
-    class: string
-    className: string
-    comment: string
-    constant: string
-    deleted: string
-    doctype: string
-    entity: string
-    function: string
-    hexcode: string
-    id: string
-    important: string
-    inserted: string
-    keyword: string
-    number: string
-    operator: string
-    prolog: string
-    property: string
-    pseudoClass: string
-    pseudoElement: string
-    punctuation: string
-    regex: string
-    selector: string
-    string: string
-    symbol: string
-    tag: string
-    unit: string
-    url: string
-    variable: string
-  }
-  skeleton: {
-    from: string
-    to: string
-  }
-  variant: Record<ThemeColorVariantKey, ThemeColorVariant>
-}
-
-/** @public */
-declare type ThemeColorCardToneKey = (typeof THEME_COLOR_CARD_TONES)[number]
-
-declare interface ThemeColorElement {
-  _hue: Hue
-  bg: {
-    0: string
-    4: string
-  }
-  border: {
-    0: string
-    4: string
-  }
-  fg: {
-    0: string
-    4: string
-  }
-}
-
-/**
- * @public
- */
-declare type ThemeColorInput_v2 = Record<ThemeColorInputModeKey, ThemeColorInputMode_v2>
-
-/**
- * @public
- */
-declare type ThemeColorInputMode_v2 = Record<ThemeColorInputStateKey, ThemeColorInputState_v2>
-
-/** @public */
-declare type ThemeColorInputModeKey = (typeof THEME_COLOR_INPUT_MODES)[number]
-
-/**
- * @public
- */
-declare interface ThemeColorInputState_v2 {
-  _blend?: ThemeColorBlendModeKey
-  bg: string
-  border: string
-  fg: string
-  muted: {
-    bg: string
-  }
-  placeholder: string
-}
-
-/** @public */
-declare type ThemeColorInputStateKey = (typeof THEME_COLOR_INPUT_STATES)[number]
-
-/**
- * @public
- */
-declare interface ThemeColorKBD {
-  bg: string
-  fg: string
-  border: string
-}
-
-/**
- * @public
- */
-declare type ThemeColorScheme_v2 = Record<ThemeColorCardToneKey, ThemeColorCard_v2>
-
-declare interface ThemeColorScheme_v3 {
-  card: Record<ThemeColorCardToneKey, ThemeColorCard_v3>
-}
-
-/**
- * @public
- */
-declare type ThemeColorSchemeKey = (typeof THEME_COLOR_SCHEMES)[number]
-
-/**
- * @public
- */
-declare type ThemeColorSchemes_v2 = Record<ThemeColorSchemeKey, ThemeColorScheme_v2>
-
-/**
- * @public
- */
-declare type ThemeColorSelectable_v2 = Record<ThemeColorStateToneKey, ThemeColorSelectableTone_v2>
-
-/**
- * @public
- */
-declare type ThemeColorSelectableTone_v2 = Record<ThemeColorStateKey, ThemeColorState_v2>
-
-/** @public */
-declare interface ThemeColorShadow {
-  outline: string
-  umbra: string
-  penumbra: string
-  ambient: string
-}
-
-/**
- * @public
- */
-declare interface ThemeColorState_v2 {
-  /** @internal */
-  _blend?: ThemeColorBlendModeKey
-  accent: {
-    fg: string
-  }
-  /**
-   * @internal  This may be removed in a future release
-   * */
-  avatar: ThemeColorAvatar_v2
-  /**
-   * @internal  This may be removed in a future release
-   * */
-  badge: ThemeColorBadge_v2
-  bg: string
-  border: string
-  code: {
-    bg: string
-    fg: string
-  }
-  fg: string
-  icon: string
-  kbd: ThemeColorKBD
-  link: {
-    fg: string
-  }
-  muted: {
-    bg: string
-    fg: string
-  }
-  skeleton: {
-    from: string
-    to: string
-  }
-}
-
-/** @public */
-declare type ThemeColorStateKey = (typeof THEME_COLOR_STATES)[number]
-
-/** @public */
-declare type ThemeColorStateToneKey = (typeof THEME_COLOR_STATE_TONES)[number]
-
-/**
- * @public
- */
-declare interface ThemeColorSyntax {
-  atrule: string
-  attrName: string
-  attrValue: string
-  attribute: string
-  boolean: string
-  builtin: string
-  cdata: string
-  char: string
-  class: string
-  className: string
-  comment: string
-  constant: string
-  deleted: string
-  doctype: string
-  entity: string
-  function: string
-  hexcode: string
-  id: string
-  important: string
-  inserted: string
-  keyword: string
-  number: string
-  operator: string
-  prolog: string
-  property: string
-  pseudoClass: string
-  pseudoElement: string
-  punctuation: string
-  regex: string
-  selector: string
-  string: string
-  symbol: string
-  tag: string
-  unit: string
-  url: string
-  variable: string
-}
-
-declare type ThemeColorVariant = Record<ThemeColorStateToneKey, ThemeColorElement>
-
-declare type ThemeColorVariantKey = 'tinted' | 'solid'
-
-/**
- * @public
- */
-declare interface ThemeFocusRing {
-  offset: number
-  width: number
-}
-
-/**
- * @public
- */
-declare interface ThemeFont {
-  family: string
-  featureSettings?: string
-  weights: ThemeFontWeight
-  sizes: ThemeFontSize[]
-  /** @deprecated No longer supported. */
-  horizontalOffset?: number
-}
-
-/**
- * @public
- */
-declare interface ThemeFonts {
-  code: ThemeFont
-  heading: ThemeFont
-  label: ThemeFont
-  text: ThemeFont
-}
-
-/**
- * @public
- */
-declare interface ThemeFontSize {
-  ascenderHeight: number
-  descenderHeight: number
-  fontSize: number
-  iconSize: number
-  letterSpacing: number
-  lineHeight: number
-}
-
-/**
- * @public
- */
-declare interface ThemeFontWeight {
-  regular: number
-  medium: number
-  semibold: number
-  bold: number
-}
-
-/**
- * @public
- */
-declare type ThemeFontWeightKey = 'regular' | 'medium' | 'semibold' | 'bold'
-
-/**
- * @public
- */
-declare interface ThemeInput_v2 {
-  checkbox: {
-    size: number
-    focusRing: ThemeFocusRing
-  }
-  radio: {
-    size: number
-    markSize: number
-    focusRing: ThemeFocusRing
-  }
-  switch: {
-    width: number
-    height: number
-    padding: number
-    transitionDurationMs: number
-    transitionTimingFunction: string
-    focusRing: ThemeFocusRing
-  }
-  border: {
-    width: number
-  }
-  select: {
-    focusRing: ThemeFocusRing
-  }
-  text: {
-    focusRing: ThemeFocusRing
-  }
-}
-
-/**
- * @public
- */
-declare interface ThemeLayer {
-  dialog: {
-    zOffset: number
-  }
-  popover: {
-    zOffset: number
-  }
-  tooltip: {
-    zOffset: number
-  }
-}
-
-/**
- * @public
- */
-declare interface ThemeShadow {
-  umbra: ThemeBoxShadow
-  penumbra: ThemeBoxShadow
-  ambient: ThemeBoxShadow
-}
-
-/**
- * @internal
- */
-declare interface ThemeStyles {
-  button?: {
-    root?: CSSObject
-  }
-  card?: {
-    root?: CSSObject
-  }
-}
-
 /** @public */
 export declare type ThemeVarName =
   | `--avatar-focus-ring-offset`
@@ -2015,10 +1318,6 @@ export declare type ThemeVarName =
   | `--shadow-${Shadow}-penumbra`
   | `--shadow-${Shadow}-ambient`
 
-declare type Tint = (typeof TINTS)[number]
-
-declare const TINTS: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
-
 export declare function toast(): string | undefined
 
 export declare function toastLayer(): string | undefined
@@ -2029,12 +1328,7 @@ export declare function toastLoadingBarMask(): string | undefined
 
 export declare function toastLoadingBarProgress(): string | undefined
 
-export declare function toBoxShadow(value: ThemeBoxShadow_2 | undefined): string
-
-/** @public */
-declare interface Tokens {
-  color: ColorTokens
-}
+export declare function toBoxShadow(value: ThemeBoxShadow | undefined): string
 
 export declare function tooltip(): string | undefined
 
@@ -2042,8 +1336,6 @@ export declare function tooltipCard(): string | undefined
 
 export declare function treeItem(): string | undefined
 
-export declare function v3_v2(theme_v3: Theme_v3): RootTheme_v2
-
 /** @public */
 export declare type VarName =
   | AvatarScopedVarName
@@ -2060,9 +1352,9 @@ export declare type VarName =
 
 /** @public */
 export declare interface VarNames {
-  color: Record<ThemeColorSchemeKey_2, ColorSchemeVarNames> &
+  color: Record<ThemeColorSchemeKey, ColorSchemeVarNames> &
     ScopedColorVarNames &
-    Record<ThemeColorCardToneKey_2, ColorCardVarNames>
+    Record<ThemeColorCardToneKey, ColorCardVarNames>
   container: Record<Exclude<ContainerWidth, 'auto'>, VarName>
   avatar: {
     distance: VarName
@@ -2117,7 +1409,7 @@ export declare interface Vars {
     dark: ColorSchemeVars
     light: ColorSchemeVars
   } & ScopedColorVars &
-    Record<ThemeColorCardToneKey_2, ColorCardVars>
+    Record<ThemeColorCardToneKey, ColorCardVars>
   container: Record<Exclude<ContainerWidth, 'auto'>, CSSVar>
   font: {
     code: FontVars<FontCodeSize>