diff --git a/packages/tokens/dist/devdot/css/helpers/typography.css b/packages/tokens/dist/devdot/css/helpers/typography.css
index 393b8900901..c0913ef1a67 100644
--- a/packages/tokens/dist/devdot/css/helpers/typography.css
+++ b/packages/tokens/dist/devdot/css/helpers/typography.css
@@ -5,10 +5,10 @@
 .hds-font-family-sans-display { font-family: var(--token-typography-font-stack-display); }
 .hds-font-family-sans-text { font-family: var(--token-typography-font-stack-text); }
 .hds-font-family-mono-code { font-family: var(--token-typography-font-stack-code); }
-.hds-font-weight-regular { font-weight: 400; }
-.hds-font-weight-medium { font-weight: 500; }
-.hds-font-weight-semibold { font-weight: 600; }
-.hds-font-weight-bold { font-weight: 700; }
+.hds-font-weight-regular { font-weight: var(--token-typography-font-weight-regular); }
+.hds-font-weight-medium { font-weight: var(--token-typography-font-weight-medium); }
+.hds-font-weight-semibold { font-weight: var(--token-typography-font-weight-semibold); }
+.hds-font-weight-bold { font-weight: var(--token-typography-font-weight-bold); }
 .hds-typography-display-500 { font-family: var(--token-typography-display-500-font-family); font-size: var(--token-typography-display-500-font-size); line-height: var(--token-typography-display-500-line-height); margin: 0; padding: 0; }
 .hds-typography-display-400 { font-family: var(--token-typography-display-400-font-family); font-size: var(--token-typography-display-400-font-size); line-height: var(--token-typography-display-400-line-height); margin: 0; padding: 0; }
 .hds-typography-display-300 { font-family: var(--token-typography-display-300-font-family); font-size: var(--token-typography-display-300-font-size); line-height: var(--token-typography-display-300-line-height); margin: 0; padding: 0; }
diff --git a/packages/tokens/dist/docs/products/themed-tokens.json b/packages/tokens/dist/docs/products/themed-tokens.json
new file mode 100644
index 00000000000..abccdddf34c
--- /dev/null
+++ b/packages/tokens/dist/docs/products/themed-tokens.json
@@ -0,0 +1,41762 @@
+{
+  "default": {
+    "token-border-radius-x-small": {
+      "key": "{border.radius.x-small}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{border.radius.x-small}"
+      },
+      "name": "token-border-radius-x-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "x-small"
+      ]
+    },
+    "token-border-radius-small": {
+      "key": "{border.radius.small}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{border.radius.small}"
+      },
+      "name": "token-border-radius-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "small"
+      ]
+    },
+    "token-border-radius-medium": {
+      "key": "{border.radius.medium}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{border.radius.medium}"
+      },
+      "name": "token-border-radius-medium",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "medium"
+      ]
+    },
+    "token-border-radius-large": {
+      "key": "{border.radius.large}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{border.radius.large}"
+      },
+      "name": "token-border-radius-large",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "large"
+      ]
+    },
+    "token-color-palette-blue-500": {
+      "key": "{color.palette.blue-500}",
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1c345f",
+        "group": "palette",
+        "key": "{color.palette.blue-500}"
+      },
+      "name": "token-color-palette-blue-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-500"
+      ]
+    },
+    "token-color-palette-blue-400": {
+      "key": "{color.palette.blue-400}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0046d1",
+        "group": "palette",
+        "key": "{color.palette.blue-400}"
+      },
+      "name": "token-color-palette-blue-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-400"
+      ]
+    },
+    "token-color-palette-blue-300": {
+      "key": "{color.palette.blue-300}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c56e9",
+        "group": "palette",
+        "key": "{color.palette.blue-300}"
+      },
+      "name": "token-color-palette-blue-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-300"
+      ]
+    },
+    "token-color-palette-blue-200": {
+      "key": "{color.palette.blue-200}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1060ff",
+        "group": "palette",
+        "key": "{color.palette.blue-200}"
+      },
+      "name": "token-color-palette-blue-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-200"
+      ]
+    },
+    "token-color-palette-blue-100": {
+      "key": "{color.palette.blue-100}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cce3fe",
+        "group": "palette",
+        "key": "{color.palette.blue-100}"
+      },
+      "name": "token-color-palette-blue-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-100"
+      ]
+    },
+    "token-color-palette-blue-50": {
+      "key": "{color.palette.blue-50}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2f8ff",
+        "group": "palette",
+        "key": "{color.palette.blue-50}"
+      },
+      "name": "token-color-palette-blue-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-50"
+      ]
+    },
+    "token-color-palette-purple-500": {
+      "key": "{color.palette.purple-500}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#42215b",
+        "group": "palette",
+        "key": "{color.palette.purple-500}"
+      },
+      "name": "token-color-palette-purple-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-500"
+      ]
+    },
+    "token-color-palette-purple-400": {
+      "key": "{color.palette.purple-400}",
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#7b00db",
+        "group": "palette",
+        "key": "{color.palette.purple-400}"
+      },
+      "name": "token-color-palette-purple-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-400"
+      ]
+    },
+    "token-color-palette-purple-300": {
+      "key": "{color.palette.purple-300}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#911ced",
+        "group": "palette",
+        "key": "{color.palette.purple-300}"
+      },
+      "name": "token-color-palette-purple-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-300"
+      ]
+    },
+    "token-color-palette-purple-200": {
+      "key": "{color.palette.purple-200}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#a737ff",
+        "group": "palette",
+        "key": "{color.palette.purple-200}"
+      },
+      "name": "token-color-palette-purple-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-200"
+      ]
+    },
+    "token-color-palette-purple-100": {
+      "key": "{color.palette.purple-100}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#ead2fe",
+        "group": "palette",
+        "key": "{color.palette.purple-100}"
+      },
+      "name": "token-color-palette-purple-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-100"
+      ]
+    },
+    "token-color-palette-purple-50": {
+      "key": "{color.palette.purple-50}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f9f2ff",
+        "group": "palette",
+        "key": "{color.palette.purple-50}"
+      },
+      "name": "token-color-palette-purple-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-50"
+      ]
+    },
+    "token-color-palette-green-500": {
+      "key": "{color.palette.green-500}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#054220",
+        "group": "palette",
+        "key": "{color.palette.green-500}"
+      },
+      "name": "token-color-palette-green-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-500"
+      ]
+    },
+    "token-color-palette-green-400": {
+      "key": "{color.palette.green-400}",
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#006619",
+        "group": "palette",
+        "key": "{color.palette.green-400}"
+      },
+      "name": "token-color-palette-green-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-400"
+      ]
+    },
+    "token-color-palette-green-300": {
+      "key": "{color.palette.green-300}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#00781e",
+        "group": "palette",
+        "key": "{color.palette.green-300}"
+      },
+      "name": "token-color-palette-green-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-300"
+      ]
+    },
+    "token-color-palette-green-200": {
+      "key": "{color.palette.green-200}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#008a22",
+        "group": "palette",
+        "key": "{color.palette.green-200}"
+      },
+      "name": "token-color-palette-green-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-200"
+      ]
+    },
+    "token-color-palette-green-100": {
+      "key": "{color.palette.green-100}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cceeda",
+        "group": "palette",
+        "key": "{color.palette.green-100}"
+      },
+      "name": "token-color-palette-green-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-100"
+      ]
+    },
+    "token-color-palette-green-50": {
+      "key": "{color.palette.green-50}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2fbf6",
+        "group": "palette",
+        "key": "{color.palette.green-50}"
+      },
+      "name": "token-color-palette-green-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-50"
+      ]
+    },
+    "token-color-palette-amber-500": {
+      "key": "{color.palette.amber-500}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#542800",
+        "group": "palette",
+        "key": "{color.palette.amber-500}"
+      },
+      "name": "token-color-palette-amber-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-500"
+      ]
+    },
+    "token-color-palette-amber-400": {
+      "key": "{color.palette.amber-400}",
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#803d00",
+        "group": "palette",
+        "key": "{color.palette.amber-400}"
+      },
+      "name": "token-color-palette-amber-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-400"
+      ]
+    },
+    "token-color-palette-amber-300": {
+      "key": "{color.palette.amber-300}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#9e4b00",
+        "group": "palette",
+        "key": "{color.palette.amber-300}"
+      },
+      "name": "token-color-palette-amber-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-300"
+      ]
+    },
+    "token-color-palette-amber-200": {
+      "key": "{color.palette.amber-200}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#bb5a00",
+        "group": "palette",
+        "key": "{color.palette.amber-200}"
+      },
+      "name": "token-color-palette-amber-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-200"
+      ]
+    },
+    "token-color-palette-amber-100": {
+      "key": "{color.palette.amber-100}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbeabf",
+        "group": "palette",
+        "key": "{color.palette.amber-100}"
+      },
+      "name": "token-color-palette-amber-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-100"
+      ]
+    },
+    "token-color-palette-amber-50": {
+      "key": "{color.palette.amber-50}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9e8",
+        "group": "palette",
+        "key": "{color.palette.amber-50}"
+      },
+      "name": "token-color-palette-amber-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-50"
+      ]
+    },
+    "token-color-palette-red-500": {
+      "key": "{color.palette.red-500}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#51130a",
+        "group": "palette",
+        "key": "{color.palette.red-500}"
+      },
+      "name": "token-color-palette-red-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-500"
+      ]
+    },
+    "token-color-palette-red-400": {
+      "key": "{color.palette.red-400}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#940004",
+        "group": "palette",
+        "key": "{color.palette.red-400}"
+      },
+      "name": "token-color-palette-red-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-400"
+      ]
+    },
+    "token-color-palette-red-300": {
+      "key": "{color.palette.red-300}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c00005",
+        "group": "palette",
+        "key": "{color.palette.red-300}"
+      },
+      "name": "token-color-palette-red-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-300"
+      ]
+    },
+    "token-color-palette-red-200": {
+      "key": "{color.palette.red-200}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#e52228",
+        "group": "palette",
+        "key": "{color.palette.red-200}"
+      },
+      "name": "token-color-palette-red-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-200"
+      ]
+    },
+    "token-color-palette-red-100": {
+      "key": "{color.palette.red-100}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbd4d4",
+        "group": "palette",
+        "key": "{color.palette.red-100}"
+      },
+      "name": "token-color-palette-red-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-100"
+      ]
+    },
+    "token-color-palette-red-50": {
+      "key": "{color.palette.red-50}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff5f5",
+        "group": "palette",
+        "key": "{color.palette.red-50}"
+      },
+      "name": "token-color-palette-red-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-50"
+      ]
+    },
+    "token-color-palette-neutral-700": {
+      "key": "{color.palette.neutral-700}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "palette",
+        "key": "{color.palette.neutral-700}"
+      },
+      "name": "token-color-palette-neutral-700",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-700"
+      ]
+    },
+    "token-color-palette-neutral-600": {
+      "key": "{color.palette.neutral-600}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "palette",
+        "key": "{color.palette.neutral-600}"
+      },
+      "name": "token-color-palette-neutral-600",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-600"
+      ]
+    },
+    "token-color-palette-neutral-500": {
+      "key": "{color.palette.neutral-500}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "palette",
+        "key": "{color.palette.neutral-500}"
+      },
+      "name": "token-color-palette-neutral-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-500"
+      ]
+    },
+    "token-color-palette-neutral-400": {
+      "key": "{color.palette.neutral-400}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "palette",
+        "key": "{color.palette.neutral-400}"
+      },
+      "name": "token-color-palette-neutral-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-400"
+      ]
+    },
+    "token-color-palette-neutral-300": {
+      "key": "{color.palette.neutral-300}",
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c2c5cb",
+        "group": "palette",
+        "key": "{color.palette.neutral-300}"
+      },
+      "name": "token-color-palette-neutral-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-300"
+      ]
+    },
+    "token-color-palette-neutral-200": {
+      "key": "{color.palette.neutral-200}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "palette",
+        "key": "{color.palette.neutral-200}"
+      },
+      "name": "token-color-palette-neutral-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-200"
+      ]
+    },
+    "token-color-palette-neutral-100": {
+      "key": "{color.palette.neutral-100}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f1f2f3",
+        "group": "palette",
+        "key": "{color.palette.neutral-100}"
+      },
+      "name": "token-color-palette-neutral-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-100"
+      ]
+    },
+    "token-color-palette-neutral-50": {
+      "key": "{color.palette.neutral-50}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fafafa",
+        "group": "palette",
+        "key": "{color.palette.neutral-50}"
+      },
+      "name": "token-color-palette-neutral-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-50"
+      ]
+    },
+    "token-color-palette-neutral-0": {
+      "key": "{color.palette.neutral-0}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#ffffff",
+        "cds-g10": "#ffffff",
+        "cds-g90": "#ffffff",
+        "cds-g100": "#ffffff"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "#ffffff",
+        "group": "palette",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.color.white.0}",
+          "cds-g10": "{carbon.color.white.0}",
+          "cds-g90": "{carbon.color.white.0}",
+          "cds-g100": "{carbon.color.white.0}"
+        },
+        "key": "{color.palette.neutral-0}"
+      },
+      "name": "token-color-palette-neutral-0",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-0"
+      ]
+    },
+    "token-color-palette-alpha-300": {
+      "key": "{color.palette.alpha-300}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "alpha": "0.4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-600}",
+        "alpha": "0.4",
+        "group": "palette",
+        "key": "{color.palette.alpha-300}"
+      },
+      "name": "token-color-palette-alpha-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-300"
+      ]
+    },
+    "token-color-palette-alpha-200": {
+      "key": "{color.palette.alpha-200}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "alpha": "0.2",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.2",
+        "group": "palette",
+        "key": "{color.palette.alpha-200}"
+      },
+      "name": "token-color-palette-alpha-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-200"
+      ]
+    },
+    "token-color-palette-alpha-100": {
+      "key": "{color.palette.alpha-100}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "alpha": "0.1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.1",
+        "group": "palette",
+        "key": "{color.palette.alpha-100}"
+      },
+      "name": "token-color-palette-alpha-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-100"
+      ]
+    },
+    "token-color-border-primary": {
+      "key": "{color.border.primary}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-200}",
+        "group": "semantic",
+        "key": "{color.border.primary}"
+      },
+      "name": "token-color-border-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "primary"
+      ]
+    },
+    "token-color-border-faint": {
+      "key": "{color.border.faint}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-100}",
+        "group": "semantic",
+        "key": "{color.border.faint}"
+      },
+      "name": "token-color-border-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "faint"
+      ]
+    },
+    "token-color-border-strong": {
+      "key": "{color.border.strong}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-300}",
+        "group": "semantic",
+        "key": "{color.border.strong}"
+      },
+      "name": "token-color-border-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "strong"
+      ]
+    },
+    "token-color-border-action": {
+      "key": "{color.border.action}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-100}",
+        "group": "semantic",
+        "key": "{color.border.action}"
+      },
+      "name": "token-color-border-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "action"
+      ]
+    },
+    "token-color-border-highlight": {
+      "key": "{color.border.highlight}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-100}",
+        "group": "semantic",
+        "key": "{color.border.highlight}"
+      },
+      "name": "token-color-border-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "highlight"
+      ]
+    },
+    "token-color-border-success": {
+      "key": "{color.border.success}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-100}",
+        "group": "semantic",
+        "key": "{color.border.success}"
+      },
+      "name": "token-color-border-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "success"
+      ]
+    },
+    "token-color-border-warning": {
+      "key": "{color.border.warning}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-100}",
+        "group": "semantic",
+        "key": "{color.border.warning}"
+      },
+      "name": "token-color-border-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "warning"
+      ]
+    },
+    "token-color-border-critical": {
+      "key": "{color.border.critical}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-100}",
+        "group": "semantic",
+        "key": "{color.border.critical}"
+      },
+      "name": "token-color-border-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "critical"
+      ]
+    },
+    "token-color-focus-action-internal": {
+      "key": "{color.focus.action.internal}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.focus.action.internal}"
+      },
+      "name": "token-color-focus-action-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "internal"
+      ]
+    },
+    "token-color-focus-action-external": {
+      "key": "{color.focus.action.external}",
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#5990ff",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.action.external}"
+      },
+      "name": "token-color-focus-action-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "external"
+      ]
+    },
+    "token-color-focus-critical-internal": {
+      "key": "{color.focus.critical.internal}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.focus.critical.internal}"
+      },
+      "name": "token-color-focus-critical-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "internal"
+      ]
+    },
+    "token-color-focus-critical-external": {
+      "key": "{color.focus.critical.external}",
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#dd7578",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.critical.external}"
+      },
+      "name": "token-color-focus-critical-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "external"
+      ]
+    },
+    "token-color-foreground-strong": {
+      "key": "{color.foreground.strong}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-700}",
+        "group": "semantic",
+        "key": "{color.foreground.strong}"
+      },
+      "name": "token-color-foreground-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-color-foreground-primary": {
+      "key": "{color.foreground.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#161616",
+        "cds-g10": "#161616",
+        "cds-g90": "#f4f4f4",
+        "cds-g100": "#f4f4f4"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "#ffffff",
+        "group": "semantic",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.themes.white.textPrimary}",
+          "cds-g10": "{carbon.themes.g10.textPrimary}",
+          "cds-g90": "{carbon.themes.g90.textPrimary}",
+          "cds-g100": "{carbon.themes.g100.textPrimary}"
+        },
+        "key": "{color.foreground.primary}"
+      },
+      "name": "token-color-foreground-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-color-foreground-faint": {
+      "key": "{color.foreground.faint}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "semantic",
+        "key": "{color.foreground.faint}"
+      },
+      "name": "token-color-foreground-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-color-foreground-high-contrast": {
+      "key": "{color.foreground.high-contrast}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.foreground.high-contrast}"
+      },
+      "name": "token-color-foreground-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "high-contrast"
+      ]
+    },
+    "token-color-foreground-disabled": {
+      "key": "{color.foreground.disabled}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "semantic",
+        "key": "{color.foreground.disabled}"
+      },
+      "name": "token-color-foreground-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "disabled"
+      ]
+    },
+    "token-color-foreground-action": {
+      "key": "{color.foreground.action}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "semantic",
+        "key": "{color.foreground.action}"
+      },
+      "name": "token-color-foreground-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action"
+      ]
+    },
+    "token-color-foreground-action-hover": {
+      "key": "{color.foreground.action-hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.foreground.action-hover}"
+      },
+      "name": "token-color-foreground-action-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-hover"
+      ]
+    },
+    "token-color-foreground-action-active": {
+      "key": "{color.foreground.action-active}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "semantic",
+        "key": "{color.foreground.action-active}"
+      },
+      "name": "token-color-foreground-action-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-active"
+      ]
+    },
+    "token-color-foreground-highlight": {
+      "key": "{color.foreground.highlight}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-200}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight}"
+      },
+      "name": "token-color-foreground-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight"
+      ]
+    },
+    "token-color-foreground-highlight-on-surface": {
+      "key": "{color.foreground.highlight-on-surface}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-300}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-on-surface}"
+      },
+      "name": "token-color-foreground-highlight-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-on-surface"
+      ]
+    },
+    "token-color-foreground-highlight-high-contrast": {
+      "key": "{color.foreground.highlight-high-contrast}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-500}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-high-contrast}"
+      },
+      "name": "token-color-foreground-highlight-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-high-contrast"
+      ]
+    },
+    "token-color-foreground-success": {
+      "key": "{color.foreground.success}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-200}",
+        "group": "semantic",
+        "key": "{color.foreground.success}"
+      },
+      "name": "token-color-foreground-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success"
+      ]
+    },
+    "token-color-foreground-success-on-surface": {
+      "key": "{color.foreground.success-on-surface}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-300}",
+        "group": "semantic",
+        "key": "{color.foreground.success-on-surface}"
+      },
+      "name": "token-color-foreground-success-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-on-surface"
+      ]
+    },
+    "token-color-foreground-success-high-contrast": {
+      "key": "{color.foreground.success-high-contrast}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-500}",
+        "group": "semantic",
+        "key": "{color.foreground.success-high-contrast}"
+      },
+      "name": "token-color-foreground-success-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-high-contrast"
+      ]
+    },
+    "token-color-foreground-warning": {
+      "key": "{color.foreground.warning}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-200}",
+        "group": "semantic",
+        "key": "{color.foreground.warning}"
+      },
+      "name": "token-color-foreground-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning"
+      ]
+    },
+    "token-color-foreground-warning-on-surface": {
+      "key": "{color.foreground.warning-on-surface}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-300}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-on-surface}"
+      },
+      "name": "token-color-foreground-warning-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-on-surface"
+      ]
+    },
+    "token-color-foreground-warning-high-contrast": {
+      "key": "{color.foreground.warning-high-contrast}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-500}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-high-contrast}"
+      },
+      "name": "token-color-foreground-warning-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-high-contrast"
+      ]
+    },
+    "token-color-foreground-critical": {
+      "key": "{color.foreground.critical}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-200}",
+        "group": "semantic",
+        "key": "{color.foreground.critical}"
+      },
+      "name": "token-color-foreground-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical"
+      ]
+    },
+    "token-color-foreground-critical-on-surface": {
+      "key": "{color.foreground.critical-on-surface}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-on-surface}"
+      },
+      "name": "token-color-foreground-critical-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-on-surface"
+      ]
+    },
+    "token-color-foreground-critical-high-contrast": {
+      "key": "{color.foreground.critical-high-contrast}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-500}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-high-contrast}"
+      },
+      "name": "token-color-foreground-critical-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-high-contrast"
+      ]
+    },
+    "token-color-page-primary": {
+      "key": "{color.page.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.page.primary}"
+      },
+      "name": "token-color-page-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "primary"
+      ]
+    },
+    "token-color-page-faint": {
+      "key": "{color.page.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.page.faint}"
+      },
+      "name": "token-color-page-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "faint"
+      ]
+    },
+    "token-color-surface-primary": {
+      "key": "{color.surface.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.primary}"
+      },
+      "name": "token-color-surface-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-color-surface-faint": {
+      "key": "{color.surface.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.faint}"
+      },
+      "name": "token-color-surface-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "faint"
+      ]
+    },
+    "token-color-surface-strong": {
+      "key": "{color.surface.strong}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.strong}"
+      },
+      "name": "token-color-surface-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "strong"
+      ]
+    },
+    "token-color-surface-interactive": {
+      "key": "{color.surface.interactive}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.interactive}"
+      },
+      "name": "token-color-surface-interactive",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive"
+      ]
+    },
+    "token-color-surface-interactive-hover": {
+      "key": "{color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-hover}"
+      },
+      "name": "token-color-surface-interactive-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-color-surface-interactive-active": {
+      "key": "{color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-200}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-active}"
+      },
+      "name": "token-color-surface-interactive-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-color-surface-interactive-disabled": {
+      "key": "{color.surface.interactive-disabled}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-disabled}"
+      },
+      "name": "token-color-surface-interactive-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-disabled"
+      ]
+    },
+    "token-color-surface-action": {
+      "key": "{color.surface.action}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-50}",
+        "group": "semantic",
+        "key": "{color.surface.action}"
+      },
+      "name": "token-color-surface-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "action"
+      ]
+    },
+    "token-color-surface-highlight": {
+      "key": "{color.surface.highlight}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-50}",
+        "group": "semantic",
+        "key": "{color.surface.highlight}"
+      },
+      "name": "token-color-surface-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "highlight"
+      ]
+    },
+    "token-color-surface-success": {
+      "key": "{color.surface.success}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-50}",
+        "group": "semantic",
+        "key": "{color.surface.success}"
+      },
+      "name": "token-color-surface-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "success"
+      ]
+    },
+    "token-color-surface-warning": {
+      "key": "{color.surface.warning}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-50}",
+        "group": "semantic",
+        "key": "{color.surface.warning}"
+      },
+      "name": "token-color-surface-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "warning"
+      ]
+    },
+    "token-color-surface-critical": {
+      "key": "{color.surface.critical}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-50}",
+        "group": "semantic",
+        "key": "{color.surface.critical}"
+      },
+      "name": "token-color-surface-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "critical"
+      ]
+    },
+    "token-color-hashicorp-brand": {
+      "key": "{color.hashicorp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hashicorp-brand}",
+        "group": "branding",
+        "key": "{color.hashicorp.brand}"
+      },
+      "name": "token-color-hashicorp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hashicorp",
+        "brand"
+      ]
+    },
+    "token-color-boundary-brand": {
+      "key": "{color.boundary.brand}",
+      "$type": "color",
+      "$value": "#f24c53",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-brand}",
+        "group": "branding",
+        "key": "{color.boundary.brand}"
+      },
+      "name": "token-color-boundary-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "brand"
+      ]
+    },
+    "token-color-boundary-foreground": {
+      "key": "{color.boundary.foreground}",
+      "$type": "color",
+      "$value": "#cf2d32",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-500}",
+        "group": "branding",
+        "key": "{color.boundary.foreground}"
+      },
+      "name": "token-color-boundary-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "foreground"
+      ]
+    },
+    "token-color-boundary-surface": {
+      "key": "{color.boundary.surface}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.surface}"
+      },
+      "name": "token-color-boundary-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "surface"
+      ]
+    },
+    "token-color-boundary-border": {
+      "key": "{color.boundary.border}",
+      "$type": "color",
+      "$value": "#fbd7d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-100}",
+        "group": "branding",
+        "key": "{color.boundary.border}"
+      },
+      "name": "token-color-boundary-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "border"
+      ]
+    },
+    "token-color-boundary-gradient-primary-start": {
+      "key": "{color.boundary.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#f97076",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-300}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.start}"
+      },
+      "name": "token-color-boundary-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-primary-stop": {
+      "key": "{color.boundary.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#db363b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-400}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.stop}"
+      },
+      "name": "token-color-boundary-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-boundary-gradient-faint-start": {
+      "key": "{color.boundary.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffafa",
+        "group": "branding",
+        "comment": "this is the 'boundary-50' value at 25% opacity on white",
+        "key": "{color.boundary.gradient.faint.start}"
+      },
+      "name": "token-color-boundary-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-faint-stop": {
+      "key": "{color.boundary.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.faint.stop}"
+      },
+      "name": "token-color-boundary-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-consul-brand": {
+      "key": "{color.consul.brand}",
+      "$type": "color",
+      "$value": "#e03875",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-brand}",
+        "group": "branding",
+        "key": "{color.consul.brand}"
+      },
+      "name": "token-color-consul-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "brand"
+      ]
+    },
+    "token-color-consul-foreground": {
+      "key": "{color.consul.foreground}",
+      "$type": "color",
+      "$value": "#d01c5b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-500}",
+        "group": "branding",
+        "key": "{color.consul.foreground}"
+      },
+      "name": "token-color-consul-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "foreground"
+      ]
+    },
+    "token-color-consul-surface": {
+      "key": "{color.consul.surface}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.surface}"
+      },
+      "name": "token-color-consul-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "surface"
+      ]
+    },
+    "token-color-consul-border": {
+      "key": "{color.consul.border}",
+      "$type": "color",
+      "$value": "#ffcede",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-100}",
+        "group": "branding",
+        "key": "{color.consul.border}"
+      },
+      "name": "token-color-consul-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "border"
+      ]
+    },
+    "token-color-consul-gradient-primary-start": {
+      "key": "{color.consul.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#ff99be",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-300}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.start}"
+      },
+      "name": "token-color-consul-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-primary-stop": {
+      "key": "{color.consul.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#da306e",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-400}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.stop}"
+      },
+      "name": "token-color-consul-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-consul-gradient-faint-start": {
+      "key": "{color.consul.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9fb",
+        "group": "branding",
+        "comment": "this is the 'consul-50' value at 25% opacity on white",
+        "key": "{color.consul.gradient.faint.start}"
+      },
+      "name": "token-color-consul-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-faint-stop": {
+      "key": "{color.consul.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.gradient.faint.stop}"
+      },
+      "name": "token-color-consul-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-hcp-brand": {
+      "key": "{color.hcp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hcp-brand}",
+        "group": "branding",
+        "key": "{color.hcp.brand}"
+      },
+      "name": "token-color-hcp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hcp",
+        "brand"
+      ]
+    },
+    "token-color-nomad-brand": {
+      "key": "{color.nomad.brand}",
+      "$type": "color",
+      "$value": "#06d092",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-brand}",
+        "group": "branding",
+        "key": "{color.nomad.brand}"
+      },
+      "name": "token-color-nomad-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "brand"
+      ]
+    },
+    "token-color-nomad-foreground": {
+      "key": "{color.nomad.foreground}",
+      "$type": "color",
+      "$value": "#008661",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-500}",
+        "group": "branding",
+        "key": "{color.nomad.foreground}"
+      },
+      "name": "token-color-nomad-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "foreground"
+      ]
+    },
+    "token-color-nomad-surface": {
+      "key": "{color.nomad.surface}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.surface}"
+      },
+      "name": "token-color-nomad-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "surface"
+      ]
+    },
+    "token-color-nomad-border": {
+      "key": "{color.nomad.border}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.border}"
+      },
+      "name": "token-color-nomad-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "border"
+      ]
+    },
+    "token-color-nomad-gradient-primary-start": {
+      "key": "{color.nomad.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.start}"
+      },
+      "name": "token-color-nomad-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-primary-stop": {
+      "key": "{color.nomad.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#60dea9",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-200}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.stop}"
+      },
+      "name": "token-color-nomad-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-nomad-gradient-faint-start": {
+      "key": "{color.nomad.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f3fff9",
+        "group": "branding",
+        "comment": "this is the 'nomad-50' value at 25% opacity on white",
+        "key": "{color.nomad.gradient.faint.start}"
+      },
+      "name": "token-color-nomad-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-faint-stop": {
+      "key": "{color.nomad.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.faint.stop}"
+      },
+      "name": "token-color-nomad-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-packer-brand": {
+      "key": "{color.packer.brand}",
+      "$type": "color",
+      "$value": "#02a8ef",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-brand}",
+        "group": "branding",
+        "key": "{color.packer.brand}"
+      },
+      "name": "token-color-packer-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "brand"
+      ]
+    },
+    "token-color-packer-foreground": {
+      "key": "{color.packer.foreground}",
+      "$type": "color",
+      "$value": "#007eb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-500}",
+        "group": "branding",
+        "key": "{color.packer.foreground}"
+      },
+      "name": "token-color-packer-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "foreground"
+      ]
+    },
+    "token-color-packer-surface": {
+      "key": "{color.packer.surface}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.surface}"
+      },
+      "name": "token-color-packer-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "surface"
+      ]
+    },
+    "token-color-packer-border": {
+      "key": "{color.packer.border}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.border}"
+      },
+      "name": "token-color-packer-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "border"
+      ]
+    },
+    "token-color-packer-gradient-primary-start": {
+      "key": "{color.packer.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.start}"
+      },
+      "name": "token-color-packer-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-primary-stop": {
+      "key": "{color.packer.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#63d0ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-200}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.stop}"
+      },
+      "name": "token-color-packer-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-packer-gradient-faint-start": {
+      "key": "{color.packer.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fcff",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#F3FCFF",
+        "group": "branding",
+        "comment": "this is the 'packer-50' value at 25% opacity on white",
+        "key": "{color.packer.gradient.faint.start}"
+      },
+      "name": "token-color-packer-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-faint-stop": {
+      "key": "{color.packer.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.gradient.faint.stop}"
+      },
+      "name": "token-color-packer-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-terraform-brand": {
+      "key": "{color.terraform.brand}",
+      "$type": "color",
+      "$value": "#7b42bc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-brand}",
+        "group": "branding",
+        "key": "{color.terraform.brand}"
+      },
+      "name": "token-color-terraform-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand"
+      ]
+    },
+    "token-color-terraform-brand-on-dark": {
+      "key": "{color.terraform.brand-on-dark}",
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "original": {
+        "$type": "color",
+        "$value": "#a067da",
+        "group": "branding",
+        "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+        "key": "{color.terraform.brand-on-dark}"
+      },
+      "name": "token-color-terraform-brand-on-dark",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand-on-dark"
+      ]
+    },
+    "token-color-terraform-foreground": {
+      "key": "{color.terraform.foreground}",
+      "$type": "color",
+      "$value": "#773cb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-500}",
+        "group": "branding",
+        "key": "{color.terraform.foreground}"
+      },
+      "name": "token-color-terraform-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "foreground"
+      ]
+    },
+    "token-color-terraform-surface": {
+      "key": "{color.terraform.surface}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.surface}"
+      },
+      "name": "token-color-terraform-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "surface"
+      ]
+    },
+    "token-color-terraform-border": {
+      "key": "{color.terraform.border}",
+      "$type": "color",
+      "$value": "#ebdbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-100}",
+        "group": "branding",
+        "key": "{color.terraform.border}"
+      },
+      "name": "token-color-terraform-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "border"
+      ]
+    },
+    "token-color-terraform-gradient-primary-start": {
+      "key": "{color.terraform.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bb8deb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-300}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.start}"
+      },
+      "name": "token-color-terraform-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-primary-stop": {
+      "key": "{color.terraform.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#844fba",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-400}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.stop}"
+      },
+      "name": "token-color-terraform-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-terraform-gradient-faint-start": {
+      "key": "{color.terraform.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fcfaff",
+        "group": "branding",
+        "comment": "this is the 'terraform-50' value at 25% opacity on white",
+        "key": "{color.terraform.gradient.faint.start}"
+      },
+      "name": "token-color-terraform-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-faint-stop": {
+      "key": "{color.terraform.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.faint.stop}"
+      },
+      "name": "token-color-terraform-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-brand": {
+      "key": "{color.vagrant.brand}",
+      "$type": "color",
+      "$value": "#1868f2",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-brand}",
+        "group": "branding",
+        "key": "{color.vagrant.brand}"
+      },
+      "name": "token-color-vagrant-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "brand"
+      ]
+    },
+    "token-color-vagrant-foreground": {
+      "key": "{color.vagrant.foreground}",
+      "$type": "color",
+      "$value": "#1c61d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-500}",
+        "group": "branding",
+        "key": "{color.vagrant.foreground}"
+      },
+      "name": "token-color-vagrant-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "foreground"
+      ]
+    },
+    "token-color-vagrant-surface": {
+      "key": "{color.vagrant.surface}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.surface}"
+      },
+      "name": "token-color-vagrant-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "surface"
+      ]
+    },
+    "token-color-vagrant-border": {
+      "key": "{color.vagrant.border}",
+      "$type": "color",
+      "$value": "#c7dbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-100}",
+        "group": "branding",
+        "key": "{color.vagrant.border}"
+      },
+      "name": "token-color-vagrant-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "border"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-start": {
+      "key": "{color.vagrant.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#639cff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-300}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.start}"
+      },
+      "name": "token-color-vagrant-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-stop": {
+      "key": "{color.vagrant.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#2e71e5",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-400}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.stop}"
+      },
+      "name": "token-color-vagrant-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-start": {
+      "key": "{color.vagrant.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f4faff",
+        "group": "branding",
+        "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+        "key": "{color.vagrant.gradient.faint.start}"
+      },
+      "name": "token-color-vagrant-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-stop": {
+      "key": "{color.vagrant.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.faint.stop}"
+      },
+      "name": "token-color-vagrant-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-brand": {
+      "key": "{color.vault-radar.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-brand}",
+        "group": "branding",
+        "key": "{color.vault-radar.brand}"
+      },
+      "name": "token-color-vault-radar-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand"
+      ]
+    },
+    "token-color-vault-radar-brand-alt": {
+      "key": "{color.vault-radar.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+        "key": "{color.vault-radar.brand-alt}"
+      },
+      "name": "token-color-vault-radar-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-radar-foreground": {
+      "key": "{color.vault-radar.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-500}",
+        "group": "branding",
+        "key": "{color.vault-radar.foreground}"
+      },
+      "name": "token-color-vault-radar-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "foreground"
+      ]
+    },
+    "token-color-vault-radar-surface": {
+      "key": "{color.vault-radar.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.surface}"
+      },
+      "name": "token-color-vault-radar-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "surface"
+      ]
+    },
+    "token-color-vault-radar-border": {
+      "key": "{color.vault-radar.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.border}"
+      },
+      "name": "token-color-vault-radar-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "border"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-start": {
+      "key": "{color.vault-radar.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.start}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-stop": {
+      "key": "{color.vault-radar.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-200}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-start": {
+      "key": "{color.vault-radar.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+        "key": "{color.vault-radar.gradient.faint.start}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-stop": {
+      "key": "{color.vault-radar.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-brand": {
+      "key": "{color.vault-secrets.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-brand}",
+        "group": "branding",
+        "key": "{color.vault-secrets.brand}"
+      },
+      "name": "token-color-vault-secrets-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand"
+      ]
+    },
+    "token-color-vault-secrets-brand-alt": {
+      "key": "{color.vault-secrets.brand-alt}",
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "original": {
+        "group": "branding",
+        "$type": "color",
+        "$value": "#000",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+        "key": "{color.vault-secrets.brand-alt}"
+      },
+      "name": "token-color-vault-secrets-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-secrets-foreground": {
+      "key": "{color.vault-secrets.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-500}",
+        "group": "branding",
+        "key": "{color.vault-secrets.foreground}"
+      },
+      "name": "token-color-vault-secrets-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "foreground"
+      ]
+    },
+    "token-color-vault-secrets-surface": {
+      "key": "{color.vault-secrets.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.surface}"
+      },
+      "name": "token-color-vault-secrets-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "surface"
+      ]
+    },
+    "token-color-vault-secrets-border": {
+      "key": "{color.vault-secrets.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.border}"
+      },
+      "name": "token-color-vault-secrets-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "border"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-start": {
+      "key": "{color.vault-secrets.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-stop": {
+      "key": "{color.vault-secrets.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-200}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-start": {
+      "key": "{color.vault-secrets.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+        "key": "{color.vault-secrets.gradient.faint.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-stop": {
+      "key": "{color.vault-secrets.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-brand": {
+      "key": "{color.vault.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-brand}",
+        "group": "branding",
+        "key": "{color.vault.brand}"
+      },
+      "name": "token-color-vault-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand"
+      ]
+    },
+    "token-color-vault-brand-alt": {
+      "key": "{color.vault.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+        "key": "{color.vault.brand-alt}"
+      },
+      "name": "token-color-vault-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-foreground": {
+      "key": "{color.vault.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-500}",
+        "group": "branding",
+        "key": "{color.vault.foreground}"
+      },
+      "name": "token-color-vault-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "foreground"
+      ]
+    },
+    "token-color-vault-surface": {
+      "key": "{color.vault.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.surface}"
+      },
+      "name": "token-color-vault-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "surface"
+      ]
+    },
+    "token-color-vault-border": {
+      "key": "{color.vault.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.border}"
+      },
+      "name": "token-color-vault-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "border"
+      ]
+    },
+    "token-color-vault-gradient-primary-start": {
+      "key": "{color.vault.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.start}"
+      },
+      "name": "token-color-vault-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-primary-stop": {
+      "key": "{color.vault.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-200}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-gradient-faint-start": {
+      "key": "{color.vault.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-50' value at 25% opacity on white",
+        "key": "{color.vault.gradient.faint.start}"
+      },
+      "name": "token-color-vault-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-faint-stop": {
+      "key": "{color.vault.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-brand": {
+      "key": "{color.waypoint.brand}",
+      "$type": "color",
+      "$value": "#14c6cb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-brand}",
+        "group": "branding",
+        "key": "{color.waypoint.brand}"
+      },
+      "name": "token-color-waypoint-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "brand"
+      ]
+    },
+    "token-color-waypoint-foreground": {
+      "key": "{color.waypoint.foreground}",
+      "$type": "color",
+      "$value": "#008196",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-500}",
+        "group": "branding",
+        "key": "{color.waypoint.foreground}"
+      },
+      "name": "token-color-waypoint-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "foreground"
+      ]
+    },
+    "token-color-waypoint-surface": {
+      "key": "{color.waypoint.surface}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.surface}"
+      },
+      "name": "token-color-waypoint-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "surface"
+      ]
+    },
+    "token-color-waypoint-border": {
+      "key": "{color.waypoint.border}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.border}"
+      },
+      "name": "token-color-waypoint-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "border"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-start": {
+      "key": "{color.waypoint.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.start}"
+      },
+      "name": "token-color-waypoint-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-stop": {
+      "key": "{color.waypoint.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#62d4dc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-200}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.stop}"
+      },
+      "name": "token-color-waypoint-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-start": {
+      "key": "{color.waypoint.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f6feff",
+        "group": "branding",
+        "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+        "key": "{color.waypoint.gradient.faint.start}"
+      },
+      "name": "token-color-waypoint-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-stop": {
+      "key": "{color.waypoint.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.faint.stop}"
+      },
+      "name": "token-color-waypoint-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-elevation-inset-box-shadow": {
+      "key": "{elevation.inset.box-shadow}",
+      "$value": "inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-01}",
+        "key": "{elevation.inset.box-shadow}"
+      },
+      "name": "token-elevation-inset-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-low-box-shadow": {
+      "key": "{elevation.low.box-shadow}",
+      "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+        "key": "{elevation.low.box-shadow}"
+      },
+      "name": "token-elevation-low-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-mid-box-shadow": {
+      "key": "{elevation.mid.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+        "key": "{elevation.mid.box-shadow}"
+      },
+      "name": "token-elevation-mid-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-high-box-shadow": {
+      "key": "{elevation.high.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+        "key": "{elevation.high.box-shadow}"
+      },
+      "name": "token-elevation-high-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-higher-box-shadow": {
+      "key": "{elevation.higher.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+        "key": "{elevation.higher.box-shadow}"
+      },
+      "name": "token-elevation-higher-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-overlay-box-shadow": {
+      "key": "{elevation.overlay.box-shadow}",
+      "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+        "key": "{elevation.overlay.box-shadow}"
+      },
+      "name": "token-elevation-overlay-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-surface-inset-box-shadow": {
+      "key": "{surface.inset.box-shadow}",
+      "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+        "key": "{surface.inset.box-shadow}"
+      },
+      "name": "token-surface-inset-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-surface-base-box-shadow": {
+      "key": "{surface.base.box-shadow}",
+      "$value": "0 0 0 1px #656a7633",
+      "original": {
+        "$value": "{elevation.base.box-shadow-border}",
+        "key": "{surface.base.box-shadow}"
+      },
+      "name": "token-surface-base-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "base",
+        "box-shadow"
+      ]
+    },
+    "token-surface-low-box-shadow": {
+      "key": "{surface.low.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+        "key": "{surface.low.box-shadow}"
+      },
+      "name": "token-surface-low-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-surface-mid-box-shadow": {
+      "key": "{surface.mid.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+        "key": "{surface.mid.box-shadow}"
+      },
+      "name": "token-surface-mid-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-surface-high-box-shadow": {
+      "key": "{surface.high.box-shadow}",
+      "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+        "key": "{surface.high.box-shadow}"
+      },
+      "name": "token-surface-high-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-surface-higher-box-shadow": {
+      "key": "{surface.higher.box-shadow}",
+      "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+        "key": "{surface.higher.box-shadow}"
+      },
+      "name": "token-surface-higher-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-surface-overlay-box-shadow": {
+      "key": "{surface.overlay.box-shadow}",
+      "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+        "key": "{surface.overlay.box-shadow}"
+      },
+      "name": "token-surface-overlay-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-action-box-shadow": {
+      "key": "{focus-ring.action.box-shadow}",
+      "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+      "original": {
+        "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+        "key": "{focus-ring.action.box-shadow}"
+      },
+      "name": "token-focus-ring-action-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "action",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-critical-box-shadow": {
+      "key": "{focus-ring.critical.box-shadow}",
+      "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+      "original": {
+        "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+        "key": "{focus-ring.critical.box-shadow}"
+      },
+      "name": "token-focus-ring-critical-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "critical",
+        "box-shadow"
+      ]
+    },
+    "token-app-header-height": {
+      "key": "{app-header.height}",
+      "$type": "dimension",
+      "$value": "60px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "60",
+        "unit": "px",
+        "key": "{app-header.height}"
+      },
+      "name": "token-app-header-height",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "height"
+      ]
+    },
+    "token-app-header-home-link-size": {
+      "key": "{app-header.home-link.size}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-header.home-link.size}"
+      },
+      "name": "token-app-header-home-link-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "home-link",
+        "size"
+      ]
+    },
+    "token-app-header-logo-size": {
+      "key": "{app-header.logo.size}",
+      "$type": "dimension",
+      "$value": "28px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "28",
+        "unit": "px",
+        "key": "{app-header.logo.size}"
+      },
+      "name": "token-app-header-logo-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "logo",
+        "size"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-width": {
+      "key": "{app-side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.border.width}"
+      },
+      "name": "token-app-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-color": {
+      "key": "{app-side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-200)",
+        "group": "components",
+        "key": "{app-side-nav.wrapper.border.color}"
+      },
+      "name": "token-app-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal": {
+      "key": "{app-side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical": {
+      "key": "{app-side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-app-side-nav-toggle-button-border-radius": {
+      "key": "{app-side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-app-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-app-side-nav-header-home-link-padding": {
+      "key": "{app-side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.padding}"
+      },
+      "name": "token-app-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size": {
+      "key": "{app-side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-app-side-nav-header-actions-spacing": {
+      "key": "{app-side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.header.actions.spacing}"
+      },
+      "name": "token-app-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-app-side-nav-body-list-margin-vertical": {
+      "key": "{app-side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{app-side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-height": {
+      "key": "{app-side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.height}"
+      },
+      "name": "token-app-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-horizontal": {
+      "key": "{app-side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-vertical": {
+      "key": "{app-side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-spacing-vertical": {
+      "key": "{app-side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-border-radius": {
+      "key": "{app-side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-app-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-app-side-nav-color-foreground-primary": {
+      "key": "{app-side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.primary}"
+      },
+      "name": "token-app-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-foreground-strong": {
+      "key": "{app-side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.strong}"
+      },
+      "name": "token-app-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-app-side-nav-color-foreground-faint": {
+      "key": "{app-side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.faint}"
+      },
+      "name": "token-app-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-app-side-nav-color-surface-primary": {
+      "key": "{app-side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.surface.primary}"
+      },
+      "name": "token-app-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-hover": {
+      "key": "{app-side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-interactive-hover)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-active": {
+      "key": "{app-side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-300)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-form-label-color": {
+      "key": "{form.label.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.label.color}"
+      },
+      "name": "token-form-label-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "label",
+        "color"
+      ]
+    },
+    "token-form-legend-color": {
+      "key": "{form.legend.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{form.label.color}",
+        "group": "components",
+        "key": "{form.legend.color}"
+      },
+      "name": "token-form-legend-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "legend",
+        "color"
+      ]
+    },
+    "token-form-helper-text-color": {
+      "key": "{form.helper-text.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.helper-text.color}"
+      },
+      "name": "token-form-helper-text-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "helper-text",
+        "color"
+      ]
+    },
+    "token-form-indicator-optional-color": {
+      "key": "{form.indicator.optional.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.indicator.optional.color}"
+      },
+      "name": "token-form-indicator-optional-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "indicator",
+        "optional",
+        "color"
+      ]
+    },
+    "token-form-error-color": {
+      "key": "{form.error.color}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.error.color}"
+      },
+      "name": "token-form-error-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "color"
+      ]
+    },
+    "token-form-error-icon-size": {
+      "key": "{form.error.icon-size}",
+      "$type": "dimension",
+      "$value": "14px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "14",
+        "unit": "px",
+        "key": "{form.error.icon-size}"
+      },
+      "name": "token-form-error-icon-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "icon-size"
+      ]
+    },
+    "token-form-checkbox-size": {
+      "key": "{form.checkbox.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.checkbox.size}"
+      },
+      "name": "token-form-checkbox-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "size"
+      ]
+    },
+    "token-form-checkbox-border-radius": {
+      "key": "{form.checkbox.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.checkbox.border.radius}"
+      },
+      "name": "token-form-checkbox-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-checkbox-border-width": {
+      "key": "{form.checkbox.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.checkbox.border.width}"
+      },
+      "name": "token-form-checkbox-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-checkbox-background-image-size": {
+      "key": "{form.checkbox.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.checkbox.background-image.size}"
+      },
+      "name": "token-form-checkbox-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url": {
+      "key": "{form.checkbox.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url}"
+      },
+      "name": "token-form-checkbox-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-disabled": {
+      "key": "{form.checkbox.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate-disabled": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate-disabled"
+      ]
+    },
+    "token-form-control-base-foreground-value-color": {
+      "key": "{form.control.base.foreground.value-color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.control.base.foreground.value-color}"
+      },
+      "name": "token-form-control-base-foreground-value-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "value-color"
+      ]
+    },
+    "token-form-control-base-foreground-placeholder-color": {
+      "key": "{form.control.base.foreground.placeholder-color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.control.base.foreground.placeholder-color}"
+      },
+      "name": "token-form-control-base-foreground-placeholder-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "placeholder-color"
+      ]
+    },
+    "token-form-control-base-surface-color-default": {
+      "key": "{form.control.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.default}"
+      },
+      "name": "token-form-control-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-surface-color-hover": {
+      "key": "{form.control.base.surface-color.hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-hover}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.hover}"
+      },
+      "name": "token-form-control-base-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-base-border-color-default": {
+      "key": "{form.control.base.border-color.default}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "components",
+        "key": "{form.control.base.border-color.default}"
+      },
+      "name": "token-form-control-base-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-border-color-hover": {
+      "key": "{form.control.base.border-color.hover}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "components",
+        "key": "{form.control.base.border-color.hover}"
+      },
+      "name": "token-form-control-base-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-foreground-color": {
+      "key": "{form.control.checked.foreground-color}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.high-contrast}",
+        "group": "components",
+        "key": "{form.control.checked.foreground-color}"
+      },
+      "name": "token-form-control-checked-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-checked-surface-color-default": {
+      "key": "{form.control.checked.surface-color.default}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.default}"
+      },
+      "name": "token-form-control-checked-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-surface-color-hover": {
+      "key": "{form.control.checked.surface-color.hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.hover}"
+      },
+      "name": "token-form-control-checked-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-border-color-default": {
+      "key": "{form.control.checked.border-color.default}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.default}"
+      },
+      "name": "token-form-control-checked-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-border-color-hover": {
+      "key": "{form.control.checked.border-color.hover}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.hover}"
+      },
+      "name": "token-form-control-checked-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-invalid-border-color-default": {
+      "key": "{form.control.invalid.border-color.default}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.default}"
+      },
+      "name": "token-form-control-invalid-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-invalid-border-color-hover": {
+      "key": "{form.control.invalid.border-color.hover}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-400}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.hover}"
+      },
+      "name": "token-form-control-invalid-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-readonly-foreground-color": {
+      "key": "{form.control.readonly.foreground-color}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.primary}",
+        "group": "components",
+        "key": "{form.control.readonly.foreground-color}"
+      },
+      "name": "token-form-control-readonly-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-readonly-surface-color": {
+      "key": "{form.control.readonly.surface-color}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "key": "{form.control.readonly.surface-color}"
+      },
+      "name": "token-form-control-readonly-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "surface-color"
+      ]
+    },
+    "token-form-control-readonly-border-color": {
+      "key": "{form.control.readonly.border-color}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.faint}",
+        "group": "components",
+        "key": "{form.control.readonly.border-color}"
+      },
+      "name": "token-form-control-readonly-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "border-color"
+      ]
+    },
+    "token-form-control-disabled-foreground-color": {
+      "key": "{form.control.disabled.foreground-color}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.foreground-color}"
+      },
+      "name": "token-form-control-disabled-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-disabled-surface-color": {
+      "key": "{form.control.disabled.surface-color}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.surface-color}"
+      },
+      "name": "token-form-control-disabled-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "surface-color"
+      ]
+    },
+    "token-form-control-disabled-border-color": {
+      "key": "{form.control.disabled.border-color}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.primary}",
+        "group": "components",
+        "key": "{form.control.disabled.border-color}"
+      },
+      "name": "token-form-control-disabled-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "border-color"
+      ]
+    },
+    "token-form-control-padding": {
+      "key": "{form.control.padding}",
+      "$type": "dimension",
+      "$value": "7px",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "original": {
+        "$type": "dimension",
+        "$value": "7",
+        "unit": "px",
+        "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+        "key": "{form.control.padding}"
+      },
+      "name": "token-form-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "padding"
+      ]
+    },
+    "token-form-control-border-radius": {
+      "key": "{form.control.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{form.control.border.radius}"
+      },
+      "name": "token-form-control-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-control-border-width": {
+      "key": "{form.control.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.control.border.width}"
+      },
+      "name": "token-form-control-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-size": {
+      "key": "{form.radio.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radio.size}"
+      },
+      "name": "token-form-radio-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "size"
+      ]
+    },
+    "token-form-radio-border-width": {
+      "key": "{form.radio.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radio.border.width}"
+      },
+      "name": "token-form-radio-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-background-image-size": {
+      "key": "{form.radio.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.radio.background-image.size}"
+      },
+      "name": "token-form-radio-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-radio-background-image-data-url": {
+      "key": "{form.radio.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url}"
+      },
+      "name": "token-form-radio-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-radio-background-image-data-url-disabled": {
+      "key": "{form.radio.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url-disabled}"
+      },
+      "name": "token-form-radio-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-radiocard-group-gap": {
+      "key": "{form.radiocard-group.gap}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radiocard-group.gap}"
+      },
+      "name": "token-form-radiocard-group-gap",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard-group",
+        "gap"
+      ]
+    },
+    "token-form-radiocard-border-width": {
+      "key": "{form.radiocard.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radiocard.border.width}"
+      },
+      "name": "token-form-radiocard-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radiocard-border-radius": {
+      "key": "{form.radiocard.border.radius}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{form.radiocard.border.radius}"
+      },
+      "name": "token-form-radiocard-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-radiocard-content-padding": {
+      "key": "{form.radiocard.content-padding}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{form.radiocard.content-padding}"
+      },
+      "name": "token-form-radiocard-content-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "content-padding"
+      ]
+    },
+    "token-form-radiocard-control-padding": {
+      "key": "{form.radiocard.control-padding}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{form.radiocard.control-padding}"
+      },
+      "name": "token-form-radiocard-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "control-padding"
+      ]
+    },
+    "token-form-radiocard-transition-duration": {
+      "key": "{form.radiocard.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.radiocard.transition.duration}"
+      },
+      "name": "token-form-radiocard-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-select-background-image-size": {
+      "key": "{form.select.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.select.background-image.size}"
+      },
+      "name": "token-form-select-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-select-background-image-position-right-x": {
+      "key": "{form.select.background-image.position-right-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.select.background-image.position-right-x}"
+      },
+      "name": "token-form-select-background-image-position-right-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-right-x"
+      ]
+    },
+    "token-form-select-background-image-position-top-y": {
+      "key": "{form.select.background-image.position-top-y}",
+      "$type": "dimension",
+      "$value": "9px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "9",
+        "unit": "px",
+        "key": "{form.select.background-image.position-top-y}"
+      },
+      "name": "token-form-select-background-image-position-top-y",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-top-y"
+      ]
+    },
+    "token-form-select-background-image-data-url": {
+      "key": "{form.select.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url}"
+      },
+      "name": "token-form-select-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-select-background-image-data-url-disabled": {
+      "key": "{form.select.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url-disabled}"
+      },
+      "name": "token-form-select-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-text-input-background-image-size": {
+      "key": "{form.text-input.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.text-input.background-image.size}"
+      },
+      "name": "token-form-text-input-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-text-input-background-image-position-x": {
+      "key": "{form.text-input.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.text-input.background-image.position-x}"
+      },
+      "name": "token-form-text-input-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-date": {
+      "key": "{form.text-input.background-image.data-url-date}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-date}"
+      },
+      "name": "token-form-text-input-background-image-data-url-date",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-date"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-time": {
+      "key": "{form.text-input.background-image.data-url-time}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-time}"
+      },
+      "name": "token-form-text-input-background-image-data-url-time",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-time"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search": {
+      "key": "{form.text-input.background-image.data-url-search}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-cancel": {
+      "key": "{form.text-input.background-image.data-url-search-cancel}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-cancel}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-cancel",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-cancel"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-loading": {
+      "key": "{form.text-input.background-image.data-url-search-loading}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color and animation are hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-loading}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-loading",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-loading"
+      ]
+    },
+    "token-form-toggle-width": {
+      "key": "{form.toggle.width}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{form.toggle.width}"
+      },
+      "name": "token-form-toggle-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "width"
+      ]
+    },
+    "token-form-toggle-height": {
+      "key": "{form.toggle.height}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.toggle.height}"
+      },
+      "name": "token-form-toggle-height",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "height"
+      ]
+    },
+    "token-form-toggle-base-surface-color-default": {
+      "key": "{form.toggle.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "comment": "the toggle has a different base surface color, compared to the other controls",
+        "key": "{form.toggle.base.surface-color.default}"
+      },
+      "name": "token-form-toggle-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-toggle-border-radius": {
+      "key": "{form.toggle.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.toggle.border.radius}"
+      },
+      "name": "token-form-toggle-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-toggle-border-width": {
+      "key": "{form.toggle.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.toggle.border.width}"
+      },
+      "name": "token-form-toggle-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-toggle-background-image-size": {
+      "key": "{form.toggle.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.toggle.background-image.size}"
+      },
+      "name": "token-form-toggle-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-toggle-background-image-position-x": {
+      "key": "{form.toggle.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{form.toggle.background-image.position-x}"
+      },
+      "name": "token-form-toggle-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-toggle-background-image-data-url": {
+      "key": "{form.toggle.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url}"
+      },
+      "name": "token-form-toggle-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-toggle-background-image-data-url-disabled": {
+      "key": "{form.toggle.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url-disabled}"
+      },
+      "name": "token-form-toggle-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-toggle-transition-duration": {
+      "key": "{form.toggle.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.toggle.transition.duration}"
+      },
+      "name": "token-form-toggle-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-toggle-transition-timing-function": {
+      "key": "{form.toggle.transition.timing-function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.68,
+          -0.2,
+          0.265,
+          1.15
+        ],
+        "key": "{form.toggle.transition.timing-function}"
+      },
+      "name": "token-form-toggle-transition-timing-function",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "timing-function"
+      ]
+    },
+    "token-form-toggle-thumb-size": {
+      "key": "{form.toggle.thumb-size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.toggle.height}",
+        "key": "{form.toggle.thumb-size}"
+      },
+      "name": "token-form-toggle-thumb-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "thumb-size"
+      ]
+    },
+    "token-pagination-nav-control-height": {
+      "key": "{pagination.nav.control.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{pagination.nav.control.height}"
+      },
+      "name": "token-pagination-nav-control-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "height"
+      ]
+    },
+    "token-pagination-nav-control-padding-horizontal": {
+      "key": "{pagination.nav.control.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{pagination.nav.control.padding.horizontal}"
+      },
+      "name": "token-pagination-nav-control-padding-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-pagination-nav-control-focus-inset": {
+      "key": "{pagination.nav.control.focus-inset}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{pagination.nav.control.focus-inset}"
+      },
+      "name": "token-pagination-nav-control-focus-inset",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "focus-inset"
+      ]
+    },
+    "token-pagination-nav-control-icon-spacing": {
+      "key": "{pagination.nav.control.icon-spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.control.icon-spacing}"
+      },
+      "name": "token-pagination-nav-control-icon-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "icon-spacing"
+      ]
+    },
+    "token-pagination-nav-indicator-height": {
+      "key": "{pagination.nav.indicator.height}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.height}"
+      },
+      "name": "token-pagination-nav-indicator-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-pagination-nav-indicator-spacing": {
+      "key": "{pagination.nav.indicator.spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.spacing}"
+      },
+      "name": "token-pagination-nav-indicator-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "spacing"
+      ]
+    },
+    "token-pagination-child-spacing-vertical": {
+      "key": "{pagination.child.spacing.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{pagination.child.spacing.vertical}"
+      },
+      "name": "token-pagination-child-spacing-vertical",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "vertical"
+      ]
+    },
+    "token-pagination-child-spacing-horizontal": {
+      "key": "{pagination.child.spacing.horizontal}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{pagination.child.spacing.horizontal}"
+      },
+      "name": "token-pagination-child-spacing-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-border-width": {
+      "key": "{side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{side-nav.wrapper.border.width}"
+      },
+      "name": "token-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-side-nav-wrapper-border-color": {
+      "key": "{side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "components",
+        "key": "{side-nav.wrapper.border.color}"
+      },
+      "name": "token-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal": {
+      "key": "{side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical": {
+      "key": "{side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-side-nav-toggle-button-border-radius": {
+      "key": "{side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-side-nav-header-home-link-padding": {
+      "key": "{side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.padding}"
+      },
+      "name": "token-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size": {
+      "key": "{side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-side-nav-header-actions-spacing": {
+      "key": "{side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.header.actions.spacing}"
+      },
+      "name": "token-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-side-nav-body-list-margin-vertical": {
+      "key": "{side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-height": {
+      "key": "{side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.height}"
+      },
+      "name": "token-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-horizontal": {
+      "key": "{side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-vertical": {
+      "key": "{side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-spacing-vertical": {
+      "key": "{side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-border-radius": {
+      "key": "{side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-side-nav-color-foreground-primary": {
+      "key": "{side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "components",
+        "key": "{side-nav.color.foreground.primary}"
+      },
+      "name": "token-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-foreground-strong": {
+      "key": "{side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#fff",
+        "group": "components",
+        "key": "{side-nav.color.foreground.strong}"
+      },
+      "name": "token-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-side-nav-color-foreground-faint": {
+      "key": "{side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "components",
+        "key": "{side-nav.color.foreground.faint}"
+      },
+      "name": "token-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-side-nav-color-surface-primary": {
+      "key": "{side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "components",
+        "key": "{side-nav.color.surface.primary}"
+      },
+      "name": "token-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-hover": {
+      "key": "{side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-active": {
+      "key": "{side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-tabs-tab-height-medium": {
+      "key": "{tabs.tab.height.medium}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{tabs.tab.height.medium}"
+      },
+      "name": "token-tabs-tab-height-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-height-large": {
+      "key": "{tabs.tab.height.large}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{tabs.tab.height.large}"
+      },
+      "name": "token-tabs-tab-height-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-medium": {
+      "key": "{tabs.tab.padding.horizontal.medium}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.medium}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-large": {
+      "key": "{tabs.tab.padding.horizontal.large}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.large}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-vertical": {
+      "key": "{tabs.tab.padding.vertical}",
+      "$type": "dimension",
+      "$value": "0px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "0",
+        "unit": "px",
+        "key": "{tabs.tab.padding.vertical}"
+      },
+      "name": "token-tabs-tab-padding-vertical",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tabs-tab-border-radius": {
+      "key": "{tabs.tab.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tabs.tab.border-radius}"
+      },
+      "name": "token-tabs-tab-border-radius",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "border-radius"
+      ]
+    },
+    "token-tabs-tab-focus-inset": {
+      "key": "{tabs.tab.focus-inset}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.focus-inset}"
+      },
+      "name": "token-tabs-tab-focus-inset",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "focus-inset"
+      ]
+    },
+    "token-tabs-tab-gutter": {
+      "key": "{tabs.tab.gutter}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.gutter}"
+      },
+      "name": "token-tabs-tab-gutter",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "gutter"
+      ]
+    },
+    "token-tabs-indicator-height": {
+      "key": "{tabs.indicator.height}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{tabs.indicator.height}"
+      },
+      "name": "token-tabs-indicator-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-tabs-indicator-transition-function": {
+      "key": "{tabs.indicator.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.5,
+          1,
+          0.89,
+          1
+        ],
+        "key": "{tabs.indicator.transition.function}"
+      },
+      "name": "token-tabs-indicator-transition-function",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "function"
+      ]
+    },
+    "token-tabs-indicator-transition-duration": {
+      "key": "{tabs.indicator.transition.duration}",
+      "$type": "duration",
+      "$value": "0.6s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.6",
+        "unit": "s",
+        "key": "{tabs.indicator.transition.duration}"
+      },
+      "name": "token-tabs-indicator-transition-duration",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-tabs-divider-height": {
+      "key": "{tabs.divider.height}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{tabs.divider.height}"
+      },
+      "name": "token-tabs-divider-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "divider",
+        "height"
+      ]
+    },
+    "token-tooltip-border-radius": {
+      "key": "{tooltip.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tooltip.border-radius}"
+      },
+      "name": "token-tooltip-border-radius",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "border-radius"
+      ]
+    },
+    "token-tooltip-color-foreground-primary": {
+      "key": "{tooltip.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-high-contrast)",
+        "group": "components",
+        "key": "{tooltip.color.foreground.primary}"
+      },
+      "name": "token-tooltip-color-foreground-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-tooltip-color-surface-primary": {
+      "key": "{tooltip.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-700)",
+        "group": "components",
+        "key": "{tooltip.color.surface.primary}"
+      },
+      "name": "token-tooltip-color-surface-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-tooltip-focus-offset": {
+      "key": "{tooltip.focus-offset}",
+      "$type": "dimension",
+      "$value": "-2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "-2",
+        "unit": "px",
+        "key": "{tooltip.focus-offset}"
+      },
+      "name": "token-tooltip-focus-offset",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "focus-offset"
+      ]
+    },
+    "token-tooltip-max-width": {
+      "key": "{tooltip.max-width}",
+      "$type": "dimension",
+      "$value": "280px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "280",
+        "unit": "px",
+        "key": "{tooltip.max-width}"
+      },
+      "name": "token-tooltip-max-width",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "max-width"
+      ]
+    },
+    "token-tooltip-padding-horizontal": {
+      "key": "{tooltip.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tooltip.padding.horizontal}"
+      },
+      "name": "token-tooltip-padding-horizontal",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-tooltip-padding-vertical": {
+      "key": "{tooltip.padding.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{tooltip.padding.vertical}"
+      },
+      "name": "token-tooltip-padding-vertical",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tooltip-transition-function": {
+      "key": "{tooltip.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.54,
+          1.5,
+          0.38,
+          1.11
+        ],
+        "key": "{tooltip.transition.function}"
+      },
+      "name": "token-tooltip-transition-function",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "transition",
+        "function"
+      ]
+    },
+    "token-typography-font-stack-display": {
+      "key": "{typography.font-stack.display}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.display.macOS}",
+          "{typography.font-stack.sans.display.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.display.emoji}"
+        ],
+        "key": "{typography.font-stack.display}"
+      },
+      "name": "token-typography-font-stack-display",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "display"
+      ]
+    },
+    "token-typography-font-stack-text": {
+      "key": "{typography.font-stack.text}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.text.macOS}",
+          "{typography.font-stack.sans.text.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.text.emoji}"
+        ],
+        "key": "{typography.font-stack.text}"
+      },
+      "name": "token-typography-font-stack-text",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "text"
+      ]
+    },
+    "token-typography-font-stack-code": {
+      "key": "{typography.font-stack.code}",
+      "$type": "font-family",
+      "$value": "ui-monospace, Menlo, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.monospace.code.macOS}",
+          "{typography.font-stack.monospace.code.windows}",
+          "monospace"
+        ],
+        "key": "{typography.font-stack.code}"
+      },
+      "name": "token-typography-font-stack-code",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "code"
+      ]
+    },
+    "token-typography-font-weight-regular": {
+      "key": "{typography.font-weight.regular}",
+      "$type": "font-weight",
+      "$value": "400",
+      "$modes": {
+        "default": "400",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "400",
+        "$modes": {
+          "default": "400",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.regular}"
+      },
+      "name": "token-typography-font-weight-regular",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "regular"
+      ]
+    },
+    "token-typography-font-weight-medium": {
+      "key": "{typography.font-weight.medium}",
+      "$type": "font-weight",
+      "$value": "500",
+      "$modes": {
+        "default": "500",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "500",
+        "$modes": {
+          "default": "500",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.medium}"
+      },
+      "name": "token-typography-font-weight-medium",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "medium"
+      ]
+    },
+    "token-typography-font-weight-semibold": {
+      "key": "{typography.font-weight.semibold}",
+      "$type": "font-weight",
+      "$value": "600",
+      "$modes": {
+        "default": "600",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "600",
+        "$modes": {
+          "default": "600",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.semibold}"
+      },
+      "name": "token-typography-font-weight-semibold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "semibold"
+      ]
+    },
+    "token-typography-font-weight-bold": {
+      "key": "{typography.font-weight.bold}",
+      "$type": "font-weight",
+      "$value": "700",
+      "$modes": {
+        "default": "700",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "700",
+        "$modes": {
+          "default": "700",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.bold}"
+      },
+      "name": "token-typography-font-weight-bold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "bold"
+      ]
+    },
+    "token-typography-display-500-font-family": {
+      "key": "{typography.display-500.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-500.font-family}"
+      },
+      "name": "token-typography-display-500-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-family"
+      ]
+    },
+    "token-typography-display-500-font-size": {
+      "key": "{typography.display-500.font-size}",
+      "$type": "font-size",
+      "$value": "1.875rem",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "30",
+        "unit": "px",
+        "comment": "30px/1.875rem",
+        "key": "{typography.display-500.font-size}"
+      },
+      "name": "token-typography-display-500-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-size"
+      ]
+    },
+    "token-typography-display-500-line-height": {
+      "key": "{typography.display-500.line-height}",
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "original": {
+        "$type": "number",
+        "$value": 1.2666,
+        "comment": "38px",
+        "key": "{typography.display-500.line-height}"
+      },
+      "name": "token-typography-display-500-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "line-height"
+      ]
+    },
+    "token-typography-display-400-font-family": {
+      "key": "{typography.display-400.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-400.font-family}"
+      },
+      "name": "token-typography-display-400-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-family"
+      ]
+    },
+    "token-typography-display-400-font-size": {
+      "key": "{typography.display-400.font-size}",
+      "$type": "font-size",
+      "$value": "1.5rem",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "24",
+        "unit": "px",
+        "comment": "24px/1.5rem",
+        "key": "{typography.display-400.font-size}"
+      },
+      "name": "token-typography-display-400-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-size"
+      ]
+    },
+    "token-typography-display-400-line-height": {
+      "key": "{typography.display-400.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "32px",
+        "key": "{typography.display-400.line-height}"
+      },
+      "name": "token-typography-display-400-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-font-family": {
+      "key": "{typography.display-300.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-300.font-family}"
+      },
+      "name": "token-typography-display-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-family"
+      ]
+    },
+    "token-typography-display-300-font-size": {
+      "key": "{typography.display-300.font-size}",
+      "$type": "font-size",
+      "$value": "1.125rem",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "18",
+        "unit": "px",
+        "comment": "18px/1.125rem",
+        "key": "{typography.display-300.font-size}"
+      },
+      "name": "token-typography-display-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-size"
+      ]
+    },
+    "token-typography-display-300-line-height": {
+      "key": "{typography.display-300.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "24px",
+        "key": "{typography.display-300.line-height}"
+      },
+      "name": "token-typography-display-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-letter-spacing": {
+      "key": "{typography.display-300.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-300.letter-spacing}"
+      },
+      "name": "token-typography-display-300-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-200-font-family": {
+      "key": "{typography.display-200.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-200.font-family}"
+      },
+      "name": "token-typography-display-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-family"
+      ]
+    },
+    "token-typography-display-200-font-size": {
+      "key": "{typography.display-200.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.display-200.font-size}"
+      },
+      "name": "token-typography-display-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-size"
+      ]
+    },
+    "token-typography-display-200-line-height": {
+      "key": "{typography.display-200.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.display-200.line-height}"
+      },
+      "name": "token-typography-display-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "line-height"
+      ]
+    },
+    "token-typography-display-200-letter-spacing": {
+      "key": "{typography.display-200.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-200.letter-spacing}"
+      },
+      "name": "token-typography-display-200-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-100-font-family": {
+      "key": "{typography.display-100.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-100.font-family}"
+      },
+      "name": "token-typography-display-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-family"
+      ]
+    },
+    "token-typography-display-100-font-size": {
+      "key": "{typography.display-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.display-100.font-size}"
+      },
+      "name": "token-typography-display-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-size"
+      ]
+    },
+    "token-typography-display-100-line-height": {
+      "key": "{typography.display-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.display-100.line-height}"
+      },
+      "name": "token-typography-display-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "line-height"
+      ]
+    },
+    "token-typography-body-300-font-family": {
+      "key": "{typography.body-300.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-300.font-family}"
+      },
+      "name": "token-typography-body-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-family"
+      ]
+    },
+    "token-typography-body-300-font-size": {
+      "key": "{typography.body-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.body-300.font-size}"
+      },
+      "name": "token-typography-body-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-size"
+      ]
+    },
+    "token-typography-body-300-line-height": {
+      "key": "{typography.body-300.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.body-300.line-height}"
+      },
+      "name": "token-typography-body-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "line-height"
+      ]
+    },
+    "token-typography-body-200-font-family": {
+      "key": "{typography.body-200.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-200.font-family}"
+      },
+      "name": "token-typography-body-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-family"
+      ]
+    },
+    "token-typography-body-200-font-size": {
+      "key": "{typography.body-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.body-200.font-size}"
+      },
+      "name": "token-typography-body-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-size"
+      ]
+    },
+    "token-typography-body-200-line-height": {
+      "key": "{typography.body-200.line-height}",
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.4286,
+        "comment": "20px",
+        "key": "{typography.body-200.line-height}"
+      },
+      "name": "token-typography-body-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "line-height"
+      ]
+    },
+    "token-typography-body-100-font-family": {
+      "key": "{typography.body-100.font-family}",
+      "$type": "font-family",
+      "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-100.font-family}"
+      },
+      "name": "token-typography-body-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-family"
+      ]
+    },
+    "token-typography-body-100-font-size": {
+      "key": "{typography.body-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.body-100.font-size}"
+      },
+      "name": "token-typography-body-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-size"
+      ]
+    },
+    "token-typography-body-100-line-height": {
+      "key": "{typography.body-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.body-100.line-height}"
+      },
+      "name": "token-typography-body-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-100-font-family": {
+      "key": "{typography.code-100.font-family}",
+      "$type": "font-family",
+      "$value": "ui-monospace, Menlo, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-100.font-family}"
+      },
+      "name": "token-typography-code-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-family"
+      ]
+    },
+    "token-typography-code-100-font-size": {
+      "key": "{typography.code-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.code-100.font-size}"
+      },
+      "name": "token-typography-code-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-size"
+      ]
+    },
+    "token-typography-code-100-line-height": {
+      "key": "{typography.code-100.line-height}",
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "original": {
+        "$type": "number",
+        "$value": 1.23,
+        "comment": "16px",
+        "key": "{typography.code-100.line-height}"
+      },
+      "name": "token-typography-code-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-200-font-family": {
+      "key": "{typography.code-200.font-family}",
+      "$type": "font-family",
+      "$value": "ui-monospace, Menlo, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-200.font-family}"
+      },
+      "name": "token-typography-code-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-family"
+      ]
+    },
+    "token-typography-code-200-font-size": {
+      "key": "{typography.code-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.code-200.font-size}"
+      },
+      "name": "token-typography-code-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-size"
+      ]
+    },
+    "token-typography-code-200-line-height": {
+      "key": "{typography.code-200.line-height}",
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.125,
+        "comment": "18px",
+        "key": "{typography.code-200.line-height}"
+      },
+      "name": "token-typography-code-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "line-height"
+      ]
+    },
+    "token-typography-code-300-font-family": {
+      "key": "{typography.code-300.font-family}",
+      "$type": "font-family",
+      "$value": "ui-monospace, Menlo, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-300.font-family}"
+      },
+      "name": "token-typography-code-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-family"
+      ]
+    },
+    "token-typography-code-300-font-size": {
+      "key": "{typography.code-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.code-300.font-size}"
+      },
+      "name": "token-typography-code-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-size"
+      ]
+    },
+    "token-typography-code-300-line-height": {
+      "key": "{typography.code-300.line-height}",
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.25,
+        "comment": "20px",
+        "key": "{typography.code-300.line-height}"
+      },
+      "name": "token-typography-code-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "line-height"
+      ]
+    }
+  },
+  "cds-g0": {
+    "token-border-radius-x-small": {
+      "key": "{border.radius.x-small}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{border.radius.x-small}"
+      },
+      "name": "token-border-radius-x-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "x-small"
+      ]
+    },
+    "token-border-radius-small": {
+      "key": "{border.radius.small}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{border.radius.small}"
+      },
+      "name": "token-border-radius-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "small"
+      ]
+    },
+    "token-border-radius-medium": {
+      "key": "{border.radius.medium}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{border.radius.medium}"
+      },
+      "name": "token-border-radius-medium",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "medium"
+      ]
+    },
+    "token-border-radius-large": {
+      "key": "{border.radius.large}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{border.radius.large}"
+      },
+      "name": "token-border-radius-large",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "large"
+      ]
+    },
+    "token-color-palette-blue-500": {
+      "key": "{color.palette.blue-500}",
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1c345f",
+        "group": "palette",
+        "key": "{color.palette.blue-500}"
+      },
+      "name": "token-color-palette-blue-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-500"
+      ]
+    },
+    "token-color-palette-blue-400": {
+      "key": "{color.palette.blue-400}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0046d1",
+        "group": "palette",
+        "key": "{color.palette.blue-400}"
+      },
+      "name": "token-color-palette-blue-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-400"
+      ]
+    },
+    "token-color-palette-blue-300": {
+      "key": "{color.palette.blue-300}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c56e9",
+        "group": "palette",
+        "key": "{color.palette.blue-300}"
+      },
+      "name": "token-color-palette-blue-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-300"
+      ]
+    },
+    "token-color-palette-blue-200": {
+      "key": "{color.palette.blue-200}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1060ff",
+        "group": "palette",
+        "key": "{color.palette.blue-200}"
+      },
+      "name": "token-color-palette-blue-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-200"
+      ]
+    },
+    "token-color-palette-blue-100": {
+      "key": "{color.palette.blue-100}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cce3fe",
+        "group": "palette",
+        "key": "{color.palette.blue-100}"
+      },
+      "name": "token-color-palette-blue-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-100"
+      ]
+    },
+    "token-color-palette-blue-50": {
+      "key": "{color.palette.blue-50}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2f8ff",
+        "group": "palette",
+        "key": "{color.palette.blue-50}"
+      },
+      "name": "token-color-palette-blue-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-50"
+      ]
+    },
+    "token-color-palette-purple-500": {
+      "key": "{color.palette.purple-500}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#42215b",
+        "group": "palette",
+        "key": "{color.palette.purple-500}"
+      },
+      "name": "token-color-palette-purple-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-500"
+      ]
+    },
+    "token-color-palette-purple-400": {
+      "key": "{color.palette.purple-400}",
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#7b00db",
+        "group": "palette",
+        "key": "{color.palette.purple-400}"
+      },
+      "name": "token-color-palette-purple-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-400"
+      ]
+    },
+    "token-color-palette-purple-300": {
+      "key": "{color.palette.purple-300}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#911ced",
+        "group": "palette",
+        "key": "{color.palette.purple-300}"
+      },
+      "name": "token-color-palette-purple-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-300"
+      ]
+    },
+    "token-color-palette-purple-200": {
+      "key": "{color.palette.purple-200}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#a737ff",
+        "group": "palette",
+        "key": "{color.palette.purple-200}"
+      },
+      "name": "token-color-palette-purple-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-200"
+      ]
+    },
+    "token-color-palette-purple-100": {
+      "key": "{color.palette.purple-100}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#ead2fe",
+        "group": "palette",
+        "key": "{color.palette.purple-100}"
+      },
+      "name": "token-color-palette-purple-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-100"
+      ]
+    },
+    "token-color-palette-purple-50": {
+      "key": "{color.palette.purple-50}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f9f2ff",
+        "group": "palette",
+        "key": "{color.palette.purple-50}"
+      },
+      "name": "token-color-palette-purple-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-50"
+      ]
+    },
+    "token-color-palette-green-500": {
+      "key": "{color.palette.green-500}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#054220",
+        "group": "palette",
+        "key": "{color.palette.green-500}"
+      },
+      "name": "token-color-palette-green-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-500"
+      ]
+    },
+    "token-color-palette-green-400": {
+      "key": "{color.palette.green-400}",
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#006619",
+        "group": "palette",
+        "key": "{color.palette.green-400}"
+      },
+      "name": "token-color-palette-green-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-400"
+      ]
+    },
+    "token-color-palette-green-300": {
+      "key": "{color.palette.green-300}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#00781e",
+        "group": "palette",
+        "key": "{color.palette.green-300}"
+      },
+      "name": "token-color-palette-green-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-300"
+      ]
+    },
+    "token-color-palette-green-200": {
+      "key": "{color.palette.green-200}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#008a22",
+        "group": "palette",
+        "key": "{color.palette.green-200}"
+      },
+      "name": "token-color-palette-green-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-200"
+      ]
+    },
+    "token-color-palette-green-100": {
+      "key": "{color.palette.green-100}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cceeda",
+        "group": "palette",
+        "key": "{color.palette.green-100}"
+      },
+      "name": "token-color-palette-green-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-100"
+      ]
+    },
+    "token-color-palette-green-50": {
+      "key": "{color.palette.green-50}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2fbf6",
+        "group": "palette",
+        "key": "{color.palette.green-50}"
+      },
+      "name": "token-color-palette-green-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-50"
+      ]
+    },
+    "token-color-palette-amber-500": {
+      "key": "{color.palette.amber-500}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#542800",
+        "group": "palette",
+        "key": "{color.palette.amber-500}"
+      },
+      "name": "token-color-palette-amber-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-500"
+      ]
+    },
+    "token-color-palette-amber-400": {
+      "key": "{color.palette.amber-400}",
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#803d00",
+        "group": "palette",
+        "key": "{color.palette.amber-400}"
+      },
+      "name": "token-color-palette-amber-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-400"
+      ]
+    },
+    "token-color-palette-amber-300": {
+      "key": "{color.palette.amber-300}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#9e4b00",
+        "group": "palette",
+        "key": "{color.palette.amber-300}"
+      },
+      "name": "token-color-palette-amber-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-300"
+      ]
+    },
+    "token-color-palette-amber-200": {
+      "key": "{color.palette.amber-200}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#bb5a00",
+        "group": "palette",
+        "key": "{color.palette.amber-200}"
+      },
+      "name": "token-color-palette-amber-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-200"
+      ]
+    },
+    "token-color-palette-amber-100": {
+      "key": "{color.palette.amber-100}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbeabf",
+        "group": "palette",
+        "key": "{color.palette.amber-100}"
+      },
+      "name": "token-color-palette-amber-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-100"
+      ]
+    },
+    "token-color-palette-amber-50": {
+      "key": "{color.palette.amber-50}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9e8",
+        "group": "palette",
+        "key": "{color.palette.amber-50}"
+      },
+      "name": "token-color-palette-amber-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-50"
+      ]
+    },
+    "token-color-palette-red-500": {
+      "key": "{color.palette.red-500}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#51130a",
+        "group": "palette",
+        "key": "{color.palette.red-500}"
+      },
+      "name": "token-color-palette-red-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-500"
+      ]
+    },
+    "token-color-palette-red-400": {
+      "key": "{color.palette.red-400}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#940004",
+        "group": "palette",
+        "key": "{color.palette.red-400}"
+      },
+      "name": "token-color-palette-red-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-400"
+      ]
+    },
+    "token-color-palette-red-300": {
+      "key": "{color.palette.red-300}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c00005",
+        "group": "palette",
+        "key": "{color.palette.red-300}"
+      },
+      "name": "token-color-palette-red-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-300"
+      ]
+    },
+    "token-color-palette-red-200": {
+      "key": "{color.palette.red-200}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#e52228",
+        "group": "palette",
+        "key": "{color.palette.red-200}"
+      },
+      "name": "token-color-palette-red-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-200"
+      ]
+    },
+    "token-color-palette-red-100": {
+      "key": "{color.palette.red-100}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbd4d4",
+        "group": "palette",
+        "key": "{color.palette.red-100}"
+      },
+      "name": "token-color-palette-red-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-100"
+      ]
+    },
+    "token-color-palette-red-50": {
+      "key": "{color.palette.red-50}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff5f5",
+        "group": "palette",
+        "key": "{color.palette.red-50}"
+      },
+      "name": "token-color-palette-red-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-50"
+      ]
+    },
+    "token-color-palette-neutral-700": {
+      "key": "{color.palette.neutral-700}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "palette",
+        "key": "{color.palette.neutral-700}"
+      },
+      "name": "token-color-palette-neutral-700",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-700"
+      ]
+    },
+    "token-color-palette-neutral-600": {
+      "key": "{color.palette.neutral-600}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "palette",
+        "key": "{color.palette.neutral-600}"
+      },
+      "name": "token-color-palette-neutral-600",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-600"
+      ]
+    },
+    "token-color-palette-neutral-500": {
+      "key": "{color.palette.neutral-500}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "palette",
+        "key": "{color.palette.neutral-500}"
+      },
+      "name": "token-color-palette-neutral-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-500"
+      ]
+    },
+    "token-color-palette-neutral-400": {
+      "key": "{color.palette.neutral-400}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "palette",
+        "key": "{color.palette.neutral-400}"
+      },
+      "name": "token-color-palette-neutral-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-400"
+      ]
+    },
+    "token-color-palette-neutral-300": {
+      "key": "{color.palette.neutral-300}",
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c2c5cb",
+        "group": "palette",
+        "key": "{color.palette.neutral-300}"
+      },
+      "name": "token-color-palette-neutral-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-300"
+      ]
+    },
+    "token-color-palette-neutral-200": {
+      "key": "{color.palette.neutral-200}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "palette",
+        "key": "{color.palette.neutral-200}"
+      },
+      "name": "token-color-palette-neutral-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-200"
+      ]
+    },
+    "token-color-palette-neutral-100": {
+      "key": "{color.palette.neutral-100}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f1f2f3",
+        "group": "palette",
+        "key": "{color.palette.neutral-100}"
+      },
+      "name": "token-color-palette-neutral-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-100"
+      ]
+    },
+    "token-color-palette-neutral-50": {
+      "key": "{color.palette.neutral-50}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fafafa",
+        "group": "palette",
+        "key": "{color.palette.neutral-50}"
+      },
+      "name": "token-color-palette-neutral-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-50"
+      ]
+    },
+    "token-color-palette-neutral-0": {
+      "key": "{color.palette.neutral-0}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#ffffff",
+        "cds-g10": "#ffffff",
+        "cds-g90": "#ffffff",
+        "cds-g100": "#ffffff"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.color.white.0}",
+        "group": "palette",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.color.white.0}",
+          "cds-g10": "{carbon.color.white.0}",
+          "cds-g90": "{carbon.color.white.0}",
+          "cds-g100": "{carbon.color.white.0}"
+        },
+        "key": "{color.palette.neutral-0}"
+      },
+      "name": "token-color-palette-neutral-0",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-0"
+      ]
+    },
+    "token-color-palette-alpha-300": {
+      "key": "{color.palette.alpha-300}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "alpha": "0.4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-600}",
+        "alpha": "0.4",
+        "group": "palette",
+        "key": "{color.palette.alpha-300}"
+      },
+      "name": "token-color-palette-alpha-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-300"
+      ]
+    },
+    "token-color-palette-alpha-200": {
+      "key": "{color.palette.alpha-200}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "alpha": "0.2",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.2",
+        "group": "palette",
+        "key": "{color.palette.alpha-200}"
+      },
+      "name": "token-color-palette-alpha-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-200"
+      ]
+    },
+    "token-color-palette-alpha-100": {
+      "key": "{color.palette.alpha-100}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "alpha": "0.1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.1",
+        "group": "palette",
+        "key": "{color.palette.alpha-100}"
+      },
+      "name": "token-color-palette-alpha-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-100"
+      ]
+    },
+    "token-color-border-primary": {
+      "key": "{color.border.primary}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-200}",
+        "group": "semantic",
+        "key": "{color.border.primary}"
+      },
+      "name": "token-color-border-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "primary"
+      ]
+    },
+    "token-color-border-faint": {
+      "key": "{color.border.faint}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-100}",
+        "group": "semantic",
+        "key": "{color.border.faint}"
+      },
+      "name": "token-color-border-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "faint"
+      ]
+    },
+    "token-color-border-strong": {
+      "key": "{color.border.strong}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-300}",
+        "group": "semantic",
+        "key": "{color.border.strong}"
+      },
+      "name": "token-color-border-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "strong"
+      ]
+    },
+    "token-color-border-action": {
+      "key": "{color.border.action}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-100}",
+        "group": "semantic",
+        "key": "{color.border.action}"
+      },
+      "name": "token-color-border-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "action"
+      ]
+    },
+    "token-color-border-highlight": {
+      "key": "{color.border.highlight}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-100}",
+        "group": "semantic",
+        "key": "{color.border.highlight}"
+      },
+      "name": "token-color-border-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "highlight"
+      ]
+    },
+    "token-color-border-success": {
+      "key": "{color.border.success}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-100}",
+        "group": "semantic",
+        "key": "{color.border.success}"
+      },
+      "name": "token-color-border-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "success"
+      ]
+    },
+    "token-color-border-warning": {
+      "key": "{color.border.warning}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-100}",
+        "group": "semantic",
+        "key": "{color.border.warning}"
+      },
+      "name": "token-color-border-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "warning"
+      ]
+    },
+    "token-color-border-critical": {
+      "key": "{color.border.critical}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-100}",
+        "group": "semantic",
+        "key": "{color.border.critical}"
+      },
+      "name": "token-color-border-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "critical"
+      ]
+    },
+    "token-color-focus-action-internal": {
+      "key": "{color.focus.action.internal}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.focus.action.internal}"
+      },
+      "name": "token-color-focus-action-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "internal"
+      ]
+    },
+    "token-color-focus-action-external": {
+      "key": "{color.focus.action.external}",
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#5990ff",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.action.external}"
+      },
+      "name": "token-color-focus-action-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "external"
+      ]
+    },
+    "token-color-focus-critical-internal": {
+      "key": "{color.focus.critical.internal}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.focus.critical.internal}"
+      },
+      "name": "token-color-focus-critical-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "internal"
+      ]
+    },
+    "token-color-focus-critical-external": {
+      "key": "{color.focus.critical.external}",
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#dd7578",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.critical.external}"
+      },
+      "name": "token-color-focus-critical-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "external"
+      ]
+    },
+    "token-color-foreground-strong": {
+      "key": "{color.foreground.strong}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-700}",
+        "group": "semantic",
+        "key": "{color.foreground.strong}"
+      },
+      "name": "token-color-foreground-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-color-foreground-primary": {
+      "key": "{color.foreground.primary}",
+      "$type": "color",
+      "$value": "#161616",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#161616",
+        "cds-g10": "#161616",
+        "cds-g90": "#f4f4f4",
+        "cds-g100": "#f4f4f4"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.themes.white.textPrimary}",
+        "group": "semantic",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.themes.white.textPrimary}",
+          "cds-g10": "{carbon.themes.g10.textPrimary}",
+          "cds-g90": "{carbon.themes.g90.textPrimary}",
+          "cds-g100": "{carbon.themes.g100.textPrimary}"
+        },
+        "key": "{color.foreground.primary}"
+      },
+      "name": "token-color-foreground-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-color-foreground-faint": {
+      "key": "{color.foreground.faint}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "semantic",
+        "key": "{color.foreground.faint}"
+      },
+      "name": "token-color-foreground-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-color-foreground-high-contrast": {
+      "key": "{color.foreground.high-contrast}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.foreground.high-contrast}"
+      },
+      "name": "token-color-foreground-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "high-contrast"
+      ]
+    },
+    "token-color-foreground-disabled": {
+      "key": "{color.foreground.disabled}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "semantic",
+        "key": "{color.foreground.disabled}"
+      },
+      "name": "token-color-foreground-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "disabled"
+      ]
+    },
+    "token-color-foreground-action": {
+      "key": "{color.foreground.action}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "semantic",
+        "key": "{color.foreground.action}"
+      },
+      "name": "token-color-foreground-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action"
+      ]
+    },
+    "token-color-foreground-action-hover": {
+      "key": "{color.foreground.action-hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.foreground.action-hover}"
+      },
+      "name": "token-color-foreground-action-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-hover"
+      ]
+    },
+    "token-color-foreground-action-active": {
+      "key": "{color.foreground.action-active}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "semantic",
+        "key": "{color.foreground.action-active}"
+      },
+      "name": "token-color-foreground-action-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-active"
+      ]
+    },
+    "token-color-foreground-highlight": {
+      "key": "{color.foreground.highlight}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-200}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight}"
+      },
+      "name": "token-color-foreground-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight"
+      ]
+    },
+    "token-color-foreground-highlight-on-surface": {
+      "key": "{color.foreground.highlight-on-surface}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-300}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-on-surface}"
+      },
+      "name": "token-color-foreground-highlight-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-on-surface"
+      ]
+    },
+    "token-color-foreground-highlight-high-contrast": {
+      "key": "{color.foreground.highlight-high-contrast}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-500}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-high-contrast}"
+      },
+      "name": "token-color-foreground-highlight-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-high-contrast"
+      ]
+    },
+    "token-color-foreground-success": {
+      "key": "{color.foreground.success}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-200}",
+        "group": "semantic",
+        "key": "{color.foreground.success}"
+      },
+      "name": "token-color-foreground-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success"
+      ]
+    },
+    "token-color-foreground-success-on-surface": {
+      "key": "{color.foreground.success-on-surface}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-300}",
+        "group": "semantic",
+        "key": "{color.foreground.success-on-surface}"
+      },
+      "name": "token-color-foreground-success-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-on-surface"
+      ]
+    },
+    "token-color-foreground-success-high-contrast": {
+      "key": "{color.foreground.success-high-contrast}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-500}",
+        "group": "semantic",
+        "key": "{color.foreground.success-high-contrast}"
+      },
+      "name": "token-color-foreground-success-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-high-contrast"
+      ]
+    },
+    "token-color-foreground-warning": {
+      "key": "{color.foreground.warning}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-200}",
+        "group": "semantic",
+        "key": "{color.foreground.warning}"
+      },
+      "name": "token-color-foreground-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning"
+      ]
+    },
+    "token-color-foreground-warning-on-surface": {
+      "key": "{color.foreground.warning-on-surface}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-300}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-on-surface}"
+      },
+      "name": "token-color-foreground-warning-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-on-surface"
+      ]
+    },
+    "token-color-foreground-warning-high-contrast": {
+      "key": "{color.foreground.warning-high-contrast}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-500}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-high-contrast}"
+      },
+      "name": "token-color-foreground-warning-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-high-contrast"
+      ]
+    },
+    "token-color-foreground-critical": {
+      "key": "{color.foreground.critical}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-200}",
+        "group": "semantic",
+        "key": "{color.foreground.critical}"
+      },
+      "name": "token-color-foreground-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical"
+      ]
+    },
+    "token-color-foreground-critical-on-surface": {
+      "key": "{color.foreground.critical-on-surface}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-on-surface}"
+      },
+      "name": "token-color-foreground-critical-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-on-surface"
+      ]
+    },
+    "token-color-foreground-critical-high-contrast": {
+      "key": "{color.foreground.critical-high-contrast}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-500}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-high-contrast}"
+      },
+      "name": "token-color-foreground-critical-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-high-contrast"
+      ]
+    },
+    "token-color-page-primary": {
+      "key": "{color.page.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.page.primary}"
+      },
+      "name": "token-color-page-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "primary"
+      ]
+    },
+    "token-color-page-faint": {
+      "key": "{color.page.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.page.faint}"
+      },
+      "name": "token-color-page-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "faint"
+      ]
+    },
+    "token-color-surface-primary": {
+      "key": "{color.surface.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.primary}"
+      },
+      "name": "token-color-surface-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-color-surface-faint": {
+      "key": "{color.surface.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.faint}"
+      },
+      "name": "token-color-surface-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "faint"
+      ]
+    },
+    "token-color-surface-strong": {
+      "key": "{color.surface.strong}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.strong}"
+      },
+      "name": "token-color-surface-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "strong"
+      ]
+    },
+    "token-color-surface-interactive": {
+      "key": "{color.surface.interactive}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.interactive}"
+      },
+      "name": "token-color-surface-interactive",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive"
+      ]
+    },
+    "token-color-surface-interactive-hover": {
+      "key": "{color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-hover}"
+      },
+      "name": "token-color-surface-interactive-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-color-surface-interactive-active": {
+      "key": "{color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-200}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-active}"
+      },
+      "name": "token-color-surface-interactive-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-color-surface-interactive-disabled": {
+      "key": "{color.surface.interactive-disabled}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-disabled}"
+      },
+      "name": "token-color-surface-interactive-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-disabled"
+      ]
+    },
+    "token-color-surface-action": {
+      "key": "{color.surface.action}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-50}",
+        "group": "semantic",
+        "key": "{color.surface.action}"
+      },
+      "name": "token-color-surface-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "action"
+      ]
+    },
+    "token-color-surface-highlight": {
+      "key": "{color.surface.highlight}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-50}",
+        "group": "semantic",
+        "key": "{color.surface.highlight}"
+      },
+      "name": "token-color-surface-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "highlight"
+      ]
+    },
+    "token-color-surface-success": {
+      "key": "{color.surface.success}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-50}",
+        "group": "semantic",
+        "key": "{color.surface.success}"
+      },
+      "name": "token-color-surface-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "success"
+      ]
+    },
+    "token-color-surface-warning": {
+      "key": "{color.surface.warning}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-50}",
+        "group": "semantic",
+        "key": "{color.surface.warning}"
+      },
+      "name": "token-color-surface-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "warning"
+      ]
+    },
+    "token-color-surface-critical": {
+      "key": "{color.surface.critical}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-50}",
+        "group": "semantic",
+        "key": "{color.surface.critical}"
+      },
+      "name": "token-color-surface-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "critical"
+      ]
+    },
+    "token-color-hashicorp-brand": {
+      "key": "{color.hashicorp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hashicorp-brand}",
+        "group": "branding",
+        "key": "{color.hashicorp.brand}"
+      },
+      "name": "token-color-hashicorp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hashicorp",
+        "brand"
+      ]
+    },
+    "token-color-boundary-brand": {
+      "key": "{color.boundary.brand}",
+      "$type": "color",
+      "$value": "#f24c53",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-brand}",
+        "group": "branding",
+        "key": "{color.boundary.brand}"
+      },
+      "name": "token-color-boundary-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "brand"
+      ]
+    },
+    "token-color-boundary-foreground": {
+      "key": "{color.boundary.foreground}",
+      "$type": "color",
+      "$value": "#cf2d32",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-500}",
+        "group": "branding",
+        "key": "{color.boundary.foreground}"
+      },
+      "name": "token-color-boundary-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "foreground"
+      ]
+    },
+    "token-color-boundary-surface": {
+      "key": "{color.boundary.surface}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.surface}"
+      },
+      "name": "token-color-boundary-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "surface"
+      ]
+    },
+    "token-color-boundary-border": {
+      "key": "{color.boundary.border}",
+      "$type": "color",
+      "$value": "#fbd7d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-100}",
+        "group": "branding",
+        "key": "{color.boundary.border}"
+      },
+      "name": "token-color-boundary-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "border"
+      ]
+    },
+    "token-color-boundary-gradient-primary-start": {
+      "key": "{color.boundary.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#f97076",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-300}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.start}"
+      },
+      "name": "token-color-boundary-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-primary-stop": {
+      "key": "{color.boundary.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#db363b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-400}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.stop}"
+      },
+      "name": "token-color-boundary-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-boundary-gradient-faint-start": {
+      "key": "{color.boundary.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffafa",
+        "group": "branding",
+        "comment": "this is the 'boundary-50' value at 25% opacity on white",
+        "key": "{color.boundary.gradient.faint.start}"
+      },
+      "name": "token-color-boundary-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-faint-stop": {
+      "key": "{color.boundary.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.faint.stop}"
+      },
+      "name": "token-color-boundary-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-consul-brand": {
+      "key": "{color.consul.brand}",
+      "$type": "color",
+      "$value": "#e03875",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-brand}",
+        "group": "branding",
+        "key": "{color.consul.brand}"
+      },
+      "name": "token-color-consul-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "brand"
+      ]
+    },
+    "token-color-consul-foreground": {
+      "key": "{color.consul.foreground}",
+      "$type": "color",
+      "$value": "#d01c5b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-500}",
+        "group": "branding",
+        "key": "{color.consul.foreground}"
+      },
+      "name": "token-color-consul-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "foreground"
+      ]
+    },
+    "token-color-consul-surface": {
+      "key": "{color.consul.surface}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.surface}"
+      },
+      "name": "token-color-consul-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "surface"
+      ]
+    },
+    "token-color-consul-border": {
+      "key": "{color.consul.border}",
+      "$type": "color",
+      "$value": "#ffcede",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-100}",
+        "group": "branding",
+        "key": "{color.consul.border}"
+      },
+      "name": "token-color-consul-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "border"
+      ]
+    },
+    "token-color-consul-gradient-primary-start": {
+      "key": "{color.consul.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#ff99be",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-300}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.start}"
+      },
+      "name": "token-color-consul-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-primary-stop": {
+      "key": "{color.consul.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#da306e",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-400}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.stop}"
+      },
+      "name": "token-color-consul-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-consul-gradient-faint-start": {
+      "key": "{color.consul.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9fb",
+        "group": "branding",
+        "comment": "this is the 'consul-50' value at 25% opacity on white",
+        "key": "{color.consul.gradient.faint.start}"
+      },
+      "name": "token-color-consul-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-faint-stop": {
+      "key": "{color.consul.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.gradient.faint.stop}"
+      },
+      "name": "token-color-consul-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-hcp-brand": {
+      "key": "{color.hcp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hcp-brand}",
+        "group": "branding",
+        "key": "{color.hcp.brand}"
+      },
+      "name": "token-color-hcp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hcp",
+        "brand"
+      ]
+    },
+    "token-color-nomad-brand": {
+      "key": "{color.nomad.brand}",
+      "$type": "color",
+      "$value": "#06d092",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-brand}",
+        "group": "branding",
+        "key": "{color.nomad.brand}"
+      },
+      "name": "token-color-nomad-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "brand"
+      ]
+    },
+    "token-color-nomad-foreground": {
+      "key": "{color.nomad.foreground}",
+      "$type": "color",
+      "$value": "#008661",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-500}",
+        "group": "branding",
+        "key": "{color.nomad.foreground}"
+      },
+      "name": "token-color-nomad-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "foreground"
+      ]
+    },
+    "token-color-nomad-surface": {
+      "key": "{color.nomad.surface}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.surface}"
+      },
+      "name": "token-color-nomad-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "surface"
+      ]
+    },
+    "token-color-nomad-border": {
+      "key": "{color.nomad.border}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.border}"
+      },
+      "name": "token-color-nomad-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "border"
+      ]
+    },
+    "token-color-nomad-gradient-primary-start": {
+      "key": "{color.nomad.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.start}"
+      },
+      "name": "token-color-nomad-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-primary-stop": {
+      "key": "{color.nomad.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#60dea9",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-200}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.stop}"
+      },
+      "name": "token-color-nomad-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-nomad-gradient-faint-start": {
+      "key": "{color.nomad.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f3fff9",
+        "group": "branding",
+        "comment": "this is the 'nomad-50' value at 25% opacity on white",
+        "key": "{color.nomad.gradient.faint.start}"
+      },
+      "name": "token-color-nomad-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-faint-stop": {
+      "key": "{color.nomad.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.faint.stop}"
+      },
+      "name": "token-color-nomad-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-packer-brand": {
+      "key": "{color.packer.brand}",
+      "$type": "color",
+      "$value": "#02a8ef",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-brand}",
+        "group": "branding",
+        "key": "{color.packer.brand}"
+      },
+      "name": "token-color-packer-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "brand"
+      ]
+    },
+    "token-color-packer-foreground": {
+      "key": "{color.packer.foreground}",
+      "$type": "color",
+      "$value": "#007eb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-500}",
+        "group": "branding",
+        "key": "{color.packer.foreground}"
+      },
+      "name": "token-color-packer-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "foreground"
+      ]
+    },
+    "token-color-packer-surface": {
+      "key": "{color.packer.surface}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.surface}"
+      },
+      "name": "token-color-packer-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "surface"
+      ]
+    },
+    "token-color-packer-border": {
+      "key": "{color.packer.border}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.border}"
+      },
+      "name": "token-color-packer-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "border"
+      ]
+    },
+    "token-color-packer-gradient-primary-start": {
+      "key": "{color.packer.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.start}"
+      },
+      "name": "token-color-packer-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-primary-stop": {
+      "key": "{color.packer.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#63d0ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-200}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.stop}"
+      },
+      "name": "token-color-packer-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-packer-gradient-faint-start": {
+      "key": "{color.packer.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fcff",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#F3FCFF",
+        "group": "branding",
+        "comment": "this is the 'packer-50' value at 25% opacity on white",
+        "key": "{color.packer.gradient.faint.start}"
+      },
+      "name": "token-color-packer-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-faint-stop": {
+      "key": "{color.packer.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.gradient.faint.stop}"
+      },
+      "name": "token-color-packer-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-terraform-brand": {
+      "key": "{color.terraform.brand}",
+      "$type": "color",
+      "$value": "#7b42bc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-brand}",
+        "group": "branding",
+        "key": "{color.terraform.brand}"
+      },
+      "name": "token-color-terraform-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand"
+      ]
+    },
+    "token-color-terraform-brand-on-dark": {
+      "key": "{color.terraform.brand-on-dark}",
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "original": {
+        "$type": "color",
+        "$value": "#a067da",
+        "group": "branding",
+        "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+        "key": "{color.terraform.brand-on-dark}"
+      },
+      "name": "token-color-terraform-brand-on-dark",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand-on-dark"
+      ]
+    },
+    "token-color-terraform-foreground": {
+      "key": "{color.terraform.foreground}",
+      "$type": "color",
+      "$value": "#773cb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-500}",
+        "group": "branding",
+        "key": "{color.terraform.foreground}"
+      },
+      "name": "token-color-terraform-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "foreground"
+      ]
+    },
+    "token-color-terraform-surface": {
+      "key": "{color.terraform.surface}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.surface}"
+      },
+      "name": "token-color-terraform-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "surface"
+      ]
+    },
+    "token-color-terraform-border": {
+      "key": "{color.terraform.border}",
+      "$type": "color",
+      "$value": "#ebdbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-100}",
+        "group": "branding",
+        "key": "{color.terraform.border}"
+      },
+      "name": "token-color-terraform-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "border"
+      ]
+    },
+    "token-color-terraform-gradient-primary-start": {
+      "key": "{color.terraform.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bb8deb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-300}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.start}"
+      },
+      "name": "token-color-terraform-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-primary-stop": {
+      "key": "{color.terraform.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#844fba",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-400}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.stop}"
+      },
+      "name": "token-color-terraform-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-terraform-gradient-faint-start": {
+      "key": "{color.terraform.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fcfaff",
+        "group": "branding",
+        "comment": "this is the 'terraform-50' value at 25% opacity on white",
+        "key": "{color.terraform.gradient.faint.start}"
+      },
+      "name": "token-color-terraform-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-faint-stop": {
+      "key": "{color.terraform.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.faint.stop}"
+      },
+      "name": "token-color-terraform-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-brand": {
+      "key": "{color.vagrant.brand}",
+      "$type": "color",
+      "$value": "#1868f2",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-brand}",
+        "group": "branding",
+        "key": "{color.vagrant.brand}"
+      },
+      "name": "token-color-vagrant-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "brand"
+      ]
+    },
+    "token-color-vagrant-foreground": {
+      "key": "{color.vagrant.foreground}",
+      "$type": "color",
+      "$value": "#1c61d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-500}",
+        "group": "branding",
+        "key": "{color.vagrant.foreground}"
+      },
+      "name": "token-color-vagrant-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "foreground"
+      ]
+    },
+    "token-color-vagrant-surface": {
+      "key": "{color.vagrant.surface}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.surface}"
+      },
+      "name": "token-color-vagrant-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "surface"
+      ]
+    },
+    "token-color-vagrant-border": {
+      "key": "{color.vagrant.border}",
+      "$type": "color",
+      "$value": "#c7dbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-100}",
+        "group": "branding",
+        "key": "{color.vagrant.border}"
+      },
+      "name": "token-color-vagrant-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "border"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-start": {
+      "key": "{color.vagrant.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#639cff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-300}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.start}"
+      },
+      "name": "token-color-vagrant-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-stop": {
+      "key": "{color.vagrant.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#2e71e5",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-400}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.stop}"
+      },
+      "name": "token-color-vagrant-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-start": {
+      "key": "{color.vagrant.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f4faff",
+        "group": "branding",
+        "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+        "key": "{color.vagrant.gradient.faint.start}"
+      },
+      "name": "token-color-vagrant-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-stop": {
+      "key": "{color.vagrant.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.faint.stop}"
+      },
+      "name": "token-color-vagrant-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-brand": {
+      "key": "{color.vault-radar.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-brand}",
+        "group": "branding",
+        "key": "{color.vault-radar.brand}"
+      },
+      "name": "token-color-vault-radar-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand"
+      ]
+    },
+    "token-color-vault-radar-brand-alt": {
+      "key": "{color.vault-radar.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+        "key": "{color.vault-radar.brand-alt}"
+      },
+      "name": "token-color-vault-radar-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-radar-foreground": {
+      "key": "{color.vault-radar.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-500}",
+        "group": "branding",
+        "key": "{color.vault-radar.foreground}"
+      },
+      "name": "token-color-vault-radar-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "foreground"
+      ]
+    },
+    "token-color-vault-radar-surface": {
+      "key": "{color.vault-radar.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.surface}"
+      },
+      "name": "token-color-vault-radar-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "surface"
+      ]
+    },
+    "token-color-vault-radar-border": {
+      "key": "{color.vault-radar.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.border}"
+      },
+      "name": "token-color-vault-radar-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "border"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-start": {
+      "key": "{color.vault-radar.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.start}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-stop": {
+      "key": "{color.vault-radar.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-200}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-start": {
+      "key": "{color.vault-radar.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+        "key": "{color.vault-radar.gradient.faint.start}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-stop": {
+      "key": "{color.vault-radar.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-brand": {
+      "key": "{color.vault-secrets.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-brand}",
+        "group": "branding",
+        "key": "{color.vault-secrets.brand}"
+      },
+      "name": "token-color-vault-secrets-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand"
+      ]
+    },
+    "token-color-vault-secrets-brand-alt": {
+      "key": "{color.vault-secrets.brand-alt}",
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "original": {
+        "group": "branding",
+        "$type": "color",
+        "$value": "#000",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+        "key": "{color.vault-secrets.brand-alt}"
+      },
+      "name": "token-color-vault-secrets-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-secrets-foreground": {
+      "key": "{color.vault-secrets.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-500}",
+        "group": "branding",
+        "key": "{color.vault-secrets.foreground}"
+      },
+      "name": "token-color-vault-secrets-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "foreground"
+      ]
+    },
+    "token-color-vault-secrets-surface": {
+      "key": "{color.vault-secrets.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.surface}"
+      },
+      "name": "token-color-vault-secrets-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "surface"
+      ]
+    },
+    "token-color-vault-secrets-border": {
+      "key": "{color.vault-secrets.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.border}"
+      },
+      "name": "token-color-vault-secrets-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "border"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-start": {
+      "key": "{color.vault-secrets.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-stop": {
+      "key": "{color.vault-secrets.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-200}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-start": {
+      "key": "{color.vault-secrets.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+        "key": "{color.vault-secrets.gradient.faint.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-stop": {
+      "key": "{color.vault-secrets.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-brand": {
+      "key": "{color.vault.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-brand}",
+        "group": "branding",
+        "key": "{color.vault.brand}"
+      },
+      "name": "token-color-vault-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand"
+      ]
+    },
+    "token-color-vault-brand-alt": {
+      "key": "{color.vault.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+        "key": "{color.vault.brand-alt}"
+      },
+      "name": "token-color-vault-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-foreground": {
+      "key": "{color.vault.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-500}",
+        "group": "branding",
+        "key": "{color.vault.foreground}"
+      },
+      "name": "token-color-vault-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "foreground"
+      ]
+    },
+    "token-color-vault-surface": {
+      "key": "{color.vault.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.surface}"
+      },
+      "name": "token-color-vault-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "surface"
+      ]
+    },
+    "token-color-vault-border": {
+      "key": "{color.vault.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.border}"
+      },
+      "name": "token-color-vault-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "border"
+      ]
+    },
+    "token-color-vault-gradient-primary-start": {
+      "key": "{color.vault.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.start}"
+      },
+      "name": "token-color-vault-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-primary-stop": {
+      "key": "{color.vault.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-200}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-gradient-faint-start": {
+      "key": "{color.vault.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-50' value at 25% opacity on white",
+        "key": "{color.vault.gradient.faint.start}"
+      },
+      "name": "token-color-vault-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-faint-stop": {
+      "key": "{color.vault.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-brand": {
+      "key": "{color.waypoint.brand}",
+      "$type": "color",
+      "$value": "#14c6cb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-brand}",
+        "group": "branding",
+        "key": "{color.waypoint.brand}"
+      },
+      "name": "token-color-waypoint-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "brand"
+      ]
+    },
+    "token-color-waypoint-foreground": {
+      "key": "{color.waypoint.foreground}",
+      "$type": "color",
+      "$value": "#008196",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-500}",
+        "group": "branding",
+        "key": "{color.waypoint.foreground}"
+      },
+      "name": "token-color-waypoint-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "foreground"
+      ]
+    },
+    "token-color-waypoint-surface": {
+      "key": "{color.waypoint.surface}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.surface}"
+      },
+      "name": "token-color-waypoint-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "surface"
+      ]
+    },
+    "token-color-waypoint-border": {
+      "key": "{color.waypoint.border}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.border}"
+      },
+      "name": "token-color-waypoint-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "border"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-start": {
+      "key": "{color.waypoint.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.start}"
+      },
+      "name": "token-color-waypoint-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-stop": {
+      "key": "{color.waypoint.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#62d4dc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-200}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.stop}"
+      },
+      "name": "token-color-waypoint-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-start": {
+      "key": "{color.waypoint.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f6feff",
+        "group": "branding",
+        "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+        "key": "{color.waypoint.gradient.faint.start}"
+      },
+      "name": "token-color-waypoint-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-stop": {
+      "key": "{color.waypoint.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.faint.stop}"
+      },
+      "name": "token-color-waypoint-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-elevation-inset-box-shadow": {
+      "key": "{elevation.inset.box-shadow}",
+      "$value": "inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-01}",
+        "key": "{elevation.inset.box-shadow}"
+      },
+      "name": "token-elevation-inset-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-low-box-shadow": {
+      "key": "{elevation.low.box-shadow}",
+      "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+        "key": "{elevation.low.box-shadow}"
+      },
+      "name": "token-elevation-low-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-mid-box-shadow": {
+      "key": "{elevation.mid.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+        "key": "{elevation.mid.box-shadow}"
+      },
+      "name": "token-elevation-mid-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-high-box-shadow": {
+      "key": "{elevation.high.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+        "key": "{elevation.high.box-shadow}"
+      },
+      "name": "token-elevation-high-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-higher-box-shadow": {
+      "key": "{elevation.higher.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+        "key": "{elevation.higher.box-shadow}"
+      },
+      "name": "token-elevation-higher-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-overlay-box-shadow": {
+      "key": "{elevation.overlay.box-shadow}",
+      "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+        "key": "{elevation.overlay.box-shadow}"
+      },
+      "name": "token-elevation-overlay-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-surface-inset-box-shadow": {
+      "key": "{surface.inset.box-shadow}",
+      "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+        "key": "{surface.inset.box-shadow}"
+      },
+      "name": "token-surface-inset-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-surface-base-box-shadow": {
+      "key": "{surface.base.box-shadow}",
+      "$value": "0 0 0 1px #656a7633",
+      "original": {
+        "$value": "{elevation.base.box-shadow-border}",
+        "key": "{surface.base.box-shadow}"
+      },
+      "name": "token-surface-base-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "base",
+        "box-shadow"
+      ]
+    },
+    "token-surface-low-box-shadow": {
+      "key": "{surface.low.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+        "key": "{surface.low.box-shadow}"
+      },
+      "name": "token-surface-low-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-surface-mid-box-shadow": {
+      "key": "{surface.mid.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+        "key": "{surface.mid.box-shadow}"
+      },
+      "name": "token-surface-mid-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-surface-high-box-shadow": {
+      "key": "{surface.high.box-shadow}",
+      "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+        "key": "{surface.high.box-shadow}"
+      },
+      "name": "token-surface-high-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-surface-higher-box-shadow": {
+      "key": "{surface.higher.box-shadow}",
+      "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+        "key": "{surface.higher.box-shadow}"
+      },
+      "name": "token-surface-higher-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-surface-overlay-box-shadow": {
+      "key": "{surface.overlay.box-shadow}",
+      "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+        "key": "{surface.overlay.box-shadow}"
+      },
+      "name": "token-surface-overlay-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-action-box-shadow": {
+      "key": "{focus-ring.action.box-shadow}",
+      "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+      "original": {
+        "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+        "key": "{focus-ring.action.box-shadow}"
+      },
+      "name": "token-focus-ring-action-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "action",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-critical-box-shadow": {
+      "key": "{focus-ring.critical.box-shadow}",
+      "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+      "original": {
+        "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+        "key": "{focus-ring.critical.box-shadow}"
+      },
+      "name": "token-focus-ring-critical-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "critical",
+        "box-shadow"
+      ]
+    },
+    "token-app-header-height": {
+      "key": "{app-header.height}",
+      "$type": "dimension",
+      "$value": "60px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "60",
+        "unit": "px",
+        "key": "{app-header.height}"
+      },
+      "name": "token-app-header-height",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "height"
+      ]
+    },
+    "token-app-header-home-link-size": {
+      "key": "{app-header.home-link.size}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-header.home-link.size}"
+      },
+      "name": "token-app-header-home-link-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "home-link",
+        "size"
+      ]
+    },
+    "token-app-header-logo-size": {
+      "key": "{app-header.logo.size}",
+      "$type": "dimension",
+      "$value": "28px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "28",
+        "unit": "px",
+        "key": "{app-header.logo.size}"
+      },
+      "name": "token-app-header-logo-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "logo",
+        "size"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-width": {
+      "key": "{app-side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.border.width}"
+      },
+      "name": "token-app-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-color": {
+      "key": "{app-side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-200)",
+        "group": "components",
+        "key": "{app-side-nav.wrapper.border.color}"
+      },
+      "name": "token-app-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal": {
+      "key": "{app-side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical": {
+      "key": "{app-side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-app-side-nav-toggle-button-border-radius": {
+      "key": "{app-side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-app-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-app-side-nav-header-home-link-padding": {
+      "key": "{app-side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.padding}"
+      },
+      "name": "token-app-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size": {
+      "key": "{app-side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-app-side-nav-header-actions-spacing": {
+      "key": "{app-side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.header.actions.spacing}"
+      },
+      "name": "token-app-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-app-side-nav-body-list-margin-vertical": {
+      "key": "{app-side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{app-side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-height": {
+      "key": "{app-side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.height}"
+      },
+      "name": "token-app-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-horizontal": {
+      "key": "{app-side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-vertical": {
+      "key": "{app-side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-spacing-vertical": {
+      "key": "{app-side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-border-radius": {
+      "key": "{app-side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-app-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-app-side-nav-color-foreground-primary": {
+      "key": "{app-side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.primary}"
+      },
+      "name": "token-app-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-foreground-strong": {
+      "key": "{app-side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.strong}"
+      },
+      "name": "token-app-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-app-side-nav-color-foreground-faint": {
+      "key": "{app-side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.faint}"
+      },
+      "name": "token-app-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-app-side-nav-color-surface-primary": {
+      "key": "{app-side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.surface.primary}"
+      },
+      "name": "token-app-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-hover": {
+      "key": "{app-side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-interactive-hover)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-active": {
+      "key": "{app-side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-300)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-form-label-color": {
+      "key": "{form.label.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.label.color}"
+      },
+      "name": "token-form-label-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "label",
+        "color"
+      ]
+    },
+    "token-form-legend-color": {
+      "key": "{form.legend.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{form.label.color}",
+        "group": "components",
+        "key": "{form.legend.color}"
+      },
+      "name": "token-form-legend-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "legend",
+        "color"
+      ]
+    },
+    "token-form-helper-text-color": {
+      "key": "{form.helper-text.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.helper-text.color}"
+      },
+      "name": "token-form-helper-text-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "helper-text",
+        "color"
+      ]
+    },
+    "token-form-indicator-optional-color": {
+      "key": "{form.indicator.optional.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.indicator.optional.color}"
+      },
+      "name": "token-form-indicator-optional-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "indicator",
+        "optional",
+        "color"
+      ]
+    },
+    "token-form-error-color": {
+      "key": "{form.error.color}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.error.color}"
+      },
+      "name": "token-form-error-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "color"
+      ]
+    },
+    "token-form-error-icon-size": {
+      "key": "{form.error.icon-size}",
+      "$type": "dimension",
+      "$value": "14px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "14",
+        "unit": "px",
+        "key": "{form.error.icon-size}"
+      },
+      "name": "token-form-error-icon-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "icon-size"
+      ]
+    },
+    "token-form-checkbox-size": {
+      "key": "{form.checkbox.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.checkbox.size}"
+      },
+      "name": "token-form-checkbox-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "size"
+      ]
+    },
+    "token-form-checkbox-border-radius": {
+      "key": "{form.checkbox.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.checkbox.border.radius}"
+      },
+      "name": "token-form-checkbox-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-checkbox-border-width": {
+      "key": "{form.checkbox.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.checkbox.border.width}"
+      },
+      "name": "token-form-checkbox-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-checkbox-background-image-size": {
+      "key": "{form.checkbox.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.checkbox.background-image.size}"
+      },
+      "name": "token-form-checkbox-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url": {
+      "key": "{form.checkbox.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url}"
+      },
+      "name": "token-form-checkbox-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-disabled": {
+      "key": "{form.checkbox.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate-disabled": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate-disabled"
+      ]
+    },
+    "token-form-control-base-foreground-value-color": {
+      "key": "{form.control.base.foreground.value-color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.control.base.foreground.value-color}"
+      },
+      "name": "token-form-control-base-foreground-value-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "value-color"
+      ]
+    },
+    "token-form-control-base-foreground-placeholder-color": {
+      "key": "{form.control.base.foreground.placeholder-color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.control.base.foreground.placeholder-color}"
+      },
+      "name": "token-form-control-base-foreground-placeholder-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "placeholder-color"
+      ]
+    },
+    "token-form-control-base-surface-color-default": {
+      "key": "{form.control.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.default}"
+      },
+      "name": "token-form-control-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-surface-color-hover": {
+      "key": "{form.control.base.surface-color.hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-hover}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.hover}"
+      },
+      "name": "token-form-control-base-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-base-border-color-default": {
+      "key": "{form.control.base.border-color.default}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "components",
+        "key": "{form.control.base.border-color.default}"
+      },
+      "name": "token-form-control-base-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-border-color-hover": {
+      "key": "{form.control.base.border-color.hover}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "components",
+        "key": "{form.control.base.border-color.hover}"
+      },
+      "name": "token-form-control-base-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-foreground-color": {
+      "key": "{form.control.checked.foreground-color}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.high-contrast}",
+        "group": "components",
+        "key": "{form.control.checked.foreground-color}"
+      },
+      "name": "token-form-control-checked-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-checked-surface-color-default": {
+      "key": "{form.control.checked.surface-color.default}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.default}"
+      },
+      "name": "token-form-control-checked-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-surface-color-hover": {
+      "key": "{form.control.checked.surface-color.hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.hover}"
+      },
+      "name": "token-form-control-checked-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-border-color-default": {
+      "key": "{form.control.checked.border-color.default}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.default}"
+      },
+      "name": "token-form-control-checked-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-border-color-hover": {
+      "key": "{form.control.checked.border-color.hover}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.hover}"
+      },
+      "name": "token-form-control-checked-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-invalid-border-color-default": {
+      "key": "{form.control.invalid.border-color.default}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.default}"
+      },
+      "name": "token-form-control-invalid-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-invalid-border-color-hover": {
+      "key": "{form.control.invalid.border-color.hover}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-400}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.hover}"
+      },
+      "name": "token-form-control-invalid-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-readonly-foreground-color": {
+      "key": "{form.control.readonly.foreground-color}",
+      "$type": "color",
+      "$value": "#161616",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.primary}",
+        "group": "components",
+        "key": "{form.control.readonly.foreground-color}"
+      },
+      "name": "token-form-control-readonly-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-readonly-surface-color": {
+      "key": "{form.control.readonly.surface-color}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "key": "{form.control.readonly.surface-color}"
+      },
+      "name": "token-form-control-readonly-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "surface-color"
+      ]
+    },
+    "token-form-control-readonly-border-color": {
+      "key": "{form.control.readonly.border-color}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.faint}",
+        "group": "components",
+        "key": "{form.control.readonly.border-color}"
+      },
+      "name": "token-form-control-readonly-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "border-color"
+      ]
+    },
+    "token-form-control-disabled-foreground-color": {
+      "key": "{form.control.disabled.foreground-color}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.foreground-color}"
+      },
+      "name": "token-form-control-disabled-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-disabled-surface-color": {
+      "key": "{form.control.disabled.surface-color}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.surface-color}"
+      },
+      "name": "token-form-control-disabled-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "surface-color"
+      ]
+    },
+    "token-form-control-disabled-border-color": {
+      "key": "{form.control.disabled.border-color}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.primary}",
+        "group": "components",
+        "key": "{form.control.disabled.border-color}"
+      },
+      "name": "token-form-control-disabled-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "border-color"
+      ]
+    },
+    "token-form-control-padding": {
+      "key": "{form.control.padding}",
+      "$type": "dimension",
+      "$value": "7px",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "original": {
+        "$type": "dimension",
+        "$value": "7",
+        "unit": "px",
+        "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+        "key": "{form.control.padding}"
+      },
+      "name": "token-form-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "padding"
+      ]
+    },
+    "token-form-control-border-radius": {
+      "key": "{form.control.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{form.control.border.radius}"
+      },
+      "name": "token-form-control-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-control-border-width": {
+      "key": "{form.control.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.control.border.width}"
+      },
+      "name": "token-form-control-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-size": {
+      "key": "{form.radio.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radio.size}"
+      },
+      "name": "token-form-radio-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "size"
+      ]
+    },
+    "token-form-radio-border-width": {
+      "key": "{form.radio.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radio.border.width}"
+      },
+      "name": "token-form-radio-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-background-image-size": {
+      "key": "{form.radio.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.radio.background-image.size}"
+      },
+      "name": "token-form-radio-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-radio-background-image-data-url": {
+      "key": "{form.radio.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url}"
+      },
+      "name": "token-form-radio-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-radio-background-image-data-url-disabled": {
+      "key": "{form.radio.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url-disabled}"
+      },
+      "name": "token-form-radio-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-radiocard-group-gap": {
+      "key": "{form.radiocard-group.gap}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radiocard-group.gap}"
+      },
+      "name": "token-form-radiocard-group-gap",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard-group",
+        "gap"
+      ]
+    },
+    "token-form-radiocard-border-width": {
+      "key": "{form.radiocard.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radiocard.border.width}"
+      },
+      "name": "token-form-radiocard-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radiocard-border-radius": {
+      "key": "{form.radiocard.border.radius}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{form.radiocard.border.radius}"
+      },
+      "name": "token-form-radiocard-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-radiocard-content-padding": {
+      "key": "{form.radiocard.content-padding}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{form.radiocard.content-padding}"
+      },
+      "name": "token-form-radiocard-content-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "content-padding"
+      ]
+    },
+    "token-form-radiocard-control-padding": {
+      "key": "{form.radiocard.control-padding}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{form.radiocard.control-padding}"
+      },
+      "name": "token-form-radiocard-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "control-padding"
+      ]
+    },
+    "token-form-radiocard-transition-duration": {
+      "key": "{form.radiocard.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.radiocard.transition.duration}"
+      },
+      "name": "token-form-radiocard-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-select-background-image-size": {
+      "key": "{form.select.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.select.background-image.size}"
+      },
+      "name": "token-form-select-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-select-background-image-position-right-x": {
+      "key": "{form.select.background-image.position-right-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.select.background-image.position-right-x}"
+      },
+      "name": "token-form-select-background-image-position-right-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-right-x"
+      ]
+    },
+    "token-form-select-background-image-position-top-y": {
+      "key": "{form.select.background-image.position-top-y}",
+      "$type": "dimension",
+      "$value": "9px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "9",
+        "unit": "px",
+        "key": "{form.select.background-image.position-top-y}"
+      },
+      "name": "token-form-select-background-image-position-top-y",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-top-y"
+      ]
+    },
+    "token-form-select-background-image-data-url": {
+      "key": "{form.select.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url}"
+      },
+      "name": "token-form-select-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-select-background-image-data-url-disabled": {
+      "key": "{form.select.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url-disabled}"
+      },
+      "name": "token-form-select-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-text-input-background-image-size": {
+      "key": "{form.text-input.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.text-input.background-image.size}"
+      },
+      "name": "token-form-text-input-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-text-input-background-image-position-x": {
+      "key": "{form.text-input.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.text-input.background-image.position-x}"
+      },
+      "name": "token-form-text-input-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-date": {
+      "key": "{form.text-input.background-image.data-url-date}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-date}"
+      },
+      "name": "token-form-text-input-background-image-data-url-date",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-date"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-time": {
+      "key": "{form.text-input.background-image.data-url-time}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-time}"
+      },
+      "name": "token-form-text-input-background-image-data-url-time",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-time"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search": {
+      "key": "{form.text-input.background-image.data-url-search}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-cancel": {
+      "key": "{form.text-input.background-image.data-url-search-cancel}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-cancel}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-cancel",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-cancel"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-loading": {
+      "key": "{form.text-input.background-image.data-url-search-loading}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color and animation are hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-loading}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-loading",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-loading"
+      ]
+    },
+    "token-form-toggle-width": {
+      "key": "{form.toggle.width}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{form.toggle.width}"
+      },
+      "name": "token-form-toggle-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "width"
+      ]
+    },
+    "token-form-toggle-height": {
+      "key": "{form.toggle.height}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.toggle.height}"
+      },
+      "name": "token-form-toggle-height",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "height"
+      ]
+    },
+    "token-form-toggle-base-surface-color-default": {
+      "key": "{form.toggle.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "comment": "the toggle has a different base surface color, compared to the other controls",
+        "key": "{form.toggle.base.surface-color.default}"
+      },
+      "name": "token-form-toggle-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-toggle-border-radius": {
+      "key": "{form.toggle.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.toggle.border.radius}"
+      },
+      "name": "token-form-toggle-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-toggle-border-width": {
+      "key": "{form.toggle.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.toggle.border.width}"
+      },
+      "name": "token-form-toggle-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-toggle-background-image-size": {
+      "key": "{form.toggle.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.toggle.background-image.size}"
+      },
+      "name": "token-form-toggle-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-toggle-background-image-position-x": {
+      "key": "{form.toggle.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{form.toggle.background-image.position-x}"
+      },
+      "name": "token-form-toggle-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-toggle-background-image-data-url": {
+      "key": "{form.toggle.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url}"
+      },
+      "name": "token-form-toggle-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-toggle-background-image-data-url-disabled": {
+      "key": "{form.toggle.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url-disabled}"
+      },
+      "name": "token-form-toggle-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-toggle-transition-duration": {
+      "key": "{form.toggle.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.toggle.transition.duration}"
+      },
+      "name": "token-form-toggle-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-toggle-transition-timing-function": {
+      "key": "{form.toggle.transition.timing-function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.68,
+          -0.2,
+          0.265,
+          1.15
+        ],
+        "key": "{form.toggle.transition.timing-function}"
+      },
+      "name": "token-form-toggle-transition-timing-function",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "timing-function"
+      ]
+    },
+    "token-form-toggle-thumb-size": {
+      "key": "{form.toggle.thumb-size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.toggle.height}",
+        "key": "{form.toggle.thumb-size}"
+      },
+      "name": "token-form-toggle-thumb-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "thumb-size"
+      ]
+    },
+    "token-pagination-nav-control-height": {
+      "key": "{pagination.nav.control.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{pagination.nav.control.height}"
+      },
+      "name": "token-pagination-nav-control-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "height"
+      ]
+    },
+    "token-pagination-nav-control-padding-horizontal": {
+      "key": "{pagination.nav.control.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{pagination.nav.control.padding.horizontal}"
+      },
+      "name": "token-pagination-nav-control-padding-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-pagination-nav-control-focus-inset": {
+      "key": "{pagination.nav.control.focus-inset}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{pagination.nav.control.focus-inset}"
+      },
+      "name": "token-pagination-nav-control-focus-inset",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "focus-inset"
+      ]
+    },
+    "token-pagination-nav-control-icon-spacing": {
+      "key": "{pagination.nav.control.icon-spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.control.icon-spacing}"
+      },
+      "name": "token-pagination-nav-control-icon-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "icon-spacing"
+      ]
+    },
+    "token-pagination-nav-indicator-height": {
+      "key": "{pagination.nav.indicator.height}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.height}"
+      },
+      "name": "token-pagination-nav-indicator-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-pagination-nav-indicator-spacing": {
+      "key": "{pagination.nav.indicator.spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.spacing}"
+      },
+      "name": "token-pagination-nav-indicator-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "spacing"
+      ]
+    },
+    "token-pagination-child-spacing-vertical": {
+      "key": "{pagination.child.spacing.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{pagination.child.spacing.vertical}"
+      },
+      "name": "token-pagination-child-spacing-vertical",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "vertical"
+      ]
+    },
+    "token-pagination-child-spacing-horizontal": {
+      "key": "{pagination.child.spacing.horizontal}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{pagination.child.spacing.horizontal}"
+      },
+      "name": "token-pagination-child-spacing-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-border-width": {
+      "key": "{side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{side-nav.wrapper.border.width}"
+      },
+      "name": "token-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-side-nav-wrapper-border-color": {
+      "key": "{side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "components",
+        "key": "{side-nav.wrapper.border.color}"
+      },
+      "name": "token-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal": {
+      "key": "{side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical": {
+      "key": "{side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-side-nav-toggle-button-border-radius": {
+      "key": "{side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-side-nav-header-home-link-padding": {
+      "key": "{side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.padding}"
+      },
+      "name": "token-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size": {
+      "key": "{side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-side-nav-header-actions-spacing": {
+      "key": "{side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.header.actions.spacing}"
+      },
+      "name": "token-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-side-nav-body-list-margin-vertical": {
+      "key": "{side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-height": {
+      "key": "{side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.height}"
+      },
+      "name": "token-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-horizontal": {
+      "key": "{side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-vertical": {
+      "key": "{side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-spacing-vertical": {
+      "key": "{side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-border-radius": {
+      "key": "{side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-side-nav-color-foreground-primary": {
+      "key": "{side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "components",
+        "key": "{side-nav.color.foreground.primary}"
+      },
+      "name": "token-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-foreground-strong": {
+      "key": "{side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#fff",
+        "group": "components",
+        "key": "{side-nav.color.foreground.strong}"
+      },
+      "name": "token-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-side-nav-color-foreground-faint": {
+      "key": "{side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "components",
+        "key": "{side-nav.color.foreground.faint}"
+      },
+      "name": "token-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-side-nav-color-surface-primary": {
+      "key": "{side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "components",
+        "key": "{side-nav.color.surface.primary}"
+      },
+      "name": "token-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-hover": {
+      "key": "{side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-active": {
+      "key": "{side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-tabs-tab-height-medium": {
+      "key": "{tabs.tab.height.medium}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{tabs.tab.height.medium}"
+      },
+      "name": "token-tabs-tab-height-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-height-large": {
+      "key": "{tabs.tab.height.large}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{tabs.tab.height.large}"
+      },
+      "name": "token-tabs-tab-height-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-medium": {
+      "key": "{tabs.tab.padding.horizontal.medium}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.medium}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-large": {
+      "key": "{tabs.tab.padding.horizontal.large}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.large}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-vertical": {
+      "key": "{tabs.tab.padding.vertical}",
+      "$type": "dimension",
+      "$value": "0px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "0",
+        "unit": "px",
+        "key": "{tabs.tab.padding.vertical}"
+      },
+      "name": "token-tabs-tab-padding-vertical",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tabs-tab-border-radius": {
+      "key": "{tabs.tab.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tabs.tab.border-radius}"
+      },
+      "name": "token-tabs-tab-border-radius",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "border-radius"
+      ]
+    },
+    "token-tabs-tab-focus-inset": {
+      "key": "{tabs.tab.focus-inset}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.focus-inset}"
+      },
+      "name": "token-tabs-tab-focus-inset",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "focus-inset"
+      ]
+    },
+    "token-tabs-tab-gutter": {
+      "key": "{tabs.tab.gutter}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.gutter}"
+      },
+      "name": "token-tabs-tab-gutter",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "gutter"
+      ]
+    },
+    "token-tabs-indicator-height": {
+      "key": "{tabs.indicator.height}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{tabs.indicator.height}"
+      },
+      "name": "token-tabs-indicator-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-tabs-indicator-transition-function": {
+      "key": "{tabs.indicator.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.5,
+          1,
+          0.89,
+          1
+        ],
+        "key": "{tabs.indicator.transition.function}"
+      },
+      "name": "token-tabs-indicator-transition-function",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "function"
+      ]
+    },
+    "token-tabs-indicator-transition-duration": {
+      "key": "{tabs.indicator.transition.duration}",
+      "$type": "duration",
+      "$value": "0.6s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.6",
+        "unit": "s",
+        "key": "{tabs.indicator.transition.duration}"
+      },
+      "name": "token-tabs-indicator-transition-duration",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-tabs-divider-height": {
+      "key": "{tabs.divider.height}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{tabs.divider.height}"
+      },
+      "name": "token-tabs-divider-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "divider",
+        "height"
+      ]
+    },
+    "token-tooltip-border-radius": {
+      "key": "{tooltip.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tooltip.border-radius}"
+      },
+      "name": "token-tooltip-border-radius",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "border-radius"
+      ]
+    },
+    "token-tooltip-color-foreground-primary": {
+      "key": "{tooltip.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-high-contrast)",
+        "group": "components",
+        "key": "{tooltip.color.foreground.primary}"
+      },
+      "name": "token-tooltip-color-foreground-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-tooltip-color-surface-primary": {
+      "key": "{tooltip.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-700)",
+        "group": "components",
+        "key": "{tooltip.color.surface.primary}"
+      },
+      "name": "token-tooltip-color-surface-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-tooltip-focus-offset": {
+      "key": "{tooltip.focus-offset}",
+      "$type": "dimension",
+      "$value": "-2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "-2",
+        "unit": "px",
+        "key": "{tooltip.focus-offset}"
+      },
+      "name": "token-tooltip-focus-offset",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "focus-offset"
+      ]
+    },
+    "token-tooltip-max-width": {
+      "key": "{tooltip.max-width}",
+      "$type": "dimension",
+      "$value": "280px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "280",
+        "unit": "px",
+        "key": "{tooltip.max-width}"
+      },
+      "name": "token-tooltip-max-width",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "max-width"
+      ]
+    },
+    "token-tooltip-padding-horizontal": {
+      "key": "{tooltip.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tooltip.padding.horizontal}"
+      },
+      "name": "token-tooltip-padding-horizontal",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-tooltip-padding-vertical": {
+      "key": "{tooltip.padding.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{tooltip.padding.vertical}"
+      },
+      "name": "token-tooltip-padding-vertical",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tooltip-transition-function": {
+      "key": "{tooltip.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.54,
+          1.5,
+          0.38,
+          1.11
+        ],
+        "key": "{tooltip.transition.function}"
+      },
+      "name": "token-tooltip-transition-function",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "transition",
+        "function"
+      ]
+    },
+    "token-typography-font-stack-display": {
+      "key": "{typography.font-stack.display}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.display.macOS}",
+          "{typography.font-stack.sans.display.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.display.emoji}"
+        ],
+        "key": "{typography.font-stack.display}"
+      },
+      "name": "token-typography-font-stack-display",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "display"
+      ]
+    },
+    "token-typography-font-stack-text": {
+      "key": "{typography.font-stack.text}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.text.macOS}",
+          "{typography.font-stack.sans.text.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.text.emoji}"
+        ],
+        "key": "{typography.font-stack.text}"
+      },
+      "name": "token-typography-font-stack-text",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "text"
+      ]
+    },
+    "token-typography-font-stack-code": {
+      "key": "{typography.font-stack.code}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.monospace.code.macOS}",
+          "{typography.font-stack.monospace.code.windows}",
+          "monospace"
+        ],
+        "key": "{typography.font-stack.code}"
+      },
+      "name": "token-typography-font-stack-code",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "code"
+      ]
+    },
+    "token-typography-font-weight-regular": {
+      "key": "{typography.font-weight.regular}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "400",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "400",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.regular}"
+      },
+      "name": "token-typography-font-weight-regular",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "regular"
+      ]
+    },
+    "token-typography-font-weight-medium": {
+      "key": "{typography.font-weight.medium}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "500",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "500",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.medium}"
+      },
+      "name": "token-typography-font-weight-medium",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "medium"
+      ]
+    },
+    "token-typography-font-weight-semibold": {
+      "key": "{typography.font-weight.semibold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "600",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "600",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.semibold}"
+      },
+      "name": "token-typography-font-weight-semibold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "semibold"
+      ]
+    },
+    "token-typography-font-weight-bold": {
+      "key": "{typography.font-weight.bold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "700",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "700",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.bold}"
+      },
+      "name": "token-typography-font-weight-bold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "bold"
+      ]
+    },
+    "token-typography-display-500-font-family": {
+      "key": "{typography.display-500.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-500.font-family}"
+      },
+      "name": "token-typography-display-500-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-family"
+      ]
+    },
+    "token-typography-display-500-font-size": {
+      "key": "{typography.display-500.font-size}",
+      "$type": "font-size",
+      "$value": "1.875rem",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "30",
+        "unit": "px",
+        "comment": "30px/1.875rem",
+        "key": "{typography.display-500.font-size}"
+      },
+      "name": "token-typography-display-500-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-size"
+      ]
+    },
+    "token-typography-display-500-line-height": {
+      "key": "{typography.display-500.line-height}",
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "original": {
+        "$type": "number",
+        "$value": 1.2666,
+        "comment": "38px",
+        "key": "{typography.display-500.line-height}"
+      },
+      "name": "token-typography-display-500-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "line-height"
+      ]
+    },
+    "token-typography-display-400-font-family": {
+      "key": "{typography.display-400.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-400.font-family}"
+      },
+      "name": "token-typography-display-400-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-family"
+      ]
+    },
+    "token-typography-display-400-font-size": {
+      "key": "{typography.display-400.font-size}",
+      "$type": "font-size",
+      "$value": "1.5rem",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "24",
+        "unit": "px",
+        "comment": "24px/1.5rem",
+        "key": "{typography.display-400.font-size}"
+      },
+      "name": "token-typography-display-400-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-size"
+      ]
+    },
+    "token-typography-display-400-line-height": {
+      "key": "{typography.display-400.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "32px",
+        "key": "{typography.display-400.line-height}"
+      },
+      "name": "token-typography-display-400-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-font-family": {
+      "key": "{typography.display-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-300.font-family}"
+      },
+      "name": "token-typography-display-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-family"
+      ]
+    },
+    "token-typography-display-300-font-size": {
+      "key": "{typography.display-300.font-size}",
+      "$type": "font-size",
+      "$value": "1.125rem",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "18",
+        "unit": "px",
+        "comment": "18px/1.125rem",
+        "key": "{typography.display-300.font-size}"
+      },
+      "name": "token-typography-display-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-size"
+      ]
+    },
+    "token-typography-display-300-line-height": {
+      "key": "{typography.display-300.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "24px",
+        "key": "{typography.display-300.line-height}"
+      },
+      "name": "token-typography-display-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-letter-spacing": {
+      "key": "{typography.display-300.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-300.letter-spacing}"
+      },
+      "name": "token-typography-display-300-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-200-font-family": {
+      "key": "{typography.display-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-200.font-family}"
+      },
+      "name": "token-typography-display-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-family"
+      ]
+    },
+    "token-typography-display-200-font-size": {
+      "key": "{typography.display-200.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.display-200.font-size}"
+      },
+      "name": "token-typography-display-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-size"
+      ]
+    },
+    "token-typography-display-200-line-height": {
+      "key": "{typography.display-200.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.display-200.line-height}"
+      },
+      "name": "token-typography-display-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "line-height"
+      ]
+    },
+    "token-typography-display-200-letter-spacing": {
+      "key": "{typography.display-200.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-200.letter-spacing}"
+      },
+      "name": "token-typography-display-200-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-100-font-family": {
+      "key": "{typography.display-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-100.font-family}"
+      },
+      "name": "token-typography-display-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-family"
+      ]
+    },
+    "token-typography-display-100-font-size": {
+      "key": "{typography.display-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.display-100.font-size}"
+      },
+      "name": "token-typography-display-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-size"
+      ]
+    },
+    "token-typography-display-100-line-height": {
+      "key": "{typography.display-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.display-100.line-height}"
+      },
+      "name": "token-typography-display-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "line-height"
+      ]
+    },
+    "token-typography-body-300-font-family": {
+      "key": "{typography.body-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-300.font-family}"
+      },
+      "name": "token-typography-body-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-family"
+      ]
+    },
+    "token-typography-body-300-font-size": {
+      "key": "{typography.body-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.body-300.font-size}"
+      },
+      "name": "token-typography-body-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-size"
+      ]
+    },
+    "token-typography-body-300-line-height": {
+      "key": "{typography.body-300.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.body-300.line-height}"
+      },
+      "name": "token-typography-body-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "line-height"
+      ]
+    },
+    "token-typography-body-200-font-family": {
+      "key": "{typography.body-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-200.font-family}"
+      },
+      "name": "token-typography-body-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-family"
+      ]
+    },
+    "token-typography-body-200-font-size": {
+      "key": "{typography.body-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.body-200.font-size}"
+      },
+      "name": "token-typography-body-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-size"
+      ]
+    },
+    "token-typography-body-200-line-height": {
+      "key": "{typography.body-200.line-height}",
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.4286,
+        "comment": "20px",
+        "key": "{typography.body-200.line-height}"
+      },
+      "name": "token-typography-body-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "line-height"
+      ]
+    },
+    "token-typography-body-100-font-family": {
+      "key": "{typography.body-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-100.font-family}"
+      },
+      "name": "token-typography-body-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-family"
+      ]
+    },
+    "token-typography-body-100-font-size": {
+      "key": "{typography.body-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.body-100.font-size}"
+      },
+      "name": "token-typography-body-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-size"
+      ]
+    },
+    "token-typography-body-100-line-height": {
+      "key": "{typography.body-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.body-100.line-height}"
+      },
+      "name": "token-typography-body-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-100-font-family": {
+      "key": "{typography.code-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-100.font-family}"
+      },
+      "name": "token-typography-code-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-family"
+      ]
+    },
+    "token-typography-code-100-font-size": {
+      "key": "{typography.code-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.code-100.font-size}"
+      },
+      "name": "token-typography-code-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-size"
+      ]
+    },
+    "token-typography-code-100-line-height": {
+      "key": "{typography.code-100.line-height}",
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "original": {
+        "$type": "number",
+        "$value": 1.23,
+        "comment": "16px",
+        "key": "{typography.code-100.line-height}"
+      },
+      "name": "token-typography-code-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-200-font-family": {
+      "key": "{typography.code-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-200.font-family}"
+      },
+      "name": "token-typography-code-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-family"
+      ]
+    },
+    "token-typography-code-200-font-size": {
+      "key": "{typography.code-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.code-200.font-size}"
+      },
+      "name": "token-typography-code-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-size"
+      ]
+    },
+    "token-typography-code-200-line-height": {
+      "key": "{typography.code-200.line-height}",
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.125,
+        "comment": "18px",
+        "key": "{typography.code-200.line-height}"
+      },
+      "name": "token-typography-code-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "line-height"
+      ]
+    },
+    "token-typography-code-300-font-family": {
+      "key": "{typography.code-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-300.font-family}"
+      },
+      "name": "token-typography-code-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-family"
+      ]
+    },
+    "token-typography-code-300-font-size": {
+      "key": "{typography.code-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.code-300.font-size}"
+      },
+      "name": "token-typography-code-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-size"
+      ]
+    },
+    "token-typography-code-300-line-height": {
+      "key": "{typography.code-300.line-height}",
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.25,
+        "comment": "20px",
+        "key": "{typography.code-300.line-height}"
+      },
+      "name": "token-typography-code-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "line-height"
+      ]
+    }
+  },
+  "cds-g10": {
+    "token-border-radius-x-small": {
+      "key": "{border.radius.x-small}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{border.radius.x-small}"
+      },
+      "name": "token-border-radius-x-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "x-small"
+      ]
+    },
+    "token-border-radius-small": {
+      "key": "{border.radius.small}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{border.radius.small}"
+      },
+      "name": "token-border-radius-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "small"
+      ]
+    },
+    "token-border-radius-medium": {
+      "key": "{border.radius.medium}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{border.radius.medium}"
+      },
+      "name": "token-border-radius-medium",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "medium"
+      ]
+    },
+    "token-border-radius-large": {
+      "key": "{border.radius.large}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{border.radius.large}"
+      },
+      "name": "token-border-radius-large",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "large"
+      ]
+    },
+    "token-color-palette-blue-500": {
+      "key": "{color.palette.blue-500}",
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1c345f",
+        "group": "palette",
+        "key": "{color.palette.blue-500}"
+      },
+      "name": "token-color-palette-blue-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-500"
+      ]
+    },
+    "token-color-palette-blue-400": {
+      "key": "{color.palette.blue-400}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0046d1",
+        "group": "palette",
+        "key": "{color.palette.blue-400}"
+      },
+      "name": "token-color-palette-blue-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-400"
+      ]
+    },
+    "token-color-palette-blue-300": {
+      "key": "{color.palette.blue-300}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c56e9",
+        "group": "palette",
+        "key": "{color.palette.blue-300}"
+      },
+      "name": "token-color-palette-blue-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-300"
+      ]
+    },
+    "token-color-palette-blue-200": {
+      "key": "{color.palette.blue-200}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1060ff",
+        "group": "palette",
+        "key": "{color.palette.blue-200}"
+      },
+      "name": "token-color-palette-blue-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-200"
+      ]
+    },
+    "token-color-palette-blue-100": {
+      "key": "{color.palette.blue-100}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cce3fe",
+        "group": "palette",
+        "key": "{color.palette.blue-100}"
+      },
+      "name": "token-color-palette-blue-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-100"
+      ]
+    },
+    "token-color-palette-blue-50": {
+      "key": "{color.palette.blue-50}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2f8ff",
+        "group": "palette",
+        "key": "{color.palette.blue-50}"
+      },
+      "name": "token-color-palette-blue-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-50"
+      ]
+    },
+    "token-color-palette-purple-500": {
+      "key": "{color.palette.purple-500}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#42215b",
+        "group": "palette",
+        "key": "{color.palette.purple-500}"
+      },
+      "name": "token-color-palette-purple-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-500"
+      ]
+    },
+    "token-color-palette-purple-400": {
+      "key": "{color.palette.purple-400}",
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#7b00db",
+        "group": "palette",
+        "key": "{color.palette.purple-400}"
+      },
+      "name": "token-color-palette-purple-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-400"
+      ]
+    },
+    "token-color-palette-purple-300": {
+      "key": "{color.palette.purple-300}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#911ced",
+        "group": "palette",
+        "key": "{color.palette.purple-300}"
+      },
+      "name": "token-color-palette-purple-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-300"
+      ]
+    },
+    "token-color-palette-purple-200": {
+      "key": "{color.palette.purple-200}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#a737ff",
+        "group": "palette",
+        "key": "{color.palette.purple-200}"
+      },
+      "name": "token-color-palette-purple-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-200"
+      ]
+    },
+    "token-color-palette-purple-100": {
+      "key": "{color.palette.purple-100}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#ead2fe",
+        "group": "palette",
+        "key": "{color.palette.purple-100}"
+      },
+      "name": "token-color-palette-purple-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-100"
+      ]
+    },
+    "token-color-palette-purple-50": {
+      "key": "{color.palette.purple-50}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f9f2ff",
+        "group": "palette",
+        "key": "{color.palette.purple-50}"
+      },
+      "name": "token-color-palette-purple-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-50"
+      ]
+    },
+    "token-color-palette-green-500": {
+      "key": "{color.palette.green-500}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#054220",
+        "group": "palette",
+        "key": "{color.palette.green-500}"
+      },
+      "name": "token-color-palette-green-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-500"
+      ]
+    },
+    "token-color-palette-green-400": {
+      "key": "{color.palette.green-400}",
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#006619",
+        "group": "palette",
+        "key": "{color.palette.green-400}"
+      },
+      "name": "token-color-palette-green-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-400"
+      ]
+    },
+    "token-color-palette-green-300": {
+      "key": "{color.palette.green-300}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#00781e",
+        "group": "palette",
+        "key": "{color.palette.green-300}"
+      },
+      "name": "token-color-palette-green-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-300"
+      ]
+    },
+    "token-color-palette-green-200": {
+      "key": "{color.palette.green-200}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#008a22",
+        "group": "palette",
+        "key": "{color.palette.green-200}"
+      },
+      "name": "token-color-palette-green-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-200"
+      ]
+    },
+    "token-color-palette-green-100": {
+      "key": "{color.palette.green-100}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cceeda",
+        "group": "palette",
+        "key": "{color.palette.green-100}"
+      },
+      "name": "token-color-palette-green-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-100"
+      ]
+    },
+    "token-color-palette-green-50": {
+      "key": "{color.palette.green-50}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2fbf6",
+        "group": "palette",
+        "key": "{color.palette.green-50}"
+      },
+      "name": "token-color-palette-green-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-50"
+      ]
+    },
+    "token-color-palette-amber-500": {
+      "key": "{color.palette.amber-500}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#542800",
+        "group": "palette",
+        "key": "{color.palette.amber-500}"
+      },
+      "name": "token-color-palette-amber-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-500"
+      ]
+    },
+    "token-color-palette-amber-400": {
+      "key": "{color.palette.amber-400}",
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#803d00",
+        "group": "palette",
+        "key": "{color.palette.amber-400}"
+      },
+      "name": "token-color-palette-amber-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-400"
+      ]
+    },
+    "token-color-palette-amber-300": {
+      "key": "{color.palette.amber-300}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#9e4b00",
+        "group": "palette",
+        "key": "{color.palette.amber-300}"
+      },
+      "name": "token-color-palette-amber-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-300"
+      ]
+    },
+    "token-color-palette-amber-200": {
+      "key": "{color.palette.amber-200}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#bb5a00",
+        "group": "palette",
+        "key": "{color.palette.amber-200}"
+      },
+      "name": "token-color-palette-amber-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-200"
+      ]
+    },
+    "token-color-palette-amber-100": {
+      "key": "{color.palette.amber-100}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbeabf",
+        "group": "palette",
+        "key": "{color.palette.amber-100}"
+      },
+      "name": "token-color-palette-amber-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-100"
+      ]
+    },
+    "token-color-palette-amber-50": {
+      "key": "{color.palette.amber-50}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9e8",
+        "group": "palette",
+        "key": "{color.palette.amber-50}"
+      },
+      "name": "token-color-palette-amber-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-50"
+      ]
+    },
+    "token-color-palette-red-500": {
+      "key": "{color.palette.red-500}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#51130a",
+        "group": "palette",
+        "key": "{color.palette.red-500}"
+      },
+      "name": "token-color-palette-red-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-500"
+      ]
+    },
+    "token-color-palette-red-400": {
+      "key": "{color.palette.red-400}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#940004",
+        "group": "palette",
+        "key": "{color.palette.red-400}"
+      },
+      "name": "token-color-palette-red-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-400"
+      ]
+    },
+    "token-color-palette-red-300": {
+      "key": "{color.palette.red-300}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c00005",
+        "group": "palette",
+        "key": "{color.palette.red-300}"
+      },
+      "name": "token-color-palette-red-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-300"
+      ]
+    },
+    "token-color-palette-red-200": {
+      "key": "{color.palette.red-200}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#e52228",
+        "group": "palette",
+        "key": "{color.palette.red-200}"
+      },
+      "name": "token-color-palette-red-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-200"
+      ]
+    },
+    "token-color-palette-red-100": {
+      "key": "{color.palette.red-100}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbd4d4",
+        "group": "palette",
+        "key": "{color.palette.red-100}"
+      },
+      "name": "token-color-palette-red-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-100"
+      ]
+    },
+    "token-color-palette-red-50": {
+      "key": "{color.palette.red-50}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff5f5",
+        "group": "palette",
+        "key": "{color.palette.red-50}"
+      },
+      "name": "token-color-palette-red-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-50"
+      ]
+    },
+    "token-color-palette-neutral-700": {
+      "key": "{color.palette.neutral-700}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "palette",
+        "key": "{color.palette.neutral-700}"
+      },
+      "name": "token-color-palette-neutral-700",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-700"
+      ]
+    },
+    "token-color-palette-neutral-600": {
+      "key": "{color.palette.neutral-600}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "palette",
+        "key": "{color.palette.neutral-600}"
+      },
+      "name": "token-color-palette-neutral-600",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-600"
+      ]
+    },
+    "token-color-palette-neutral-500": {
+      "key": "{color.palette.neutral-500}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "palette",
+        "key": "{color.palette.neutral-500}"
+      },
+      "name": "token-color-palette-neutral-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-500"
+      ]
+    },
+    "token-color-palette-neutral-400": {
+      "key": "{color.palette.neutral-400}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "palette",
+        "key": "{color.palette.neutral-400}"
+      },
+      "name": "token-color-palette-neutral-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-400"
+      ]
+    },
+    "token-color-palette-neutral-300": {
+      "key": "{color.palette.neutral-300}",
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c2c5cb",
+        "group": "palette",
+        "key": "{color.palette.neutral-300}"
+      },
+      "name": "token-color-palette-neutral-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-300"
+      ]
+    },
+    "token-color-palette-neutral-200": {
+      "key": "{color.palette.neutral-200}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "palette",
+        "key": "{color.palette.neutral-200}"
+      },
+      "name": "token-color-palette-neutral-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-200"
+      ]
+    },
+    "token-color-palette-neutral-100": {
+      "key": "{color.palette.neutral-100}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f1f2f3",
+        "group": "palette",
+        "key": "{color.palette.neutral-100}"
+      },
+      "name": "token-color-palette-neutral-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-100"
+      ]
+    },
+    "token-color-palette-neutral-50": {
+      "key": "{color.palette.neutral-50}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fafafa",
+        "group": "palette",
+        "key": "{color.palette.neutral-50}"
+      },
+      "name": "token-color-palette-neutral-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-50"
+      ]
+    },
+    "token-color-palette-neutral-0": {
+      "key": "{color.palette.neutral-0}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#ffffff",
+        "cds-g10": "#ffffff",
+        "cds-g90": "#ffffff",
+        "cds-g100": "#ffffff"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.color.white.0}",
+        "group": "palette",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.color.white.0}",
+          "cds-g10": "{carbon.color.white.0}",
+          "cds-g90": "{carbon.color.white.0}",
+          "cds-g100": "{carbon.color.white.0}"
+        },
+        "key": "{color.palette.neutral-0}"
+      },
+      "name": "token-color-palette-neutral-0",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-0"
+      ]
+    },
+    "token-color-palette-alpha-300": {
+      "key": "{color.palette.alpha-300}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "alpha": "0.4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-600}",
+        "alpha": "0.4",
+        "group": "palette",
+        "key": "{color.palette.alpha-300}"
+      },
+      "name": "token-color-palette-alpha-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-300"
+      ]
+    },
+    "token-color-palette-alpha-200": {
+      "key": "{color.palette.alpha-200}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "alpha": "0.2",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.2",
+        "group": "palette",
+        "key": "{color.palette.alpha-200}"
+      },
+      "name": "token-color-palette-alpha-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-200"
+      ]
+    },
+    "token-color-palette-alpha-100": {
+      "key": "{color.palette.alpha-100}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "alpha": "0.1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.1",
+        "group": "palette",
+        "key": "{color.palette.alpha-100}"
+      },
+      "name": "token-color-palette-alpha-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-100"
+      ]
+    },
+    "token-color-border-primary": {
+      "key": "{color.border.primary}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-200}",
+        "group": "semantic",
+        "key": "{color.border.primary}"
+      },
+      "name": "token-color-border-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "primary"
+      ]
+    },
+    "token-color-border-faint": {
+      "key": "{color.border.faint}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-100}",
+        "group": "semantic",
+        "key": "{color.border.faint}"
+      },
+      "name": "token-color-border-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "faint"
+      ]
+    },
+    "token-color-border-strong": {
+      "key": "{color.border.strong}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-300}",
+        "group": "semantic",
+        "key": "{color.border.strong}"
+      },
+      "name": "token-color-border-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "strong"
+      ]
+    },
+    "token-color-border-action": {
+      "key": "{color.border.action}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-100}",
+        "group": "semantic",
+        "key": "{color.border.action}"
+      },
+      "name": "token-color-border-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "action"
+      ]
+    },
+    "token-color-border-highlight": {
+      "key": "{color.border.highlight}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-100}",
+        "group": "semantic",
+        "key": "{color.border.highlight}"
+      },
+      "name": "token-color-border-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "highlight"
+      ]
+    },
+    "token-color-border-success": {
+      "key": "{color.border.success}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-100}",
+        "group": "semantic",
+        "key": "{color.border.success}"
+      },
+      "name": "token-color-border-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "success"
+      ]
+    },
+    "token-color-border-warning": {
+      "key": "{color.border.warning}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-100}",
+        "group": "semantic",
+        "key": "{color.border.warning}"
+      },
+      "name": "token-color-border-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "warning"
+      ]
+    },
+    "token-color-border-critical": {
+      "key": "{color.border.critical}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-100}",
+        "group": "semantic",
+        "key": "{color.border.critical}"
+      },
+      "name": "token-color-border-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "critical"
+      ]
+    },
+    "token-color-focus-action-internal": {
+      "key": "{color.focus.action.internal}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.focus.action.internal}"
+      },
+      "name": "token-color-focus-action-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "internal"
+      ]
+    },
+    "token-color-focus-action-external": {
+      "key": "{color.focus.action.external}",
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#5990ff",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.action.external}"
+      },
+      "name": "token-color-focus-action-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "external"
+      ]
+    },
+    "token-color-focus-critical-internal": {
+      "key": "{color.focus.critical.internal}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.focus.critical.internal}"
+      },
+      "name": "token-color-focus-critical-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "internal"
+      ]
+    },
+    "token-color-focus-critical-external": {
+      "key": "{color.focus.critical.external}",
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#dd7578",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.critical.external}"
+      },
+      "name": "token-color-focus-critical-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "external"
+      ]
+    },
+    "token-color-foreground-strong": {
+      "key": "{color.foreground.strong}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-700}",
+        "group": "semantic",
+        "key": "{color.foreground.strong}"
+      },
+      "name": "token-color-foreground-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-color-foreground-primary": {
+      "key": "{color.foreground.primary}",
+      "$type": "color",
+      "$value": "#161616",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#161616",
+        "cds-g10": "#161616",
+        "cds-g90": "#f4f4f4",
+        "cds-g100": "#f4f4f4"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.themes.g10.textPrimary}",
+        "group": "semantic",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.themes.white.textPrimary}",
+          "cds-g10": "{carbon.themes.g10.textPrimary}",
+          "cds-g90": "{carbon.themes.g90.textPrimary}",
+          "cds-g100": "{carbon.themes.g100.textPrimary}"
+        },
+        "key": "{color.foreground.primary}"
+      },
+      "name": "token-color-foreground-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-color-foreground-faint": {
+      "key": "{color.foreground.faint}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "semantic",
+        "key": "{color.foreground.faint}"
+      },
+      "name": "token-color-foreground-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-color-foreground-high-contrast": {
+      "key": "{color.foreground.high-contrast}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.foreground.high-contrast}"
+      },
+      "name": "token-color-foreground-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "high-contrast"
+      ]
+    },
+    "token-color-foreground-disabled": {
+      "key": "{color.foreground.disabled}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "semantic",
+        "key": "{color.foreground.disabled}"
+      },
+      "name": "token-color-foreground-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "disabled"
+      ]
+    },
+    "token-color-foreground-action": {
+      "key": "{color.foreground.action}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "semantic",
+        "key": "{color.foreground.action}"
+      },
+      "name": "token-color-foreground-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action"
+      ]
+    },
+    "token-color-foreground-action-hover": {
+      "key": "{color.foreground.action-hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.foreground.action-hover}"
+      },
+      "name": "token-color-foreground-action-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-hover"
+      ]
+    },
+    "token-color-foreground-action-active": {
+      "key": "{color.foreground.action-active}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "semantic",
+        "key": "{color.foreground.action-active}"
+      },
+      "name": "token-color-foreground-action-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-active"
+      ]
+    },
+    "token-color-foreground-highlight": {
+      "key": "{color.foreground.highlight}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-200}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight}"
+      },
+      "name": "token-color-foreground-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight"
+      ]
+    },
+    "token-color-foreground-highlight-on-surface": {
+      "key": "{color.foreground.highlight-on-surface}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-300}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-on-surface}"
+      },
+      "name": "token-color-foreground-highlight-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-on-surface"
+      ]
+    },
+    "token-color-foreground-highlight-high-contrast": {
+      "key": "{color.foreground.highlight-high-contrast}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-500}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-high-contrast}"
+      },
+      "name": "token-color-foreground-highlight-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-high-contrast"
+      ]
+    },
+    "token-color-foreground-success": {
+      "key": "{color.foreground.success}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-200}",
+        "group": "semantic",
+        "key": "{color.foreground.success}"
+      },
+      "name": "token-color-foreground-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success"
+      ]
+    },
+    "token-color-foreground-success-on-surface": {
+      "key": "{color.foreground.success-on-surface}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-300}",
+        "group": "semantic",
+        "key": "{color.foreground.success-on-surface}"
+      },
+      "name": "token-color-foreground-success-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-on-surface"
+      ]
+    },
+    "token-color-foreground-success-high-contrast": {
+      "key": "{color.foreground.success-high-contrast}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-500}",
+        "group": "semantic",
+        "key": "{color.foreground.success-high-contrast}"
+      },
+      "name": "token-color-foreground-success-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-high-contrast"
+      ]
+    },
+    "token-color-foreground-warning": {
+      "key": "{color.foreground.warning}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-200}",
+        "group": "semantic",
+        "key": "{color.foreground.warning}"
+      },
+      "name": "token-color-foreground-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning"
+      ]
+    },
+    "token-color-foreground-warning-on-surface": {
+      "key": "{color.foreground.warning-on-surface}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-300}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-on-surface}"
+      },
+      "name": "token-color-foreground-warning-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-on-surface"
+      ]
+    },
+    "token-color-foreground-warning-high-contrast": {
+      "key": "{color.foreground.warning-high-contrast}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-500}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-high-contrast}"
+      },
+      "name": "token-color-foreground-warning-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-high-contrast"
+      ]
+    },
+    "token-color-foreground-critical": {
+      "key": "{color.foreground.critical}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-200}",
+        "group": "semantic",
+        "key": "{color.foreground.critical}"
+      },
+      "name": "token-color-foreground-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical"
+      ]
+    },
+    "token-color-foreground-critical-on-surface": {
+      "key": "{color.foreground.critical-on-surface}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-on-surface}"
+      },
+      "name": "token-color-foreground-critical-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-on-surface"
+      ]
+    },
+    "token-color-foreground-critical-high-contrast": {
+      "key": "{color.foreground.critical-high-contrast}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-500}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-high-contrast}"
+      },
+      "name": "token-color-foreground-critical-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-high-contrast"
+      ]
+    },
+    "token-color-page-primary": {
+      "key": "{color.page.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.page.primary}"
+      },
+      "name": "token-color-page-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "primary"
+      ]
+    },
+    "token-color-page-faint": {
+      "key": "{color.page.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.page.faint}"
+      },
+      "name": "token-color-page-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "faint"
+      ]
+    },
+    "token-color-surface-primary": {
+      "key": "{color.surface.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.primary}"
+      },
+      "name": "token-color-surface-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-color-surface-faint": {
+      "key": "{color.surface.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.faint}"
+      },
+      "name": "token-color-surface-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "faint"
+      ]
+    },
+    "token-color-surface-strong": {
+      "key": "{color.surface.strong}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.strong}"
+      },
+      "name": "token-color-surface-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "strong"
+      ]
+    },
+    "token-color-surface-interactive": {
+      "key": "{color.surface.interactive}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.interactive}"
+      },
+      "name": "token-color-surface-interactive",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive"
+      ]
+    },
+    "token-color-surface-interactive-hover": {
+      "key": "{color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-hover}"
+      },
+      "name": "token-color-surface-interactive-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-color-surface-interactive-active": {
+      "key": "{color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-200}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-active}"
+      },
+      "name": "token-color-surface-interactive-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-color-surface-interactive-disabled": {
+      "key": "{color.surface.interactive-disabled}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-disabled}"
+      },
+      "name": "token-color-surface-interactive-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-disabled"
+      ]
+    },
+    "token-color-surface-action": {
+      "key": "{color.surface.action}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-50}",
+        "group": "semantic",
+        "key": "{color.surface.action}"
+      },
+      "name": "token-color-surface-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "action"
+      ]
+    },
+    "token-color-surface-highlight": {
+      "key": "{color.surface.highlight}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-50}",
+        "group": "semantic",
+        "key": "{color.surface.highlight}"
+      },
+      "name": "token-color-surface-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "highlight"
+      ]
+    },
+    "token-color-surface-success": {
+      "key": "{color.surface.success}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-50}",
+        "group": "semantic",
+        "key": "{color.surface.success}"
+      },
+      "name": "token-color-surface-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "success"
+      ]
+    },
+    "token-color-surface-warning": {
+      "key": "{color.surface.warning}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-50}",
+        "group": "semantic",
+        "key": "{color.surface.warning}"
+      },
+      "name": "token-color-surface-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "warning"
+      ]
+    },
+    "token-color-surface-critical": {
+      "key": "{color.surface.critical}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-50}",
+        "group": "semantic",
+        "key": "{color.surface.critical}"
+      },
+      "name": "token-color-surface-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "critical"
+      ]
+    },
+    "token-color-hashicorp-brand": {
+      "key": "{color.hashicorp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hashicorp-brand}",
+        "group": "branding",
+        "key": "{color.hashicorp.brand}"
+      },
+      "name": "token-color-hashicorp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hashicorp",
+        "brand"
+      ]
+    },
+    "token-color-boundary-brand": {
+      "key": "{color.boundary.brand}",
+      "$type": "color",
+      "$value": "#f24c53",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-brand}",
+        "group": "branding",
+        "key": "{color.boundary.brand}"
+      },
+      "name": "token-color-boundary-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "brand"
+      ]
+    },
+    "token-color-boundary-foreground": {
+      "key": "{color.boundary.foreground}",
+      "$type": "color",
+      "$value": "#cf2d32",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-500}",
+        "group": "branding",
+        "key": "{color.boundary.foreground}"
+      },
+      "name": "token-color-boundary-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "foreground"
+      ]
+    },
+    "token-color-boundary-surface": {
+      "key": "{color.boundary.surface}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.surface}"
+      },
+      "name": "token-color-boundary-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "surface"
+      ]
+    },
+    "token-color-boundary-border": {
+      "key": "{color.boundary.border}",
+      "$type": "color",
+      "$value": "#fbd7d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-100}",
+        "group": "branding",
+        "key": "{color.boundary.border}"
+      },
+      "name": "token-color-boundary-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "border"
+      ]
+    },
+    "token-color-boundary-gradient-primary-start": {
+      "key": "{color.boundary.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#f97076",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-300}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.start}"
+      },
+      "name": "token-color-boundary-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-primary-stop": {
+      "key": "{color.boundary.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#db363b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-400}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.stop}"
+      },
+      "name": "token-color-boundary-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-boundary-gradient-faint-start": {
+      "key": "{color.boundary.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffafa",
+        "group": "branding",
+        "comment": "this is the 'boundary-50' value at 25% opacity on white",
+        "key": "{color.boundary.gradient.faint.start}"
+      },
+      "name": "token-color-boundary-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-faint-stop": {
+      "key": "{color.boundary.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.faint.stop}"
+      },
+      "name": "token-color-boundary-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-consul-brand": {
+      "key": "{color.consul.brand}",
+      "$type": "color",
+      "$value": "#e03875",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-brand}",
+        "group": "branding",
+        "key": "{color.consul.brand}"
+      },
+      "name": "token-color-consul-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "brand"
+      ]
+    },
+    "token-color-consul-foreground": {
+      "key": "{color.consul.foreground}",
+      "$type": "color",
+      "$value": "#d01c5b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-500}",
+        "group": "branding",
+        "key": "{color.consul.foreground}"
+      },
+      "name": "token-color-consul-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "foreground"
+      ]
+    },
+    "token-color-consul-surface": {
+      "key": "{color.consul.surface}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.surface}"
+      },
+      "name": "token-color-consul-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "surface"
+      ]
+    },
+    "token-color-consul-border": {
+      "key": "{color.consul.border}",
+      "$type": "color",
+      "$value": "#ffcede",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-100}",
+        "group": "branding",
+        "key": "{color.consul.border}"
+      },
+      "name": "token-color-consul-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "border"
+      ]
+    },
+    "token-color-consul-gradient-primary-start": {
+      "key": "{color.consul.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#ff99be",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-300}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.start}"
+      },
+      "name": "token-color-consul-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-primary-stop": {
+      "key": "{color.consul.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#da306e",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-400}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.stop}"
+      },
+      "name": "token-color-consul-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-consul-gradient-faint-start": {
+      "key": "{color.consul.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9fb",
+        "group": "branding",
+        "comment": "this is the 'consul-50' value at 25% opacity on white",
+        "key": "{color.consul.gradient.faint.start}"
+      },
+      "name": "token-color-consul-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-faint-stop": {
+      "key": "{color.consul.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.gradient.faint.stop}"
+      },
+      "name": "token-color-consul-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-hcp-brand": {
+      "key": "{color.hcp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hcp-brand}",
+        "group": "branding",
+        "key": "{color.hcp.brand}"
+      },
+      "name": "token-color-hcp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hcp",
+        "brand"
+      ]
+    },
+    "token-color-nomad-brand": {
+      "key": "{color.nomad.brand}",
+      "$type": "color",
+      "$value": "#06d092",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-brand}",
+        "group": "branding",
+        "key": "{color.nomad.brand}"
+      },
+      "name": "token-color-nomad-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "brand"
+      ]
+    },
+    "token-color-nomad-foreground": {
+      "key": "{color.nomad.foreground}",
+      "$type": "color",
+      "$value": "#008661",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-500}",
+        "group": "branding",
+        "key": "{color.nomad.foreground}"
+      },
+      "name": "token-color-nomad-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "foreground"
+      ]
+    },
+    "token-color-nomad-surface": {
+      "key": "{color.nomad.surface}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.surface}"
+      },
+      "name": "token-color-nomad-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "surface"
+      ]
+    },
+    "token-color-nomad-border": {
+      "key": "{color.nomad.border}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.border}"
+      },
+      "name": "token-color-nomad-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "border"
+      ]
+    },
+    "token-color-nomad-gradient-primary-start": {
+      "key": "{color.nomad.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.start}"
+      },
+      "name": "token-color-nomad-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-primary-stop": {
+      "key": "{color.nomad.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#60dea9",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-200}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.stop}"
+      },
+      "name": "token-color-nomad-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-nomad-gradient-faint-start": {
+      "key": "{color.nomad.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f3fff9",
+        "group": "branding",
+        "comment": "this is the 'nomad-50' value at 25% opacity on white",
+        "key": "{color.nomad.gradient.faint.start}"
+      },
+      "name": "token-color-nomad-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-faint-stop": {
+      "key": "{color.nomad.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.faint.stop}"
+      },
+      "name": "token-color-nomad-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-packer-brand": {
+      "key": "{color.packer.brand}",
+      "$type": "color",
+      "$value": "#02a8ef",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-brand}",
+        "group": "branding",
+        "key": "{color.packer.brand}"
+      },
+      "name": "token-color-packer-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "brand"
+      ]
+    },
+    "token-color-packer-foreground": {
+      "key": "{color.packer.foreground}",
+      "$type": "color",
+      "$value": "#007eb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-500}",
+        "group": "branding",
+        "key": "{color.packer.foreground}"
+      },
+      "name": "token-color-packer-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "foreground"
+      ]
+    },
+    "token-color-packer-surface": {
+      "key": "{color.packer.surface}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.surface}"
+      },
+      "name": "token-color-packer-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "surface"
+      ]
+    },
+    "token-color-packer-border": {
+      "key": "{color.packer.border}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.border}"
+      },
+      "name": "token-color-packer-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "border"
+      ]
+    },
+    "token-color-packer-gradient-primary-start": {
+      "key": "{color.packer.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.start}"
+      },
+      "name": "token-color-packer-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-primary-stop": {
+      "key": "{color.packer.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#63d0ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-200}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.stop}"
+      },
+      "name": "token-color-packer-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-packer-gradient-faint-start": {
+      "key": "{color.packer.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fcff",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#F3FCFF",
+        "group": "branding",
+        "comment": "this is the 'packer-50' value at 25% opacity on white",
+        "key": "{color.packer.gradient.faint.start}"
+      },
+      "name": "token-color-packer-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-faint-stop": {
+      "key": "{color.packer.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.gradient.faint.stop}"
+      },
+      "name": "token-color-packer-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-terraform-brand": {
+      "key": "{color.terraform.brand}",
+      "$type": "color",
+      "$value": "#7b42bc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-brand}",
+        "group": "branding",
+        "key": "{color.terraform.brand}"
+      },
+      "name": "token-color-terraform-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand"
+      ]
+    },
+    "token-color-terraform-brand-on-dark": {
+      "key": "{color.terraform.brand-on-dark}",
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "original": {
+        "$type": "color",
+        "$value": "#a067da",
+        "group": "branding",
+        "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+        "key": "{color.terraform.brand-on-dark}"
+      },
+      "name": "token-color-terraform-brand-on-dark",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand-on-dark"
+      ]
+    },
+    "token-color-terraform-foreground": {
+      "key": "{color.terraform.foreground}",
+      "$type": "color",
+      "$value": "#773cb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-500}",
+        "group": "branding",
+        "key": "{color.terraform.foreground}"
+      },
+      "name": "token-color-terraform-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "foreground"
+      ]
+    },
+    "token-color-terraform-surface": {
+      "key": "{color.terraform.surface}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.surface}"
+      },
+      "name": "token-color-terraform-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "surface"
+      ]
+    },
+    "token-color-terraform-border": {
+      "key": "{color.terraform.border}",
+      "$type": "color",
+      "$value": "#ebdbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-100}",
+        "group": "branding",
+        "key": "{color.terraform.border}"
+      },
+      "name": "token-color-terraform-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "border"
+      ]
+    },
+    "token-color-terraform-gradient-primary-start": {
+      "key": "{color.terraform.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bb8deb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-300}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.start}"
+      },
+      "name": "token-color-terraform-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-primary-stop": {
+      "key": "{color.terraform.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#844fba",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-400}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.stop}"
+      },
+      "name": "token-color-terraform-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-terraform-gradient-faint-start": {
+      "key": "{color.terraform.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fcfaff",
+        "group": "branding",
+        "comment": "this is the 'terraform-50' value at 25% opacity on white",
+        "key": "{color.terraform.gradient.faint.start}"
+      },
+      "name": "token-color-terraform-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-faint-stop": {
+      "key": "{color.terraform.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.faint.stop}"
+      },
+      "name": "token-color-terraform-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-brand": {
+      "key": "{color.vagrant.brand}",
+      "$type": "color",
+      "$value": "#1868f2",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-brand}",
+        "group": "branding",
+        "key": "{color.vagrant.brand}"
+      },
+      "name": "token-color-vagrant-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "brand"
+      ]
+    },
+    "token-color-vagrant-foreground": {
+      "key": "{color.vagrant.foreground}",
+      "$type": "color",
+      "$value": "#1c61d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-500}",
+        "group": "branding",
+        "key": "{color.vagrant.foreground}"
+      },
+      "name": "token-color-vagrant-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "foreground"
+      ]
+    },
+    "token-color-vagrant-surface": {
+      "key": "{color.vagrant.surface}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.surface}"
+      },
+      "name": "token-color-vagrant-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "surface"
+      ]
+    },
+    "token-color-vagrant-border": {
+      "key": "{color.vagrant.border}",
+      "$type": "color",
+      "$value": "#c7dbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-100}",
+        "group": "branding",
+        "key": "{color.vagrant.border}"
+      },
+      "name": "token-color-vagrant-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "border"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-start": {
+      "key": "{color.vagrant.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#639cff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-300}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.start}"
+      },
+      "name": "token-color-vagrant-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-stop": {
+      "key": "{color.vagrant.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#2e71e5",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-400}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.stop}"
+      },
+      "name": "token-color-vagrant-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-start": {
+      "key": "{color.vagrant.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f4faff",
+        "group": "branding",
+        "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+        "key": "{color.vagrant.gradient.faint.start}"
+      },
+      "name": "token-color-vagrant-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-stop": {
+      "key": "{color.vagrant.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.faint.stop}"
+      },
+      "name": "token-color-vagrant-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-brand": {
+      "key": "{color.vault-radar.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-brand}",
+        "group": "branding",
+        "key": "{color.vault-radar.brand}"
+      },
+      "name": "token-color-vault-radar-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand"
+      ]
+    },
+    "token-color-vault-radar-brand-alt": {
+      "key": "{color.vault-radar.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+        "key": "{color.vault-radar.brand-alt}"
+      },
+      "name": "token-color-vault-radar-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-radar-foreground": {
+      "key": "{color.vault-radar.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-500}",
+        "group": "branding",
+        "key": "{color.vault-radar.foreground}"
+      },
+      "name": "token-color-vault-radar-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "foreground"
+      ]
+    },
+    "token-color-vault-radar-surface": {
+      "key": "{color.vault-radar.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.surface}"
+      },
+      "name": "token-color-vault-radar-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "surface"
+      ]
+    },
+    "token-color-vault-radar-border": {
+      "key": "{color.vault-radar.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.border}"
+      },
+      "name": "token-color-vault-radar-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "border"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-start": {
+      "key": "{color.vault-radar.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.start}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-stop": {
+      "key": "{color.vault-radar.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-200}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-start": {
+      "key": "{color.vault-radar.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+        "key": "{color.vault-radar.gradient.faint.start}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-stop": {
+      "key": "{color.vault-radar.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-brand": {
+      "key": "{color.vault-secrets.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-brand}",
+        "group": "branding",
+        "key": "{color.vault-secrets.brand}"
+      },
+      "name": "token-color-vault-secrets-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand"
+      ]
+    },
+    "token-color-vault-secrets-brand-alt": {
+      "key": "{color.vault-secrets.brand-alt}",
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "original": {
+        "group": "branding",
+        "$type": "color",
+        "$value": "#000",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+        "key": "{color.vault-secrets.brand-alt}"
+      },
+      "name": "token-color-vault-secrets-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-secrets-foreground": {
+      "key": "{color.vault-secrets.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-500}",
+        "group": "branding",
+        "key": "{color.vault-secrets.foreground}"
+      },
+      "name": "token-color-vault-secrets-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "foreground"
+      ]
+    },
+    "token-color-vault-secrets-surface": {
+      "key": "{color.vault-secrets.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.surface}"
+      },
+      "name": "token-color-vault-secrets-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "surface"
+      ]
+    },
+    "token-color-vault-secrets-border": {
+      "key": "{color.vault-secrets.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.border}"
+      },
+      "name": "token-color-vault-secrets-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "border"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-start": {
+      "key": "{color.vault-secrets.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-stop": {
+      "key": "{color.vault-secrets.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-200}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-start": {
+      "key": "{color.vault-secrets.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+        "key": "{color.vault-secrets.gradient.faint.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-stop": {
+      "key": "{color.vault-secrets.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-brand": {
+      "key": "{color.vault.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-brand}",
+        "group": "branding",
+        "key": "{color.vault.brand}"
+      },
+      "name": "token-color-vault-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand"
+      ]
+    },
+    "token-color-vault-brand-alt": {
+      "key": "{color.vault.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+        "key": "{color.vault.brand-alt}"
+      },
+      "name": "token-color-vault-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-foreground": {
+      "key": "{color.vault.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-500}",
+        "group": "branding",
+        "key": "{color.vault.foreground}"
+      },
+      "name": "token-color-vault-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "foreground"
+      ]
+    },
+    "token-color-vault-surface": {
+      "key": "{color.vault.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.surface}"
+      },
+      "name": "token-color-vault-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "surface"
+      ]
+    },
+    "token-color-vault-border": {
+      "key": "{color.vault.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.border}"
+      },
+      "name": "token-color-vault-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "border"
+      ]
+    },
+    "token-color-vault-gradient-primary-start": {
+      "key": "{color.vault.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.start}"
+      },
+      "name": "token-color-vault-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-primary-stop": {
+      "key": "{color.vault.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-200}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-gradient-faint-start": {
+      "key": "{color.vault.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-50' value at 25% opacity on white",
+        "key": "{color.vault.gradient.faint.start}"
+      },
+      "name": "token-color-vault-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-faint-stop": {
+      "key": "{color.vault.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-brand": {
+      "key": "{color.waypoint.brand}",
+      "$type": "color",
+      "$value": "#14c6cb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-brand}",
+        "group": "branding",
+        "key": "{color.waypoint.brand}"
+      },
+      "name": "token-color-waypoint-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "brand"
+      ]
+    },
+    "token-color-waypoint-foreground": {
+      "key": "{color.waypoint.foreground}",
+      "$type": "color",
+      "$value": "#008196",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-500}",
+        "group": "branding",
+        "key": "{color.waypoint.foreground}"
+      },
+      "name": "token-color-waypoint-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "foreground"
+      ]
+    },
+    "token-color-waypoint-surface": {
+      "key": "{color.waypoint.surface}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.surface}"
+      },
+      "name": "token-color-waypoint-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "surface"
+      ]
+    },
+    "token-color-waypoint-border": {
+      "key": "{color.waypoint.border}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.border}"
+      },
+      "name": "token-color-waypoint-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "border"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-start": {
+      "key": "{color.waypoint.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.start}"
+      },
+      "name": "token-color-waypoint-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-stop": {
+      "key": "{color.waypoint.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#62d4dc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-200}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.stop}"
+      },
+      "name": "token-color-waypoint-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-start": {
+      "key": "{color.waypoint.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f6feff",
+        "group": "branding",
+        "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+        "key": "{color.waypoint.gradient.faint.start}"
+      },
+      "name": "token-color-waypoint-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-stop": {
+      "key": "{color.waypoint.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.faint.stop}"
+      },
+      "name": "token-color-waypoint-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-elevation-inset-box-shadow": {
+      "key": "{elevation.inset.box-shadow}",
+      "$value": "inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-01}",
+        "key": "{elevation.inset.box-shadow}"
+      },
+      "name": "token-elevation-inset-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-low-box-shadow": {
+      "key": "{elevation.low.box-shadow}",
+      "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+        "key": "{elevation.low.box-shadow}"
+      },
+      "name": "token-elevation-low-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-mid-box-shadow": {
+      "key": "{elevation.mid.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+        "key": "{elevation.mid.box-shadow}"
+      },
+      "name": "token-elevation-mid-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-high-box-shadow": {
+      "key": "{elevation.high.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+        "key": "{elevation.high.box-shadow}"
+      },
+      "name": "token-elevation-high-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-higher-box-shadow": {
+      "key": "{elevation.higher.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+        "key": "{elevation.higher.box-shadow}"
+      },
+      "name": "token-elevation-higher-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-overlay-box-shadow": {
+      "key": "{elevation.overlay.box-shadow}",
+      "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+        "key": "{elevation.overlay.box-shadow}"
+      },
+      "name": "token-elevation-overlay-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-surface-inset-box-shadow": {
+      "key": "{surface.inset.box-shadow}",
+      "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+        "key": "{surface.inset.box-shadow}"
+      },
+      "name": "token-surface-inset-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-surface-base-box-shadow": {
+      "key": "{surface.base.box-shadow}",
+      "$value": "0 0 0 1px #656a7633",
+      "original": {
+        "$value": "{elevation.base.box-shadow-border}",
+        "key": "{surface.base.box-shadow}"
+      },
+      "name": "token-surface-base-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "base",
+        "box-shadow"
+      ]
+    },
+    "token-surface-low-box-shadow": {
+      "key": "{surface.low.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+        "key": "{surface.low.box-shadow}"
+      },
+      "name": "token-surface-low-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-surface-mid-box-shadow": {
+      "key": "{surface.mid.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+        "key": "{surface.mid.box-shadow}"
+      },
+      "name": "token-surface-mid-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-surface-high-box-shadow": {
+      "key": "{surface.high.box-shadow}",
+      "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+        "key": "{surface.high.box-shadow}"
+      },
+      "name": "token-surface-high-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-surface-higher-box-shadow": {
+      "key": "{surface.higher.box-shadow}",
+      "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+        "key": "{surface.higher.box-shadow}"
+      },
+      "name": "token-surface-higher-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-surface-overlay-box-shadow": {
+      "key": "{surface.overlay.box-shadow}",
+      "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+        "key": "{surface.overlay.box-shadow}"
+      },
+      "name": "token-surface-overlay-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-action-box-shadow": {
+      "key": "{focus-ring.action.box-shadow}",
+      "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+      "original": {
+        "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+        "key": "{focus-ring.action.box-shadow}"
+      },
+      "name": "token-focus-ring-action-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "action",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-critical-box-shadow": {
+      "key": "{focus-ring.critical.box-shadow}",
+      "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+      "original": {
+        "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+        "key": "{focus-ring.critical.box-shadow}"
+      },
+      "name": "token-focus-ring-critical-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "critical",
+        "box-shadow"
+      ]
+    },
+    "token-app-header-height": {
+      "key": "{app-header.height}",
+      "$type": "dimension",
+      "$value": "60px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "60",
+        "unit": "px",
+        "key": "{app-header.height}"
+      },
+      "name": "token-app-header-height",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "height"
+      ]
+    },
+    "token-app-header-home-link-size": {
+      "key": "{app-header.home-link.size}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-header.home-link.size}"
+      },
+      "name": "token-app-header-home-link-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "home-link",
+        "size"
+      ]
+    },
+    "token-app-header-logo-size": {
+      "key": "{app-header.logo.size}",
+      "$type": "dimension",
+      "$value": "28px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "28",
+        "unit": "px",
+        "key": "{app-header.logo.size}"
+      },
+      "name": "token-app-header-logo-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "logo",
+        "size"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-width": {
+      "key": "{app-side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.border.width}"
+      },
+      "name": "token-app-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-color": {
+      "key": "{app-side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-200)",
+        "group": "components",
+        "key": "{app-side-nav.wrapper.border.color}"
+      },
+      "name": "token-app-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal": {
+      "key": "{app-side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical": {
+      "key": "{app-side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-app-side-nav-toggle-button-border-radius": {
+      "key": "{app-side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-app-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-app-side-nav-header-home-link-padding": {
+      "key": "{app-side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.padding}"
+      },
+      "name": "token-app-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size": {
+      "key": "{app-side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-app-side-nav-header-actions-spacing": {
+      "key": "{app-side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.header.actions.spacing}"
+      },
+      "name": "token-app-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-app-side-nav-body-list-margin-vertical": {
+      "key": "{app-side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{app-side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-height": {
+      "key": "{app-side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.height}"
+      },
+      "name": "token-app-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-horizontal": {
+      "key": "{app-side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-vertical": {
+      "key": "{app-side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-spacing-vertical": {
+      "key": "{app-side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-border-radius": {
+      "key": "{app-side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-app-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-app-side-nav-color-foreground-primary": {
+      "key": "{app-side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.primary}"
+      },
+      "name": "token-app-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-foreground-strong": {
+      "key": "{app-side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.strong}"
+      },
+      "name": "token-app-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-app-side-nav-color-foreground-faint": {
+      "key": "{app-side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.faint}"
+      },
+      "name": "token-app-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-app-side-nav-color-surface-primary": {
+      "key": "{app-side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.surface.primary}"
+      },
+      "name": "token-app-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-hover": {
+      "key": "{app-side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-interactive-hover)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-active": {
+      "key": "{app-side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-300)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-form-label-color": {
+      "key": "{form.label.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.label.color}"
+      },
+      "name": "token-form-label-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "label",
+        "color"
+      ]
+    },
+    "token-form-legend-color": {
+      "key": "{form.legend.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{form.label.color}",
+        "group": "components",
+        "key": "{form.legend.color}"
+      },
+      "name": "token-form-legend-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "legend",
+        "color"
+      ]
+    },
+    "token-form-helper-text-color": {
+      "key": "{form.helper-text.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.helper-text.color}"
+      },
+      "name": "token-form-helper-text-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "helper-text",
+        "color"
+      ]
+    },
+    "token-form-indicator-optional-color": {
+      "key": "{form.indicator.optional.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.indicator.optional.color}"
+      },
+      "name": "token-form-indicator-optional-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "indicator",
+        "optional",
+        "color"
+      ]
+    },
+    "token-form-error-color": {
+      "key": "{form.error.color}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.error.color}"
+      },
+      "name": "token-form-error-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "color"
+      ]
+    },
+    "token-form-error-icon-size": {
+      "key": "{form.error.icon-size}",
+      "$type": "dimension",
+      "$value": "14px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "14",
+        "unit": "px",
+        "key": "{form.error.icon-size}"
+      },
+      "name": "token-form-error-icon-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "icon-size"
+      ]
+    },
+    "token-form-checkbox-size": {
+      "key": "{form.checkbox.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.checkbox.size}"
+      },
+      "name": "token-form-checkbox-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "size"
+      ]
+    },
+    "token-form-checkbox-border-radius": {
+      "key": "{form.checkbox.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.checkbox.border.radius}"
+      },
+      "name": "token-form-checkbox-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-checkbox-border-width": {
+      "key": "{form.checkbox.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.checkbox.border.width}"
+      },
+      "name": "token-form-checkbox-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-checkbox-background-image-size": {
+      "key": "{form.checkbox.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.checkbox.background-image.size}"
+      },
+      "name": "token-form-checkbox-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url": {
+      "key": "{form.checkbox.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url}"
+      },
+      "name": "token-form-checkbox-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-disabled": {
+      "key": "{form.checkbox.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate-disabled": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate-disabled"
+      ]
+    },
+    "token-form-control-base-foreground-value-color": {
+      "key": "{form.control.base.foreground.value-color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.control.base.foreground.value-color}"
+      },
+      "name": "token-form-control-base-foreground-value-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "value-color"
+      ]
+    },
+    "token-form-control-base-foreground-placeholder-color": {
+      "key": "{form.control.base.foreground.placeholder-color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.control.base.foreground.placeholder-color}"
+      },
+      "name": "token-form-control-base-foreground-placeholder-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "placeholder-color"
+      ]
+    },
+    "token-form-control-base-surface-color-default": {
+      "key": "{form.control.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.default}"
+      },
+      "name": "token-form-control-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-surface-color-hover": {
+      "key": "{form.control.base.surface-color.hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-hover}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.hover}"
+      },
+      "name": "token-form-control-base-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-base-border-color-default": {
+      "key": "{form.control.base.border-color.default}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "components",
+        "key": "{form.control.base.border-color.default}"
+      },
+      "name": "token-form-control-base-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-border-color-hover": {
+      "key": "{form.control.base.border-color.hover}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "components",
+        "key": "{form.control.base.border-color.hover}"
+      },
+      "name": "token-form-control-base-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-foreground-color": {
+      "key": "{form.control.checked.foreground-color}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.high-contrast}",
+        "group": "components",
+        "key": "{form.control.checked.foreground-color}"
+      },
+      "name": "token-form-control-checked-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-checked-surface-color-default": {
+      "key": "{form.control.checked.surface-color.default}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.default}"
+      },
+      "name": "token-form-control-checked-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-surface-color-hover": {
+      "key": "{form.control.checked.surface-color.hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.hover}"
+      },
+      "name": "token-form-control-checked-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-border-color-default": {
+      "key": "{form.control.checked.border-color.default}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.default}"
+      },
+      "name": "token-form-control-checked-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-border-color-hover": {
+      "key": "{form.control.checked.border-color.hover}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.hover}"
+      },
+      "name": "token-form-control-checked-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-invalid-border-color-default": {
+      "key": "{form.control.invalid.border-color.default}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.default}"
+      },
+      "name": "token-form-control-invalid-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-invalid-border-color-hover": {
+      "key": "{form.control.invalid.border-color.hover}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-400}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.hover}"
+      },
+      "name": "token-form-control-invalid-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-readonly-foreground-color": {
+      "key": "{form.control.readonly.foreground-color}",
+      "$type": "color",
+      "$value": "#161616",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.primary}",
+        "group": "components",
+        "key": "{form.control.readonly.foreground-color}"
+      },
+      "name": "token-form-control-readonly-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-readonly-surface-color": {
+      "key": "{form.control.readonly.surface-color}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "key": "{form.control.readonly.surface-color}"
+      },
+      "name": "token-form-control-readonly-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "surface-color"
+      ]
+    },
+    "token-form-control-readonly-border-color": {
+      "key": "{form.control.readonly.border-color}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.faint}",
+        "group": "components",
+        "key": "{form.control.readonly.border-color}"
+      },
+      "name": "token-form-control-readonly-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "border-color"
+      ]
+    },
+    "token-form-control-disabled-foreground-color": {
+      "key": "{form.control.disabled.foreground-color}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.foreground-color}"
+      },
+      "name": "token-form-control-disabled-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-disabled-surface-color": {
+      "key": "{form.control.disabled.surface-color}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.surface-color}"
+      },
+      "name": "token-form-control-disabled-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "surface-color"
+      ]
+    },
+    "token-form-control-disabled-border-color": {
+      "key": "{form.control.disabled.border-color}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.primary}",
+        "group": "components",
+        "key": "{form.control.disabled.border-color}"
+      },
+      "name": "token-form-control-disabled-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "border-color"
+      ]
+    },
+    "token-form-control-padding": {
+      "key": "{form.control.padding}",
+      "$type": "dimension",
+      "$value": "7px",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "original": {
+        "$type": "dimension",
+        "$value": "7",
+        "unit": "px",
+        "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+        "key": "{form.control.padding}"
+      },
+      "name": "token-form-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "padding"
+      ]
+    },
+    "token-form-control-border-radius": {
+      "key": "{form.control.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{form.control.border.radius}"
+      },
+      "name": "token-form-control-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-control-border-width": {
+      "key": "{form.control.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.control.border.width}"
+      },
+      "name": "token-form-control-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-size": {
+      "key": "{form.radio.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radio.size}"
+      },
+      "name": "token-form-radio-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "size"
+      ]
+    },
+    "token-form-radio-border-width": {
+      "key": "{form.radio.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radio.border.width}"
+      },
+      "name": "token-form-radio-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-background-image-size": {
+      "key": "{form.radio.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.radio.background-image.size}"
+      },
+      "name": "token-form-radio-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-radio-background-image-data-url": {
+      "key": "{form.radio.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url}"
+      },
+      "name": "token-form-radio-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-radio-background-image-data-url-disabled": {
+      "key": "{form.radio.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url-disabled}"
+      },
+      "name": "token-form-radio-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-radiocard-group-gap": {
+      "key": "{form.radiocard-group.gap}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radiocard-group.gap}"
+      },
+      "name": "token-form-radiocard-group-gap",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard-group",
+        "gap"
+      ]
+    },
+    "token-form-radiocard-border-width": {
+      "key": "{form.radiocard.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radiocard.border.width}"
+      },
+      "name": "token-form-radiocard-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radiocard-border-radius": {
+      "key": "{form.radiocard.border.radius}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{form.radiocard.border.radius}"
+      },
+      "name": "token-form-radiocard-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-radiocard-content-padding": {
+      "key": "{form.radiocard.content-padding}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{form.radiocard.content-padding}"
+      },
+      "name": "token-form-radiocard-content-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "content-padding"
+      ]
+    },
+    "token-form-radiocard-control-padding": {
+      "key": "{form.radiocard.control-padding}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{form.radiocard.control-padding}"
+      },
+      "name": "token-form-radiocard-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "control-padding"
+      ]
+    },
+    "token-form-radiocard-transition-duration": {
+      "key": "{form.radiocard.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.radiocard.transition.duration}"
+      },
+      "name": "token-form-radiocard-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-select-background-image-size": {
+      "key": "{form.select.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.select.background-image.size}"
+      },
+      "name": "token-form-select-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-select-background-image-position-right-x": {
+      "key": "{form.select.background-image.position-right-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.select.background-image.position-right-x}"
+      },
+      "name": "token-form-select-background-image-position-right-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-right-x"
+      ]
+    },
+    "token-form-select-background-image-position-top-y": {
+      "key": "{form.select.background-image.position-top-y}",
+      "$type": "dimension",
+      "$value": "9px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "9",
+        "unit": "px",
+        "key": "{form.select.background-image.position-top-y}"
+      },
+      "name": "token-form-select-background-image-position-top-y",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-top-y"
+      ]
+    },
+    "token-form-select-background-image-data-url": {
+      "key": "{form.select.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url}"
+      },
+      "name": "token-form-select-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-select-background-image-data-url-disabled": {
+      "key": "{form.select.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url-disabled}"
+      },
+      "name": "token-form-select-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-text-input-background-image-size": {
+      "key": "{form.text-input.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.text-input.background-image.size}"
+      },
+      "name": "token-form-text-input-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-text-input-background-image-position-x": {
+      "key": "{form.text-input.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.text-input.background-image.position-x}"
+      },
+      "name": "token-form-text-input-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-date": {
+      "key": "{form.text-input.background-image.data-url-date}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-date}"
+      },
+      "name": "token-form-text-input-background-image-data-url-date",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-date"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-time": {
+      "key": "{form.text-input.background-image.data-url-time}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-time}"
+      },
+      "name": "token-form-text-input-background-image-data-url-time",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-time"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search": {
+      "key": "{form.text-input.background-image.data-url-search}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-cancel": {
+      "key": "{form.text-input.background-image.data-url-search-cancel}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-cancel}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-cancel",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-cancel"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-loading": {
+      "key": "{form.text-input.background-image.data-url-search-loading}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color and animation are hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-loading}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-loading",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-loading"
+      ]
+    },
+    "token-form-toggle-width": {
+      "key": "{form.toggle.width}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{form.toggle.width}"
+      },
+      "name": "token-form-toggle-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "width"
+      ]
+    },
+    "token-form-toggle-height": {
+      "key": "{form.toggle.height}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.toggle.height}"
+      },
+      "name": "token-form-toggle-height",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "height"
+      ]
+    },
+    "token-form-toggle-base-surface-color-default": {
+      "key": "{form.toggle.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "comment": "the toggle has a different base surface color, compared to the other controls",
+        "key": "{form.toggle.base.surface-color.default}"
+      },
+      "name": "token-form-toggle-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-toggle-border-radius": {
+      "key": "{form.toggle.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.toggle.border.radius}"
+      },
+      "name": "token-form-toggle-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-toggle-border-width": {
+      "key": "{form.toggle.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.toggle.border.width}"
+      },
+      "name": "token-form-toggle-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-toggle-background-image-size": {
+      "key": "{form.toggle.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.toggle.background-image.size}"
+      },
+      "name": "token-form-toggle-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-toggle-background-image-position-x": {
+      "key": "{form.toggle.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{form.toggle.background-image.position-x}"
+      },
+      "name": "token-form-toggle-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-toggle-background-image-data-url": {
+      "key": "{form.toggle.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url}"
+      },
+      "name": "token-form-toggle-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-toggle-background-image-data-url-disabled": {
+      "key": "{form.toggle.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url-disabled}"
+      },
+      "name": "token-form-toggle-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-toggle-transition-duration": {
+      "key": "{form.toggle.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.toggle.transition.duration}"
+      },
+      "name": "token-form-toggle-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-toggle-transition-timing-function": {
+      "key": "{form.toggle.transition.timing-function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.68,
+          -0.2,
+          0.265,
+          1.15
+        ],
+        "key": "{form.toggle.transition.timing-function}"
+      },
+      "name": "token-form-toggle-transition-timing-function",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "timing-function"
+      ]
+    },
+    "token-form-toggle-thumb-size": {
+      "key": "{form.toggle.thumb-size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.toggle.height}",
+        "key": "{form.toggle.thumb-size}"
+      },
+      "name": "token-form-toggle-thumb-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "thumb-size"
+      ]
+    },
+    "token-pagination-nav-control-height": {
+      "key": "{pagination.nav.control.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{pagination.nav.control.height}"
+      },
+      "name": "token-pagination-nav-control-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "height"
+      ]
+    },
+    "token-pagination-nav-control-padding-horizontal": {
+      "key": "{pagination.nav.control.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{pagination.nav.control.padding.horizontal}"
+      },
+      "name": "token-pagination-nav-control-padding-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-pagination-nav-control-focus-inset": {
+      "key": "{pagination.nav.control.focus-inset}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{pagination.nav.control.focus-inset}"
+      },
+      "name": "token-pagination-nav-control-focus-inset",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "focus-inset"
+      ]
+    },
+    "token-pagination-nav-control-icon-spacing": {
+      "key": "{pagination.nav.control.icon-spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.control.icon-spacing}"
+      },
+      "name": "token-pagination-nav-control-icon-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "icon-spacing"
+      ]
+    },
+    "token-pagination-nav-indicator-height": {
+      "key": "{pagination.nav.indicator.height}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.height}"
+      },
+      "name": "token-pagination-nav-indicator-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-pagination-nav-indicator-spacing": {
+      "key": "{pagination.nav.indicator.spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.spacing}"
+      },
+      "name": "token-pagination-nav-indicator-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "spacing"
+      ]
+    },
+    "token-pagination-child-spacing-vertical": {
+      "key": "{pagination.child.spacing.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{pagination.child.spacing.vertical}"
+      },
+      "name": "token-pagination-child-spacing-vertical",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "vertical"
+      ]
+    },
+    "token-pagination-child-spacing-horizontal": {
+      "key": "{pagination.child.spacing.horizontal}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{pagination.child.spacing.horizontal}"
+      },
+      "name": "token-pagination-child-spacing-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-border-width": {
+      "key": "{side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{side-nav.wrapper.border.width}"
+      },
+      "name": "token-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-side-nav-wrapper-border-color": {
+      "key": "{side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "components",
+        "key": "{side-nav.wrapper.border.color}"
+      },
+      "name": "token-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal": {
+      "key": "{side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical": {
+      "key": "{side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-side-nav-toggle-button-border-radius": {
+      "key": "{side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-side-nav-header-home-link-padding": {
+      "key": "{side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.padding}"
+      },
+      "name": "token-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size": {
+      "key": "{side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-side-nav-header-actions-spacing": {
+      "key": "{side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.header.actions.spacing}"
+      },
+      "name": "token-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-side-nav-body-list-margin-vertical": {
+      "key": "{side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-height": {
+      "key": "{side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.height}"
+      },
+      "name": "token-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-horizontal": {
+      "key": "{side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-vertical": {
+      "key": "{side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-spacing-vertical": {
+      "key": "{side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-border-radius": {
+      "key": "{side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-side-nav-color-foreground-primary": {
+      "key": "{side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "components",
+        "key": "{side-nav.color.foreground.primary}"
+      },
+      "name": "token-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-foreground-strong": {
+      "key": "{side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#fff",
+        "group": "components",
+        "key": "{side-nav.color.foreground.strong}"
+      },
+      "name": "token-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-side-nav-color-foreground-faint": {
+      "key": "{side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "components",
+        "key": "{side-nav.color.foreground.faint}"
+      },
+      "name": "token-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-side-nav-color-surface-primary": {
+      "key": "{side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "components",
+        "key": "{side-nav.color.surface.primary}"
+      },
+      "name": "token-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-hover": {
+      "key": "{side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-active": {
+      "key": "{side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-tabs-tab-height-medium": {
+      "key": "{tabs.tab.height.medium}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{tabs.tab.height.medium}"
+      },
+      "name": "token-tabs-tab-height-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-height-large": {
+      "key": "{tabs.tab.height.large}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{tabs.tab.height.large}"
+      },
+      "name": "token-tabs-tab-height-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-medium": {
+      "key": "{tabs.tab.padding.horizontal.medium}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.medium}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-large": {
+      "key": "{tabs.tab.padding.horizontal.large}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.large}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-vertical": {
+      "key": "{tabs.tab.padding.vertical}",
+      "$type": "dimension",
+      "$value": "0px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "0",
+        "unit": "px",
+        "key": "{tabs.tab.padding.vertical}"
+      },
+      "name": "token-tabs-tab-padding-vertical",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tabs-tab-border-radius": {
+      "key": "{tabs.tab.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tabs.tab.border-radius}"
+      },
+      "name": "token-tabs-tab-border-radius",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "border-radius"
+      ]
+    },
+    "token-tabs-tab-focus-inset": {
+      "key": "{tabs.tab.focus-inset}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.focus-inset}"
+      },
+      "name": "token-tabs-tab-focus-inset",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "focus-inset"
+      ]
+    },
+    "token-tabs-tab-gutter": {
+      "key": "{tabs.tab.gutter}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.gutter}"
+      },
+      "name": "token-tabs-tab-gutter",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "gutter"
+      ]
+    },
+    "token-tabs-indicator-height": {
+      "key": "{tabs.indicator.height}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{tabs.indicator.height}"
+      },
+      "name": "token-tabs-indicator-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-tabs-indicator-transition-function": {
+      "key": "{tabs.indicator.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.5,
+          1,
+          0.89,
+          1
+        ],
+        "key": "{tabs.indicator.transition.function}"
+      },
+      "name": "token-tabs-indicator-transition-function",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "function"
+      ]
+    },
+    "token-tabs-indicator-transition-duration": {
+      "key": "{tabs.indicator.transition.duration}",
+      "$type": "duration",
+      "$value": "0.6s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.6",
+        "unit": "s",
+        "key": "{tabs.indicator.transition.duration}"
+      },
+      "name": "token-tabs-indicator-transition-duration",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-tabs-divider-height": {
+      "key": "{tabs.divider.height}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{tabs.divider.height}"
+      },
+      "name": "token-tabs-divider-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "divider",
+        "height"
+      ]
+    },
+    "token-tooltip-border-radius": {
+      "key": "{tooltip.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tooltip.border-radius}"
+      },
+      "name": "token-tooltip-border-radius",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "border-radius"
+      ]
+    },
+    "token-tooltip-color-foreground-primary": {
+      "key": "{tooltip.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-high-contrast)",
+        "group": "components",
+        "key": "{tooltip.color.foreground.primary}"
+      },
+      "name": "token-tooltip-color-foreground-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-tooltip-color-surface-primary": {
+      "key": "{tooltip.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-700)",
+        "group": "components",
+        "key": "{tooltip.color.surface.primary}"
+      },
+      "name": "token-tooltip-color-surface-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-tooltip-focus-offset": {
+      "key": "{tooltip.focus-offset}",
+      "$type": "dimension",
+      "$value": "-2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "-2",
+        "unit": "px",
+        "key": "{tooltip.focus-offset}"
+      },
+      "name": "token-tooltip-focus-offset",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "focus-offset"
+      ]
+    },
+    "token-tooltip-max-width": {
+      "key": "{tooltip.max-width}",
+      "$type": "dimension",
+      "$value": "280px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "280",
+        "unit": "px",
+        "key": "{tooltip.max-width}"
+      },
+      "name": "token-tooltip-max-width",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "max-width"
+      ]
+    },
+    "token-tooltip-padding-horizontal": {
+      "key": "{tooltip.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tooltip.padding.horizontal}"
+      },
+      "name": "token-tooltip-padding-horizontal",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-tooltip-padding-vertical": {
+      "key": "{tooltip.padding.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{tooltip.padding.vertical}"
+      },
+      "name": "token-tooltip-padding-vertical",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tooltip-transition-function": {
+      "key": "{tooltip.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.54,
+          1.5,
+          0.38,
+          1.11
+        ],
+        "key": "{tooltip.transition.function}"
+      },
+      "name": "token-tooltip-transition-function",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "transition",
+        "function"
+      ]
+    },
+    "token-typography-font-stack-display": {
+      "key": "{typography.font-stack.display}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.display.macOS}",
+          "{typography.font-stack.sans.display.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.display.emoji}"
+        ],
+        "key": "{typography.font-stack.display}"
+      },
+      "name": "token-typography-font-stack-display",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "display"
+      ]
+    },
+    "token-typography-font-stack-text": {
+      "key": "{typography.font-stack.text}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.text.macOS}",
+          "{typography.font-stack.sans.text.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.text.emoji}"
+        ],
+        "key": "{typography.font-stack.text}"
+      },
+      "name": "token-typography-font-stack-text",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "text"
+      ]
+    },
+    "token-typography-font-stack-code": {
+      "key": "{typography.font-stack.code}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.monospace.code.macOS}",
+          "{typography.font-stack.monospace.code.windows}",
+          "monospace"
+        ],
+        "key": "{typography.font-stack.code}"
+      },
+      "name": "token-typography-font-stack-code",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "code"
+      ]
+    },
+    "token-typography-font-weight-regular": {
+      "key": "{typography.font-weight.regular}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "400",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "400",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.regular}"
+      },
+      "name": "token-typography-font-weight-regular",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "regular"
+      ]
+    },
+    "token-typography-font-weight-medium": {
+      "key": "{typography.font-weight.medium}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "500",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "500",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.medium}"
+      },
+      "name": "token-typography-font-weight-medium",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "medium"
+      ]
+    },
+    "token-typography-font-weight-semibold": {
+      "key": "{typography.font-weight.semibold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "600",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "600",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.semibold}"
+      },
+      "name": "token-typography-font-weight-semibold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "semibold"
+      ]
+    },
+    "token-typography-font-weight-bold": {
+      "key": "{typography.font-weight.bold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "700",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "700",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.bold}"
+      },
+      "name": "token-typography-font-weight-bold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "bold"
+      ]
+    },
+    "token-typography-display-500-font-family": {
+      "key": "{typography.display-500.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-500.font-family}"
+      },
+      "name": "token-typography-display-500-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-family"
+      ]
+    },
+    "token-typography-display-500-font-size": {
+      "key": "{typography.display-500.font-size}",
+      "$type": "font-size",
+      "$value": "1.875rem",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "30",
+        "unit": "px",
+        "comment": "30px/1.875rem",
+        "key": "{typography.display-500.font-size}"
+      },
+      "name": "token-typography-display-500-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-size"
+      ]
+    },
+    "token-typography-display-500-line-height": {
+      "key": "{typography.display-500.line-height}",
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "original": {
+        "$type": "number",
+        "$value": 1.2666,
+        "comment": "38px",
+        "key": "{typography.display-500.line-height}"
+      },
+      "name": "token-typography-display-500-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "line-height"
+      ]
+    },
+    "token-typography-display-400-font-family": {
+      "key": "{typography.display-400.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-400.font-family}"
+      },
+      "name": "token-typography-display-400-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-family"
+      ]
+    },
+    "token-typography-display-400-font-size": {
+      "key": "{typography.display-400.font-size}",
+      "$type": "font-size",
+      "$value": "1.5rem",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "24",
+        "unit": "px",
+        "comment": "24px/1.5rem",
+        "key": "{typography.display-400.font-size}"
+      },
+      "name": "token-typography-display-400-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-size"
+      ]
+    },
+    "token-typography-display-400-line-height": {
+      "key": "{typography.display-400.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "32px",
+        "key": "{typography.display-400.line-height}"
+      },
+      "name": "token-typography-display-400-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-font-family": {
+      "key": "{typography.display-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-300.font-family}"
+      },
+      "name": "token-typography-display-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-family"
+      ]
+    },
+    "token-typography-display-300-font-size": {
+      "key": "{typography.display-300.font-size}",
+      "$type": "font-size",
+      "$value": "1.125rem",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "18",
+        "unit": "px",
+        "comment": "18px/1.125rem",
+        "key": "{typography.display-300.font-size}"
+      },
+      "name": "token-typography-display-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-size"
+      ]
+    },
+    "token-typography-display-300-line-height": {
+      "key": "{typography.display-300.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "24px",
+        "key": "{typography.display-300.line-height}"
+      },
+      "name": "token-typography-display-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-letter-spacing": {
+      "key": "{typography.display-300.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-300.letter-spacing}"
+      },
+      "name": "token-typography-display-300-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-200-font-family": {
+      "key": "{typography.display-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-200.font-family}"
+      },
+      "name": "token-typography-display-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-family"
+      ]
+    },
+    "token-typography-display-200-font-size": {
+      "key": "{typography.display-200.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.display-200.font-size}"
+      },
+      "name": "token-typography-display-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-size"
+      ]
+    },
+    "token-typography-display-200-line-height": {
+      "key": "{typography.display-200.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.display-200.line-height}"
+      },
+      "name": "token-typography-display-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "line-height"
+      ]
+    },
+    "token-typography-display-200-letter-spacing": {
+      "key": "{typography.display-200.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-200.letter-spacing}"
+      },
+      "name": "token-typography-display-200-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-100-font-family": {
+      "key": "{typography.display-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-100.font-family}"
+      },
+      "name": "token-typography-display-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-family"
+      ]
+    },
+    "token-typography-display-100-font-size": {
+      "key": "{typography.display-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.display-100.font-size}"
+      },
+      "name": "token-typography-display-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-size"
+      ]
+    },
+    "token-typography-display-100-line-height": {
+      "key": "{typography.display-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.display-100.line-height}"
+      },
+      "name": "token-typography-display-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "line-height"
+      ]
+    },
+    "token-typography-body-300-font-family": {
+      "key": "{typography.body-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-300.font-family}"
+      },
+      "name": "token-typography-body-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-family"
+      ]
+    },
+    "token-typography-body-300-font-size": {
+      "key": "{typography.body-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.body-300.font-size}"
+      },
+      "name": "token-typography-body-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-size"
+      ]
+    },
+    "token-typography-body-300-line-height": {
+      "key": "{typography.body-300.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.body-300.line-height}"
+      },
+      "name": "token-typography-body-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "line-height"
+      ]
+    },
+    "token-typography-body-200-font-family": {
+      "key": "{typography.body-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-200.font-family}"
+      },
+      "name": "token-typography-body-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-family"
+      ]
+    },
+    "token-typography-body-200-font-size": {
+      "key": "{typography.body-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.body-200.font-size}"
+      },
+      "name": "token-typography-body-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-size"
+      ]
+    },
+    "token-typography-body-200-line-height": {
+      "key": "{typography.body-200.line-height}",
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.4286,
+        "comment": "20px",
+        "key": "{typography.body-200.line-height}"
+      },
+      "name": "token-typography-body-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "line-height"
+      ]
+    },
+    "token-typography-body-100-font-family": {
+      "key": "{typography.body-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-100.font-family}"
+      },
+      "name": "token-typography-body-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-family"
+      ]
+    },
+    "token-typography-body-100-font-size": {
+      "key": "{typography.body-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.body-100.font-size}"
+      },
+      "name": "token-typography-body-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-size"
+      ]
+    },
+    "token-typography-body-100-line-height": {
+      "key": "{typography.body-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.body-100.line-height}"
+      },
+      "name": "token-typography-body-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-100-font-family": {
+      "key": "{typography.code-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-100.font-family}"
+      },
+      "name": "token-typography-code-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-family"
+      ]
+    },
+    "token-typography-code-100-font-size": {
+      "key": "{typography.code-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.code-100.font-size}"
+      },
+      "name": "token-typography-code-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-size"
+      ]
+    },
+    "token-typography-code-100-line-height": {
+      "key": "{typography.code-100.line-height}",
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "original": {
+        "$type": "number",
+        "$value": 1.23,
+        "comment": "16px",
+        "key": "{typography.code-100.line-height}"
+      },
+      "name": "token-typography-code-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-200-font-family": {
+      "key": "{typography.code-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-200.font-family}"
+      },
+      "name": "token-typography-code-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-family"
+      ]
+    },
+    "token-typography-code-200-font-size": {
+      "key": "{typography.code-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.code-200.font-size}"
+      },
+      "name": "token-typography-code-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-size"
+      ]
+    },
+    "token-typography-code-200-line-height": {
+      "key": "{typography.code-200.line-height}",
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.125,
+        "comment": "18px",
+        "key": "{typography.code-200.line-height}"
+      },
+      "name": "token-typography-code-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "line-height"
+      ]
+    },
+    "token-typography-code-300-font-family": {
+      "key": "{typography.code-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-300.font-family}"
+      },
+      "name": "token-typography-code-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-family"
+      ]
+    },
+    "token-typography-code-300-font-size": {
+      "key": "{typography.code-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.code-300.font-size}"
+      },
+      "name": "token-typography-code-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-size"
+      ]
+    },
+    "token-typography-code-300-line-height": {
+      "key": "{typography.code-300.line-height}",
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.25,
+        "comment": "20px",
+        "key": "{typography.code-300.line-height}"
+      },
+      "name": "token-typography-code-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "line-height"
+      ]
+    }
+  },
+  "cds-g90": {
+    "token-border-radius-x-small": {
+      "key": "{border.radius.x-small}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{border.radius.x-small}"
+      },
+      "name": "token-border-radius-x-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "x-small"
+      ]
+    },
+    "token-border-radius-small": {
+      "key": "{border.radius.small}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{border.radius.small}"
+      },
+      "name": "token-border-radius-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "small"
+      ]
+    },
+    "token-border-radius-medium": {
+      "key": "{border.radius.medium}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{border.radius.medium}"
+      },
+      "name": "token-border-radius-medium",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "medium"
+      ]
+    },
+    "token-border-radius-large": {
+      "key": "{border.radius.large}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{border.radius.large}"
+      },
+      "name": "token-border-radius-large",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "large"
+      ]
+    },
+    "token-color-palette-blue-500": {
+      "key": "{color.palette.blue-500}",
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1c345f",
+        "group": "palette",
+        "key": "{color.palette.blue-500}"
+      },
+      "name": "token-color-palette-blue-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-500"
+      ]
+    },
+    "token-color-palette-blue-400": {
+      "key": "{color.palette.blue-400}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0046d1",
+        "group": "palette",
+        "key": "{color.palette.blue-400}"
+      },
+      "name": "token-color-palette-blue-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-400"
+      ]
+    },
+    "token-color-palette-blue-300": {
+      "key": "{color.palette.blue-300}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c56e9",
+        "group": "palette",
+        "key": "{color.palette.blue-300}"
+      },
+      "name": "token-color-palette-blue-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-300"
+      ]
+    },
+    "token-color-palette-blue-200": {
+      "key": "{color.palette.blue-200}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1060ff",
+        "group": "palette",
+        "key": "{color.palette.blue-200}"
+      },
+      "name": "token-color-palette-blue-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-200"
+      ]
+    },
+    "token-color-palette-blue-100": {
+      "key": "{color.palette.blue-100}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cce3fe",
+        "group": "palette",
+        "key": "{color.palette.blue-100}"
+      },
+      "name": "token-color-palette-blue-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-100"
+      ]
+    },
+    "token-color-palette-blue-50": {
+      "key": "{color.palette.blue-50}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2f8ff",
+        "group": "palette",
+        "key": "{color.palette.blue-50}"
+      },
+      "name": "token-color-palette-blue-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-50"
+      ]
+    },
+    "token-color-palette-purple-500": {
+      "key": "{color.palette.purple-500}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#42215b",
+        "group": "palette",
+        "key": "{color.palette.purple-500}"
+      },
+      "name": "token-color-palette-purple-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-500"
+      ]
+    },
+    "token-color-palette-purple-400": {
+      "key": "{color.palette.purple-400}",
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#7b00db",
+        "group": "palette",
+        "key": "{color.palette.purple-400}"
+      },
+      "name": "token-color-palette-purple-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-400"
+      ]
+    },
+    "token-color-palette-purple-300": {
+      "key": "{color.palette.purple-300}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#911ced",
+        "group": "palette",
+        "key": "{color.palette.purple-300}"
+      },
+      "name": "token-color-palette-purple-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-300"
+      ]
+    },
+    "token-color-palette-purple-200": {
+      "key": "{color.palette.purple-200}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#a737ff",
+        "group": "palette",
+        "key": "{color.palette.purple-200}"
+      },
+      "name": "token-color-palette-purple-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-200"
+      ]
+    },
+    "token-color-palette-purple-100": {
+      "key": "{color.palette.purple-100}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#ead2fe",
+        "group": "palette",
+        "key": "{color.palette.purple-100}"
+      },
+      "name": "token-color-palette-purple-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-100"
+      ]
+    },
+    "token-color-palette-purple-50": {
+      "key": "{color.palette.purple-50}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f9f2ff",
+        "group": "palette",
+        "key": "{color.palette.purple-50}"
+      },
+      "name": "token-color-palette-purple-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-50"
+      ]
+    },
+    "token-color-palette-green-500": {
+      "key": "{color.palette.green-500}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#054220",
+        "group": "palette",
+        "key": "{color.palette.green-500}"
+      },
+      "name": "token-color-palette-green-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-500"
+      ]
+    },
+    "token-color-palette-green-400": {
+      "key": "{color.palette.green-400}",
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#006619",
+        "group": "palette",
+        "key": "{color.palette.green-400}"
+      },
+      "name": "token-color-palette-green-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-400"
+      ]
+    },
+    "token-color-palette-green-300": {
+      "key": "{color.palette.green-300}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#00781e",
+        "group": "palette",
+        "key": "{color.palette.green-300}"
+      },
+      "name": "token-color-palette-green-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-300"
+      ]
+    },
+    "token-color-palette-green-200": {
+      "key": "{color.palette.green-200}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#008a22",
+        "group": "palette",
+        "key": "{color.palette.green-200}"
+      },
+      "name": "token-color-palette-green-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-200"
+      ]
+    },
+    "token-color-palette-green-100": {
+      "key": "{color.palette.green-100}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cceeda",
+        "group": "palette",
+        "key": "{color.palette.green-100}"
+      },
+      "name": "token-color-palette-green-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-100"
+      ]
+    },
+    "token-color-palette-green-50": {
+      "key": "{color.palette.green-50}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2fbf6",
+        "group": "palette",
+        "key": "{color.palette.green-50}"
+      },
+      "name": "token-color-palette-green-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-50"
+      ]
+    },
+    "token-color-palette-amber-500": {
+      "key": "{color.palette.amber-500}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#542800",
+        "group": "palette",
+        "key": "{color.palette.amber-500}"
+      },
+      "name": "token-color-palette-amber-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-500"
+      ]
+    },
+    "token-color-palette-amber-400": {
+      "key": "{color.palette.amber-400}",
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#803d00",
+        "group": "palette",
+        "key": "{color.palette.amber-400}"
+      },
+      "name": "token-color-palette-amber-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-400"
+      ]
+    },
+    "token-color-palette-amber-300": {
+      "key": "{color.palette.amber-300}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#9e4b00",
+        "group": "palette",
+        "key": "{color.palette.amber-300}"
+      },
+      "name": "token-color-palette-amber-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-300"
+      ]
+    },
+    "token-color-palette-amber-200": {
+      "key": "{color.palette.amber-200}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#bb5a00",
+        "group": "palette",
+        "key": "{color.palette.amber-200}"
+      },
+      "name": "token-color-palette-amber-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-200"
+      ]
+    },
+    "token-color-palette-amber-100": {
+      "key": "{color.palette.amber-100}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbeabf",
+        "group": "palette",
+        "key": "{color.palette.amber-100}"
+      },
+      "name": "token-color-palette-amber-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-100"
+      ]
+    },
+    "token-color-palette-amber-50": {
+      "key": "{color.palette.amber-50}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9e8",
+        "group": "palette",
+        "key": "{color.palette.amber-50}"
+      },
+      "name": "token-color-palette-amber-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-50"
+      ]
+    },
+    "token-color-palette-red-500": {
+      "key": "{color.palette.red-500}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#51130a",
+        "group": "palette",
+        "key": "{color.palette.red-500}"
+      },
+      "name": "token-color-palette-red-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-500"
+      ]
+    },
+    "token-color-palette-red-400": {
+      "key": "{color.palette.red-400}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#940004",
+        "group": "palette",
+        "key": "{color.palette.red-400}"
+      },
+      "name": "token-color-palette-red-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-400"
+      ]
+    },
+    "token-color-palette-red-300": {
+      "key": "{color.palette.red-300}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c00005",
+        "group": "palette",
+        "key": "{color.palette.red-300}"
+      },
+      "name": "token-color-palette-red-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-300"
+      ]
+    },
+    "token-color-palette-red-200": {
+      "key": "{color.palette.red-200}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#e52228",
+        "group": "palette",
+        "key": "{color.palette.red-200}"
+      },
+      "name": "token-color-palette-red-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-200"
+      ]
+    },
+    "token-color-palette-red-100": {
+      "key": "{color.palette.red-100}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbd4d4",
+        "group": "palette",
+        "key": "{color.palette.red-100}"
+      },
+      "name": "token-color-palette-red-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-100"
+      ]
+    },
+    "token-color-palette-red-50": {
+      "key": "{color.palette.red-50}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff5f5",
+        "group": "palette",
+        "key": "{color.palette.red-50}"
+      },
+      "name": "token-color-palette-red-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-50"
+      ]
+    },
+    "token-color-palette-neutral-700": {
+      "key": "{color.palette.neutral-700}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "palette",
+        "key": "{color.palette.neutral-700}"
+      },
+      "name": "token-color-palette-neutral-700",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-700"
+      ]
+    },
+    "token-color-palette-neutral-600": {
+      "key": "{color.palette.neutral-600}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "palette",
+        "key": "{color.palette.neutral-600}"
+      },
+      "name": "token-color-palette-neutral-600",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-600"
+      ]
+    },
+    "token-color-palette-neutral-500": {
+      "key": "{color.palette.neutral-500}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "palette",
+        "key": "{color.palette.neutral-500}"
+      },
+      "name": "token-color-palette-neutral-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-500"
+      ]
+    },
+    "token-color-palette-neutral-400": {
+      "key": "{color.palette.neutral-400}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "palette",
+        "key": "{color.palette.neutral-400}"
+      },
+      "name": "token-color-palette-neutral-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-400"
+      ]
+    },
+    "token-color-palette-neutral-300": {
+      "key": "{color.palette.neutral-300}",
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c2c5cb",
+        "group": "palette",
+        "key": "{color.palette.neutral-300}"
+      },
+      "name": "token-color-palette-neutral-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-300"
+      ]
+    },
+    "token-color-palette-neutral-200": {
+      "key": "{color.palette.neutral-200}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "palette",
+        "key": "{color.palette.neutral-200}"
+      },
+      "name": "token-color-palette-neutral-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-200"
+      ]
+    },
+    "token-color-palette-neutral-100": {
+      "key": "{color.palette.neutral-100}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f1f2f3",
+        "group": "palette",
+        "key": "{color.palette.neutral-100}"
+      },
+      "name": "token-color-palette-neutral-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-100"
+      ]
+    },
+    "token-color-palette-neutral-50": {
+      "key": "{color.palette.neutral-50}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fafafa",
+        "group": "palette",
+        "key": "{color.palette.neutral-50}"
+      },
+      "name": "token-color-palette-neutral-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-50"
+      ]
+    },
+    "token-color-palette-neutral-0": {
+      "key": "{color.palette.neutral-0}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#ffffff",
+        "cds-g10": "#ffffff",
+        "cds-g90": "#ffffff",
+        "cds-g100": "#ffffff"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.color.white.0}",
+        "group": "palette",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.color.white.0}",
+          "cds-g10": "{carbon.color.white.0}",
+          "cds-g90": "{carbon.color.white.0}",
+          "cds-g100": "{carbon.color.white.0}"
+        },
+        "key": "{color.palette.neutral-0}"
+      },
+      "name": "token-color-palette-neutral-0",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-0"
+      ]
+    },
+    "token-color-palette-alpha-300": {
+      "key": "{color.palette.alpha-300}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "alpha": "0.4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-600}",
+        "alpha": "0.4",
+        "group": "palette",
+        "key": "{color.palette.alpha-300}"
+      },
+      "name": "token-color-palette-alpha-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-300"
+      ]
+    },
+    "token-color-palette-alpha-200": {
+      "key": "{color.palette.alpha-200}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "alpha": "0.2",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.2",
+        "group": "palette",
+        "key": "{color.palette.alpha-200}"
+      },
+      "name": "token-color-palette-alpha-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-200"
+      ]
+    },
+    "token-color-palette-alpha-100": {
+      "key": "{color.palette.alpha-100}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "alpha": "0.1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.1",
+        "group": "palette",
+        "key": "{color.palette.alpha-100}"
+      },
+      "name": "token-color-palette-alpha-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-100"
+      ]
+    },
+    "token-color-border-primary": {
+      "key": "{color.border.primary}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-200}",
+        "group": "semantic",
+        "key": "{color.border.primary}"
+      },
+      "name": "token-color-border-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "primary"
+      ]
+    },
+    "token-color-border-faint": {
+      "key": "{color.border.faint}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-100}",
+        "group": "semantic",
+        "key": "{color.border.faint}"
+      },
+      "name": "token-color-border-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "faint"
+      ]
+    },
+    "token-color-border-strong": {
+      "key": "{color.border.strong}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-300}",
+        "group": "semantic",
+        "key": "{color.border.strong}"
+      },
+      "name": "token-color-border-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "strong"
+      ]
+    },
+    "token-color-border-action": {
+      "key": "{color.border.action}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-100}",
+        "group": "semantic",
+        "key": "{color.border.action}"
+      },
+      "name": "token-color-border-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "action"
+      ]
+    },
+    "token-color-border-highlight": {
+      "key": "{color.border.highlight}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-100}",
+        "group": "semantic",
+        "key": "{color.border.highlight}"
+      },
+      "name": "token-color-border-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "highlight"
+      ]
+    },
+    "token-color-border-success": {
+      "key": "{color.border.success}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-100}",
+        "group": "semantic",
+        "key": "{color.border.success}"
+      },
+      "name": "token-color-border-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "success"
+      ]
+    },
+    "token-color-border-warning": {
+      "key": "{color.border.warning}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-100}",
+        "group": "semantic",
+        "key": "{color.border.warning}"
+      },
+      "name": "token-color-border-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "warning"
+      ]
+    },
+    "token-color-border-critical": {
+      "key": "{color.border.critical}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-100}",
+        "group": "semantic",
+        "key": "{color.border.critical}"
+      },
+      "name": "token-color-border-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "critical"
+      ]
+    },
+    "token-color-focus-action-internal": {
+      "key": "{color.focus.action.internal}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.focus.action.internal}"
+      },
+      "name": "token-color-focus-action-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "internal"
+      ]
+    },
+    "token-color-focus-action-external": {
+      "key": "{color.focus.action.external}",
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#5990ff",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.action.external}"
+      },
+      "name": "token-color-focus-action-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "external"
+      ]
+    },
+    "token-color-focus-critical-internal": {
+      "key": "{color.focus.critical.internal}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.focus.critical.internal}"
+      },
+      "name": "token-color-focus-critical-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "internal"
+      ]
+    },
+    "token-color-focus-critical-external": {
+      "key": "{color.focus.critical.external}",
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#dd7578",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.critical.external}"
+      },
+      "name": "token-color-focus-critical-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "external"
+      ]
+    },
+    "token-color-foreground-strong": {
+      "key": "{color.foreground.strong}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-700}",
+        "group": "semantic",
+        "key": "{color.foreground.strong}"
+      },
+      "name": "token-color-foreground-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-color-foreground-primary": {
+      "key": "{color.foreground.primary}",
+      "$type": "color",
+      "$value": "#f4f4f4",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#161616",
+        "cds-g10": "#161616",
+        "cds-g90": "#f4f4f4",
+        "cds-g100": "#f4f4f4"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.themes.g90.textPrimary}",
+        "group": "semantic",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.themes.white.textPrimary}",
+          "cds-g10": "{carbon.themes.g10.textPrimary}",
+          "cds-g90": "{carbon.themes.g90.textPrimary}",
+          "cds-g100": "{carbon.themes.g100.textPrimary}"
+        },
+        "key": "{color.foreground.primary}"
+      },
+      "name": "token-color-foreground-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-color-foreground-faint": {
+      "key": "{color.foreground.faint}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "semantic",
+        "key": "{color.foreground.faint}"
+      },
+      "name": "token-color-foreground-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-color-foreground-high-contrast": {
+      "key": "{color.foreground.high-contrast}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.foreground.high-contrast}"
+      },
+      "name": "token-color-foreground-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "high-contrast"
+      ]
+    },
+    "token-color-foreground-disabled": {
+      "key": "{color.foreground.disabled}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "semantic",
+        "key": "{color.foreground.disabled}"
+      },
+      "name": "token-color-foreground-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "disabled"
+      ]
+    },
+    "token-color-foreground-action": {
+      "key": "{color.foreground.action}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "semantic",
+        "key": "{color.foreground.action}"
+      },
+      "name": "token-color-foreground-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action"
+      ]
+    },
+    "token-color-foreground-action-hover": {
+      "key": "{color.foreground.action-hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.foreground.action-hover}"
+      },
+      "name": "token-color-foreground-action-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-hover"
+      ]
+    },
+    "token-color-foreground-action-active": {
+      "key": "{color.foreground.action-active}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "semantic",
+        "key": "{color.foreground.action-active}"
+      },
+      "name": "token-color-foreground-action-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-active"
+      ]
+    },
+    "token-color-foreground-highlight": {
+      "key": "{color.foreground.highlight}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-200}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight}"
+      },
+      "name": "token-color-foreground-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight"
+      ]
+    },
+    "token-color-foreground-highlight-on-surface": {
+      "key": "{color.foreground.highlight-on-surface}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-300}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-on-surface}"
+      },
+      "name": "token-color-foreground-highlight-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-on-surface"
+      ]
+    },
+    "token-color-foreground-highlight-high-contrast": {
+      "key": "{color.foreground.highlight-high-contrast}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-500}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-high-contrast}"
+      },
+      "name": "token-color-foreground-highlight-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-high-contrast"
+      ]
+    },
+    "token-color-foreground-success": {
+      "key": "{color.foreground.success}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-200}",
+        "group": "semantic",
+        "key": "{color.foreground.success}"
+      },
+      "name": "token-color-foreground-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success"
+      ]
+    },
+    "token-color-foreground-success-on-surface": {
+      "key": "{color.foreground.success-on-surface}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-300}",
+        "group": "semantic",
+        "key": "{color.foreground.success-on-surface}"
+      },
+      "name": "token-color-foreground-success-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-on-surface"
+      ]
+    },
+    "token-color-foreground-success-high-contrast": {
+      "key": "{color.foreground.success-high-contrast}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-500}",
+        "group": "semantic",
+        "key": "{color.foreground.success-high-contrast}"
+      },
+      "name": "token-color-foreground-success-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-high-contrast"
+      ]
+    },
+    "token-color-foreground-warning": {
+      "key": "{color.foreground.warning}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-200}",
+        "group": "semantic",
+        "key": "{color.foreground.warning}"
+      },
+      "name": "token-color-foreground-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning"
+      ]
+    },
+    "token-color-foreground-warning-on-surface": {
+      "key": "{color.foreground.warning-on-surface}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-300}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-on-surface}"
+      },
+      "name": "token-color-foreground-warning-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-on-surface"
+      ]
+    },
+    "token-color-foreground-warning-high-contrast": {
+      "key": "{color.foreground.warning-high-contrast}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-500}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-high-contrast}"
+      },
+      "name": "token-color-foreground-warning-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-high-contrast"
+      ]
+    },
+    "token-color-foreground-critical": {
+      "key": "{color.foreground.critical}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-200}",
+        "group": "semantic",
+        "key": "{color.foreground.critical}"
+      },
+      "name": "token-color-foreground-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical"
+      ]
+    },
+    "token-color-foreground-critical-on-surface": {
+      "key": "{color.foreground.critical-on-surface}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-on-surface}"
+      },
+      "name": "token-color-foreground-critical-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-on-surface"
+      ]
+    },
+    "token-color-foreground-critical-high-contrast": {
+      "key": "{color.foreground.critical-high-contrast}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-500}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-high-contrast}"
+      },
+      "name": "token-color-foreground-critical-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-high-contrast"
+      ]
+    },
+    "token-color-page-primary": {
+      "key": "{color.page.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.page.primary}"
+      },
+      "name": "token-color-page-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "primary"
+      ]
+    },
+    "token-color-page-faint": {
+      "key": "{color.page.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.page.faint}"
+      },
+      "name": "token-color-page-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "faint"
+      ]
+    },
+    "token-color-surface-primary": {
+      "key": "{color.surface.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.primary}"
+      },
+      "name": "token-color-surface-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-color-surface-faint": {
+      "key": "{color.surface.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.faint}"
+      },
+      "name": "token-color-surface-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "faint"
+      ]
+    },
+    "token-color-surface-strong": {
+      "key": "{color.surface.strong}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.strong}"
+      },
+      "name": "token-color-surface-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "strong"
+      ]
+    },
+    "token-color-surface-interactive": {
+      "key": "{color.surface.interactive}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.interactive}"
+      },
+      "name": "token-color-surface-interactive",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive"
+      ]
+    },
+    "token-color-surface-interactive-hover": {
+      "key": "{color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-hover}"
+      },
+      "name": "token-color-surface-interactive-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-color-surface-interactive-active": {
+      "key": "{color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-200}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-active}"
+      },
+      "name": "token-color-surface-interactive-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-color-surface-interactive-disabled": {
+      "key": "{color.surface.interactive-disabled}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-disabled}"
+      },
+      "name": "token-color-surface-interactive-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-disabled"
+      ]
+    },
+    "token-color-surface-action": {
+      "key": "{color.surface.action}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-50}",
+        "group": "semantic",
+        "key": "{color.surface.action}"
+      },
+      "name": "token-color-surface-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "action"
+      ]
+    },
+    "token-color-surface-highlight": {
+      "key": "{color.surface.highlight}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-50}",
+        "group": "semantic",
+        "key": "{color.surface.highlight}"
+      },
+      "name": "token-color-surface-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "highlight"
+      ]
+    },
+    "token-color-surface-success": {
+      "key": "{color.surface.success}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-50}",
+        "group": "semantic",
+        "key": "{color.surface.success}"
+      },
+      "name": "token-color-surface-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "success"
+      ]
+    },
+    "token-color-surface-warning": {
+      "key": "{color.surface.warning}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-50}",
+        "group": "semantic",
+        "key": "{color.surface.warning}"
+      },
+      "name": "token-color-surface-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "warning"
+      ]
+    },
+    "token-color-surface-critical": {
+      "key": "{color.surface.critical}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-50}",
+        "group": "semantic",
+        "key": "{color.surface.critical}"
+      },
+      "name": "token-color-surface-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "critical"
+      ]
+    },
+    "token-color-hashicorp-brand": {
+      "key": "{color.hashicorp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hashicorp-brand}",
+        "group": "branding",
+        "key": "{color.hashicorp.brand}"
+      },
+      "name": "token-color-hashicorp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hashicorp",
+        "brand"
+      ]
+    },
+    "token-color-boundary-brand": {
+      "key": "{color.boundary.brand}",
+      "$type": "color",
+      "$value": "#f24c53",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-brand}",
+        "group": "branding",
+        "key": "{color.boundary.brand}"
+      },
+      "name": "token-color-boundary-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "brand"
+      ]
+    },
+    "token-color-boundary-foreground": {
+      "key": "{color.boundary.foreground}",
+      "$type": "color",
+      "$value": "#cf2d32",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-500}",
+        "group": "branding",
+        "key": "{color.boundary.foreground}"
+      },
+      "name": "token-color-boundary-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "foreground"
+      ]
+    },
+    "token-color-boundary-surface": {
+      "key": "{color.boundary.surface}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.surface}"
+      },
+      "name": "token-color-boundary-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "surface"
+      ]
+    },
+    "token-color-boundary-border": {
+      "key": "{color.boundary.border}",
+      "$type": "color",
+      "$value": "#fbd7d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-100}",
+        "group": "branding",
+        "key": "{color.boundary.border}"
+      },
+      "name": "token-color-boundary-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "border"
+      ]
+    },
+    "token-color-boundary-gradient-primary-start": {
+      "key": "{color.boundary.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#f97076",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-300}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.start}"
+      },
+      "name": "token-color-boundary-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-primary-stop": {
+      "key": "{color.boundary.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#db363b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-400}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.stop}"
+      },
+      "name": "token-color-boundary-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-boundary-gradient-faint-start": {
+      "key": "{color.boundary.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffafa",
+        "group": "branding",
+        "comment": "this is the 'boundary-50' value at 25% opacity on white",
+        "key": "{color.boundary.gradient.faint.start}"
+      },
+      "name": "token-color-boundary-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-faint-stop": {
+      "key": "{color.boundary.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.faint.stop}"
+      },
+      "name": "token-color-boundary-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-consul-brand": {
+      "key": "{color.consul.brand}",
+      "$type": "color",
+      "$value": "#e03875",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-brand}",
+        "group": "branding",
+        "key": "{color.consul.brand}"
+      },
+      "name": "token-color-consul-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "brand"
+      ]
+    },
+    "token-color-consul-foreground": {
+      "key": "{color.consul.foreground}",
+      "$type": "color",
+      "$value": "#d01c5b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-500}",
+        "group": "branding",
+        "key": "{color.consul.foreground}"
+      },
+      "name": "token-color-consul-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "foreground"
+      ]
+    },
+    "token-color-consul-surface": {
+      "key": "{color.consul.surface}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.surface}"
+      },
+      "name": "token-color-consul-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "surface"
+      ]
+    },
+    "token-color-consul-border": {
+      "key": "{color.consul.border}",
+      "$type": "color",
+      "$value": "#ffcede",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-100}",
+        "group": "branding",
+        "key": "{color.consul.border}"
+      },
+      "name": "token-color-consul-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "border"
+      ]
+    },
+    "token-color-consul-gradient-primary-start": {
+      "key": "{color.consul.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#ff99be",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-300}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.start}"
+      },
+      "name": "token-color-consul-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-primary-stop": {
+      "key": "{color.consul.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#da306e",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-400}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.stop}"
+      },
+      "name": "token-color-consul-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-consul-gradient-faint-start": {
+      "key": "{color.consul.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9fb",
+        "group": "branding",
+        "comment": "this is the 'consul-50' value at 25% opacity on white",
+        "key": "{color.consul.gradient.faint.start}"
+      },
+      "name": "token-color-consul-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-faint-stop": {
+      "key": "{color.consul.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.gradient.faint.stop}"
+      },
+      "name": "token-color-consul-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-hcp-brand": {
+      "key": "{color.hcp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hcp-brand}",
+        "group": "branding",
+        "key": "{color.hcp.brand}"
+      },
+      "name": "token-color-hcp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hcp",
+        "brand"
+      ]
+    },
+    "token-color-nomad-brand": {
+      "key": "{color.nomad.brand}",
+      "$type": "color",
+      "$value": "#06d092",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-brand}",
+        "group": "branding",
+        "key": "{color.nomad.brand}"
+      },
+      "name": "token-color-nomad-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "brand"
+      ]
+    },
+    "token-color-nomad-foreground": {
+      "key": "{color.nomad.foreground}",
+      "$type": "color",
+      "$value": "#008661",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-500}",
+        "group": "branding",
+        "key": "{color.nomad.foreground}"
+      },
+      "name": "token-color-nomad-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "foreground"
+      ]
+    },
+    "token-color-nomad-surface": {
+      "key": "{color.nomad.surface}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.surface}"
+      },
+      "name": "token-color-nomad-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "surface"
+      ]
+    },
+    "token-color-nomad-border": {
+      "key": "{color.nomad.border}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.border}"
+      },
+      "name": "token-color-nomad-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "border"
+      ]
+    },
+    "token-color-nomad-gradient-primary-start": {
+      "key": "{color.nomad.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.start}"
+      },
+      "name": "token-color-nomad-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-primary-stop": {
+      "key": "{color.nomad.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#60dea9",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-200}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.stop}"
+      },
+      "name": "token-color-nomad-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-nomad-gradient-faint-start": {
+      "key": "{color.nomad.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f3fff9",
+        "group": "branding",
+        "comment": "this is the 'nomad-50' value at 25% opacity on white",
+        "key": "{color.nomad.gradient.faint.start}"
+      },
+      "name": "token-color-nomad-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-faint-stop": {
+      "key": "{color.nomad.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.faint.stop}"
+      },
+      "name": "token-color-nomad-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-packer-brand": {
+      "key": "{color.packer.brand}",
+      "$type": "color",
+      "$value": "#02a8ef",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-brand}",
+        "group": "branding",
+        "key": "{color.packer.brand}"
+      },
+      "name": "token-color-packer-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "brand"
+      ]
+    },
+    "token-color-packer-foreground": {
+      "key": "{color.packer.foreground}",
+      "$type": "color",
+      "$value": "#007eb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-500}",
+        "group": "branding",
+        "key": "{color.packer.foreground}"
+      },
+      "name": "token-color-packer-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "foreground"
+      ]
+    },
+    "token-color-packer-surface": {
+      "key": "{color.packer.surface}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.surface}"
+      },
+      "name": "token-color-packer-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "surface"
+      ]
+    },
+    "token-color-packer-border": {
+      "key": "{color.packer.border}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.border}"
+      },
+      "name": "token-color-packer-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "border"
+      ]
+    },
+    "token-color-packer-gradient-primary-start": {
+      "key": "{color.packer.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.start}"
+      },
+      "name": "token-color-packer-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-primary-stop": {
+      "key": "{color.packer.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#63d0ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-200}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.stop}"
+      },
+      "name": "token-color-packer-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-packer-gradient-faint-start": {
+      "key": "{color.packer.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fcff",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#F3FCFF",
+        "group": "branding",
+        "comment": "this is the 'packer-50' value at 25% opacity on white",
+        "key": "{color.packer.gradient.faint.start}"
+      },
+      "name": "token-color-packer-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-faint-stop": {
+      "key": "{color.packer.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.gradient.faint.stop}"
+      },
+      "name": "token-color-packer-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-terraform-brand": {
+      "key": "{color.terraform.brand}",
+      "$type": "color",
+      "$value": "#7b42bc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-brand}",
+        "group": "branding",
+        "key": "{color.terraform.brand}"
+      },
+      "name": "token-color-terraform-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand"
+      ]
+    },
+    "token-color-terraform-brand-on-dark": {
+      "key": "{color.terraform.brand-on-dark}",
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "original": {
+        "$type": "color",
+        "$value": "#a067da",
+        "group": "branding",
+        "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+        "key": "{color.terraform.brand-on-dark}"
+      },
+      "name": "token-color-terraform-brand-on-dark",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand-on-dark"
+      ]
+    },
+    "token-color-terraform-foreground": {
+      "key": "{color.terraform.foreground}",
+      "$type": "color",
+      "$value": "#773cb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-500}",
+        "group": "branding",
+        "key": "{color.terraform.foreground}"
+      },
+      "name": "token-color-terraform-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "foreground"
+      ]
+    },
+    "token-color-terraform-surface": {
+      "key": "{color.terraform.surface}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.surface}"
+      },
+      "name": "token-color-terraform-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "surface"
+      ]
+    },
+    "token-color-terraform-border": {
+      "key": "{color.terraform.border}",
+      "$type": "color",
+      "$value": "#ebdbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-100}",
+        "group": "branding",
+        "key": "{color.terraform.border}"
+      },
+      "name": "token-color-terraform-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "border"
+      ]
+    },
+    "token-color-terraform-gradient-primary-start": {
+      "key": "{color.terraform.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bb8deb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-300}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.start}"
+      },
+      "name": "token-color-terraform-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-primary-stop": {
+      "key": "{color.terraform.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#844fba",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-400}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.stop}"
+      },
+      "name": "token-color-terraform-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-terraform-gradient-faint-start": {
+      "key": "{color.terraform.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fcfaff",
+        "group": "branding",
+        "comment": "this is the 'terraform-50' value at 25% opacity on white",
+        "key": "{color.terraform.gradient.faint.start}"
+      },
+      "name": "token-color-terraform-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-faint-stop": {
+      "key": "{color.terraform.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.faint.stop}"
+      },
+      "name": "token-color-terraform-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-brand": {
+      "key": "{color.vagrant.brand}",
+      "$type": "color",
+      "$value": "#1868f2",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-brand}",
+        "group": "branding",
+        "key": "{color.vagrant.brand}"
+      },
+      "name": "token-color-vagrant-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "brand"
+      ]
+    },
+    "token-color-vagrant-foreground": {
+      "key": "{color.vagrant.foreground}",
+      "$type": "color",
+      "$value": "#1c61d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-500}",
+        "group": "branding",
+        "key": "{color.vagrant.foreground}"
+      },
+      "name": "token-color-vagrant-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "foreground"
+      ]
+    },
+    "token-color-vagrant-surface": {
+      "key": "{color.vagrant.surface}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.surface}"
+      },
+      "name": "token-color-vagrant-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "surface"
+      ]
+    },
+    "token-color-vagrant-border": {
+      "key": "{color.vagrant.border}",
+      "$type": "color",
+      "$value": "#c7dbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-100}",
+        "group": "branding",
+        "key": "{color.vagrant.border}"
+      },
+      "name": "token-color-vagrant-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "border"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-start": {
+      "key": "{color.vagrant.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#639cff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-300}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.start}"
+      },
+      "name": "token-color-vagrant-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-stop": {
+      "key": "{color.vagrant.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#2e71e5",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-400}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.stop}"
+      },
+      "name": "token-color-vagrant-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-start": {
+      "key": "{color.vagrant.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f4faff",
+        "group": "branding",
+        "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+        "key": "{color.vagrant.gradient.faint.start}"
+      },
+      "name": "token-color-vagrant-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-stop": {
+      "key": "{color.vagrant.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.faint.stop}"
+      },
+      "name": "token-color-vagrant-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-brand": {
+      "key": "{color.vault-radar.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-brand}",
+        "group": "branding",
+        "key": "{color.vault-radar.brand}"
+      },
+      "name": "token-color-vault-radar-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand"
+      ]
+    },
+    "token-color-vault-radar-brand-alt": {
+      "key": "{color.vault-radar.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+        "key": "{color.vault-radar.brand-alt}"
+      },
+      "name": "token-color-vault-radar-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-radar-foreground": {
+      "key": "{color.vault-radar.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-500}",
+        "group": "branding",
+        "key": "{color.vault-radar.foreground}"
+      },
+      "name": "token-color-vault-radar-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "foreground"
+      ]
+    },
+    "token-color-vault-radar-surface": {
+      "key": "{color.vault-radar.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.surface}"
+      },
+      "name": "token-color-vault-radar-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "surface"
+      ]
+    },
+    "token-color-vault-radar-border": {
+      "key": "{color.vault-radar.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.border}"
+      },
+      "name": "token-color-vault-radar-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "border"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-start": {
+      "key": "{color.vault-radar.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.start}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-stop": {
+      "key": "{color.vault-radar.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-200}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-start": {
+      "key": "{color.vault-radar.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+        "key": "{color.vault-radar.gradient.faint.start}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-stop": {
+      "key": "{color.vault-radar.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-brand": {
+      "key": "{color.vault-secrets.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-brand}",
+        "group": "branding",
+        "key": "{color.vault-secrets.brand}"
+      },
+      "name": "token-color-vault-secrets-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand"
+      ]
+    },
+    "token-color-vault-secrets-brand-alt": {
+      "key": "{color.vault-secrets.brand-alt}",
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "original": {
+        "group": "branding",
+        "$type": "color",
+        "$value": "#000",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+        "key": "{color.vault-secrets.brand-alt}"
+      },
+      "name": "token-color-vault-secrets-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-secrets-foreground": {
+      "key": "{color.vault-secrets.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-500}",
+        "group": "branding",
+        "key": "{color.vault-secrets.foreground}"
+      },
+      "name": "token-color-vault-secrets-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "foreground"
+      ]
+    },
+    "token-color-vault-secrets-surface": {
+      "key": "{color.vault-secrets.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.surface}"
+      },
+      "name": "token-color-vault-secrets-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "surface"
+      ]
+    },
+    "token-color-vault-secrets-border": {
+      "key": "{color.vault-secrets.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.border}"
+      },
+      "name": "token-color-vault-secrets-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "border"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-start": {
+      "key": "{color.vault-secrets.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-stop": {
+      "key": "{color.vault-secrets.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-200}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-start": {
+      "key": "{color.vault-secrets.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+        "key": "{color.vault-secrets.gradient.faint.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-stop": {
+      "key": "{color.vault-secrets.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-brand": {
+      "key": "{color.vault.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-brand}",
+        "group": "branding",
+        "key": "{color.vault.brand}"
+      },
+      "name": "token-color-vault-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand"
+      ]
+    },
+    "token-color-vault-brand-alt": {
+      "key": "{color.vault.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+        "key": "{color.vault.brand-alt}"
+      },
+      "name": "token-color-vault-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-foreground": {
+      "key": "{color.vault.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-500}",
+        "group": "branding",
+        "key": "{color.vault.foreground}"
+      },
+      "name": "token-color-vault-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "foreground"
+      ]
+    },
+    "token-color-vault-surface": {
+      "key": "{color.vault.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.surface}"
+      },
+      "name": "token-color-vault-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "surface"
+      ]
+    },
+    "token-color-vault-border": {
+      "key": "{color.vault.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.border}"
+      },
+      "name": "token-color-vault-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "border"
+      ]
+    },
+    "token-color-vault-gradient-primary-start": {
+      "key": "{color.vault.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.start}"
+      },
+      "name": "token-color-vault-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-primary-stop": {
+      "key": "{color.vault.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-200}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-gradient-faint-start": {
+      "key": "{color.vault.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-50' value at 25% opacity on white",
+        "key": "{color.vault.gradient.faint.start}"
+      },
+      "name": "token-color-vault-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-faint-stop": {
+      "key": "{color.vault.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-brand": {
+      "key": "{color.waypoint.brand}",
+      "$type": "color",
+      "$value": "#14c6cb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-brand}",
+        "group": "branding",
+        "key": "{color.waypoint.brand}"
+      },
+      "name": "token-color-waypoint-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "brand"
+      ]
+    },
+    "token-color-waypoint-foreground": {
+      "key": "{color.waypoint.foreground}",
+      "$type": "color",
+      "$value": "#008196",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-500}",
+        "group": "branding",
+        "key": "{color.waypoint.foreground}"
+      },
+      "name": "token-color-waypoint-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "foreground"
+      ]
+    },
+    "token-color-waypoint-surface": {
+      "key": "{color.waypoint.surface}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.surface}"
+      },
+      "name": "token-color-waypoint-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "surface"
+      ]
+    },
+    "token-color-waypoint-border": {
+      "key": "{color.waypoint.border}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.border}"
+      },
+      "name": "token-color-waypoint-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "border"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-start": {
+      "key": "{color.waypoint.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.start}"
+      },
+      "name": "token-color-waypoint-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-stop": {
+      "key": "{color.waypoint.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#62d4dc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-200}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.stop}"
+      },
+      "name": "token-color-waypoint-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-start": {
+      "key": "{color.waypoint.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f6feff",
+        "group": "branding",
+        "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+        "key": "{color.waypoint.gradient.faint.start}"
+      },
+      "name": "token-color-waypoint-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-stop": {
+      "key": "{color.waypoint.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.faint.stop}"
+      },
+      "name": "token-color-waypoint-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-elevation-inset-box-shadow": {
+      "key": "{elevation.inset.box-shadow}",
+      "$value": "inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-01}",
+        "key": "{elevation.inset.box-shadow}"
+      },
+      "name": "token-elevation-inset-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-low-box-shadow": {
+      "key": "{elevation.low.box-shadow}",
+      "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+        "key": "{elevation.low.box-shadow}"
+      },
+      "name": "token-elevation-low-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-mid-box-shadow": {
+      "key": "{elevation.mid.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+        "key": "{elevation.mid.box-shadow}"
+      },
+      "name": "token-elevation-mid-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-high-box-shadow": {
+      "key": "{elevation.high.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+        "key": "{elevation.high.box-shadow}"
+      },
+      "name": "token-elevation-high-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-higher-box-shadow": {
+      "key": "{elevation.higher.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+        "key": "{elevation.higher.box-shadow}"
+      },
+      "name": "token-elevation-higher-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-overlay-box-shadow": {
+      "key": "{elevation.overlay.box-shadow}",
+      "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+        "key": "{elevation.overlay.box-shadow}"
+      },
+      "name": "token-elevation-overlay-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-surface-inset-box-shadow": {
+      "key": "{surface.inset.box-shadow}",
+      "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+        "key": "{surface.inset.box-shadow}"
+      },
+      "name": "token-surface-inset-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-surface-base-box-shadow": {
+      "key": "{surface.base.box-shadow}",
+      "$value": "0 0 0 1px #656a7633",
+      "original": {
+        "$value": "{elevation.base.box-shadow-border}",
+        "key": "{surface.base.box-shadow}"
+      },
+      "name": "token-surface-base-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "base",
+        "box-shadow"
+      ]
+    },
+    "token-surface-low-box-shadow": {
+      "key": "{surface.low.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+        "key": "{surface.low.box-shadow}"
+      },
+      "name": "token-surface-low-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-surface-mid-box-shadow": {
+      "key": "{surface.mid.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+        "key": "{surface.mid.box-shadow}"
+      },
+      "name": "token-surface-mid-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-surface-high-box-shadow": {
+      "key": "{surface.high.box-shadow}",
+      "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+        "key": "{surface.high.box-shadow}"
+      },
+      "name": "token-surface-high-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-surface-higher-box-shadow": {
+      "key": "{surface.higher.box-shadow}",
+      "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+        "key": "{surface.higher.box-shadow}"
+      },
+      "name": "token-surface-higher-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-surface-overlay-box-shadow": {
+      "key": "{surface.overlay.box-shadow}",
+      "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+        "key": "{surface.overlay.box-shadow}"
+      },
+      "name": "token-surface-overlay-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-action-box-shadow": {
+      "key": "{focus-ring.action.box-shadow}",
+      "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+      "original": {
+        "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+        "key": "{focus-ring.action.box-shadow}"
+      },
+      "name": "token-focus-ring-action-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "action",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-critical-box-shadow": {
+      "key": "{focus-ring.critical.box-shadow}",
+      "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+      "original": {
+        "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+        "key": "{focus-ring.critical.box-shadow}"
+      },
+      "name": "token-focus-ring-critical-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "critical",
+        "box-shadow"
+      ]
+    },
+    "token-app-header-height": {
+      "key": "{app-header.height}",
+      "$type": "dimension",
+      "$value": "60px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "60",
+        "unit": "px",
+        "key": "{app-header.height}"
+      },
+      "name": "token-app-header-height",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "height"
+      ]
+    },
+    "token-app-header-home-link-size": {
+      "key": "{app-header.home-link.size}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-header.home-link.size}"
+      },
+      "name": "token-app-header-home-link-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "home-link",
+        "size"
+      ]
+    },
+    "token-app-header-logo-size": {
+      "key": "{app-header.logo.size}",
+      "$type": "dimension",
+      "$value": "28px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "28",
+        "unit": "px",
+        "key": "{app-header.logo.size}"
+      },
+      "name": "token-app-header-logo-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "logo",
+        "size"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-width": {
+      "key": "{app-side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.border.width}"
+      },
+      "name": "token-app-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-color": {
+      "key": "{app-side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-200)",
+        "group": "components",
+        "key": "{app-side-nav.wrapper.border.color}"
+      },
+      "name": "token-app-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal": {
+      "key": "{app-side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical": {
+      "key": "{app-side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-app-side-nav-toggle-button-border-radius": {
+      "key": "{app-side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-app-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-app-side-nav-header-home-link-padding": {
+      "key": "{app-side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.padding}"
+      },
+      "name": "token-app-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size": {
+      "key": "{app-side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-app-side-nav-header-actions-spacing": {
+      "key": "{app-side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.header.actions.spacing}"
+      },
+      "name": "token-app-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-app-side-nav-body-list-margin-vertical": {
+      "key": "{app-side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{app-side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-height": {
+      "key": "{app-side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.height}"
+      },
+      "name": "token-app-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-horizontal": {
+      "key": "{app-side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-vertical": {
+      "key": "{app-side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-spacing-vertical": {
+      "key": "{app-side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-border-radius": {
+      "key": "{app-side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-app-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-app-side-nav-color-foreground-primary": {
+      "key": "{app-side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.primary}"
+      },
+      "name": "token-app-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-foreground-strong": {
+      "key": "{app-side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.strong}"
+      },
+      "name": "token-app-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-app-side-nav-color-foreground-faint": {
+      "key": "{app-side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.faint}"
+      },
+      "name": "token-app-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-app-side-nav-color-surface-primary": {
+      "key": "{app-side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.surface.primary}"
+      },
+      "name": "token-app-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-hover": {
+      "key": "{app-side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-interactive-hover)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-active": {
+      "key": "{app-side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-300)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-form-label-color": {
+      "key": "{form.label.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.label.color}"
+      },
+      "name": "token-form-label-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "label",
+        "color"
+      ]
+    },
+    "token-form-legend-color": {
+      "key": "{form.legend.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{form.label.color}",
+        "group": "components",
+        "key": "{form.legend.color}"
+      },
+      "name": "token-form-legend-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "legend",
+        "color"
+      ]
+    },
+    "token-form-helper-text-color": {
+      "key": "{form.helper-text.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.helper-text.color}"
+      },
+      "name": "token-form-helper-text-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "helper-text",
+        "color"
+      ]
+    },
+    "token-form-indicator-optional-color": {
+      "key": "{form.indicator.optional.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.indicator.optional.color}"
+      },
+      "name": "token-form-indicator-optional-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "indicator",
+        "optional",
+        "color"
+      ]
+    },
+    "token-form-error-color": {
+      "key": "{form.error.color}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.error.color}"
+      },
+      "name": "token-form-error-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "color"
+      ]
+    },
+    "token-form-error-icon-size": {
+      "key": "{form.error.icon-size}",
+      "$type": "dimension",
+      "$value": "14px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "14",
+        "unit": "px",
+        "key": "{form.error.icon-size}"
+      },
+      "name": "token-form-error-icon-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "icon-size"
+      ]
+    },
+    "token-form-checkbox-size": {
+      "key": "{form.checkbox.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.checkbox.size}"
+      },
+      "name": "token-form-checkbox-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "size"
+      ]
+    },
+    "token-form-checkbox-border-radius": {
+      "key": "{form.checkbox.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.checkbox.border.radius}"
+      },
+      "name": "token-form-checkbox-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-checkbox-border-width": {
+      "key": "{form.checkbox.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.checkbox.border.width}"
+      },
+      "name": "token-form-checkbox-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-checkbox-background-image-size": {
+      "key": "{form.checkbox.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.checkbox.background-image.size}"
+      },
+      "name": "token-form-checkbox-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url": {
+      "key": "{form.checkbox.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url}"
+      },
+      "name": "token-form-checkbox-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-disabled": {
+      "key": "{form.checkbox.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate-disabled": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate-disabled"
+      ]
+    },
+    "token-form-control-base-foreground-value-color": {
+      "key": "{form.control.base.foreground.value-color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.control.base.foreground.value-color}"
+      },
+      "name": "token-form-control-base-foreground-value-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "value-color"
+      ]
+    },
+    "token-form-control-base-foreground-placeholder-color": {
+      "key": "{form.control.base.foreground.placeholder-color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.control.base.foreground.placeholder-color}"
+      },
+      "name": "token-form-control-base-foreground-placeholder-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "placeholder-color"
+      ]
+    },
+    "token-form-control-base-surface-color-default": {
+      "key": "{form.control.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.default}"
+      },
+      "name": "token-form-control-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-surface-color-hover": {
+      "key": "{form.control.base.surface-color.hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-hover}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.hover}"
+      },
+      "name": "token-form-control-base-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-base-border-color-default": {
+      "key": "{form.control.base.border-color.default}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "components",
+        "key": "{form.control.base.border-color.default}"
+      },
+      "name": "token-form-control-base-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-border-color-hover": {
+      "key": "{form.control.base.border-color.hover}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "components",
+        "key": "{form.control.base.border-color.hover}"
+      },
+      "name": "token-form-control-base-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-foreground-color": {
+      "key": "{form.control.checked.foreground-color}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.high-contrast}",
+        "group": "components",
+        "key": "{form.control.checked.foreground-color}"
+      },
+      "name": "token-form-control-checked-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-checked-surface-color-default": {
+      "key": "{form.control.checked.surface-color.default}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.default}"
+      },
+      "name": "token-form-control-checked-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-surface-color-hover": {
+      "key": "{form.control.checked.surface-color.hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.hover}"
+      },
+      "name": "token-form-control-checked-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-border-color-default": {
+      "key": "{form.control.checked.border-color.default}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.default}"
+      },
+      "name": "token-form-control-checked-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-border-color-hover": {
+      "key": "{form.control.checked.border-color.hover}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.hover}"
+      },
+      "name": "token-form-control-checked-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-invalid-border-color-default": {
+      "key": "{form.control.invalid.border-color.default}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.default}"
+      },
+      "name": "token-form-control-invalid-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-invalid-border-color-hover": {
+      "key": "{form.control.invalid.border-color.hover}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-400}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.hover}"
+      },
+      "name": "token-form-control-invalid-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-readonly-foreground-color": {
+      "key": "{form.control.readonly.foreground-color}",
+      "$type": "color",
+      "$value": "#f4f4f4",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.primary}",
+        "group": "components",
+        "key": "{form.control.readonly.foreground-color}"
+      },
+      "name": "token-form-control-readonly-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-readonly-surface-color": {
+      "key": "{form.control.readonly.surface-color}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "key": "{form.control.readonly.surface-color}"
+      },
+      "name": "token-form-control-readonly-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "surface-color"
+      ]
+    },
+    "token-form-control-readonly-border-color": {
+      "key": "{form.control.readonly.border-color}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.faint}",
+        "group": "components",
+        "key": "{form.control.readonly.border-color}"
+      },
+      "name": "token-form-control-readonly-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "border-color"
+      ]
+    },
+    "token-form-control-disabled-foreground-color": {
+      "key": "{form.control.disabled.foreground-color}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.foreground-color}"
+      },
+      "name": "token-form-control-disabled-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-disabled-surface-color": {
+      "key": "{form.control.disabled.surface-color}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.surface-color}"
+      },
+      "name": "token-form-control-disabled-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "surface-color"
+      ]
+    },
+    "token-form-control-disabled-border-color": {
+      "key": "{form.control.disabled.border-color}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.primary}",
+        "group": "components",
+        "key": "{form.control.disabled.border-color}"
+      },
+      "name": "token-form-control-disabled-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "border-color"
+      ]
+    },
+    "token-form-control-padding": {
+      "key": "{form.control.padding}",
+      "$type": "dimension",
+      "$value": "7px",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "original": {
+        "$type": "dimension",
+        "$value": "7",
+        "unit": "px",
+        "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+        "key": "{form.control.padding}"
+      },
+      "name": "token-form-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "padding"
+      ]
+    },
+    "token-form-control-border-radius": {
+      "key": "{form.control.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{form.control.border.radius}"
+      },
+      "name": "token-form-control-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-control-border-width": {
+      "key": "{form.control.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.control.border.width}"
+      },
+      "name": "token-form-control-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-size": {
+      "key": "{form.radio.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radio.size}"
+      },
+      "name": "token-form-radio-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "size"
+      ]
+    },
+    "token-form-radio-border-width": {
+      "key": "{form.radio.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radio.border.width}"
+      },
+      "name": "token-form-radio-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-background-image-size": {
+      "key": "{form.radio.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.radio.background-image.size}"
+      },
+      "name": "token-form-radio-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-radio-background-image-data-url": {
+      "key": "{form.radio.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url}"
+      },
+      "name": "token-form-radio-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-radio-background-image-data-url-disabled": {
+      "key": "{form.radio.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url-disabled}"
+      },
+      "name": "token-form-radio-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-radiocard-group-gap": {
+      "key": "{form.radiocard-group.gap}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radiocard-group.gap}"
+      },
+      "name": "token-form-radiocard-group-gap",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard-group",
+        "gap"
+      ]
+    },
+    "token-form-radiocard-border-width": {
+      "key": "{form.radiocard.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radiocard.border.width}"
+      },
+      "name": "token-form-radiocard-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radiocard-border-radius": {
+      "key": "{form.radiocard.border.radius}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{form.radiocard.border.radius}"
+      },
+      "name": "token-form-radiocard-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-radiocard-content-padding": {
+      "key": "{form.radiocard.content-padding}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{form.radiocard.content-padding}"
+      },
+      "name": "token-form-radiocard-content-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "content-padding"
+      ]
+    },
+    "token-form-radiocard-control-padding": {
+      "key": "{form.radiocard.control-padding}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{form.radiocard.control-padding}"
+      },
+      "name": "token-form-radiocard-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "control-padding"
+      ]
+    },
+    "token-form-radiocard-transition-duration": {
+      "key": "{form.radiocard.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.radiocard.transition.duration}"
+      },
+      "name": "token-form-radiocard-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-select-background-image-size": {
+      "key": "{form.select.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.select.background-image.size}"
+      },
+      "name": "token-form-select-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-select-background-image-position-right-x": {
+      "key": "{form.select.background-image.position-right-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.select.background-image.position-right-x}"
+      },
+      "name": "token-form-select-background-image-position-right-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-right-x"
+      ]
+    },
+    "token-form-select-background-image-position-top-y": {
+      "key": "{form.select.background-image.position-top-y}",
+      "$type": "dimension",
+      "$value": "9px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "9",
+        "unit": "px",
+        "key": "{form.select.background-image.position-top-y}"
+      },
+      "name": "token-form-select-background-image-position-top-y",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-top-y"
+      ]
+    },
+    "token-form-select-background-image-data-url": {
+      "key": "{form.select.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url}"
+      },
+      "name": "token-form-select-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-select-background-image-data-url-disabled": {
+      "key": "{form.select.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url-disabled}"
+      },
+      "name": "token-form-select-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-text-input-background-image-size": {
+      "key": "{form.text-input.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.text-input.background-image.size}"
+      },
+      "name": "token-form-text-input-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-text-input-background-image-position-x": {
+      "key": "{form.text-input.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.text-input.background-image.position-x}"
+      },
+      "name": "token-form-text-input-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-date": {
+      "key": "{form.text-input.background-image.data-url-date}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-date}"
+      },
+      "name": "token-form-text-input-background-image-data-url-date",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-date"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-time": {
+      "key": "{form.text-input.background-image.data-url-time}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-time}"
+      },
+      "name": "token-form-text-input-background-image-data-url-time",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-time"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search": {
+      "key": "{form.text-input.background-image.data-url-search}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-cancel": {
+      "key": "{form.text-input.background-image.data-url-search-cancel}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-cancel}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-cancel",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-cancel"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-loading": {
+      "key": "{form.text-input.background-image.data-url-search-loading}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color and animation are hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-loading}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-loading",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-loading"
+      ]
+    },
+    "token-form-toggle-width": {
+      "key": "{form.toggle.width}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{form.toggle.width}"
+      },
+      "name": "token-form-toggle-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "width"
+      ]
+    },
+    "token-form-toggle-height": {
+      "key": "{form.toggle.height}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.toggle.height}"
+      },
+      "name": "token-form-toggle-height",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "height"
+      ]
+    },
+    "token-form-toggle-base-surface-color-default": {
+      "key": "{form.toggle.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "comment": "the toggle has a different base surface color, compared to the other controls",
+        "key": "{form.toggle.base.surface-color.default}"
+      },
+      "name": "token-form-toggle-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-toggle-border-radius": {
+      "key": "{form.toggle.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.toggle.border.radius}"
+      },
+      "name": "token-form-toggle-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-toggle-border-width": {
+      "key": "{form.toggle.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.toggle.border.width}"
+      },
+      "name": "token-form-toggle-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-toggle-background-image-size": {
+      "key": "{form.toggle.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.toggle.background-image.size}"
+      },
+      "name": "token-form-toggle-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-toggle-background-image-position-x": {
+      "key": "{form.toggle.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{form.toggle.background-image.position-x}"
+      },
+      "name": "token-form-toggle-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-toggle-background-image-data-url": {
+      "key": "{form.toggle.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url}"
+      },
+      "name": "token-form-toggle-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-toggle-background-image-data-url-disabled": {
+      "key": "{form.toggle.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url-disabled}"
+      },
+      "name": "token-form-toggle-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-toggle-transition-duration": {
+      "key": "{form.toggle.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.toggle.transition.duration}"
+      },
+      "name": "token-form-toggle-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-toggle-transition-timing-function": {
+      "key": "{form.toggle.transition.timing-function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.68,
+          -0.2,
+          0.265,
+          1.15
+        ],
+        "key": "{form.toggle.transition.timing-function}"
+      },
+      "name": "token-form-toggle-transition-timing-function",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "timing-function"
+      ]
+    },
+    "token-form-toggle-thumb-size": {
+      "key": "{form.toggle.thumb-size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.toggle.height}",
+        "key": "{form.toggle.thumb-size}"
+      },
+      "name": "token-form-toggle-thumb-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "thumb-size"
+      ]
+    },
+    "token-pagination-nav-control-height": {
+      "key": "{pagination.nav.control.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{pagination.nav.control.height}"
+      },
+      "name": "token-pagination-nav-control-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "height"
+      ]
+    },
+    "token-pagination-nav-control-padding-horizontal": {
+      "key": "{pagination.nav.control.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{pagination.nav.control.padding.horizontal}"
+      },
+      "name": "token-pagination-nav-control-padding-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-pagination-nav-control-focus-inset": {
+      "key": "{pagination.nav.control.focus-inset}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{pagination.nav.control.focus-inset}"
+      },
+      "name": "token-pagination-nav-control-focus-inset",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "focus-inset"
+      ]
+    },
+    "token-pagination-nav-control-icon-spacing": {
+      "key": "{pagination.nav.control.icon-spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.control.icon-spacing}"
+      },
+      "name": "token-pagination-nav-control-icon-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "icon-spacing"
+      ]
+    },
+    "token-pagination-nav-indicator-height": {
+      "key": "{pagination.nav.indicator.height}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.height}"
+      },
+      "name": "token-pagination-nav-indicator-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-pagination-nav-indicator-spacing": {
+      "key": "{pagination.nav.indicator.spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.spacing}"
+      },
+      "name": "token-pagination-nav-indicator-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "spacing"
+      ]
+    },
+    "token-pagination-child-spacing-vertical": {
+      "key": "{pagination.child.spacing.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{pagination.child.spacing.vertical}"
+      },
+      "name": "token-pagination-child-spacing-vertical",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "vertical"
+      ]
+    },
+    "token-pagination-child-spacing-horizontal": {
+      "key": "{pagination.child.spacing.horizontal}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{pagination.child.spacing.horizontal}"
+      },
+      "name": "token-pagination-child-spacing-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-border-width": {
+      "key": "{side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{side-nav.wrapper.border.width}"
+      },
+      "name": "token-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-side-nav-wrapper-border-color": {
+      "key": "{side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "components",
+        "key": "{side-nav.wrapper.border.color}"
+      },
+      "name": "token-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal": {
+      "key": "{side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical": {
+      "key": "{side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-side-nav-toggle-button-border-radius": {
+      "key": "{side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-side-nav-header-home-link-padding": {
+      "key": "{side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.padding}"
+      },
+      "name": "token-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size": {
+      "key": "{side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-side-nav-header-actions-spacing": {
+      "key": "{side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.header.actions.spacing}"
+      },
+      "name": "token-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-side-nav-body-list-margin-vertical": {
+      "key": "{side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-height": {
+      "key": "{side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.height}"
+      },
+      "name": "token-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-horizontal": {
+      "key": "{side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-vertical": {
+      "key": "{side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-spacing-vertical": {
+      "key": "{side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-border-radius": {
+      "key": "{side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-side-nav-color-foreground-primary": {
+      "key": "{side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "components",
+        "key": "{side-nav.color.foreground.primary}"
+      },
+      "name": "token-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-foreground-strong": {
+      "key": "{side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#fff",
+        "group": "components",
+        "key": "{side-nav.color.foreground.strong}"
+      },
+      "name": "token-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-side-nav-color-foreground-faint": {
+      "key": "{side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "components",
+        "key": "{side-nav.color.foreground.faint}"
+      },
+      "name": "token-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-side-nav-color-surface-primary": {
+      "key": "{side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "components",
+        "key": "{side-nav.color.surface.primary}"
+      },
+      "name": "token-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-hover": {
+      "key": "{side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-active": {
+      "key": "{side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-tabs-tab-height-medium": {
+      "key": "{tabs.tab.height.medium}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{tabs.tab.height.medium}"
+      },
+      "name": "token-tabs-tab-height-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-height-large": {
+      "key": "{tabs.tab.height.large}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{tabs.tab.height.large}"
+      },
+      "name": "token-tabs-tab-height-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-medium": {
+      "key": "{tabs.tab.padding.horizontal.medium}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.medium}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-large": {
+      "key": "{tabs.tab.padding.horizontal.large}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.large}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-vertical": {
+      "key": "{tabs.tab.padding.vertical}",
+      "$type": "dimension",
+      "$value": "0px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "0",
+        "unit": "px",
+        "key": "{tabs.tab.padding.vertical}"
+      },
+      "name": "token-tabs-tab-padding-vertical",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tabs-tab-border-radius": {
+      "key": "{tabs.tab.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tabs.tab.border-radius}"
+      },
+      "name": "token-tabs-tab-border-radius",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "border-radius"
+      ]
+    },
+    "token-tabs-tab-focus-inset": {
+      "key": "{tabs.tab.focus-inset}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.focus-inset}"
+      },
+      "name": "token-tabs-tab-focus-inset",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "focus-inset"
+      ]
+    },
+    "token-tabs-tab-gutter": {
+      "key": "{tabs.tab.gutter}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.gutter}"
+      },
+      "name": "token-tabs-tab-gutter",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "gutter"
+      ]
+    },
+    "token-tabs-indicator-height": {
+      "key": "{tabs.indicator.height}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{tabs.indicator.height}"
+      },
+      "name": "token-tabs-indicator-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-tabs-indicator-transition-function": {
+      "key": "{tabs.indicator.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.5,
+          1,
+          0.89,
+          1
+        ],
+        "key": "{tabs.indicator.transition.function}"
+      },
+      "name": "token-tabs-indicator-transition-function",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "function"
+      ]
+    },
+    "token-tabs-indicator-transition-duration": {
+      "key": "{tabs.indicator.transition.duration}",
+      "$type": "duration",
+      "$value": "0.6s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.6",
+        "unit": "s",
+        "key": "{tabs.indicator.transition.duration}"
+      },
+      "name": "token-tabs-indicator-transition-duration",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-tabs-divider-height": {
+      "key": "{tabs.divider.height}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{tabs.divider.height}"
+      },
+      "name": "token-tabs-divider-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "divider",
+        "height"
+      ]
+    },
+    "token-tooltip-border-radius": {
+      "key": "{tooltip.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tooltip.border-radius}"
+      },
+      "name": "token-tooltip-border-radius",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "border-radius"
+      ]
+    },
+    "token-tooltip-color-foreground-primary": {
+      "key": "{tooltip.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-high-contrast)",
+        "group": "components",
+        "key": "{tooltip.color.foreground.primary}"
+      },
+      "name": "token-tooltip-color-foreground-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-tooltip-color-surface-primary": {
+      "key": "{tooltip.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-700)",
+        "group": "components",
+        "key": "{tooltip.color.surface.primary}"
+      },
+      "name": "token-tooltip-color-surface-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-tooltip-focus-offset": {
+      "key": "{tooltip.focus-offset}",
+      "$type": "dimension",
+      "$value": "-2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "-2",
+        "unit": "px",
+        "key": "{tooltip.focus-offset}"
+      },
+      "name": "token-tooltip-focus-offset",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "focus-offset"
+      ]
+    },
+    "token-tooltip-max-width": {
+      "key": "{tooltip.max-width}",
+      "$type": "dimension",
+      "$value": "280px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "280",
+        "unit": "px",
+        "key": "{tooltip.max-width}"
+      },
+      "name": "token-tooltip-max-width",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "max-width"
+      ]
+    },
+    "token-tooltip-padding-horizontal": {
+      "key": "{tooltip.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tooltip.padding.horizontal}"
+      },
+      "name": "token-tooltip-padding-horizontal",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-tooltip-padding-vertical": {
+      "key": "{tooltip.padding.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{tooltip.padding.vertical}"
+      },
+      "name": "token-tooltip-padding-vertical",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tooltip-transition-function": {
+      "key": "{tooltip.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.54,
+          1.5,
+          0.38,
+          1.11
+        ],
+        "key": "{tooltip.transition.function}"
+      },
+      "name": "token-tooltip-transition-function",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "transition",
+        "function"
+      ]
+    },
+    "token-typography-font-stack-display": {
+      "key": "{typography.font-stack.display}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.display.macOS}",
+          "{typography.font-stack.sans.display.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.display.emoji}"
+        ],
+        "key": "{typography.font-stack.display}"
+      },
+      "name": "token-typography-font-stack-display",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "display"
+      ]
+    },
+    "token-typography-font-stack-text": {
+      "key": "{typography.font-stack.text}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.text.macOS}",
+          "{typography.font-stack.sans.text.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.text.emoji}"
+        ],
+        "key": "{typography.font-stack.text}"
+      },
+      "name": "token-typography-font-stack-text",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "text"
+      ]
+    },
+    "token-typography-font-stack-code": {
+      "key": "{typography.font-stack.code}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.monospace.code.macOS}",
+          "{typography.font-stack.monospace.code.windows}",
+          "monospace"
+        ],
+        "key": "{typography.font-stack.code}"
+      },
+      "name": "token-typography-font-stack-code",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "code"
+      ]
+    },
+    "token-typography-font-weight-regular": {
+      "key": "{typography.font-weight.regular}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "400",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "400",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.regular}"
+      },
+      "name": "token-typography-font-weight-regular",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "regular"
+      ]
+    },
+    "token-typography-font-weight-medium": {
+      "key": "{typography.font-weight.medium}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "500",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "500",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.medium}"
+      },
+      "name": "token-typography-font-weight-medium",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "medium"
+      ]
+    },
+    "token-typography-font-weight-semibold": {
+      "key": "{typography.font-weight.semibold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "600",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "600",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.semibold}"
+      },
+      "name": "token-typography-font-weight-semibold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "semibold"
+      ]
+    },
+    "token-typography-font-weight-bold": {
+      "key": "{typography.font-weight.bold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "700",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "700",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.bold}"
+      },
+      "name": "token-typography-font-weight-bold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "bold"
+      ]
+    },
+    "token-typography-display-500-font-family": {
+      "key": "{typography.display-500.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-500.font-family}"
+      },
+      "name": "token-typography-display-500-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-family"
+      ]
+    },
+    "token-typography-display-500-font-size": {
+      "key": "{typography.display-500.font-size}",
+      "$type": "font-size",
+      "$value": "1.875rem",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "30",
+        "unit": "px",
+        "comment": "30px/1.875rem",
+        "key": "{typography.display-500.font-size}"
+      },
+      "name": "token-typography-display-500-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-size"
+      ]
+    },
+    "token-typography-display-500-line-height": {
+      "key": "{typography.display-500.line-height}",
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "original": {
+        "$type": "number",
+        "$value": 1.2666,
+        "comment": "38px",
+        "key": "{typography.display-500.line-height}"
+      },
+      "name": "token-typography-display-500-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "line-height"
+      ]
+    },
+    "token-typography-display-400-font-family": {
+      "key": "{typography.display-400.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-400.font-family}"
+      },
+      "name": "token-typography-display-400-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-family"
+      ]
+    },
+    "token-typography-display-400-font-size": {
+      "key": "{typography.display-400.font-size}",
+      "$type": "font-size",
+      "$value": "1.5rem",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "24",
+        "unit": "px",
+        "comment": "24px/1.5rem",
+        "key": "{typography.display-400.font-size}"
+      },
+      "name": "token-typography-display-400-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-size"
+      ]
+    },
+    "token-typography-display-400-line-height": {
+      "key": "{typography.display-400.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "32px",
+        "key": "{typography.display-400.line-height}"
+      },
+      "name": "token-typography-display-400-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-font-family": {
+      "key": "{typography.display-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-300.font-family}"
+      },
+      "name": "token-typography-display-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-family"
+      ]
+    },
+    "token-typography-display-300-font-size": {
+      "key": "{typography.display-300.font-size}",
+      "$type": "font-size",
+      "$value": "1.125rem",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "18",
+        "unit": "px",
+        "comment": "18px/1.125rem",
+        "key": "{typography.display-300.font-size}"
+      },
+      "name": "token-typography-display-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-size"
+      ]
+    },
+    "token-typography-display-300-line-height": {
+      "key": "{typography.display-300.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "24px",
+        "key": "{typography.display-300.line-height}"
+      },
+      "name": "token-typography-display-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-letter-spacing": {
+      "key": "{typography.display-300.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-300.letter-spacing}"
+      },
+      "name": "token-typography-display-300-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-200-font-family": {
+      "key": "{typography.display-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-200.font-family}"
+      },
+      "name": "token-typography-display-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-family"
+      ]
+    },
+    "token-typography-display-200-font-size": {
+      "key": "{typography.display-200.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.display-200.font-size}"
+      },
+      "name": "token-typography-display-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-size"
+      ]
+    },
+    "token-typography-display-200-line-height": {
+      "key": "{typography.display-200.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.display-200.line-height}"
+      },
+      "name": "token-typography-display-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "line-height"
+      ]
+    },
+    "token-typography-display-200-letter-spacing": {
+      "key": "{typography.display-200.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-200.letter-spacing}"
+      },
+      "name": "token-typography-display-200-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-100-font-family": {
+      "key": "{typography.display-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-100.font-family}"
+      },
+      "name": "token-typography-display-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-family"
+      ]
+    },
+    "token-typography-display-100-font-size": {
+      "key": "{typography.display-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.display-100.font-size}"
+      },
+      "name": "token-typography-display-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-size"
+      ]
+    },
+    "token-typography-display-100-line-height": {
+      "key": "{typography.display-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.display-100.line-height}"
+      },
+      "name": "token-typography-display-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "line-height"
+      ]
+    },
+    "token-typography-body-300-font-family": {
+      "key": "{typography.body-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-300.font-family}"
+      },
+      "name": "token-typography-body-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-family"
+      ]
+    },
+    "token-typography-body-300-font-size": {
+      "key": "{typography.body-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.body-300.font-size}"
+      },
+      "name": "token-typography-body-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-size"
+      ]
+    },
+    "token-typography-body-300-line-height": {
+      "key": "{typography.body-300.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.body-300.line-height}"
+      },
+      "name": "token-typography-body-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "line-height"
+      ]
+    },
+    "token-typography-body-200-font-family": {
+      "key": "{typography.body-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-200.font-family}"
+      },
+      "name": "token-typography-body-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-family"
+      ]
+    },
+    "token-typography-body-200-font-size": {
+      "key": "{typography.body-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.body-200.font-size}"
+      },
+      "name": "token-typography-body-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-size"
+      ]
+    },
+    "token-typography-body-200-line-height": {
+      "key": "{typography.body-200.line-height}",
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.4286,
+        "comment": "20px",
+        "key": "{typography.body-200.line-height}"
+      },
+      "name": "token-typography-body-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "line-height"
+      ]
+    },
+    "token-typography-body-100-font-family": {
+      "key": "{typography.body-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-100.font-family}"
+      },
+      "name": "token-typography-body-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-family"
+      ]
+    },
+    "token-typography-body-100-font-size": {
+      "key": "{typography.body-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.body-100.font-size}"
+      },
+      "name": "token-typography-body-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-size"
+      ]
+    },
+    "token-typography-body-100-line-height": {
+      "key": "{typography.body-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.body-100.line-height}"
+      },
+      "name": "token-typography-body-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-100-font-family": {
+      "key": "{typography.code-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-100.font-family}"
+      },
+      "name": "token-typography-code-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-family"
+      ]
+    },
+    "token-typography-code-100-font-size": {
+      "key": "{typography.code-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.code-100.font-size}"
+      },
+      "name": "token-typography-code-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-size"
+      ]
+    },
+    "token-typography-code-100-line-height": {
+      "key": "{typography.code-100.line-height}",
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "original": {
+        "$type": "number",
+        "$value": 1.23,
+        "comment": "16px",
+        "key": "{typography.code-100.line-height}"
+      },
+      "name": "token-typography-code-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-200-font-family": {
+      "key": "{typography.code-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-200.font-family}"
+      },
+      "name": "token-typography-code-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-family"
+      ]
+    },
+    "token-typography-code-200-font-size": {
+      "key": "{typography.code-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.code-200.font-size}"
+      },
+      "name": "token-typography-code-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-size"
+      ]
+    },
+    "token-typography-code-200-line-height": {
+      "key": "{typography.code-200.line-height}",
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.125,
+        "comment": "18px",
+        "key": "{typography.code-200.line-height}"
+      },
+      "name": "token-typography-code-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "line-height"
+      ]
+    },
+    "token-typography-code-300-font-family": {
+      "key": "{typography.code-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-300.font-family}"
+      },
+      "name": "token-typography-code-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-family"
+      ]
+    },
+    "token-typography-code-300-font-size": {
+      "key": "{typography.code-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.code-300.font-size}"
+      },
+      "name": "token-typography-code-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-size"
+      ]
+    },
+    "token-typography-code-300-line-height": {
+      "key": "{typography.code-300.line-height}",
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.25,
+        "comment": "20px",
+        "key": "{typography.code-300.line-height}"
+      },
+      "name": "token-typography-code-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "line-height"
+      ]
+    }
+  },
+  "cds-g100": {
+    "token-border-radius-x-small": {
+      "key": "{border.radius.x-small}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{border.radius.x-small}"
+      },
+      "name": "token-border-radius-x-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "x-small"
+      ]
+    },
+    "token-border-radius-small": {
+      "key": "{border.radius.small}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{border.radius.small}"
+      },
+      "name": "token-border-radius-small",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "small"
+      ]
+    },
+    "token-border-radius-medium": {
+      "key": "{border.radius.medium}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{border.radius.medium}"
+      },
+      "name": "token-border-radius-medium",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "medium"
+      ]
+    },
+    "token-border-radius-large": {
+      "key": "{border.radius.large}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{border.radius.large}"
+      },
+      "name": "token-border-radius-large",
+      "attributes": {
+        "category": "border"
+      },
+      "path": [
+        "border",
+        "radius",
+        "large"
+      ]
+    },
+    "token-color-palette-blue-500": {
+      "key": "{color.palette.blue-500}",
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1c345f",
+        "group": "palette",
+        "key": "{color.palette.blue-500}"
+      },
+      "name": "token-color-palette-blue-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-500"
+      ]
+    },
+    "token-color-palette-blue-400": {
+      "key": "{color.palette.blue-400}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0046d1",
+        "group": "palette",
+        "key": "{color.palette.blue-400}"
+      },
+      "name": "token-color-palette-blue-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-400"
+      ]
+    },
+    "token-color-palette-blue-300": {
+      "key": "{color.palette.blue-300}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c56e9",
+        "group": "palette",
+        "key": "{color.palette.blue-300}"
+      },
+      "name": "token-color-palette-blue-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-300"
+      ]
+    },
+    "token-color-palette-blue-200": {
+      "key": "{color.palette.blue-200}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#1060ff",
+        "group": "palette",
+        "key": "{color.palette.blue-200}"
+      },
+      "name": "token-color-palette-blue-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-200"
+      ]
+    },
+    "token-color-palette-blue-100": {
+      "key": "{color.palette.blue-100}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cce3fe",
+        "group": "palette",
+        "key": "{color.palette.blue-100}"
+      },
+      "name": "token-color-palette-blue-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-100"
+      ]
+    },
+    "token-color-palette-blue-50": {
+      "key": "{color.palette.blue-50}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2f8ff",
+        "group": "palette",
+        "key": "{color.palette.blue-50}"
+      },
+      "name": "token-color-palette-blue-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "blue-50"
+      ]
+    },
+    "token-color-palette-purple-500": {
+      "key": "{color.palette.purple-500}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#42215b",
+        "group": "palette",
+        "key": "{color.palette.purple-500}"
+      },
+      "name": "token-color-palette-purple-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-500"
+      ]
+    },
+    "token-color-palette-purple-400": {
+      "key": "{color.palette.purple-400}",
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#7b00db",
+        "group": "palette",
+        "key": "{color.palette.purple-400}"
+      },
+      "name": "token-color-palette-purple-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-400"
+      ]
+    },
+    "token-color-palette-purple-300": {
+      "key": "{color.palette.purple-300}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#911ced",
+        "group": "palette",
+        "key": "{color.palette.purple-300}"
+      },
+      "name": "token-color-palette-purple-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-300"
+      ]
+    },
+    "token-color-palette-purple-200": {
+      "key": "{color.palette.purple-200}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#a737ff",
+        "group": "palette",
+        "key": "{color.palette.purple-200}"
+      },
+      "name": "token-color-palette-purple-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-200"
+      ]
+    },
+    "token-color-palette-purple-100": {
+      "key": "{color.palette.purple-100}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#ead2fe",
+        "group": "palette",
+        "key": "{color.palette.purple-100}"
+      },
+      "name": "token-color-palette-purple-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-100"
+      ]
+    },
+    "token-color-palette-purple-50": {
+      "key": "{color.palette.purple-50}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f9f2ff",
+        "group": "palette",
+        "key": "{color.palette.purple-50}"
+      },
+      "name": "token-color-palette-purple-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "purple-50"
+      ]
+    },
+    "token-color-palette-green-500": {
+      "key": "{color.palette.green-500}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#054220",
+        "group": "palette",
+        "key": "{color.palette.green-500}"
+      },
+      "name": "token-color-palette-green-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-500"
+      ]
+    },
+    "token-color-palette-green-400": {
+      "key": "{color.palette.green-400}",
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#006619",
+        "group": "palette",
+        "key": "{color.palette.green-400}"
+      },
+      "name": "token-color-palette-green-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-400"
+      ]
+    },
+    "token-color-palette-green-300": {
+      "key": "{color.palette.green-300}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#00781e",
+        "group": "palette",
+        "key": "{color.palette.green-300}"
+      },
+      "name": "token-color-palette-green-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-300"
+      ]
+    },
+    "token-color-palette-green-200": {
+      "key": "{color.palette.green-200}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#008a22",
+        "group": "palette",
+        "key": "{color.palette.green-200}"
+      },
+      "name": "token-color-palette-green-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-200"
+      ]
+    },
+    "token-color-palette-green-100": {
+      "key": "{color.palette.green-100}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#cceeda",
+        "group": "palette",
+        "key": "{color.palette.green-100}"
+      },
+      "name": "token-color-palette-green-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-100"
+      ]
+    },
+    "token-color-palette-green-50": {
+      "key": "{color.palette.green-50}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f2fbf6",
+        "group": "palette",
+        "key": "{color.palette.green-50}"
+      },
+      "name": "token-color-palette-green-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "green-50"
+      ]
+    },
+    "token-color-palette-amber-500": {
+      "key": "{color.palette.amber-500}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#542800",
+        "group": "palette",
+        "key": "{color.palette.amber-500}"
+      },
+      "name": "token-color-palette-amber-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-500"
+      ]
+    },
+    "token-color-palette-amber-400": {
+      "key": "{color.palette.amber-400}",
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#803d00",
+        "group": "palette",
+        "key": "{color.palette.amber-400}"
+      },
+      "name": "token-color-palette-amber-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-400"
+      ]
+    },
+    "token-color-palette-amber-300": {
+      "key": "{color.palette.amber-300}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#9e4b00",
+        "group": "palette",
+        "key": "{color.palette.amber-300}"
+      },
+      "name": "token-color-palette-amber-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-300"
+      ]
+    },
+    "token-color-palette-amber-200": {
+      "key": "{color.palette.amber-200}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#bb5a00",
+        "group": "palette",
+        "key": "{color.palette.amber-200}"
+      },
+      "name": "token-color-palette-amber-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-200"
+      ]
+    },
+    "token-color-palette-amber-100": {
+      "key": "{color.palette.amber-100}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbeabf",
+        "group": "palette",
+        "key": "{color.palette.amber-100}"
+      },
+      "name": "token-color-palette-amber-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-100"
+      ]
+    },
+    "token-color-palette-amber-50": {
+      "key": "{color.palette.amber-50}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9e8",
+        "group": "palette",
+        "key": "{color.palette.amber-50}"
+      },
+      "name": "token-color-palette-amber-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "amber-50"
+      ]
+    },
+    "token-color-palette-red-500": {
+      "key": "{color.palette.red-500}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#51130a",
+        "group": "palette",
+        "key": "{color.palette.red-500}"
+      },
+      "name": "token-color-palette-red-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-500"
+      ]
+    },
+    "token-color-palette-red-400": {
+      "key": "{color.palette.red-400}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#940004",
+        "group": "palette",
+        "key": "{color.palette.red-400}"
+      },
+      "name": "token-color-palette-red-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-400"
+      ]
+    },
+    "token-color-palette-red-300": {
+      "key": "{color.palette.red-300}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c00005",
+        "group": "palette",
+        "key": "{color.palette.red-300}"
+      },
+      "name": "token-color-palette-red-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-300"
+      ]
+    },
+    "token-color-palette-red-200": {
+      "key": "{color.palette.red-200}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#e52228",
+        "group": "palette",
+        "key": "{color.palette.red-200}"
+      },
+      "name": "token-color-palette-red-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-200"
+      ]
+    },
+    "token-color-palette-red-100": {
+      "key": "{color.palette.red-100}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fbd4d4",
+        "group": "palette",
+        "key": "{color.palette.red-100}"
+      },
+      "name": "token-color-palette-red-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-100"
+      ]
+    },
+    "token-color-palette-red-50": {
+      "key": "{color.palette.red-50}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fff5f5",
+        "group": "palette",
+        "key": "{color.palette.red-50}"
+      },
+      "name": "token-color-palette-red-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "red-50"
+      ]
+    },
+    "token-color-palette-neutral-700": {
+      "key": "{color.palette.neutral-700}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "palette",
+        "key": "{color.palette.neutral-700}"
+      },
+      "name": "token-color-palette-neutral-700",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-700"
+      ]
+    },
+    "token-color-palette-neutral-600": {
+      "key": "{color.palette.neutral-600}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "palette",
+        "key": "{color.palette.neutral-600}"
+      },
+      "name": "token-color-palette-neutral-600",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-600"
+      ]
+    },
+    "token-color-palette-neutral-500": {
+      "key": "{color.palette.neutral-500}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "palette",
+        "key": "{color.palette.neutral-500}"
+      },
+      "name": "token-color-palette-neutral-500",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-500"
+      ]
+    },
+    "token-color-palette-neutral-400": {
+      "key": "{color.palette.neutral-400}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "palette",
+        "key": "{color.palette.neutral-400}"
+      },
+      "name": "token-color-palette-neutral-400",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-400"
+      ]
+    },
+    "token-color-palette-neutral-300": {
+      "key": "{color.palette.neutral-300}",
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#c2c5cb",
+        "group": "palette",
+        "key": "{color.palette.neutral-300}"
+      },
+      "name": "token-color-palette-neutral-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-300"
+      ]
+    },
+    "token-color-palette-neutral-200": {
+      "key": "{color.palette.neutral-200}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "palette",
+        "key": "{color.palette.neutral-200}"
+      },
+      "name": "token-color-palette-neutral-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-200"
+      ]
+    },
+    "token-color-palette-neutral-100": {
+      "key": "{color.palette.neutral-100}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#f1f2f3",
+        "group": "palette",
+        "key": "{color.palette.neutral-100}"
+      },
+      "name": "token-color-palette-neutral-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-100"
+      ]
+    },
+    "token-color-palette-neutral-50": {
+      "key": "{color.palette.neutral-50}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "#fafafa",
+        "group": "palette",
+        "key": "{color.palette.neutral-50}"
+      },
+      "name": "token-color-palette-neutral-50",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-50"
+      ]
+    },
+    "token-color-palette-neutral-0": {
+      "key": "{color.palette.neutral-0}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#ffffff",
+        "cds-g10": "#ffffff",
+        "cds-g90": "#ffffff",
+        "cds-g100": "#ffffff"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.color.white.0}",
+        "group": "palette",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.color.white.0}",
+          "cds-g10": "{carbon.color.white.0}",
+          "cds-g90": "{carbon.color.white.0}",
+          "cds-g100": "{carbon.color.white.0}"
+        },
+        "key": "{color.palette.neutral-0}"
+      },
+      "name": "token-color-palette-neutral-0",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "neutral-0"
+      ]
+    },
+    "token-color-palette-alpha-300": {
+      "key": "{color.palette.alpha-300}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "alpha": "0.4",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-600}",
+        "alpha": "0.4",
+        "group": "palette",
+        "key": "{color.palette.alpha-300}"
+      },
+      "name": "token-color-palette-alpha-300",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-300"
+      ]
+    },
+    "token-color-palette-alpha-200": {
+      "key": "{color.palette.alpha-200}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "alpha": "0.2",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.2",
+        "group": "palette",
+        "key": "{color.palette.alpha-200}"
+      },
+      "name": "token-color-palette-alpha-200",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-200"
+      ]
+    },
+    "token-color-palette-alpha-100": {
+      "key": "{color.palette.alpha-100}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "alpha": "0.1",
+      "group": "palette",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "alpha": "0.1",
+        "group": "palette",
+        "key": "{color.palette.alpha-100}"
+      },
+      "name": "token-color-palette-alpha-100",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "palette",
+        "alpha-100"
+      ]
+    },
+    "token-color-border-primary": {
+      "key": "{color.border.primary}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-200}",
+        "group": "semantic",
+        "key": "{color.border.primary}"
+      },
+      "name": "token-color-border-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "primary"
+      ]
+    },
+    "token-color-border-faint": {
+      "key": "{color.border.faint}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-100}",
+        "group": "semantic",
+        "key": "{color.border.faint}"
+      },
+      "name": "token-color-border-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "faint"
+      ]
+    },
+    "token-color-border-strong": {
+      "key": "{color.border.strong}",
+      "$type": "color",
+      "$value": "#3b3d4566",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.alpha-300}",
+        "group": "semantic",
+        "key": "{color.border.strong}"
+      },
+      "name": "token-color-border-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "strong"
+      ]
+    },
+    "token-color-border-action": {
+      "key": "{color.border.action}",
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-100}",
+        "group": "semantic",
+        "key": "{color.border.action}"
+      },
+      "name": "token-color-border-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "action"
+      ]
+    },
+    "token-color-border-highlight": {
+      "key": "{color.border.highlight}",
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-100}",
+        "group": "semantic",
+        "key": "{color.border.highlight}"
+      },
+      "name": "token-color-border-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "highlight"
+      ]
+    },
+    "token-color-border-success": {
+      "key": "{color.border.success}",
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-100}",
+        "group": "semantic",
+        "key": "{color.border.success}"
+      },
+      "name": "token-color-border-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "success"
+      ]
+    },
+    "token-color-border-warning": {
+      "key": "{color.border.warning}",
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-100}",
+        "group": "semantic",
+        "key": "{color.border.warning}"
+      },
+      "name": "token-color-border-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "warning"
+      ]
+    },
+    "token-color-border-critical": {
+      "key": "{color.border.critical}",
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-100}",
+        "group": "semantic",
+        "key": "{color.border.critical}"
+      },
+      "name": "token-color-border-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "border",
+        "critical"
+      ]
+    },
+    "token-color-focus-action-internal": {
+      "key": "{color.focus.action.internal}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.focus.action.internal}"
+      },
+      "name": "token-color-focus-action-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "internal"
+      ]
+    },
+    "token-color-focus-action-external": {
+      "key": "{color.focus.action.external}",
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#5990ff",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.action.external}"
+      },
+      "name": "token-color-focus-action-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "action",
+        "external"
+      ]
+    },
+    "token-color-focus-critical-internal": {
+      "key": "{color.focus.critical.internal}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.focus.critical.internal}"
+      },
+      "name": "token-color-focus-critical-internal",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "internal"
+      ]
+    },
+    "token-color-focus-critical-external": {
+      "key": "{color.focus.critical.external}",
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "original": {
+        "$type": "color",
+        "$value": "#dd7578",
+        "group": "semantic",
+        "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+        "key": "{color.focus.critical.external}"
+      },
+      "name": "token-color-focus-critical-external",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "focus",
+        "critical",
+        "external"
+      ]
+    },
+    "token-color-foreground-strong": {
+      "key": "{color.foreground.strong}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-700}",
+        "group": "semantic",
+        "key": "{color.foreground.strong}"
+      },
+      "name": "token-color-foreground-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-color-foreground-primary": {
+      "key": "{color.foreground.primary}",
+      "$type": "color",
+      "$value": "#f4f4f4",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "#161616",
+        "cds-g10": "#161616",
+        "cds-g90": "#f4f4f4",
+        "cds-g100": "#f4f4f4"
+      },
+      "original": {
+        "$type": "color",
+        "$value": "{carbon.themes.g100.textPrimary}",
+        "group": "semantic",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.themes.white.textPrimary}",
+          "cds-g10": "{carbon.themes.g10.textPrimary}",
+          "cds-g90": "{carbon.themes.g90.textPrimary}",
+          "cds-g100": "{carbon.themes.g100.textPrimary}"
+        },
+        "key": "{color.foreground.primary}"
+      },
+      "name": "token-color-foreground-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-color-foreground-faint": {
+      "key": "{color.foreground.faint}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "semantic",
+        "key": "{color.foreground.faint}"
+      },
+      "name": "token-color-foreground-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-color-foreground-high-contrast": {
+      "key": "{color.foreground.high-contrast}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.foreground.high-contrast}"
+      },
+      "name": "token-color-foreground-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "high-contrast"
+      ]
+    },
+    "token-color-foreground-disabled": {
+      "key": "{color.foreground.disabled}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "semantic",
+        "key": "{color.foreground.disabled}"
+      },
+      "name": "token-color-foreground-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "disabled"
+      ]
+    },
+    "token-color-foreground-action": {
+      "key": "{color.foreground.action}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "semantic",
+        "key": "{color.foreground.action}"
+      },
+      "name": "token-color-foreground-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action"
+      ]
+    },
+    "token-color-foreground-action-hover": {
+      "key": "{color.foreground.action-hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "semantic",
+        "key": "{color.foreground.action-hover}"
+      },
+      "name": "token-color-foreground-action-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-hover"
+      ]
+    },
+    "token-color-foreground-action-active": {
+      "key": "{color.foreground.action-active}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "semantic",
+        "key": "{color.foreground.action-active}"
+      },
+      "name": "token-color-foreground-action-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "action-active"
+      ]
+    },
+    "token-color-foreground-highlight": {
+      "key": "{color.foreground.highlight}",
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-200}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight}"
+      },
+      "name": "token-color-foreground-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight"
+      ]
+    },
+    "token-color-foreground-highlight-on-surface": {
+      "key": "{color.foreground.highlight-on-surface}",
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-300}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-on-surface}"
+      },
+      "name": "token-color-foreground-highlight-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-on-surface"
+      ]
+    },
+    "token-color-foreground-highlight-high-contrast": {
+      "key": "{color.foreground.highlight-high-contrast}",
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-500}",
+        "group": "semantic",
+        "key": "{color.foreground.highlight-high-contrast}"
+      },
+      "name": "token-color-foreground-highlight-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "highlight-high-contrast"
+      ]
+    },
+    "token-color-foreground-success": {
+      "key": "{color.foreground.success}",
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-200}",
+        "group": "semantic",
+        "key": "{color.foreground.success}"
+      },
+      "name": "token-color-foreground-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success"
+      ]
+    },
+    "token-color-foreground-success-on-surface": {
+      "key": "{color.foreground.success-on-surface}",
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-300}",
+        "group": "semantic",
+        "key": "{color.foreground.success-on-surface}"
+      },
+      "name": "token-color-foreground-success-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-on-surface"
+      ]
+    },
+    "token-color-foreground-success-high-contrast": {
+      "key": "{color.foreground.success-high-contrast}",
+      "$type": "color",
+      "$value": "#054220",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-500}",
+        "group": "semantic",
+        "key": "{color.foreground.success-high-contrast}"
+      },
+      "name": "token-color-foreground-success-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "success-high-contrast"
+      ]
+    },
+    "token-color-foreground-warning": {
+      "key": "{color.foreground.warning}",
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-200}",
+        "group": "semantic",
+        "key": "{color.foreground.warning}"
+      },
+      "name": "token-color-foreground-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning"
+      ]
+    },
+    "token-color-foreground-warning-on-surface": {
+      "key": "{color.foreground.warning-on-surface}",
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-300}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-on-surface}"
+      },
+      "name": "token-color-foreground-warning-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-on-surface"
+      ]
+    },
+    "token-color-foreground-warning-high-contrast": {
+      "key": "{color.foreground.warning-high-contrast}",
+      "$type": "color",
+      "$value": "#542800",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-500}",
+        "group": "semantic",
+        "key": "{color.foreground.warning-high-contrast}"
+      },
+      "name": "token-color-foreground-warning-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "warning-high-contrast"
+      ]
+    },
+    "token-color-foreground-critical": {
+      "key": "{color.foreground.critical}",
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-200}",
+        "group": "semantic",
+        "key": "{color.foreground.critical}"
+      },
+      "name": "token-color-foreground-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical"
+      ]
+    },
+    "token-color-foreground-critical-on-surface": {
+      "key": "{color.foreground.critical-on-surface}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-on-surface}"
+      },
+      "name": "token-color-foreground-critical-on-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-on-surface"
+      ]
+    },
+    "token-color-foreground-critical-high-contrast": {
+      "key": "{color.foreground.critical-high-contrast}",
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-500}",
+        "group": "semantic",
+        "key": "{color.foreground.critical-high-contrast}"
+      },
+      "name": "token-color-foreground-critical-high-contrast",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "foreground",
+        "critical-high-contrast"
+      ]
+    },
+    "token-color-page-primary": {
+      "key": "{color.page.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.page.primary}"
+      },
+      "name": "token-color-page-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "primary"
+      ]
+    },
+    "token-color-page-faint": {
+      "key": "{color.page.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.page.faint}"
+      },
+      "name": "token-color-page-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "page",
+        "faint"
+      ]
+    },
+    "token-color-surface-primary": {
+      "key": "{color.surface.primary}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.primary}"
+      },
+      "name": "token-color-surface-primary",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-color-surface-faint": {
+      "key": "{color.surface.faint}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.faint}"
+      },
+      "name": "token-color-surface-faint",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "faint"
+      ]
+    },
+    "token-color-surface-strong": {
+      "key": "{color.surface.strong}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.strong}"
+      },
+      "name": "token-color-surface-strong",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "strong"
+      ]
+    },
+    "token-color-surface-interactive": {
+      "key": "{color.surface.interactive}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-0}",
+        "group": "semantic",
+        "key": "{color.surface.interactive}"
+      },
+      "name": "token-color-surface-interactive",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive"
+      ]
+    },
+    "token-color-surface-interactive-hover": {
+      "key": "{color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-100}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-hover}"
+      },
+      "name": "token-color-surface-interactive-hover",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-color-surface-interactive-active": {
+      "key": "{color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-200}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-active}"
+      },
+      "name": "token-color-surface-interactive-active",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-color-surface-interactive-disabled": {
+      "key": "{color.surface.interactive-disabled}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-50}",
+        "group": "semantic",
+        "key": "{color.surface.interactive-disabled}"
+      },
+      "name": "token-color-surface-interactive-disabled",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "interactive-disabled"
+      ]
+    },
+    "token-color-surface-action": {
+      "key": "{color.surface.action}",
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-50}",
+        "group": "semantic",
+        "key": "{color.surface.action}"
+      },
+      "name": "token-color-surface-action",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "action"
+      ]
+    },
+    "token-color-surface-highlight": {
+      "key": "{color.surface.highlight}",
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.purple-50}",
+        "group": "semantic",
+        "key": "{color.surface.highlight}"
+      },
+      "name": "token-color-surface-highlight",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "highlight"
+      ]
+    },
+    "token-color-surface-success": {
+      "key": "{color.surface.success}",
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.green-50}",
+        "group": "semantic",
+        "key": "{color.surface.success}"
+      },
+      "name": "token-color-surface-success",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "success"
+      ]
+    },
+    "token-color-surface-warning": {
+      "key": "{color.surface.warning}",
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.amber-50}",
+        "group": "semantic",
+        "key": "{color.surface.warning}"
+      },
+      "name": "token-color-surface-warning",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "warning"
+      ]
+    },
+    "token-color-surface-critical": {
+      "key": "{color.surface.critical}",
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-50}",
+        "group": "semantic",
+        "key": "{color.surface.critical}"
+      },
+      "name": "token-color-surface-critical",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "surface",
+        "critical"
+      ]
+    },
+    "token-color-hashicorp-brand": {
+      "key": "{color.hashicorp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hashicorp-brand}",
+        "group": "branding",
+        "key": "{color.hashicorp.brand}"
+      },
+      "name": "token-color-hashicorp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hashicorp",
+        "brand"
+      ]
+    },
+    "token-color-boundary-brand": {
+      "key": "{color.boundary.brand}",
+      "$type": "color",
+      "$value": "#f24c53",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-brand}",
+        "group": "branding",
+        "key": "{color.boundary.brand}"
+      },
+      "name": "token-color-boundary-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "brand"
+      ]
+    },
+    "token-color-boundary-foreground": {
+      "key": "{color.boundary.foreground}",
+      "$type": "color",
+      "$value": "#cf2d32",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-500}",
+        "group": "branding",
+        "key": "{color.boundary.foreground}"
+      },
+      "name": "token-color-boundary-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "foreground"
+      ]
+    },
+    "token-color-boundary-surface": {
+      "key": "{color.boundary.surface}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.surface}"
+      },
+      "name": "token-color-boundary-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "surface"
+      ]
+    },
+    "token-color-boundary-border": {
+      "key": "{color.boundary.border}",
+      "$type": "color",
+      "$value": "#fbd7d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-100}",
+        "group": "branding",
+        "key": "{color.boundary.border}"
+      },
+      "name": "token-color-boundary-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "border"
+      ]
+    },
+    "token-color-boundary-gradient-primary-start": {
+      "key": "{color.boundary.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#f97076",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-300}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.start}"
+      },
+      "name": "token-color-boundary-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-primary-stop": {
+      "key": "{color.boundary.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#db363b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-400}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.primary.stop}"
+      },
+      "name": "token-color-boundary-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-boundary-gradient-faint-start": {
+      "key": "{color.boundary.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffafa",
+        "group": "branding",
+        "comment": "this is the 'boundary-50' value at 25% opacity on white",
+        "key": "{color.boundary.gradient.faint.start}"
+      },
+      "name": "token-color-boundary-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-boundary-gradient-faint-stop": {
+      "key": "{color.boundary.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffecec",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.boundary-50}",
+        "group": "branding",
+        "key": "{color.boundary.gradient.faint.stop}"
+      },
+      "name": "token-color-boundary-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "boundary",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-consul-brand": {
+      "key": "{color.consul.brand}",
+      "$type": "color",
+      "$value": "#e03875",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-brand}",
+        "group": "branding",
+        "key": "{color.consul.brand}"
+      },
+      "name": "token-color-consul-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "brand"
+      ]
+    },
+    "token-color-consul-foreground": {
+      "key": "{color.consul.foreground}",
+      "$type": "color",
+      "$value": "#d01c5b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-500}",
+        "group": "branding",
+        "key": "{color.consul.foreground}"
+      },
+      "name": "token-color-consul-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "foreground"
+      ]
+    },
+    "token-color-consul-surface": {
+      "key": "{color.consul.surface}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.surface}"
+      },
+      "name": "token-color-consul-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "surface"
+      ]
+    },
+    "token-color-consul-border": {
+      "key": "{color.consul.border}",
+      "$type": "color",
+      "$value": "#ffcede",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-100}",
+        "group": "branding",
+        "key": "{color.consul.border}"
+      },
+      "name": "token-color-consul-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "border"
+      ]
+    },
+    "token-color-consul-gradient-primary-start": {
+      "key": "{color.consul.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#ff99be",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-300}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.start}"
+      },
+      "name": "token-color-consul-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-primary-stop": {
+      "key": "{color.consul.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#da306e",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-400}",
+        "group": "branding",
+        "key": "{color.consul.gradient.primary.stop}"
+      },
+      "name": "token-color-consul-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-consul-gradient-faint-start": {
+      "key": "{color.consul.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fff9fb",
+        "group": "branding",
+        "comment": "this is the 'consul-50' value at 25% opacity on white",
+        "key": "{color.consul.gradient.faint.start}"
+      },
+      "name": "token-color-consul-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-consul-gradient-faint-stop": {
+      "key": "{color.consul.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#ffe9f1",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.consul-50}",
+        "group": "branding",
+        "key": "{color.consul.gradient.faint.stop}"
+      },
+      "name": "token-color-consul-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "consul",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-hcp-brand": {
+      "key": "{color.hcp.brand}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.hcp-brand}",
+        "group": "branding",
+        "key": "{color.hcp.brand}"
+      },
+      "name": "token-color-hcp-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "hcp",
+        "brand"
+      ]
+    },
+    "token-color-nomad-brand": {
+      "key": "{color.nomad.brand}",
+      "$type": "color",
+      "$value": "#06d092",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-brand}",
+        "group": "branding",
+        "key": "{color.nomad.brand}"
+      },
+      "name": "token-color-nomad-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "brand"
+      ]
+    },
+    "token-color-nomad-foreground": {
+      "key": "{color.nomad.foreground}",
+      "$type": "color",
+      "$value": "#008661",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-500}",
+        "group": "branding",
+        "key": "{color.nomad.foreground}"
+      },
+      "name": "token-color-nomad-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "foreground"
+      ]
+    },
+    "token-color-nomad-surface": {
+      "key": "{color.nomad.surface}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.surface}"
+      },
+      "name": "token-color-nomad-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "surface"
+      ]
+    },
+    "token-color-nomad-border": {
+      "key": "{color.nomad.border}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.border}"
+      },
+      "name": "token-color-nomad-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "border"
+      ]
+    },
+    "token-color-nomad-gradient-primary-start": {
+      "key": "{color.nomad.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bff3dd",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-100}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.start}"
+      },
+      "name": "token-color-nomad-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-primary-stop": {
+      "key": "{color.nomad.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#60dea9",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-200}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.primary.stop}"
+      },
+      "name": "token-color-nomad-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-nomad-gradient-faint-start": {
+      "key": "{color.nomad.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f3fff9",
+        "group": "branding",
+        "comment": "this is the 'nomad-50' value at 25% opacity on white",
+        "key": "{color.nomad.gradient.faint.start}"
+      },
+      "name": "token-color-nomad-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-nomad-gradient-faint-stop": {
+      "key": "{color.nomad.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d3fdeb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.nomad-50}",
+        "group": "branding",
+        "key": "{color.nomad.gradient.faint.stop}"
+      },
+      "name": "token-color-nomad-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "nomad",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-packer-brand": {
+      "key": "{color.packer.brand}",
+      "$type": "color",
+      "$value": "#02a8ef",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-brand}",
+        "group": "branding",
+        "key": "{color.packer.brand}"
+      },
+      "name": "token-color-packer-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "brand"
+      ]
+    },
+    "token-color-packer-foreground": {
+      "key": "{color.packer.foreground}",
+      "$type": "color",
+      "$value": "#007eb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-500}",
+        "group": "branding",
+        "key": "{color.packer.foreground}"
+      },
+      "name": "token-color-packer-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "foreground"
+      ]
+    },
+    "token-color-packer-surface": {
+      "key": "{color.packer.surface}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.surface}"
+      },
+      "name": "token-color-packer-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "surface"
+      ]
+    },
+    "token-color-packer-border": {
+      "key": "{color.packer.border}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.border}"
+      },
+      "name": "token-color-packer-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "border"
+      ]
+    },
+    "token-color-packer-gradient-primary-start": {
+      "key": "{color.packer.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#b4e4ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-100}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.start}"
+      },
+      "name": "token-color-packer-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-primary-stop": {
+      "key": "{color.packer.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#63d0ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-200}",
+        "group": "branding",
+        "key": "{color.packer.gradient.primary.stop}"
+      },
+      "name": "token-color-packer-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-packer-gradient-faint-start": {
+      "key": "{color.packer.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f3fcff",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#F3FCFF",
+        "group": "branding",
+        "comment": "this is the 'packer-50' value at 25% opacity on white",
+        "key": "{color.packer.gradient.faint.start}"
+      },
+      "name": "token-color-packer-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-packer-gradient-faint-stop": {
+      "key": "{color.packer.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d4f2ff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.packer-50}",
+        "group": "branding",
+        "key": "{color.packer.gradient.faint.stop}"
+      },
+      "name": "token-color-packer-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "packer",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-terraform-brand": {
+      "key": "{color.terraform.brand}",
+      "$type": "color",
+      "$value": "#7b42bc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-brand}",
+        "group": "branding",
+        "key": "{color.terraform.brand}"
+      },
+      "name": "token-color-terraform-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand"
+      ]
+    },
+    "token-color-terraform-brand-on-dark": {
+      "key": "{color.terraform.brand-on-dark}",
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "original": {
+        "$type": "color",
+        "$value": "#a067da",
+        "group": "branding",
+        "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+        "key": "{color.terraform.brand-on-dark}"
+      },
+      "name": "token-color-terraform-brand-on-dark",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "brand-on-dark"
+      ]
+    },
+    "token-color-terraform-foreground": {
+      "key": "{color.terraform.foreground}",
+      "$type": "color",
+      "$value": "#773cb4",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-500}",
+        "group": "branding",
+        "key": "{color.terraform.foreground}"
+      },
+      "name": "token-color-terraform-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "foreground"
+      ]
+    },
+    "token-color-terraform-surface": {
+      "key": "{color.terraform.surface}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.surface}"
+      },
+      "name": "token-color-terraform-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "surface"
+      ]
+    },
+    "token-color-terraform-border": {
+      "key": "{color.terraform.border}",
+      "$type": "color",
+      "$value": "#ebdbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-100}",
+        "group": "branding",
+        "key": "{color.terraform.border}"
+      },
+      "name": "token-color-terraform-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "border"
+      ]
+    },
+    "token-color-terraform-gradient-primary-start": {
+      "key": "{color.terraform.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#bb8deb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-300}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.start}"
+      },
+      "name": "token-color-terraform-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-primary-stop": {
+      "key": "{color.terraform.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#844fba",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-400}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.primary.stop}"
+      },
+      "name": "token-color-terraform-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-terraform-gradient-faint-start": {
+      "key": "{color.terraform.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fcfaff",
+        "group": "branding",
+        "comment": "this is the 'terraform-50' value at 25% opacity on white",
+        "key": "{color.terraform.gradient.faint.start}"
+      },
+      "name": "token-color-terraform-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-terraform-gradient-faint-stop": {
+      "key": "{color.terraform.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#f4ecff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.terraform-50}",
+        "group": "branding",
+        "key": "{color.terraform.gradient.faint.stop}"
+      },
+      "name": "token-color-terraform-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "terraform",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-brand": {
+      "key": "{color.vagrant.brand}",
+      "$type": "color",
+      "$value": "#1868f2",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-brand}",
+        "group": "branding",
+        "key": "{color.vagrant.brand}"
+      },
+      "name": "token-color-vagrant-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "brand"
+      ]
+    },
+    "token-color-vagrant-foreground": {
+      "key": "{color.vagrant.foreground}",
+      "$type": "color",
+      "$value": "#1c61d8",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-500}",
+        "group": "branding",
+        "key": "{color.vagrant.foreground}"
+      },
+      "name": "token-color-vagrant-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "foreground"
+      ]
+    },
+    "token-color-vagrant-surface": {
+      "key": "{color.vagrant.surface}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.surface}"
+      },
+      "name": "token-color-vagrant-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "surface"
+      ]
+    },
+    "token-color-vagrant-border": {
+      "key": "{color.vagrant.border}",
+      "$type": "color",
+      "$value": "#c7dbfc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-100}",
+        "group": "branding",
+        "key": "{color.vagrant.border}"
+      },
+      "name": "token-color-vagrant-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "border"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-start": {
+      "key": "{color.vagrant.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#639cff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-300}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.start}"
+      },
+      "name": "token-color-vagrant-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-primary-stop": {
+      "key": "{color.vagrant.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#2e71e5",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-400}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.primary.stop}"
+      },
+      "name": "token-color-vagrant-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-start": {
+      "key": "{color.vagrant.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f4faff",
+        "group": "branding",
+        "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+        "key": "{color.vagrant.gradient.faint.start}"
+      },
+      "name": "token-color-vagrant-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vagrant-gradient-faint-stop": {
+      "key": "{color.vagrant.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#d6ebff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vagrant-50}",
+        "group": "branding",
+        "key": "{color.vagrant.gradient.faint.stop}"
+      },
+      "name": "token-color-vagrant-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vagrant",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-brand": {
+      "key": "{color.vault-radar.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-brand}",
+        "group": "branding",
+        "key": "{color.vault-radar.brand}"
+      },
+      "name": "token-color-vault-radar-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand"
+      ]
+    },
+    "token-color-vault-radar-brand-alt": {
+      "key": "{color.vault-radar.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+        "key": "{color.vault-radar.brand-alt}"
+      },
+      "name": "token-color-vault-radar-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-radar-foreground": {
+      "key": "{color.vault-radar.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-500}",
+        "group": "branding",
+        "key": "{color.vault-radar.foreground}"
+      },
+      "name": "token-color-vault-radar-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "foreground"
+      ]
+    },
+    "token-color-vault-radar-surface": {
+      "key": "{color.vault-radar.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.surface}"
+      },
+      "name": "token-color-vault-radar-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "surface"
+      ]
+    },
+    "token-color-vault-radar-border": {
+      "key": "{color.vault-radar.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.border}"
+      },
+      "name": "token-color-vault-radar-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "border"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-start": {
+      "key": "{color.vault-radar.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-100}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.start}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-primary-stop": {
+      "key": "{color.vault-radar.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-200}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-start": {
+      "key": "{color.vault-radar.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+        "key": "{color.vault-radar.gradient.faint.start}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-radar-gradient-faint-stop": {
+      "key": "{color.vault-radar.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-radar-50}",
+        "group": "branding",
+        "key": "{color.vault-radar.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-radar-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-radar",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-brand": {
+      "key": "{color.vault-secrets.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-brand}",
+        "group": "branding",
+        "key": "{color.vault-secrets.brand}"
+      },
+      "name": "token-color-vault-secrets-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand"
+      ]
+    },
+    "token-color-vault-secrets-brand-alt": {
+      "key": "{color.vault-secrets.brand-alt}",
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "original": {
+        "group": "branding",
+        "$type": "color",
+        "$value": "#000",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+        "key": "{color.vault-secrets.brand-alt}"
+      },
+      "name": "token-color-vault-secrets-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-secrets-foreground": {
+      "key": "{color.vault-secrets.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-500}",
+        "group": "branding",
+        "key": "{color.vault-secrets.foreground}"
+      },
+      "name": "token-color-vault-secrets-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "foreground"
+      ]
+    },
+    "token-color-vault-secrets-surface": {
+      "key": "{color.vault-secrets.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.surface}"
+      },
+      "name": "token-color-vault-secrets-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "surface"
+      ]
+    },
+    "token-color-vault-secrets-border": {
+      "key": "{color.vault-secrets.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.border}"
+      },
+      "name": "token-color-vault-secrets-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "border"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-start": {
+      "key": "{color.vault-secrets.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-100}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-primary-stop": {
+      "key": "{color.vault-secrets.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-200}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-start": {
+      "key": "{color.vault-secrets.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+        "key": "{color.vault-secrets.gradient.faint.start}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-secrets-gradient-faint-stop": {
+      "key": "{color.vault-secrets.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-secrets-50}",
+        "group": "branding",
+        "key": "{color.vault-secrets.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-secrets-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault-secrets",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-vault-brand": {
+      "key": "{color.vault.brand}",
+      "$type": "color",
+      "$value": "#ffcf25",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-brand}",
+        "group": "branding",
+        "key": "{color.vault.brand}"
+      },
+      "name": "token-color-vault-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand"
+      ]
+    },
+    "token-color-vault-brand-alt": {
+      "key": "{color.vault.brand-alt}",
+      "$type": "color",
+      "$value": "#000000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "original": {
+        "$type": "color",
+        "$value": "#000",
+        "group": "branding",
+        "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+        "key": "{color.vault.brand-alt}"
+      },
+      "name": "token-color-vault-brand-alt",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "brand-alt"
+      ]
+    },
+    "token-color-vault-foreground": {
+      "key": "{color.vault.foreground}",
+      "$type": "color",
+      "$value": "#9a6f00",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-500}",
+        "group": "branding",
+        "key": "{color.vault.foreground}"
+      },
+      "name": "token-color-vault-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "foreground"
+      ]
+    },
+    "token-color-vault-surface": {
+      "key": "{color.vault.surface}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.surface}"
+      },
+      "name": "token-color-vault-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "surface"
+      ]
+    },
+    "token-color-vault-border": {
+      "key": "{color.vault.border}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.border}"
+      },
+      "name": "token-color-vault-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "border"
+      ]
+    },
+    "token-color-vault-gradient-primary-start": {
+      "key": "{color.vault.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#feec7b",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-100}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.start}"
+      },
+      "name": "token-color-vault-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-primary-stop": {
+      "key": "{color.vault.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#ffe543",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-200}",
+        "group": "branding",
+        "key": "{color.vault.gradient.primary.stop}"
+      },
+      "name": "token-color-vault-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-vault-gradient-faint-start": {
+      "key": "{color.vault.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#fffdf2",
+        "group": "branding",
+        "comment": "this is the 'vault-50' value at 25% opacity on white",
+        "key": "{color.vault.gradient.faint.start}"
+      },
+      "name": "token-color-vault-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-vault-gradient-faint-stop": {
+      "key": "{color.vault.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#fff9cf",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.vault-50}",
+        "group": "branding",
+        "key": "{color.vault.gradient.faint.stop}"
+      },
+      "name": "token-color-vault-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "vault",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-brand": {
+      "key": "{color.waypoint.brand}",
+      "$type": "color",
+      "$value": "#14c6cb",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-brand}",
+        "group": "branding",
+        "key": "{color.waypoint.brand}"
+      },
+      "name": "token-color-waypoint-brand",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "brand"
+      ]
+    },
+    "token-color-waypoint-foreground": {
+      "key": "{color.waypoint.foreground}",
+      "$type": "color",
+      "$value": "#008196",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-500}",
+        "group": "branding",
+        "key": "{color.waypoint.foreground}"
+      },
+      "name": "token-color-waypoint-foreground",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "foreground"
+      ]
+    },
+    "token-color-waypoint-surface": {
+      "key": "{color.waypoint.surface}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.surface}"
+      },
+      "name": "token-color-waypoint-surface",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "surface"
+      ]
+    },
+    "token-color-waypoint-border": {
+      "key": "{color.waypoint.border}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.border}"
+      },
+      "name": "token-color-waypoint-border",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "border"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-start": {
+      "key": "{color.waypoint.gradient.primary.start}",
+      "$type": "color",
+      "$value": "#cbf1f3",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-100}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.start}"
+      },
+      "name": "token-color-waypoint-gradient-primary-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-primary-stop": {
+      "key": "{color.waypoint.gradient.primary.stop}",
+      "$type": "color",
+      "$value": "#62d4dc",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-200}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.primary.stop}"
+      },
+      "name": "token-color-waypoint-gradient-primary-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "primary",
+        "stop"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-start": {
+      "key": "{color.waypoint.gradient.faint.start}",
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "original": {
+        "$type": "color",
+        "$value": "#f6feff",
+        "group": "branding",
+        "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+        "key": "{color.waypoint.gradient.faint.start}"
+      },
+      "name": "token-color-waypoint-gradient-faint-start",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "start"
+      ]
+    },
+    "token-color-waypoint-gradient-faint-stop": {
+      "key": "{color.waypoint.gradient.faint.stop}",
+      "$type": "color",
+      "$value": "#e0fcff",
+      "group": "branding",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.waypoint-50}",
+        "group": "branding",
+        "key": "{color.waypoint.gradient.faint.stop}"
+      },
+      "name": "token-color-waypoint-gradient-faint-stop",
+      "attributes": {
+        "category": "color"
+      },
+      "path": [
+        "color",
+        "waypoint",
+        "gradient",
+        "faint",
+        "stop"
+      ]
+    },
+    "token-elevation-inset-box-shadow": {
+      "key": "{elevation.inset.box-shadow}",
+      "$value": "inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-01}",
+        "key": "{elevation.inset.box-shadow}"
+      },
+      "name": "token-elevation-inset-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-low-box-shadow": {
+      "key": "{elevation.low.box-shadow}",
+      "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+        "key": "{elevation.low.box-shadow}"
+      },
+      "name": "token-elevation-low-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-mid-box-shadow": {
+      "key": "{elevation.mid.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+        "key": "{elevation.mid.box-shadow}"
+      },
+      "name": "token-elevation-mid-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-high-box-shadow": {
+      "key": "{elevation.high.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+        "key": "{elevation.high.box-shadow}"
+      },
+      "name": "token-elevation-high-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-higher-box-shadow": {
+      "key": "{elevation.higher.box-shadow}",
+      "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+        "key": "{elevation.higher.box-shadow}"
+      },
+      "name": "token-elevation-higher-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-elevation-overlay-box-shadow": {
+      "key": "{elevation.overlay.box-shadow}",
+      "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+        "key": "{elevation.overlay.box-shadow}"
+      },
+      "name": "token-elevation-overlay-box-shadow",
+      "attributes": {
+        "category": "elevation"
+      },
+      "path": [
+        "elevation",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-surface-inset-box-shadow": {
+      "key": "{surface.inset.box-shadow}",
+      "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+      "original": {
+        "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+        "key": "{surface.inset.box-shadow}"
+      },
+      "name": "token-surface-inset-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "inset",
+        "box-shadow"
+      ]
+    },
+    "token-surface-base-box-shadow": {
+      "key": "{surface.base.box-shadow}",
+      "$value": "0 0 0 1px #656a7633",
+      "original": {
+        "$value": "{elevation.base.box-shadow-border}",
+        "key": "{surface.base.box-shadow}"
+      },
+      "name": "token-surface-base-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "base",
+        "box-shadow"
+      ]
+    },
+    "token-surface-low-box-shadow": {
+      "key": "{surface.low.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+      "original": {
+        "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+        "key": "{surface.low.box-shadow}"
+      },
+      "name": "token-surface-low-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "low",
+        "box-shadow"
+      ]
+    },
+    "token-surface-mid-box-shadow": {
+      "key": "{surface.mid.box-shadow}",
+      "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+        "key": "{surface.mid.box-shadow}"
+      },
+      "name": "token-surface-mid-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "mid",
+        "box-shadow"
+      ]
+    },
+    "token-surface-high-box-shadow": {
+      "key": "{surface.high.box-shadow}",
+      "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+      "original": {
+        "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+        "key": "{surface.high.box-shadow}"
+      },
+      "name": "token-surface-high-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "high",
+        "box-shadow"
+      ]
+    },
+    "token-surface-higher-box-shadow": {
+      "key": "{surface.higher.box-shadow}",
+      "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+      "original": {
+        "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+        "key": "{surface.higher.box-shadow}"
+      },
+      "name": "token-surface-higher-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "higher",
+        "box-shadow"
+      ]
+    },
+    "token-surface-overlay-box-shadow": {
+      "key": "{surface.overlay.box-shadow}",
+      "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+      "original": {
+        "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+        "key": "{surface.overlay.box-shadow}"
+      },
+      "name": "token-surface-overlay-box-shadow",
+      "attributes": {
+        "category": "surface"
+      },
+      "path": [
+        "surface",
+        "overlay",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-action-box-shadow": {
+      "key": "{focus-ring.action.box-shadow}",
+      "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+      "original": {
+        "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+        "key": "{focus-ring.action.box-shadow}"
+      },
+      "name": "token-focus-ring-action-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "action",
+        "box-shadow"
+      ]
+    },
+    "token-focus-ring-critical-box-shadow": {
+      "key": "{focus-ring.critical.box-shadow}",
+      "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+      "original": {
+        "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+        "key": "{focus-ring.critical.box-shadow}"
+      },
+      "name": "token-focus-ring-critical-box-shadow",
+      "attributes": {
+        "category": "focus-ring"
+      },
+      "path": [
+        "focus-ring",
+        "critical",
+        "box-shadow"
+      ]
+    },
+    "token-app-header-height": {
+      "key": "{app-header.height}",
+      "$type": "dimension",
+      "$value": "60px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "60",
+        "unit": "px",
+        "key": "{app-header.height}"
+      },
+      "name": "token-app-header-height",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "height"
+      ]
+    },
+    "token-app-header-home-link-size": {
+      "key": "{app-header.home-link.size}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-header.home-link.size}"
+      },
+      "name": "token-app-header-home-link-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "home-link",
+        "size"
+      ]
+    },
+    "token-app-header-logo-size": {
+      "key": "{app-header.logo.size}",
+      "$type": "dimension",
+      "$value": "28px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "28",
+        "unit": "px",
+        "key": "{app-header.logo.size}"
+      },
+      "name": "token-app-header-logo-size",
+      "attributes": {
+        "category": "app-header"
+      },
+      "path": [
+        "app-header",
+        "logo",
+        "size"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-width": {
+      "key": "{app-side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.border.width}"
+      },
+      "name": "token-app-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-app-side-nav-wrapper-border-color": {
+      "key": "{app-side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-200)",
+        "group": "components",
+        "key": "{app-side-nav.wrapper.border.color}"
+      },
+      "name": "token-app-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal": {
+      "key": "{app-side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical": {
+      "key": "{app-side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-app-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-app-side-nav-toggle-button-border-radius": {
+      "key": "{app-side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-app-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-app-side-nav-header-home-link-padding": {
+      "key": "{app-side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.padding}"
+      },
+      "name": "token-app-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size": {
+      "key": "{app-side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-app-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-app-side-nav-header-actions-spacing": {
+      "key": "{app-side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.header.actions.spacing}"
+      },
+      "name": "token-app-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-app-side-nav-body-list-margin-vertical": {
+      "key": "{app-side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{app-side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-height": {
+      "key": "{app-side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.height}"
+      },
+      "name": "token-app-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-horizontal": {
+      "key": "{app-side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-padding-vertical": {
+      "key": "{app-side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-spacing-vertical": {
+      "key": "{app-side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-app-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-app-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-app-side-nav-body-list-item-border-radius": {
+      "key": "{app-side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{app-side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-app-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-app-side-nav-color-foreground-primary": {
+      "key": "{app-side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.primary}"
+      },
+      "name": "token-app-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-foreground-strong": {
+      "key": "{app-side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-primary)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.strong}"
+      },
+      "name": "token-app-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-app-side-nav-color-foreground-faint": {
+      "key": "{app-side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.foreground.faint}"
+      },
+      "name": "token-app-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-app-side-nav-color-surface-primary": {
+      "key": "{app-side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-faint)",
+        "group": "components",
+        "key": "{app-side-nav.color.surface.primary}"
+      },
+      "name": "token-app-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-hover": {
+      "key": "{app-side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-surface-interactive-hover)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-app-side-nav-color-surface-interactive-active": {
+      "key": "{app-side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-300)",
+        "group": "semantic",
+        "key": "{app-side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-app-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "app-side-nav"
+      },
+      "path": [
+        "app-side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-form-label-color": {
+      "key": "{form.label.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.label.color}"
+      },
+      "name": "token-form-label-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "label",
+        "color"
+      ]
+    },
+    "token-form-legend-color": {
+      "key": "{form.legend.color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{form.label.color}",
+        "group": "components",
+        "key": "{form.legend.color}"
+      },
+      "name": "token-form-legend-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "legend",
+        "color"
+      ]
+    },
+    "token-form-helper-text-color": {
+      "key": "{form.helper-text.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.helper-text.color}"
+      },
+      "name": "token-form-helper-text-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "helper-text",
+        "color"
+      ]
+    },
+    "token-form-indicator-optional-color": {
+      "key": "{form.indicator.optional.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.indicator.optional.color}"
+      },
+      "name": "token-form-indicator-optional-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "indicator",
+        "optional",
+        "color"
+      ]
+    },
+    "token-form-error-color": {
+      "key": "{form.error.color}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.error.color}"
+      },
+      "name": "token-form-error-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "color"
+      ]
+    },
+    "token-form-error-icon-size": {
+      "key": "{form.error.icon-size}",
+      "$type": "dimension",
+      "$value": "14px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "14",
+        "unit": "px",
+        "key": "{form.error.icon-size}"
+      },
+      "name": "token-form-error-icon-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "error",
+        "icon-size"
+      ]
+    },
+    "token-form-checkbox-size": {
+      "key": "{form.checkbox.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.checkbox.size}"
+      },
+      "name": "token-form-checkbox-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "size"
+      ]
+    },
+    "token-form-checkbox-border-radius": {
+      "key": "{form.checkbox.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.checkbox.border.radius}"
+      },
+      "name": "token-form-checkbox-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-checkbox-border-width": {
+      "key": "{form.checkbox.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.checkbox.border.width}"
+      },
+      "name": "token-form-checkbox-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-checkbox-background-image-size": {
+      "key": "{form.checkbox.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.checkbox.background-image.size}"
+      },
+      "name": "token-form-checkbox-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url": {
+      "key": "{form.checkbox.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url}"
+      },
+      "name": "token-form-checkbox-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-disabled": {
+      "key": "{form.checkbox.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-checkbox-background-image-data-url-indeterminate-disabled": {
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dash' color is hardcoded here!",
+        "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+      },
+      "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "checkbox",
+        "background-image",
+        "data-url-indeterminate-disabled"
+      ]
+    },
+    "token-form-control-base-foreground-value-color": {
+      "key": "{form.control.base.foreground.value-color}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.strong}",
+        "group": "components",
+        "key": "{form.control.base.foreground.value-color}"
+      },
+      "name": "token-form-control-base-foreground-value-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "value-color"
+      ]
+    },
+    "token-form-control-base-foreground-placeholder-color": {
+      "key": "{form.control.base.foreground.placeholder-color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.faint}",
+        "group": "components",
+        "key": "{form.control.base.foreground.placeholder-color}"
+      },
+      "name": "token-form-control-base-foreground-placeholder-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "foreground",
+        "placeholder-color"
+      ]
+    },
+    "token-form-control-base-surface-color-default": {
+      "key": "{form.control.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.default}"
+      },
+      "name": "token-form-control-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-surface-color-hover": {
+      "key": "{form.control.base.surface-color.hover}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-hover}",
+        "group": "components",
+        "key": "{form.control.base.surface-color.hover}"
+      },
+      "name": "token-form-control-base-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-base-border-color-default": {
+      "key": "{form.control.base.border-color.default}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-400}",
+        "group": "components",
+        "key": "{form.control.base.border-color.default}"
+      },
+      "name": "token-form-control-base-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-base-border-color-hover": {
+      "key": "{form.control.base.border-color.hover}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.neutral-500}",
+        "group": "components",
+        "key": "{form.control.base.border-color.hover}"
+      },
+      "name": "token-form-control-base-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "base",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-foreground-color": {
+      "key": "{form.control.checked.foreground-color}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.high-contrast}",
+        "group": "components",
+        "key": "{form.control.checked.foreground-color}"
+      },
+      "name": "token-form-control-checked-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-checked-surface-color-default": {
+      "key": "{form.control.checked.surface-color.default}",
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-200}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.default}"
+      },
+      "name": "token-form-control-checked-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-surface-color-hover": {
+      "key": "{form.control.checked.surface-color.hover}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.surface-color.hover}"
+      },
+      "name": "token-form-control-checked-surface-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "surface-color",
+        "hover"
+      ]
+    },
+    "token-form-control-checked-border-color-default": {
+      "key": "{form.control.checked.border-color.default}",
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-300}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.default}"
+      },
+      "name": "token-form-control-checked-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-checked-border-color-hover": {
+      "key": "{form.control.checked.border-color.hover}",
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.blue-400}",
+        "group": "components",
+        "key": "{form.control.checked.border-color.hover}"
+      },
+      "name": "token-form-control-checked-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "checked",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-invalid-border-color-default": {
+      "key": "{form.control.invalid.border-color.default}",
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-300}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.default}"
+      },
+      "name": "token-form-control-invalid-border-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "default"
+      ]
+    },
+    "token-form-control-invalid-border-color-hover": {
+      "key": "{form.control.invalid.border-color.hover}",
+      "$type": "color",
+      "$value": "#940004",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.palette.red-400}",
+        "group": "components",
+        "key": "{form.control.invalid.border-color.hover}"
+      },
+      "name": "token-form-control-invalid-border-color-hover",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "invalid",
+        "border-color",
+        "hover"
+      ]
+    },
+    "token-form-control-readonly-foreground-color": {
+      "key": "{form.control.readonly.foreground-color}",
+      "$type": "color",
+      "$value": "#f4f4f4",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.primary}",
+        "group": "components",
+        "key": "{form.control.readonly.foreground-color}"
+      },
+      "name": "token-form-control-readonly-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-readonly-surface-color": {
+      "key": "{form.control.readonly.surface-color}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "key": "{form.control.readonly.surface-color}"
+      },
+      "name": "token-form-control-readonly-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "surface-color"
+      ]
+    },
+    "token-form-control-readonly-border-color": {
+      "key": "{form.control.readonly.border-color}",
+      "$type": "color",
+      "$value": "#656a761a",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.faint}",
+        "group": "components",
+        "key": "{form.control.readonly.border-color}"
+      },
+      "name": "token-form-control-readonly-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "readonly",
+        "border-color"
+      ]
+    },
+    "token-form-control-disabled-foreground-color": {
+      "key": "{form.control.disabled.foreground-color}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.foreground.disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.foreground-color}"
+      },
+      "name": "token-form-control-disabled-foreground-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "foreground-color"
+      ]
+    },
+    "token-form-control-disabled-surface-color": {
+      "key": "{form.control.disabled.surface-color}",
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.interactive-disabled}",
+        "group": "components",
+        "key": "{form.control.disabled.surface-color}"
+      },
+      "name": "token-form-control-disabled-surface-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "surface-color"
+      ]
+    },
+    "token-form-control-disabled-border-color": {
+      "key": "{form.control.disabled.border-color}",
+      "$type": "color",
+      "$value": "#656a7633",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "{color.border.primary}",
+        "group": "components",
+        "key": "{form.control.disabled.border-color}"
+      },
+      "name": "token-form-control-disabled-border-color",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "disabled",
+        "border-color"
+      ]
+    },
+    "token-form-control-padding": {
+      "key": "{form.control.padding}",
+      "$type": "dimension",
+      "$value": "7px",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "original": {
+        "$type": "dimension",
+        "$value": "7",
+        "unit": "px",
+        "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+        "key": "{form.control.padding}"
+      },
+      "name": "token-form-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "padding"
+      ]
+    },
+    "token-form-control-border-radius": {
+      "key": "{form.control.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{form.control.border.radius}"
+      },
+      "name": "token-form-control-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-control-border-width": {
+      "key": "{form.control.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.control.border.width}"
+      },
+      "name": "token-form-control-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "control",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-size": {
+      "key": "{form.radio.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radio.size}"
+      },
+      "name": "token-form-radio-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "size"
+      ]
+    },
+    "token-form-radio-border-width": {
+      "key": "{form.radio.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radio.border.width}"
+      },
+      "name": "token-form-radio-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radio-background-image-size": {
+      "key": "{form.radio.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.radio.background-image.size}"
+      },
+      "name": "token-form-radio-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-radio-background-image-data-url": {
+      "key": "{form.radio.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url}"
+      },
+      "name": "token-form-radio-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-radio-background-image-data-url-disabled": {
+      "key": "{form.radio.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'dot' color is hardcoded here!",
+        "key": "{form.radio.background-image.data-url-disabled}"
+      },
+      "name": "token-form-radio-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radio",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-radiocard-group-gap": {
+      "key": "{form.radiocard-group.gap}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.radiocard-group.gap}"
+      },
+      "name": "token-form-radiocard-group-gap",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard-group",
+        "gap"
+      ]
+    },
+    "token-form-radiocard-border-width": {
+      "key": "{form.radiocard.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.radiocard.border.width}"
+      },
+      "name": "token-form-radiocard-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-radiocard-border-radius": {
+      "key": "{form.radiocard.border.radius}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{form.radiocard.border.radius}"
+      },
+      "name": "token-form-radiocard-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-radiocard-content-padding": {
+      "key": "{form.radiocard.content-padding}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{form.radiocard.content-padding}"
+      },
+      "name": "token-form-radiocard-content-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "content-padding"
+      ]
+    },
+    "token-form-radiocard-control-padding": {
+      "key": "{form.radiocard.control-padding}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{form.radiocard.control-padding}"
+      },
+      "name": "token-form-radiocard-control-padding",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "control-padding"
+      ]
+    },
+    "token-form-radiocard-transition-duration": {
+      "key": "{form.radiocard.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.radiocard.transition.duration}"
+      },
+      "name": "token-form-radiocard-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "radiocard",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-select-background-image-size": {
+      "key": "{form.select.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.select.background-image.size}"
+      },
+      "name": "token-form-select-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-select-background-image-position-right-x": {
+      "key": "{form.select.background-image.position-right-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.select.background-image.position-right-x}"
+      },
+      "name": "token-form-select-background-image-position-right-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-right-x"
+      ]
+    },
+    "token-form-select-background-image-position-top-y": {
+      "key": "{form.select.background-image.position-top-y}",
+      "$type": "dimension",
+      "$value": "9px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "9",
+        "unit": "px",
+        "key": "{form.select.background-image.position-top-y}"
+      },
+      "name": "token-form-select-background-image-position-top-y",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "position-top-y"
+      ]
+    },
+    "token-form-select-background-image-data-url": {
+      "key": "{form.select.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url}"
+      },
+      "name": "token-form-select-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-select-background-image-data-url-disabled": {
+      "key": "{form.select.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+        "comment": "notice: the 'caret' color is hardcoded here!",
+        "key": "{form.select.background-image.data-url-disabled}"
+      },
+      "name": "token-form-select-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "select",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-text-input-background-image-size": {
+      "key": "{form.text-input.background-image.size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.text-input.background-image.size}"
+      },
+      "name": "token-form-text-input-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-text-input-background-image-position-x": {
+      "key": "{form.text-input.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "7px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.control.padding}",
+        "key": "{form.text-input.background-image.position-x}"
+      },
+      "name": "token-form-text-input-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-date": {
+      "key": "{form.text-input.background-image.data-url-date}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-date}"
+      },
+      "name": "token-form-text-input-background-image-data-url-date",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-date"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-time": {
+      "key": "{form.text-input.background-image.data-url-time}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-time}"
+      },
+      "name": "token-form-text-input-background-image-data-url-time",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-time"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search": {
+      "key": "{form.text-input.background-image.data-url-search}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-cancel": {
+      "key": "{form.text-input.background-image.data-url-search-cancel}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color is hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-cancel}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-cancel",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-cancel"
+      ]
+    },
+    "token-form-text-input-background-image-data-url-search-loading": {
+      "key": "{form.text-input.background-image.data-url-search-loading}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+        "comment": "notice: the icon color and animation are hardcoded here!",
+        "key": "{form.text-input.background-image.data-url-search-loading}"
+      },
+      "name": "token-form-text-input-background-image-data-url-search-loading",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "text-input",
+        "background-image",
+        "data-url-search-loading"
+      ]
+    },
+    "token-form-toggle-width": {
+      "key": "{form.toggle.width}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{form.toggle.width}"
+      },
+      "name": "token-form-toggle-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "width"
+      ]
+    },
+    "token-form-toggle-height": {
+      "key": "{form.toggle.height}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{form.toggle.height}"
+      },
+      "name": "token-form-toggle-height",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "height"
+      ]
+    },
+    "token-form-toggle-base-surface-color-default": {
+      "key": "{form.toggle.base.surface-color.default}",
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "original": {
+        "$type": "color",
+        "$value": "{color.surface.strong}",
+        "group": "components",
+        "comment": "the toggle has a different base surface color, compared to the other controls",
+        "key": "{form.toggle.base.surface-color.default}"
+      },
+      "name": "token-form-toggle-base-surface-color-default",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "base",
+        "surface-color",
+        "default"
+      ]
+    },
+    "token-form-toggle-border-radius": {
+      "key": "{form.toggle.border.radius}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{form.toggle.border.radius}"
+      },
+      "name": "token-form-toggle-border-radius",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "radius"
+      ]
+    },
+    "token-form-toggle-border-width": {
+      "key": "{form.toggle.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{form.toggle.border.width}"
+      },
+      "name": "token-form-toggle-border-width",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "border",
+        "width"
+      ]
+    },
+    "token-form-toggle-background-image-size": {
+      "key": "{form.toggle.background-image.size}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{form.toggle.background-image.size}"
+      },
+      "name": "token-form-toggle-background-image-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "size"
+      ]
+    },
+    "token-form-toggle-background-image-position-x": {
+      "key": "{form.toggle.background-image.position-x}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{form.toggle.background-image.position-x}"
+      },
+      "name": "token-form-toggle-background-image-position-x",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "position-x"
+      ]
+    },
+    "token-form-toggle-background-image-data-url": {
+      "key": "{form.toggle.background-image.data-url}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url}"
+      },
+      "name": "token-form-toggle-background-image-data-url",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url"
+      ]
+    },
+    "token-form-toggle-background-image-data-url-disabled": {
+      "key": "{form.toggle.background-image.data-url-disabled}",
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "original": {
+        "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+        "comment": "notice: the 'tick' color is hardcoded here!",
+        "key": "{form.toggle.background-image.data-url-disabled}"
+      },
+      "name": "token-form-toggle-background-image-data-url-disabled",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "background-image",
+        "data-url-disabled"
+      ]
+    },
+    "token-form-toggle-transition-duration": {
+      "key": "{form.toggle.transition.duration}",
+      "$type": "duration",
+      "$value": "0.2s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.2",
+        "unit": "s",
+        "key": "{form.toggle.transition.duration}"
+      },
+      "name": "token-form-toggle-transition-duration",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-form-toggle-transition-timing-function": {
+      "key": "{form.toggle.transition.timing-function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.68,
+          -0.2,
+          0.265,
+          1.15
+        ],
+        "key": "{form.toggle.transition.timing-function}"
+      },
+      "name": "token-form-toggle-transition-timing-function",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "transition",
+        "timing-function"
+      ]
+    },
+    "token-form-toggle-thumb-size": {
+      "key": "{form.toggle.thumb-size}",
+      "$type": "dimension",
+      "$value": "16px",
+      "original": {
+        "$type": "dimension",
+        "$value": "{form.toggle.height}",
+        "key": "{form.toggle.thumb-size}"
+      },
+      "name": "token-form-toggle-thumb-size",
+      "attributes": {
+        "category": "form"
+      },
+      "path": [
+        "form",
+        "toggle",
+        "thumb-size"
+      ]
+    },
+    "token-pagination-nav-control-height": {
+      "key": "{pagination.nav.control.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{pagination.nav.control.height}"
+      },
+      "name": "token-pagination-nav-control-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "height"
+      ]
+    },
+    "token-pagination-nav-control-padding-horizontal": {
+      "key": "{pagination.nav.control.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{pagination.nav.control.padding.horizontal}"
+      },
+      "name": "token-pagination-nav-control-padding-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-pagination-nav-control-focus-inset": {
+      "key": "{pagination.nav.control.focus-inset}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{pagination.nav.control.focus-inset}"
+      },
+      "name": "token-pagination-nav-control-focus-inset",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "focus-inset"
+      ]
+    },
+    "token-pagination-nav-control-icon-spacing": {
+      "key": "{pagination.nav.control.icon-spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.control.icon-spacing}"
+      },
+      "name": "token-pagination-nav-control-icon-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "control",
+        "icon-spacing"
+      ]
+    },
+    "token-pagination-nav-indicator-height": {
+      "key": "{pagination.nav.indicator.height}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.height}"
+      },
+      "name": "token-pagination-nav-indicator-height",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-pagination-nav-indicator-spacing": {
+      "key": "{pagination.nav.indicator.spacing}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{pagination.nav.indicator.spacing}"
+      },
+      "name": "token-pagination-nav-indicator-spacing",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "nav",
+        "indicator",
+        "spacing"
+      ]
+    },
+    "token-pagination-child-spacing-vertical": {
+      "key": "{pagination.child.spacing.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{pagination.child.spacing.vertical}"
+      },
+      "name": "token-pagination-child-spacing-vertical",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "vertical"
+      ]
+    },
+    "token-pagination-child-spacing-horizontal": {
+      "key": "{pagination.child.spacing.horizontal}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{pagination.child.spacing.horizontal}"
+      },
+      "name": "token-pagination-child-spacing-horizontal",
+      "attributes": {
+        "category": "pagination"
+      },
+      "path": [
+        "pagination",
+        "child",
+        "spacing",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-border-width": {
+      "key": "{side-nav.wrapper.border.width}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{side-nav.wrapper.border.width}"
+      },
+      "name": "token-side-nav-wrapper-border-width",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "width"
+      ]
+    },
+    "token-side-nav-wrapper-border-color": {
+      "key": "{side-nav.wrapper.border.color}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "components",
+        "key": "{side-nav.wrapper.border.color}"
+      },
+      "name": "token-side-nav-wrapper-border-color",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "border",
+        "color"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal": {
+      "key": "{side-nav.wrapper.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical": {
+      "key": "{side-nav.wrapper.padding.vertical}",
+      "$type": "dimension",
+      "$value": "16px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "16",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-wrapper-padding-horizontal-minimized": {
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "horizontal-minimized"
+      ]
+    },
+    "token-side-nav-wrapper-padding-vertical-minimized": {
+      "key": "{side-nav.wrapper.padding.vertical-minimized}",
+      "$type": "dimension",
+      "$value": "22px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "22",
+        "unit": "px",
+        "key": "{side-nav.wrapper.padding.vertical-minimized}"
+      },
+      "name": "token-side-nav-wrapper-padding-vertical-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "wrapper",
+        "padding",
+        "vertical-minimized"
+      ]
+    },
+    "token-side-nav-toggle-button-border-radius": {
+      "key": "{side-nav.toggle-button.border.radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.toggle-button.border.radius}"
+      },
+      "name": "token-side-nav-toggle-button-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "toggle-button",
+        "border",
+        "radius"
+      ]
+    },
+    "token-side-nav-header-home-link-padding": {
+      "key": "{side-nav.header.home-link.padding}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.padding}"
+      },
+      "name": "token-side-nav-header-home-link-padding",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "padding"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size": {
+      "key": "{side-nav.header.home-link.logo-size}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size"
+      ]
+    },
+    "token-side-nav-header-home-link-logo-size-minimized": {
+      "key": "{side-nav.header.home-link.logo-size-minimized}",
+      "$type": "dimension",
+      "$value": "32px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "32",
+        "unit": "px",
+        "key": "{side-nav.header.home-link.logo-size-minimized}"
+      },
+      "name": "token-side-nav-header-home-link-logo-size-minimized",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "home-link",
+        "logo-size-minimized"
+      ]
+    },
+    "token-side-nav-header-actions-spacing": {
+      "key": "{side-nav.header.actions.spacing}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.header.actions.spacing}"
+      },
+      "name": "token-side-nav-header-actions-spacing",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "header",
+        "actions",
+        "spacing"
+      ]
+    },
+    "token-side-nav-body-list-margin-vertical": {
+      "key": "{side-nav.body.list.margin-vertical}",
+      "$type": "dimension",
+      "$value": "24px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "24",
+        "unit": "px",
+        "key": "{side-nav.body.list.margin-vertical}"
+      },
+      "name": "token-side-nav-body-list-margin-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list",
+        "margin-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-height": {
+      "key": "{side-nav.body.list-item.height}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.height}"
+      },
+      "name": "token-side-nav-body-list-item-height",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "height"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-horizontal": {
+      "key": "{side-nav.body.list-item.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-padding-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-padding-vertical": {
+      "key": "{side-nav.body.list-item.padding.vertical}",
+      "$type": "dimension",
+      "$value": "4px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "4",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.padding.vertical}"
+      },
+      "name": "token-side-nav-body-list-item-padding-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-spacing-vertical": {
+      "key": "{side-nav.body.list-item.spacing-vertical}",
+      "$type": "dimension",
+      "$value": "2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "2",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.spacing-vertical}"
+      },
+      "name": "token-side-nav-body-list-item-spacing-vertical",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "spacing-vertical"
+      ]
+    },
+    "token-side-nav-body-list-item-content-spacing-horizontal": {
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+      },
+      "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "content-spacing-horizontal"
+      ]
+    },
+    "token-side-nav-body-list-item-border-radius": {
+      "key": "{side-nav.body.list-item.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{side-nav.body.list-item.border-radius}"
+      },
+      "name": "token-side-nav-body-list-item-border-radius",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "body",
+        "list-item",
+        "border-radius"
+      ]
+    },
+    "token-side-nav-color-foreground-primary": {
+      "key": "{side-nav.color.foreground.primary}",
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#dedfe3",
+        "group": "components",
+        "key": "{side-nav.color.foreground.primary}"
+      },
+      "name": "token-side-nav-color-foreground-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-foreground-strong": {
+      "key": "{side-nav.color.foreground.strong}",
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#fff",
+        "group": "components",
+        "key": "{side-nav.color.foreground.strong}"
+      },
+      "name": "token-side-nav-color-foreground-strong",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "strong"
+      ]
+    },
+    "token-side-nav-color-foreground-faint": {
+      "key": "{side-nav.color.foreground.faint}",
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#8c909c",
+        "group": "components",
+        "key": "{side-nav.color.foreground.faint}"
+      },
+      "name": "token-side-nav-color-foreground-faint",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "foreground",
+        "faint"
+      ]
+    },
+    "token-side-nav-color-surface-primary": {
+      "key": "{side-nav.color.surface.primary}",
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "#0c0c0e",
+        "group": "components",
+        "key": "{side-nav.color.surface.primary}"
+      },
+      "name": "token-side-nav-color-surface-primary",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-hover": {
+      "key": "{side-nav.color.surface.interactive-hover}",
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#3b3d45",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-hover}"
+      },
+      "name": "token-side-nav-color-surface-interactive-hover",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-hover"
+      ]
+    },
+    "token-side-nav-color-surface-interactive-active": {
+      "key": "{side-nav.color.surface.interactive-active}",
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "original": {
+        "$type": "color",
+        "$value": "#656a76",
+        "group": "semantic",
+        "key": "{side-nav.color.surface.interactive-active}"
+      },
+      "name": "token-side-nav-color-surface-interactive-active",
+      "attributes": {
+        "category": "side-nav"
+      },
+      "path": [
+        "side-nav",
+        "color",
+        "surface",
+        "interactive-active"
+      ]
+    },
+    "token-tabs-tab-height-medium": {
+      "key": "{tabs.tab.height.medium}",
+      "$type": "dimension",
+      "$value": "36px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "36",
+        "unit": "px",
+        "key": "{tabs.tab.height.medium}"
+      },
+      "name": "token-tabs-tab-height-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-height-large": {
+      "key": "{tabs.tab.height.large}",
+      "$type": "dimension",
+      "$value": "48px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "48",
+        "unit": "px",
+        "key": "{tabs.tab.height.large}"
+      },
+      "name": "token-tabs-tab-height-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "height",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-medium": {
+      "key": "{tabs.tab.padding.horizontal.medium}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.medium}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-medium",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "medium"
+      ]
+    },
+    "token-tabs-tab-padding-horizontal-large": {
+      "key": "{tabs.tab.padding.horizontal.large}",
+      "$type": "dimension",
+      "$value": "20px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "20",
+        "unit": "px",
+        "key": "{tabs.tab.padding.horizontal.large}"
+      },
+      "name": "token-tabs-tab-padding-horizontal-large",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "horizontal",
+        "large"
+      ]
+    },
+    "token-tabs-tab-padding-vertical": {
+      "key": "{tabs.tab.padding.vertical}",
+      "$type": "dimension",
+      "$value": "0px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "0",
+        "unit": "px",
+        "key": "{tabs.tab.padding.vertical}"
+      },
+      "name": "token-tabs-tab-padding-vertical",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tabs-tab-border-radius": {
+      "key": "{tabs.tab.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tabs.tab.border-radius}"
+      },
+      "name": "token-tabs-tab-border-radius",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "border-radius"
+      ]
+    },
+    "token-tabs-tab-focus-inset": {
+      "key": "{tabs.tab.focus-inset}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.focus-inset}"
+      },
+      "name": "token-tabs-tab-focus-inset",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "focus-inset"
+      ]
+    },
+    "token-tabs-tab-gutter": {
+      "key": "{tabs.tab.gutter}",
+      "$type": "dimension",
+      "$value": "6px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "6",
+        "unit": "px",
+        "key": "{tabs.tab.gutter}"
+      },
+      "name": "token-tabs-tab-gutter",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "tab",
+        "gutter"
+      ]
+    },
+    "token-tabs-indicator-height": {
+      "key": "{tabs.indicator.height}",
+      "$type": "dimension",
+      "$value": "3px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "3",
+        "unit": "px",
+        "key": "{tabs.indicator.height}"
+      },
+      "name": "token-tabs-indicator-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "height"
+      ]
+    },
+    "token-tabs-indicator-transition-function": {
+      "key": "{tabs.indicator.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.5,
+          1,
+          0.89,
+          1
+        ],
+        "key": "{tabs.indicator.transition.function}"
+      },
+      "name": "token-tabs-indicator-transition-function",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "function"
+      ]
+    },
+    "token-tabs-indicator-transition-duration": {
+      "key": "{tabs.indicator.transition.duration}",
+      "$type": "duration",
+      "$value": "0.6s",
+      "unit": "s",
+      "original": {
+        "$type": "duration",
+        "$value": "0.6",
+        "unit": "s",
+        "key": "{tabs.indicator.transition.duration}"
+      },
+      "name": "token-tabs-indicator-transition-duration",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "indicator",
+        "transition",
+        "duration"
+      ]
+    },
+    "token-tabs-divider-height": {
+      "key": "{tabs.divider.height}",
+      "$type": "dimension",
+      "$value": "1px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "1",
+        "unit": "px",
+        "key": "{tabs.divider.height}"
+      },
+      "name": "token-tabs-divider-height",
+      "attributes": {
+        "category": "tabs"
+      },
+      "path": [
+        "tabs",
+        "divider",
+        "height"
+      ]
+    },
+    "token-tooltip-border-radius": {
+      "key": "{tooltip.border-radius}",
+      "$type": "dimension",
+      "$value": "5px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "5",
+        "unit": "px",
+        "key": "{tooltip.border-radius}"
+      },
+      "name": "token-tooltip-border-radius",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "border-radius"
+      ]
+    },
+    "token-tooltip-color-foreground-primary": {
+      "key": "{tooltip.color.foreground.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-foreground-high-contrast)",
+        "group": "components",
+        "key": "{tooltip.color.foreground.primary}"
+      },
+      "name": "token-tooltip-color-foreground-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "foreground",
+        "primary"
+      ]
+    },
+    "token-tooltip-color-surface-primary": {
+      "key": "{tooltip.color.surface.primary}",
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "original": {
+        "$type": "color",
+        "$value": "var(--token-color-palette-neutral-700)",
+        "group": "components",
+        "key": "{tooltip.color.surface.primary}"
+      },
+      "name": "token-tooltip-color-surface-primary",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "color",
+        "surface",
+        "primary"
+      ]
+    },
+    "token-tooltip-focus-offset": {
+      "key": "{tooltip.focus-offset}",
+      "$type": "dimension",
+      "$value": "-2px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "-2",
+        "unit": "px",
+        "key": "{tooltip.focus-offset}"
+      },
+      "name": "token-tooltip-focus-offset",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "focus-offset"
+      ]
+    },
+    "token-tooltip-max-width": {
+      "key": "{tooltip.max-width}",
+      "$type": "dimension",
+      "$value": "280px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "280",
+        "unit": "px",
+        "key": "{tooltip.max-width}"
+      },
+      "name": "token-tooltip-max-width",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "max-width"
+      ]
+    },
+    "token-tooltip-padding-horizontal": {
+      "key": "{tooltip.padding.horizontal}",
+      "$type": "dimension",
+      "$value": "12px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "12",
+        "unit": "px",
+        "key": "{tooltip.padding.horizontal}"
+      },
+      "name": "token-tooltip-padding-horizontal",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "horizontal"
+      ]
+    },
+    "token-tooltip-padding-vertical": {
+      "key": "{tooltip.padding.vertical}",
+      "$type": "dimension",
+      "$value": "8px",
+      "unit": "px",
+      "original": {
+        "$type": "dimension",
+        "$value": "8",
+        "unit": "px",
+        "key": "{tooltip.padding.vertical}"
+      },
+      "name": "token-tooltip-padding-vertical",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "padding",
+        "vertical"
+      ]
+    },
+    "token-tooltip-transition-function": {
+      "key": "{tooltip.transition.function}",
+      "$type": "cubicBezier",
+      "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+      "original": {
+        "$type": "cubicBezier",
+        "$value": [
+          0.54,
+          1.5,
+          0.38,
+          1.11
+        ],
+        "key": "{tooltip.transition.function}"
+      },
+      "name": "token-tooltip-transition-function",
+      "attributes": {
+        "category": "tooltip"
+      },
+      "path": [
+        "tooltip",
+        "transition",
+        "function"
+      ]
+    },
+    "token-typography-font-stack-display": {
+      "key": "{typography.font-stack.display}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.display.macOS}",
+          "{typography.font-stack.sans.display.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.display.emoji}"
+        ],
+        "key": "{typography.font-stack.display}"
+      },
+      "name": "token-typography-font-stack-display",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "display"
+      ]
+    },
+    "token-typography-font-stack-text": {
+      "key": "{typography.font-stack.text}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.sans.text.macOS}",
+          "{typography.font-stack.sans.text.windows}",
+          "{typography.font-stack.sans.display.sans}",
+          "{typography.font-stack.sans.text.emoji}"
+        ],
+        "key": "{typography.font-stack.text}"
+      },
+      "name": "token-typography-font-stack-text",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "text"
+      ]
+    },
+    "token-typography-font-stack-code": {
+      "key": "{typography.font-stack.code}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": [
+          "{typography.font-stack.monospace.code.macOS}",
+          "{typography.font-stack.monospace.code.windows}",
+          "monospace"
+        ],
+        "key": "{typography.font-stack.code}"
+      },
+      "name": "token-typography-font-stack-code",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-stack",
+        "code"
+      ]
+    },
+    "token-typography-font-weight-regular": {
+      "key": "{typography.font-weight.regular}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "400",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "400",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.regular}"
+      },
+      "name": "token-typography-font-weight-regular",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "regular"
+      ]
+    },
+    "token-typography-font-weight-medium": {
+      "key": "{typography.font-weight.medium}",
+      "$type": "font-weight",
+      "$value": 400,
+      "$modes": {
+        "default": "500",
+        "cds-g0": 400,
+        "cds-g10": 400,
+        "cds-g90": 400,
+        "cds-g100": 400
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.regular}",
+        "$modes": {
+          "default": "500",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        },
+        "key": "{typography.font-weight.medium}"
+      },
+      "name": "token-typography-font-weight-medium",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "medium"
+      ]
+    },
+    "token-typography-font-weight-semibold": {
+      "key": "{typography.font-weight.semibold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "600",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "600",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.semibold}"
+      },
+      "name": "token-typography-font-weight-semibold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "semibold"
+      ]
+    },
+    "token-typography-font-weight-bold": {
+      "key": "{typography.font-weight.bold}",
+      "$type": "font-weight",
+      "$value": 600,
+      "$modes": {
+        "default": "700",
+        "cds-g0": 600,
+        "cds-g10": 600,
+        "cds-g90": 600,
+        "cds-g100": 600
+      },
+      "original": {
+        "$type": "font-weight",
+        "$value": "{carbon.typography.font-weight.semibold}",
+        "$modes": {
+          "default": "700",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        },
+        "key": "{typography.font-weight.bold}"
+      },
+      "name": "token-typography-font-weight-bold",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "font-weight",
+        "bold"
+      ]
+    },
+    "token-typography-display-500-font-family": {
+      "key": "{typography.display-500.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-500.font-family}"
+      },
+      "name": "token-typography-display-500-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-family"
+      ]
+    },
+    "token-typography-display-500-font-size": {
+      "key": "{typography.display-500.font-size}",
+      "$type": "font-size",
+      "$value": "1.875rem",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "30",
+        "unit": "px",
+        "comment": "30px/1.875rem",
+        "key": "{typography.display-500.font-size}"
+      },
+      "name": "token-typography-display-500-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "font-size"
+      ]
+    },
+    "token-typography-display-500-line-height": {
+      "key": "{typography.display-500.line-height}",
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "original": {
+        "$type": "number",
+        "$value": 1.2666,
+        "comment": "38px",
+        "key": "{typography.display-500.line-height}"
+      },
+      "name": "token-typography-display-500-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-500",
+        "line-height"
+      ]
+    },
+    "token-typography-display-400-font-family": {
+      "key": "{typography.display-400.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-400.font-family}"
+      },
+      "name": "token-typography-display-400-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-family"
+      ]
+    },
+    "token-typography-display-400-font-size": {
+      "key": "{typography.display-400.font-size}",
+      "$type": "font-size",
+      "$value": "1.5rem",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "24",
+        "unit": "px",
+        "comment": "24px/1.5rem",
+        "key": "{typography.display-400.font-size}"
+      },
+      "name": "token-typography-display-400-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "font-size"
+      ]
+    },
+    "token-typography-display-400-line-height": {
+      "key": "{typography.display-400.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "32px",
+        "key": "{typography.display-400.line-height}"
+      },
+      "name": "token-typography-display-400-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-400",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-font-family": {
+      "key": "{typography.display-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-300.font-family}"
+      },
+      "name": "token-typography-display-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-family"
+      ]
+    },
+    "token-typography-display-300-font-size": {
+      "key": "{typography.display-300.font-size}",
+      "$type": "font-size",
+      "$value": "1.125rem",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "18",
+        "unit": "px",
+        "comment": "18px/1.125rem",
+        "key": "{typography.display-300.font-size}"
+      },
+      "name": "token-typography-display-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "font-size"
+      ]
+    },
+    "token-typography-display-300-line-height": {
+      "key": "{typography.display-300.line-height}",
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3333,
+        "comment": "24px",
+        "key": "{typography.display-300.line-height}"
+      },
+      "name": "token-typography-display-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "line-height"
+      ]
+    },
+    "token-typography-display-300-letter-spacing": {
+      "key": "{typography.display-300.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-300.letter-spacing}"
+      },
+      "name": "token-typography-display-300-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-300",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-200-font-family": {
+      "key": "{typography.display-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.display}",
+        "key": "{typography.display-200.font-family}"
+      },
+      "name": "token-typography-display-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-family"
+      ]
+    },
+    "token-typography-display-200-font-size": {
+      "key": "{typography.display-200.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.display-200.font-size}"
+      },
+      "name": "token-typography-display-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "font-size"
+      ]
+    },
+    "token-typography-display-200-line-height": {
+      "key": "{typography.display-200.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.display-200.line-height}"
+      },
+      "name": "token-typography-display-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "line-height"
+      ]
+    },
+    "token-typography-display-200-letter-spacing": {
+      "key": "{typography.display-200.letter-spacing}",
+      "$type": "letter-spacing",
+      "$value": "-0.5px",
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "original": {
+        "$type": "letter-spacing",
+        "$value": -0.5,
+        "unit": "px",
+        "comment": "this is `tracking`",
+        "key": "{typography.display-200.letter-spacing}"
+      },
+      "name": "token-typography-display-200-letter-spacing",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-200",
+        "letter-spacing"
+      ]
+    },
+    "token-typography-display-100-font-family": {
+      "key": "{typography.display-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.display-100.font-family}"
+      },
+      "name": "token-typography-display-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-family"
+      ]
+    },
+    "token-typography-display-100-font-size": {
+      "key": "{typography.display-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.display-100.font-size}"
+      },
+      "name": "token-typography-display-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "font-size"
+      ]
+    },
+    "token-typography-display-100-line-height": {
+      "key": "{typography.display-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.display-100.line-height}"
+      },
+      "name": "token-typography-display-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "display-100",
+        "line-height"
+      ]
+    },
+    "token-typography-body-300-font-family": {
+      "key": "{typography.body-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-300.font-family}"
+      },
+      "name": "token-typography-body-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-family"
+      ]
+    },
+    "token-typography-body-300-font-size": {
+      "key": "{typography.body-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.body-300.font-size}"
+      },
+      "name": "token-typography-body-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "font-size"
+      ]
+    },
+    "token-typography-body-300-line-height": {
+      "key": "{typography.body-300.line-height}",
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "original": {
+        "$type": "number",
+        "$value": 1.5,
+        "comment": "24px",
+        "key": "{typography.body-300.line-height}"
+      },
+      "name": "token-typography-body-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-300",
+        "line-height"
+      ]
+    },
+    "token-typography-body-200-font-family": {
+      "key": "{typography.body-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-200.font-family}"
+      },
+      "name": "token-typography-body-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-family"
+      ]
+    },
+    "token-typography-body-200-font-size": {
+      "key": "{typography.body-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.body-200.font-size}"
+      },
+      "name": "token-typography-body-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "font-size"
+      ]
+    },
+    "token-typography-body-200-line-height": {
+      "key": "{typography.body-200.line-height}",
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.4286,
+        "comment": "20px",
+        "key": "{typography.body-200.line-height}"
+      },
+      "name": "token-typography-body-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-200",
+        "line-height"
+      ]
+    },
+    "token-typography-body-100-font-family": {
+      "key": "{typography.body-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.text}",
+        "key": "{typography.body-100.font-family}"
+      },
+      "name": "token-typography-body-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-family"
+      ]
+    },
+    "token-typography-body-100-font-size": {
+      "key": "{typography.body-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.body-100.font-size}"
+      },
+      "name": "token-typography-body-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "font-size"
+      ]
+    },
+    "token-typography-body-100-line-height": {
+      "key": "{typography.body-100.line-height}",
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.3846,
+        "comment": "18px",
+        "key": "{typography.body-100.line-height}"
+      },
+      "name": "token-typography-body-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "body-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-100-font-family": {
+      "key": "{typography.code-100.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-100.font-family}"
+      },
+      "name": "token-typography-code-100-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-family"
+      ]
+    },
+    "token-typography-code-100-font-size": {
+      "key": "{typography.code-100.font-size}",
+      "$type": "font-size",
+      "$value": "0.8125rem",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "13",
+        "unit": "px",
+        "comment": "13px/0.8125rem",
+        "key": "{typography.code-100.font-size}"
+      },
+      "name": "token-typography-code-100-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "font-size"
+      ]
+    },
+    "token-typography-code-100-line-height": {
+      "key": "{typography.code-100.line-height}",
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "original": {
+        "$type": "number",
+        "$value": 1.23,
+        "comment": "16px",
+        "key": "{typography.code-100.line-height}"
+      },
+      "name": "token-typography-code-100-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-100",
+        "line-height"
+      ]
+    },
+    "token-typography-code-200-font-family": {
+      "key": "{typography.code-200.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-200.font-family}"
+      },
+      "name": "token-typography-code-200-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-family"
+      ]
+    },
+    "token-typography-code-200-font-size": {
+      "key": "{typography.code-200.font-size}",
+      "$type": "font-size",
+      "$value": "0.875rem",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "14",
+        "unit": "px",
+        "comment": "14px/0.875rem",
+        "key": "{typography.code-200.font-size}"
+      },
+      "name": "token-typography-code-200-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "font-size"
+      ]
+    },
+    "token-typography-code-200-line-height": {
+      "key": "{typography.code-200.line-height}",
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "original": {
+        "$type": "number",
+        "$value": 1.125,
+        "comment": "18px",
+        "key": "{typography.code-200.line-height}"
+      },
+      "name": "token-typography-code-200-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-200",
+        "line-height"
+      ]
+    },
+    "token-typography-code-300-font-family": {
+      "key": "{typography.code-300.font-family}",
+      "$type": "font-family",
+      "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+      "original": {
+        "$type": "font-family",
+        "$value": "{typography.font-stack.code}",
+        "key": "{typography.code-300.font-family}"
+      },
+      "name": "token-typography-code-300-font-family",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-family"
+      ]
+    },
+    "token-typography-code-300-font-size": {
+      "key": "{typography.code-300.font-size}",
+      "$type": "font-size",
+      "$value": "1rem",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "original": {
+        "$type": "font-size",
+        "$value": "16",
+        "unit": "px",
+        "comment": "16px/1rem",
+        "key": "{typography.code-300.font-size}"
+      },
+      "name": "token-typography-code-300-font-size",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "font-size"
+      ]
+    },
+    "token-typography-code-300-line-height": {
+      "key": "{typography.code-300.line-height}",
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "original": {
+        "$type": "number",
+        "$value": 1.25,
+        "comment": "20px",
+        "key": "{typography.code-300.line-height}"
+      },
+      "name": "token-typography-code-300-line-height",
+      "attributes": {
+        "category": "typography"
+      },
+      "path": [
+        "typography",
+        "code-300",
+        "line-height"
+      ]
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/tokens/dist/docs/products/themed-tokens/cds-g0.json b/packages/tokens/dist/docs/products/themed-tokens/cds-g0.json
new file mode 100644
index 00000000000..b43ef37bfd3
--- /dev/null
+++ b/packages/tokens/dist/docs/products/themed-tokens/cds-g0.json
@@ -0,0 +1,8352 @@
+[
+  {
+    "key": "{border.radius.x-small}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{border.radius.x-small}"
+    },
+    "name": "token-border-radius-x-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "x-small"
+    ]
+  },
+  {
+    "key": "{border.radius.small}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{border.radius.small}"
+    },
+    "name": "token-border-radius-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "small"
+    ]
+  },
+  {
+    "key": "{border.radius.medium}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{border.radius.medium}"
+    },
+    "name": "token-border-radius-medium",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "medium"
+    ]
+  },
+  {
+    "key": "{border.radius.large}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{border.radius.large}"
+    },
+    "name": "token-border-radius-large",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "large"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-500}",
+    "$type": "color",
+    "$value": "#1c345f",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "key": "{color.palette.blue-500}"
+    },
+    "name": "token-color-palette-blue-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-500"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-400}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "key": "{color.palette.blue-400}"
+    },
+    "name": "token-color-palette-blue-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-400"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-300}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "key": "{color.palette.blue-300}"
+    },
+    "name": "token-color-palette-blue-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-300"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-200}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "key": "{color.palette.blue-200}"
+    },
+    "name": "token-color-palette-blue-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-200"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-100}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "key": "{color.palette.blue-100}"
+    },
+    "name": "token-color-palette-blue-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-100"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-50}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "key": "{color.palette.blue-50}"
+    },
+    "name": "token-color-palette-blue-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-50"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-500}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "key": "{color.palette.purple-500}"
+    },
+    "name": "token-color-palette-purple-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-500"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-400}",
+    "$type": "color",
+    "$value": "#7b00db",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "key": "{color.palette.purple-400}"
+    },
+    "name": "token-color-palette-purple-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-400"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-300}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "key": "{color.palette.purple-300}"
+    },
+    "name": "token-color-palette-purple-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-300"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-200}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "key": "{color.palette.purple-200}"
+    },
+    "name": "token-color-palette-purple-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-200"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-100}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "key": "{color.palette.purple-100}"
+    },
+    "name": "token-color-palette-purple-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-100"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-50}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "key": "{color.palette.purple-50}"
+    },
+    "name": "token-color-palette-purple-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-50"
+    ]
+  },
+  {
+    "key": "{color.palette.green-500}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "key": "{color.palette.green-500}"
+    },
+    "name": "token-color-palette-green-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-500"
+    ]
+  },
+  {
+    "key": "{color.palette.green-400}",
+    "$type": "color",
+    "$value": "#006619",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "key": "{color.palette.green-400}"
+    },
+    "name": "token-color-palette-green-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-400"
+    ]
+  },
+  {
+    "key": "{color.palette.green-300}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "key": "{color.palette.green-300}"
+    },
+    "name": "token-color-palette-green-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-300"
+    ]
+  },
+  {
+    "key": "{color.palette.green-200}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "key": "{color.palette.green-200}"
+    },
+    "name": "token-color-palette-green-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-200"
+    ]
+  },
+  {
+    "key": "{color.palette.green-100}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "key": "{color.palette.green-100}"
+    },
+    "name": "token-color-palette-green-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-100"
+    ]
+  },
+  {
+    "key": "{color.palette.green-50}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "key": "{color.palette.green-50}"
+    },
+    "name": "token-color-palette-green-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-50"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-500}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "key": "{color.palette.amber-500}"
+    },
+    "name": "token-color-palette-amber-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-500"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-400}",
+    "$type": "color",
+    "$value": "#803d00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "key": "{color.palette.amber-400}"
+    },
+    "name": "token-color-palette-amber-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-400"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-300}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "key": "{color.palette.amber-300}"
+    },
+    "name": "token-color-palette-amber-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-300"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-200}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "key": "{color.palette.amber-200}"
+    },
+    "name": "token-color-palette-amber-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-200"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-100}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "key": "{color.palette.amber-100}"
+    },
+    "name": "token-color-palette-amber-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-100"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-50}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "key": "{color.palette.amber-50}"
+    },
+    "name": "token-color-palette-amber-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-50"
+    ]
+  },
+  {
+    "key": "{color.palette.red-500}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "key": "{color.palette.red-500}"
+    },
+    "name": "token-color-palette-red-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-500"
+    ]
+  },
+  {
+    "key": "{color.palette.red-400}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "key": "{color.palette.red-400}"
+    },
+    "name": "token-color-palette-red-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-400"
+    ]
+  },
+  {
+    "key": "{color.palette.red-300}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "key": "{color.palette.red-300}"
+    },
+    "name": "token-color-palette-red-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-300"
+    ]
+  },
+  {
+    "key": "{color.palette.red-200}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "key": "{color.palette.red-200}"
+    },
+    "name": "token-color-palette-red-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-200"
+    ]
+  },
+  {
+    "key": "{color.palette.red-100}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "key": "{color.palette.red-100}"
+    },
+    "name": "token-color-palette-red-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-100"
+    ]
+  },
+  {
+    "key": "{color.palette.red-50}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "key": "{color.palette.red-50}"
+    },
+    "name": "token-color-palette-red-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-700}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "key": "{color.palette.neutral-700}"
+    },
+    "name": "token-color-palette-neutral-700",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-700"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-600}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "key": "{color.palette.neutral-600}"
+    },
+    "name": "token-color-palette-neutral-600",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-600"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-500}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "key": "{color.palette.neutral-500}"
+    },
+    "name": "token-color-palette-neutral-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-500"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-400}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "key": "{color.palette.neutral-400}"
+    },
+    "name": "token-color-palette-neutral-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-400"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-300}",
+    "$type": "color",
+    "$value": "#c2c5cb",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "key": "{color.palette.neutral-300}"
+    },
+    "name": "token-color-palette-neutral-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-300"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-200}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "key": "{color.palette.neutral-200}"
+    },
+    "name": "token-color-palette-neutral-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-200"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-100}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "key": "{color.palette.neutral-100}"
+    },
+    "name": "token-color-palette-neutral-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-100"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-50}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "key": "{color.palette.neutral-50}"
+    },
+    "name": "token-color-palette-neutral-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-0}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "palette",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#ffffff",
+      "cds-g10": "#ffffff",
+      "cds-g90": "#ffffff",
+      "cds-g100": "#ffffff"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.color.white.0}",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.color.white.0}",
+        "cds-g10": "{carbon.color.white.0}",
+        "cds-g90": "{carbon.color.white.0}",
+        "cds-g100": "{carbon.color.white.0}"
+      },
+      "key": "{color.palette.neutral-0}"
+    },
+    "name": "token-color-palette-neutral-0",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-0"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-300}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "alpha": "0.4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-600}",
+      "alpha": "0.4",
+      "group": "palette",
+      "key": "{color.palette.alpha-300}"
+    },
+    "name": "token-color-palette-alpha-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-300"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-200}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "alpha": "0.2",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.2",
+      "group": "palette",
+      "key": "{color.palette.alpha-200}"
+    },
+    "name": "token-color-palette-alpha-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-200"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-100}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "alpha": "0.1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.1",
+      "group": "palette",
+      "key": "{color.palette.alpha-100}"
+    },
+    "name": "token-color-palette-alpha-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-100"
+    ]
+  },
+  {
+    "key": "{color.border.primary}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-200}",
+      "group": "semantic",
+      "key": "{color.border.primary}"
+    },
+    "name": "token-color-border-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.border.faint}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-100}",
+      "group": "semantic",
+      "key": "{color.border.faint}"
+    },
+    "name": "token-color-border-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.border.strong}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-300}",
+      "group": "semantic",
+      "key": "{color.border.strong}"
+    },
+    "name": "token-color-border-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.border.action}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-100}",
+      "group": "semantic",
+      "key": "{color.border.action}"
+    },
+    "name": "token-color-border-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.border.highlight}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-100}",
+      "group": "semantic",
+      "key": "{color.border.highlight}"
+    },
+    "name": "token-color-border-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.border.success}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-100}",
+      "group": "semantic",
+      "key": "{color.border.success}"
+    },
+    "name": "token-color-border-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.border.warning}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-100}",
+      "group": "semantic",
+      "key": "{color.border.warning}"
+    },
+    "name": "token-color-border-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.border.critical}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-100}",
+      "group": "semantic",
+      "key": "{color.border.critical}"
+    },
+    "name": "token-color-border-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.focus.action.internal}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.focus.action.internal}"
+    },
+    "name": "token-color-focus-action-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.action.external}",
+    "$type": "color",
+    "$value": "#5990ff",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.action.external}"
+    },
+    "name": "token-color-focus-action-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.internal}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.focus.critical.internal}"
+    },
+    "name": "token-color-focus-critical-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.external}",
+    "$type": "color",
+    "$value": "#dd7578",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.critical.external}"
+    },
+    "name": "token-color-focus-critical-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.foreground.strong}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-700}",
+      "group": "semantic",
+      "key": "{color.foreground.strong}"
+    },
+    "name": "token-color-foreground-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.foreground.primary}",
+    "$type": "color",
+    "$value": "#161616",
+    "group": "semantic",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#161616",
+      "cds-g10": "#161616",
+      "cds-g90": "#f4f4f4",
+      "cds-g100": "#f4f4f4"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.themes.white.textPrimary}",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.themes.white.textPrimary}",
+        "cds-g10": "{carbon.themes.g10.textPrimary}",
+        "cds-g90": "{carbon.themes.g90.textPrimary}",
+        "cds-g100": "{carbon.themes.g100.textPrimary}"
+      },
+      "key": "{color.foreground.primary}"
+    },
+    "name": "token-color-foreground-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.foreground.faint}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "semantic",
+      "key": "{color.foreground.faint}"
+    },
+    "name": "token-color-foreground-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.foreground.high-contrast}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.foreground.high-contrast}"
+    },
+    "name": "token-color-foreground-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.disabled}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "semantic",
+      "key": "{color.foreground.disabled}"
+    },
+    "name": "token-color-foreground-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "disabled"
+    ]
+  },
+  {
+    "key": "{color.foreground.action}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "semantic",
+      "key": "{color.foreground.action}"
+    },
+    "name": "token-color-foreground-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.foreground.action-hover}"
+    },
+    "name": "token-color-foreground-action-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-hover"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-active}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "semantic",
+      "key": "{color.foreground.action-active}"
+    },
+    "name": "token-color-foreground-action-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-active"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-200}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight}"
+    },
+    "name": "token-color-foreground-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-on-surface}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-300}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-on-surface}"
+    },
+    "name": "token-color-foreground-highlight-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-high-contrast}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-500}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-high-contrast}"
+    },
+    "name": "token-color-foreground-highlight-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.success}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-200}",
+      "group": "semantic",
+      "key": "{color.foreground.success}"
+    },
+    "name": "token-color-foreground-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-on-surface}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-300}",
+      "group": "semantic",
+      "key": "{color.foreground.success-on-surface}"
+    },
+    "name": "token-color-foreground-success-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-high-contrast}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-500}",
+      "group": "semantic",
+      "key": "{color.foreground.success-high-contrast}"
+    },
+    "name": "token-color-foreground-success-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-200}",
+      "group": "semantic",
+      "key": "{color.foreground.warning}"
+    },
+    "name": "token-color-foreground-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-on-surface}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-300}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-on-surface}"
+    },
+    "name": "token-color-foreground-warning-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-high-contrast}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-500}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-high-contrast}"
+    },
+    "name": "token-color-foreground-warning-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-200}",
+      "group": "semantic",
+      "key": "{color.foreground.critical}"
+    },
+    "name": "token-color-foreground-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-on-surface}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-on-surface}"
+    },
+    "name": "token-color-foreground-critical-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-high-contrast}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-500}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-high-contrast}"
+    },
+    "name": "token-color-foreground-critical-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.page.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.page.primary}"
+    },
+    "name": "token-color-page-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.page.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.page.faint}"
+    },
+    "name": "token-color-page-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.primary}"
+    },
+    "name": "token-color-surface-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.surface.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.faint}"
+    },
+    "name": "token-color-surface-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.strong}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.strong}"
+    },
+    "name": "token-color-surface-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.interactive}"
+    },
+    "name": "token-color-surface-interactive",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-hover}"
+    },
+    "name": "token-color-surface-interactive-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-200}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-active}"
+    },
+    "name": "token-color-surface-interactive-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-disabled}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-disabled}"
+    },
+    "name": "token-color-surface-interactive-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-disabled"
+    ]
+  },
+  {
+    "key": "{color.surface.action}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-50}",
+      "group": "semantic",
+      "key": "{color.surface.action}"
+    },
+    "name": "token-color-surface-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.surface.highlight}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-50}",
+      "group": "semantic",
+      "key": "{color.surface.highlight}"
+    },
+    "name": "token-color-surface-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.surface.success}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-50}",
+      "group": "semantic",
+      "key": "{color.surface.success}"
+    },
+    "name": "token-color-surface-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.surface.warning}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-50}",
+      "group": "semantic",
+      "key": "{color.surface.warning}"
+    },
+    "name": "token-color-surface-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.surface.critical}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-50}",
+      "group": "semantic",
+      "key": "{color.surface.critical}"
+    },
+    "name": "token-color-surface-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.hashicorp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hashicorp-brand}",
+      "group": "branding",
+      "key": "{color.hashicorp.brand}"
+    },
+    "name": "token-color-hashicorp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hashicorp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.brand}",
+    "$type": "color",
+    "$value": "#f24c53",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-brand}",
+      "group": "branding",
+      "key": "{color.boundary.brand}"
+    },
+    "name": "token-color-boundary-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.foreground}",
+    "$type": "color",
+    "$value": "#cf2d32",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-500}",
+      "group": "branding",
+      "key": "{color.boundary.foreground}"
+    },
+    "name": "token-color-boundary-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.boundary.surface}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.surface}"
+    },
+    "name": "token-color-boundary-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.boundary.border}",
+    "$type": "color",
+    "$value": "#fbd7d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-100}",
+      "group": "branding",
+      "key": "{color.boundary.border}"
+    },
+    "name": "token-color-boundary-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#f97076",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-300}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.start}"
+    },
+    "name": "token-color-boundary-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#db363b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-400}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.stop}"
+    },
+    "name": "token-color-boundary-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffafa",
+    "group": "branding",
+    "comment": "this is the 'boundary-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "key": "{color.boundary.gradient.faint.start}"
+    },
+    "name": "token-color-boundary-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.faint.stop}"
+    },
+    "name": "token-color-boundary-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.brand}",
+    "$type": "color",
+    "$value": "#e03875",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-brand}",
+      "group": "branding",
+      "key": "{color.consul.brand}"
+    },
+    "name": "token-color-consul-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.consul.foreground}",
+    "$type": "color",
+    "$value": "#d01c5b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-500}",
+      "group": "branding",
+      "key": "{color.consul.foreground}"
+    },
+    "name": "token-color-consul-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.consul.surface}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.surface}"
+    },
+    "name": "token-color-consul-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.consul.border}",
+    "$type": "color",
+    "$value": "#ffcede",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-100}",
+      "group": "branding",
+      "key": "{color.consul.border}"
+    },
+    "name": "token-color-consul-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#ff99be",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-300}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.start}"
+    },
+    "name": "token-color-consul-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#da306e",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-400}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.stop}"
+    },
+    "name": "token-color-consul-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fff9fb",
+    "group": "branding",
+    "comment": "this is the 'consul-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "key": "{color.consul.gradient.faint.start}"
+    },
+    "name": "token-color-consul-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.gradient.faint.stop}"
+    },
+    "name": "token-color-consul-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.hcp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hcp-brand}",
+      "group": "branding",
+      "key": "{color.hcp.brand}"
+    },
+    "name": "token-color-hcp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hcp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.brand}",
+    "$type": "color",
+    "$value": "#06d092",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-brand}",
+      "group": "branding",
+      "key": "{color.nomad.brand}"
+    },
+    "name": "token-color-nomad-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.foreground}",
+    "$type": "color",
+    "$value": "#008661",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-500}",
+      "group": "branding",
+      "key": "{color.nomad.foreground}"
+    },
+    "name": "token-color-nomad-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.nomad.surface}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.surface}"
+    },
+    "name": "token-color-nomad-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.nomad.border}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.border}"
+    },
+    "name": "token-color-nomad-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.start}"
+    },
+    "name": "token-color-nomad-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#60dea9",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-200}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.stop}"
+    },
+    "name": "token-color-nomad-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fff9",
+    "group": "branding",
+    "comment": "this is the 'nomad-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "key": "{color.nomad.gradient.faint.start}"
+    },
+    "name": "token-color-nomad-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.faint.stop}"
+    },
+    "name": "token-color-nomad-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.brand}",
+    "$type": "color",
+    "$value": "#02a8ef",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-brand}",
+      "group": "branding",
+      "key": "{color.packer.brand}"
+    },
+    "name": "token-color-packer-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.packer.foreground}",
+    "$type": "color",
+    "$value": "#007eb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-500}",
+      "group": "branding",
+      "key": "{color.packer.foreground}"
+    },
+    "name": "token-color-packer-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.packer.surface}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.surface}"
+    },
+    "name": "token-color-packer-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.packer.border}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.border}"
+    },
+    "name": "token-color-packer-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.start}"
+    },
+    "name": "token-color-packer-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#63d0ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-200}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.stop}"
+    },
+    "name": "token-color-packer-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fcff",
+    "group": "branding",
+    "comment": "this is the 'packer-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#F3FCFF",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "key": "{color.packer.gradient.faint.start}"
+    },
+    "name": "token-color-packer-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.gradient.faint.stop}"
+    },
+    "name": "token-color-packer-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand}",
+    "$type": "color",
+    "$value": "#7b42bc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-brand}",
+      "group": "branding",
+      "key": "{color.terraform.brand}"
+    },
+    "name": "token-color-terraform-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand-on-dark}",
+    "$type": "color",
+    "$value": "#a067da",
+    "group": "branding",
+    "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+    "original": {
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "key": "{color.terraform.brand-on-dark}"
+    },
+    "name": "token-color-terraform-brand-on-dark",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand-on-dark"
+    ]
+  },
+  {
+    "key": "{color.terraform.foreground}",
+    "$type": "color",
+    "$value": "#773cb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-500}",
+      "group": "branding",
+      "key": "{color.terraform.foreground}"
+    },
+    "name": "token-color-terraform-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.terraform.surface}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.surface}"
+    },
+    "name": "token-color-terraform-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.terraform.border}",
+    "$type": "color",
+    "$value": "#ebdbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-100}",
+      "group": "branding",
+      "key": "{color.terraform.border}"
+    },
+    "name": "token-color-terraform-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bb8deb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-300}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.start}"
+    },
+    "name": "token-color-terraform-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#844fba",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-400}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.stop}"
+    },
+    "name": "token-color-terraform-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fcfaff",
+    "group": "branding",
+    "comment": "this is the 'terraform-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "key": "{color.terraform.gradient.faint.start}"
+    },
+    "name": "token-color-terraform-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.faint.stop}"
+    },
+    "name": "token-color-terraform-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.brand}",
+    "$type": "color",
+    "$value": "#1868f2",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-brand}",
+      "group": "branding",
+      "key": "{color.vagrant.brand}"
+    },
+    "name": "token-color-vagrant-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vagrant.foreground}",
+    "$type": "color",
+    "$value": "#1c61d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-500}",
+      "group": "branding",
+      "key": "{color.vagrant.foreground}"
+    },
+    "name": "token-color-vagrant-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vagrant.surface}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.surface}"
+    },
+    "name": "token-color-vagrant-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vagrant.border}",
+    "$type": "color",
+    "$value": "#c7dbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-100}",
+      "group": "branding",
+      "key": "{color.vagrant.border}"
+    },
+    "name": "token-color-vagrant-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#639cff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-300}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.start}"
+    },
+    "name": "token-color-vagrant-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#2e71e5",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-400}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.stop}"
+    },
+    "name": "token-color-vagrant-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f4faff",
+    "group": "branding",
+    "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "key": "{color.vagrant.gradient.faint.start}"
+    },
+    "name": "token-color-vagrant-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.faint.stop}"
+    },
+    "name": "token-color-vagrant-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-brand}",
+      "group": "branding",
+      "key": "{color.vault-radar.brand}"
+    },
+    "name": "token-color-vault-radar-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "key": "{color.vault-radar.brand-alt}"
+    },
+    "name": "token-color-vault-radar-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-500}",
+      "group": "branding",
+      "key": "{color.vault-radar.foreground}"
+    },
+    "name": "token-color-vault-radar-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.surface}"
+    },
+    "name": "token-color-vault-radar-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.border}"
+    },
+    "name": "token-color-vault-radar-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.start}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-200}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "key": "{color.vault-radar.gradient.faint.start}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-brand}",
+      "group": "branding",
+      "key": "{color.vault-secrets.brand}"
+    },
+    "name": "token-color-vault-secrets-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand-alt}",
+    "group": "branding",
+    "$type": "color",
+    "$value": "#000000",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+    "original": {
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "key": "{color.vault-secrets.brand-alt}"
+    },
+    "name": "token-color-vault-secrets-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-500}",
+      "group": "branding",
+      "key": "{color.vault-secrets.foreground}"
+    },
+    "name": "token-color-vault-secrets-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.surface}"
+    },
+    "name": "token-color-vault-secrets-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.border}"
+    },
+    "name": "token-color-vault-secrets-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-200}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "key": "{color.vault-secrets.gradient.faint.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-brand}",
+      "group": "branding",
+      "key": "{color.vault.brand}"
+    },
+    "name": "token-color-vault-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "key": "{color.vault.brand-alt}"
+    },
+    "name": "token-color-vault-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-500}",
+      "group": "branding",
+      "key": "{color.vault.foreground}"
+    },
+    "name": "token-color-vault-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.surface}"
+    },
+    "name": "token-color-vault-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.border}"
+    },
+    "name": "token-color-vault-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.start}"
+    },
+    "name": "token-color-vault-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-200}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "key": "{color.vault.gradient.faint.start}"
+    },
+    "name": "token-color-vault-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.brand}",
+    "$type": "color",
+    "$value": "#14c6cb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-brand}",
+      "group": "branding",
+      "key": "{color.waypoint.brand}"
+    },
+    "name": "token-color-waypoint-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.waypoint.foreground}",
+    "$type": "color",
+    "$value": "#008196",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-500}",
+      "group": "branding",
+      "key": "{color.waypoint.foreground}"
+    },
+    "name": "token-color-waypoint-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.waypoint.surface}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.surface}"
+    },
+    "name": "token-color-waypoint-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.waypoint.border}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.border}"
+    },
+    "name": "token-color-waypoint-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.start}"
+    },
+    "name": "token-color-waypoint-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#62d4dc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-200}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.stop}"
+    },
+    "name": "token-color-waypoint-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f6feff",
+    "group": "branding",
+    "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "key": "{color.waypoint.gradient.faint.start}"
+    },
+    "name": "token-color-waypoint-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.faint.stop}"
+    },
+    "name": "token-color-waypoint-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{elevation.inset.box-shadow}",
+    "$value": "inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-01}",
+      "key": "{elevation.inset.box-shadow}"
+    },
+    "name": "token-elevation-inset-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.low.box-shadow}",
+    "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+      "key": "{elevation.low.box-shadow}"
+    },
+    "name": "token-elevation-low-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.mid.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+      "key": "{elevation.mid.box-shadow}"
+    },
+    "name": "token-elevation-mid-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.high.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+      "key": "{elevation.high.box-shadow}"
+    },
+    "name": "token-elevation-high-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.higher.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+      "key": "{elevation.higher.box-shadow}"
+    },
+    "name": "token-elevation-higher-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.overlay.box-shadow}",
+    "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+      "key": "{elevation.overlay.box-shadow}"
+    },
+    "name": "token-elevation-overlay-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.inset.box-shadow}",
+    "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+      "key": "{surface.inset.box-shadow}"
+    },
+    "name": "token-surface-inset-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.base.box-shadow}",
+    "$value": "0 0 0 1px #656a7633",
+    "original": {
+      "$value": "{elevation.base.box-shadow-border}",
+      "key": "{surface.base.box-shadow}"
+    },
+    "name": "token-surface-base-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "base",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.low.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+      "key": "{surface.low.box-shadow}"
+    },
+    "name": "token-surface-low-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.mid.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+      "key": "{surface.mid.box-shadow}"
+    },
+    "name": "token-surface-mid-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.high.box-shadow}",
+    "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+      "key": "{surface.high.box-shadow}"
+    },
+    "name": "token-surface-high-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.higher.box-shadow}",
+    "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+      "key": "{surface.higher.box-shadow}"
+    },
+    "name": "token-surface-higher-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.overlay.box-shadow}",
+    "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+      "key": "{surface.overlay.box-shadow}"
+    },
+    "name": "token-surface-overlay-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.action.box-shadow}",
+    "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+    "original": {
+      "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+      "key": "{focus-ring.action.box-shadow}"
+    },
+    "name": "token-focus-ring-action-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "action",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.critical.box-shadow}",
+    "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+    "original": {
+      "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+      "key": "{focus-ring.critical.box-shadow}"
+    },
+    "name": "token-focus-ring-critical-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "critical",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{app-header.height}",
+    "$type": "dimension",
+    "$value": "60px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "60",
+      "unit": "px",
+      "key": "{app-header.height}"
+    },
+    "name": "token-app-header-height",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-header.home-link.size}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-header.home-link.size}"
+    },
+    "name": "token-app-header-home-link-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "home-link",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-header.logo.size}",
+    "$type": "dimension",
+    "$value": "28px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "28",
+      "unit": "px",
+      "key": "{app-header.logo.size}"
+    },
+    "name": "token-app-header-logo-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "logo",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.border.width}"
+    },
+    "name": "token-app-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-200)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "key": "{app-side-nav.wrapper.border.color}"
+    },
+    "name": "token-app-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-app-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.padding}"
+    },
+    "name": "token-app-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.header.actions.spacing}"
+    },
+    "name": "token-app-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{app-side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.height}"
+    },
+    "name": "token-app-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-app-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.primary}"
+    },
+    "name": "token-app-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.strong}"
+    },
+    "name": "token-app-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.faint}"
+    },
+    "name": "token-app-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.surface.primary}"
+    },
+    "name": "token-app-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-interactive-hover)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-300)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{form.label.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.label.color}"
+    },
+    "name": "token-form-label-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "label",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.legend.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{form.label.color}",
+      "group": "components",
+      "key": "{form.legend.color}"
+    },
+    "name": "token-form-legend-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "legend",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.helper-text.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.helper-text.color}"
+    },
+    "name": "token-form-helper-text-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "helper-text",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.indicator.optional.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.indicator.optional.color}"
+    },
+    "name": "token-form-indicator-optional-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "indicator",
+      "optional",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.color}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.error.color}"
+    },
+    "name": "token-form-error-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.icon-size}",
+    "$type": "dimension",
+    "$value": "14px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "14",
+      "unit": "px",
+      "key": "{form.error.icon-size}"
+    },
+    "name": "token-form-error-icon-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "icon-size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.checkbox.size}"
+    },
+    "name": "token-form-checkbox-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.checkbox.border.radius}"
+    },
+    "name": "token-form-checkbox-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.checkbox.border.width}"
+    },
+    "name": "token-form-checkbox-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.checkbox.background-image.size}"
+    },
+    "name": "token-form-checkbox-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url}"
+    },
+    "name": "token-form-checkbox-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate-disabled"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.value-color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.control.base.foreground.value-color}"
+    },
+    "name": "token-form-control-base-foreground-value-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "value-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.placeholder-color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.control.base.foreground.placeholder-color}"
+    },
+    "name": "token-form-control-base-foreground-placeholder-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "placeholder-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.default}"
+    },
+    "name": "token-form-control-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-hover}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.hover}"
+    },
+    "name": "token-form-control-base-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.default}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "components",
+      "key": "{form.control.base.border-color.default}"
+    },
+    "name": "token-form-control-base-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.hover}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "components",
+      "key": "{form.control.base.border-color.hover}"
+    },
+    "name": "token-form-control-base-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.foreground-color}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.high-contrast}",
+      "group": "components",
+      "key": "{form.control.checked.foreground-color}"
+    },
+    "name": "token-form-control-checked-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.default}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.default}"
+    },
+    "name": "token-form-control-checked-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.hover}"
+    },
+    "name": "token-form-control-checked-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.default}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.default}"
+    },
+    "name": "token-form-control-checked-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.hover}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.hover}"
+    },
+    "name": "token-form-control-checked-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.default}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.default}"
+    },
+    "name": "token-form-control-invalid-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.hover}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-400}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.hover}"
+    },
+    "name": "token-form-control-invalid-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.foreground-color}",
+    "$type": "color",
+    "$value": "#161616",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.primary}",
+      "group": "components",
+      "key": "{form.control.readonly.foreground-color}"
+    },
+    "name": "token-form-control-readonly-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.surface-color}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "key": "{form.control.readonly.surface-color}"
+    },
+    "name": "token-form-control-readonly-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.border-color}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.faint}",
+      "group": "components",
+      "key": "{form.control.readonly.border-color}"
+    },
+    "name": "token-form-control-readonly-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.foreground-color}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.foreground-color}"
+    },
+    "name": "token-form-control-disabled-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.surface-color}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.surface-color}"
+    },
+    "name": "token-form-control-disabled-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.border-color}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.primary}",
+      "group": "components",
+      "key": "{form.control.disabled.border-color}"
+    },
+    "name": "token-form-control-disabled-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.padding}",
+    "$type": "dimension",
+    "$value": "7px",
+    "unit": "px",
+    "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+    "original": {
+      "$type": "dimension",
+      "$value": "7",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "key": "{form.control.padding}"
+    },
+    "name": "token-form-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "padding"
+    ]
+  },
+  {
+    "key": "{form.control.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{form.control.border.radius}"
+    },
+    "name": "token-form-control-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.control.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.control.border.width}"
+    },
+    "name": "token-form-control-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radio.size}"
+    },
+    "name": "token-form-radio-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radio.border.width}"
+    },
+    "name": "token-form-radio-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.radio.background-image.size}"
+    },
+    "name": "token-form-radio-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url}"
+    },
+    "name": "token-form-radio-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url-disabled}"
+    },
+    "name": "token-form-radio-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.radiocard-group.gap}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radiocard-group.gap}"
+    },
+    "name": "token-form-radiocard-group-gap",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard-group",
+      "gap"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radiocard.border.width}"
+    },
+    "name": "token-form-radiocard-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.radius}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{form.radiocard.border.radius}"
+    },
+    "name": "token-form-radiocard-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.radiocard.content-padding}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{form.radiocard.content-padding}"
+    },
+    "name": "token-form-radiocard-content-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "content-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.control-padding}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{form.radiocard.control-padding}"
+    },
+    "name": "token-form-radiocard-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "control-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.radiocard.transition.duration}"
+    },
+    "name": "token-form-radiocard-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.select.background-image.size}"
+    },
+    "name": "token-form-select-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-right-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.select.background-image.position-right-x}"
+    },
+    "name": "token-form-select-background-image-position-right-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-right-x"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-top-y}",
+    "$type": "dimension",
+    "$value": "9px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "9",
+      "unit": "px",
+      "key": "{form.select.background-image.position-top-y}"
+    },
+    "name": "token-form-select-background-image-position-top-y",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-top-y"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url}"
+    },
+    "name": "token-form-select-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url-disabled}"
+    },
+    "name": "token-form-select-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.text-input.background-image.size}"
+    },
+    "name": "token-form-text-input-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.text-input.background-image.position-x}"
+    },
+    "name": "token-form-text-input-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-date}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-date}"
+    },
+    "name": "token-form-text-input-background-image-data-url-date",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-date"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-time}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-time}"
+    },
+    "name": "token-form-text-input-background-image-data-url-time",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-time"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-cancel}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-cancel}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-cancel",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-cancel"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-loading}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color and animation are hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-loading}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-loading",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-loading"
+    ]
+  },
+  {
+    "key": "{form.toggle.width}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{form.toggle.width}"
+    },
+    "name": "token-form-toggle-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.height}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.toggle.height}"
+    },
+    "name": "token-form-toggle-height",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "height"
+    ]
+  },
+  {
+    "key": "{form.toggle.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "comment": "the toggle has a different base surface color, compared to the other controls",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "key": "{form.toggle.base.surface-color.default}"
+    },
+    "name": "token-form-toggle-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.toggle.border.radius}"
+    },
+    "name": "token-form-toggle-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.toggle.border.width}"
+    },
+    "name": "token-form-toggle-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.toggle.background-image.size}"
+    },
+    "name": "token-form-toggle-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{form.toggle.background-image.position-x}"
+    },
+    "name": "token-form-toggle-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url}"
+    },
+    "name": "token-form-toggle-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url-disabled}"
+    },
+    "name": "token-form-toggle-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.toggle.transition.duration}"
+    },
+    "name": "token-form-toggle-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.timing-function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.68,
+        -0.2,
+        0.265,
+        1.15
+      ],
+      "key": "{form.toggle.transition.timing-function}"
+    },
+    "name": "token-form-toggle-transition-timing-function",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "timing-function"
+    ]
+  },
+  {
+    "key": "{form.toggle.thumb-size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.toggle.height}",
+      "key": "{form.toggle.thumb-size}"
+    },
+    "name": "token-form-toggle-thumb-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "thumb-size"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{pagination.nav.control.height}"
+    },
+    "name": "token-pagination-nav-control-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{pagination.nav.control.padding.horizontal}"
+    },
+    "name": "token-pagination-nav-control-padding-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.focus-inset}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{pagination.nav.control.focus-inset}"
+    },
+    "name": "token-pagination-nav-control-focus-inset",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.icon-spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.control.icon-spacing}"
+    },
+    "name": "token-pagination-nav-control-icon-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "icon-spacing"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.height}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.height}"
+    },
+    "name": "token-pagination-nav-indicator-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.spacing}"
+    },
+    "name": "token-pagination-nav-indicator-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{pagination.child.spacing.vertical}"
+    },
+    "name": "token-pagination-child-spacing-vertical",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.horizontal}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{pagination.child.spacing.horizontal}"
+    },
+    "name": "token-pagination-child-spacing-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{side-nav.wrapper.border.width}"
+    },
+    "name": "token-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "key": "{side-nav.wrapper.border.color}"
+    },
+    "name": "token-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.padding}"
+    },
+    "name": "token-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.header.actions.spacing}"
+    },
+    "name": "token-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.height}"
+    },
+    "name": "token-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "key": "{side-nav.color.foreground.primary}"
+    },
+    "name": "token-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#fff",
+      "group": "components",
+      "key": "{side-nav.color.foreground.strong}"
+    },
+    "name": "token-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "key": "{side-nav.color.foreground.faint}"
+    },
+    "name": "token-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "key": "{side-nav.color.surface.primary}"
+    },
+    "name": "token-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.medium}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{tabs.tab.height.medium}"
+    },
+    "name": "token-tabs-tab-height-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.large}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{tabs.tab.height.large}"
+    },
+    "name": "token-tabs-tab-height-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.medium}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.medium}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.large}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.large}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.vertical}",
+    "$type": "dimension",
+    "$value": "0px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "0",
+      "unit": "px",
+      "key": "{tabs.tab.padding.vertical}"
+    },
+    "name": "token-tabs-tab-padding-vertical",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tabs.tab.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tabs.tab.border-radius}"
+    },
+    "name": "token-tabs-tab-border-radius",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tabs.tab.focus-inset}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.focus-inset}"
+    },
+    "name": "token-tabs-tab-focus-inset",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{tabs.tab.gutter}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.gutter}"
+    },
+    "name": "token-tabs-tab-gutter",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "gutter"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.height}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{tabs.indicator.height}"
+    },
+    "name": "token-tabs-indicator-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.5,
+        1,
+        0.89,
+        1
+      ],
+      "key": "{tabs.indicator.transition.function}"
+    },
+    "name": "token-tabs-indicator-transition-function",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.duration}",
+    "$type": "duration",
+    "$value": "0.6s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.6",
+      "unit": "s",
+      "key": "{tabs.indicator.transition.duration}"
+    },
+    "name": "token-tabs-indicator-transition-duration",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{tabs.divider.height}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{tabs.divider.height}"
+    },
+    "name": "token-tabs-divider-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "divider",
+      "height"
+    ]
+  },
+  {
+    "key": "{tooltip.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tooltip.border-radius}"
+    },
+    "name": "token-tooltip-border-radius",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tooltip.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-high-contrast)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "key": "{tooltip.color.foreground.primary}"
+    },
+    "name": "token-tooltip-color-foreground-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-700)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "key": "{tooltip.color.surface.primary}"
+    },
+    "name": "token-tooltip-color-surface-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.focus-offset}",
+    "$type": "dimension",
+    "$value": "-2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "-2",
+      "unit": "px",
+      "key": "{tooltip.focus-offset}"
+    },
+    "name": "token-tooltip-focus-offset",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "focus-offset"
+    ]
+  },
+  {
+    "key": "{tooltip.max-width}",
+    "$type": "dimension",
+    "$value": "280px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "280",
+      "unit": "px",
+      "key": "{tooltip.max-width}"
+    },
+    "name": "token-tooltip-max-width",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "max-width"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tooltip.padding.horizontal}"
+    },
+    "name": "token-tooltip-padding-horizontal",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{tooltip.padding.vertical}"
+    },
+    "name": "token-tooltip-padding-vertical",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tooltip.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.54,
+        1.5,
+        0.38,
+        1.11
+      ],
+      "key": "{tooltip.transition.function}"
+    },
+    "name": "token-tooltip-transition-function",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.display}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.display.macOS}",
+        "{typography.font-stack.sans.display.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.display.emoji}"
+      ],
+      "key": "{typography.font-stack.display}"
+    },
+    "name": "token-typography-font-stack-display",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "display"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.text}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.text.macOS}",
+        "{typography.font-stack.sans.text.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.text.emoji}"
+      ],
+      "key": "{typography.font-stack.text}"
+    },
+    "name": "token-typography-font-stack-text",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "text"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.code}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.monospace.code.macOS}",
+        "{typography.font-stack.monospace.code.windows}",
+        "monospace"
+      ],
+      "key": "{typography.font-stack.code}"
+    },
+    "name": "token-typography-font-stack-code",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "code"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.regular}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "400",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "400",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.regular}"
+    },
+    "name": "token-typography-font-weight-regular",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "regular"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.medium}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "500",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "500",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.medium}"
+    },
+    "name": "token-typography-font-weight-medium",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "medium"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.semibold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "600",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "600",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.semibold}"
+    },
+    "name": "token-typography-font-weight-semibold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "semibold"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.bold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "700",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "700",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.bold}"
+    },
+    "name": "token-typography-font-weight-bold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "bold"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-500.font-family}"
+    },
+    "name": "token-typography-display-500-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-size}",
+    "$type": "font-size",
+    "$value": "1.875rem",
+    "unit": "px",
+    "comment": "30px/1.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "30",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "key": "{typography.display-500.font-size}"
+    },
+    "name": "token-typography-display-500-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-500.line-height}",
+    "$type": "number",
+    "$value": 1.2666,
+    "comment": "38px",
+    "original": {
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "key": "{typography.display-500.line-height}"
+    },
+    "name": "token-typography-display-500-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-400.font-family}"
+    },
+    "name": "token-typography-display-400-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-size}",
+    "$type": "font-size",
+    "$value": "1.5rem",
+    "unit": "px",
+    "comment": "24px/1.5rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "24",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "key": "{typography.display-400.font-size}"
+    },
+    "name": "token-typography-display-400-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-400.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "32px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "key": "{typography.display-400.line-height}"
+    },
+    "name": "token-typography-display-400-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-300.font-family}"
+    },
+    "name": "token-typography-display-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-size}",
+    "$type": "font-size",
+    "$value": "1.125rem",
+    "unit": "px",
+    "comment": "18px/1.125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "18",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "key": "{typography.display-300.font-size}"
+    },
+    "name": "token-typography-display-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-300.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "key": "{typography.display-300.line-height}"
+    },
+    "name": "token-typography-display-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-300.letter-spacing}"
+    },
+    "name": "token-typography-display-300-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-200.font-family}"
+    },
+    "name": "token-typography-display-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.display-200.font-size}"
+    },
+    "name": "token-typography-display-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-200.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.display-200.line-height}"
+    },
+    "name": "token-typography-display-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-200.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-200.letter-spacing}"
+    },
+    "name": "token-typography-display-200-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-100.font-family}"
+    },
+    "name": "token-typography-display-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.display-100.font-size}"
+    },
+    "name": "token-typography-display-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.display-100.line-height}"
+    },
+    "name": "token-typography-display-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-300.font-family}"
+    },
+    "name": "token-typography-body-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.body-300.font-size}"
+    },
+    "name": "token-typography-body-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-300.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.body-300.line-height}"
+    },
+    "name": "token-typography-body-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-200.font-family}"
+    },
+    "name": "token-typography-body-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.body-200.font-size}"
+    },
+    "name": "token-typography-body-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-200.line-height}",
+    "$type": "number",
+    "$value": 1.4286,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "key": "{typography.body-200.line-height}"
+    },
+    "name": "token-typography-body-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-100.font-family}"
+    },
+    "name": "token-typography-body-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.body-100.font-size}"
+    },
+    "name": "token-typography-body-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.body-100.line-height}"
+    },
+    "name": "token-typography-body-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-100.font-family}"
+    },
+    "name": "token-typography-code-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.code-100.font-size}"
+    },
+    "name": "token-typography-code-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-100.line-height}",
+    "$type": "number",
+    "$value": 1.23,
+    "comment": "16px",
+    "original": {
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "key": "{typography.code-100.line-height}"
+    },
+    "name": "token-typography-code-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-200.font-family}"
+    },
+    "name": "token-typography-code-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.code-200.font-size}"
+    },
+    "name": "token-typography-code-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-200.line-height}",
+    "$type": "number",
+    "$value": 1.125,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "key": "{typography.code-200.line-height}"
+    },
+    "name": "token-typography-code-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-300.font-family}"
+    },
+    "name": "token-typography-code-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.code-300.font-size}"
+    },
+    "name": "token-typography-code-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-300.line-height}",
+    "$type": "number",
+    "$value": 1.25,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "key": "{typography.code-300.line-height}"
+    },
+    "name": "token-typography-code-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "line-height"
+    ]
+  }
+]
\ No newline at end of file
diff --git a/packages/tokens/dist/docs/products/themed-tokens/cds-g10.json b/packages/tokens/dist/docs/products/themed-tokens/cds-g10.json
new file mode 100644
index 00000000000..3b7746e8036
--- /dev/null
+++ b/packages/tokens/dist/docs/products/themed-tokens/cds-g10.json
@@ -0,0 +1,8352 @@
+[
+  {
+    "key": "{border.radius.x-small}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{border.radius.x-small}"
+    },
+    "name": "token-border-radius-x-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "x-small"
+    ]
+  },
+  {
+    "key": "{border.radius.small}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{border.radius.small}"
+    },
+    "name": "token-border-radius-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "small"
+    ]
+  },
+  {
+    "key": "{border.radius.medium}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{border.radius.medium}"
+    },
+    "name": "token-border-radius-medium",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "medium"
+    ]
+  },
+  {
+    "key": "{border.radius.large}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{border.radius.large}"
+    },
+    "name": "token-border-radius-large",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "large"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-500}",
+    "$type": "color",
+    "$value": "#1c345f",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "key": "{color.palette.blue-500}"
+    },
+    "name": "token-color-palette-blue-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-500"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-400}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "key": "{color.palette.blue-400}"
+    },
+    "name": "token-color-palette-blue-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-400"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-300}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "key": "{color.palette.blue-300}"
+    },
+    "name": "token-color-palette-blue-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-300"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-200}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "key": "{color.palette.blue-200}"
+    },
+    "name": "token-color-palette-blue-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-200"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-100}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "key": "{color.palette.blue-100}"
+    },
+    "name": "token-color-palette-blue-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-100"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-50}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "key": "{color.palette.blue-50}"
+    },
+    "name": "token-color-palette-blue-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-50"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-500}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "key": "{color.palette.purple-500}"
+    },
+    "name": "token-color-palette-purple-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-500"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-400}",
+    "$type": "color",
+    "$value": "#7b00db",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "key": "{color.palette.purple-400}"
+    },
+    "name": "token-color-palette-purple-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-400"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-300}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "key": "{color.palette.purple-300}"
+    },
+    "name": "token-color-palette-purple-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-300"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-200}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "key": "{color.palette.purple-200}"
+    },
+    "name": "token-color-palette-purple-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-200"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-100}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "key": "{color.palette.purple-100}"
+    },
+    "name": "token-color-palette-purple-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-100"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-50}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "key": "{color.palette.purple-50}"
+    },
+    "name": "token-color-palette-purple-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-50"
+    ]
+  },
+  {
+    "key": "{color.palette.green-500}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "key": "{color.palette.green-500}"
+    },
+    "name": "token-color-palette-green-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-500"
+    ]
+  },
+  {
+    "key": "{color.palette.green-400}",
+    "$type": "color",
+    "$value": "#006619",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "key": "{color.palette.green-400}"
+    },
+    "name": "token-color-palette-green-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-400"
+    ]
+  },
+  {
+    "key": "{color.palette.green-300}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "key": "{color.palette.green-300}"
+    },
+    "name": "token-color-palette-green-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-300"
+    ]
+  },
+  {
+    "key": "{color.palette.green-200}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "key": "{color.palette.green-200}"
+    },
+    "name": "token-color-palette-green-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-200"
+    ]
+  },
+  {
+    "key": "{color.palette.green-100}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "key": "{color.palette.green-100}"
+    },
+    "name": "token-color-palette-green-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-100"
+    ]
+  },
+  {
+    "key": "{color.palette.green-50}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "key": "{color.palette.green-50}"
+    },
+    "name": "token-color-palette-green-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-50"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-500}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "key": "{color.palette.amber-500}"
+    },
+    "name": "token-color-palette-amber-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-500"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-400}",
+    "$type": "color",
+    "$value": "#803d00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "key": "{color.palette.amber-400}"
+    },
+    "name": "token-color-palette-amber-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-400"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-300}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "key": "{color.palette.amber-300}"
+    },
+    "name": "token-color-palette-amber-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-300"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-200}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "key": "{color.palette.amber-200}"
+    },
+    "name": "token-color-palette-amber-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-200"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-100}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "key": "{color.palette.amber-100}"
+    },
+    "name": "token-color-palette-amber-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-100"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-50}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "key": "{color.palette.amber-50}"
+    },
+    "name": "token-color-palette-amber-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-50"
+    ]
+  },
+  {
+    "key": "{color.palette.red-500}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "key": "{color.palette.red-500}"
+    },
+    "name": "token-color-palette-red-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-500"
+    ]
+  },
+  {
+    "key": "{color.palette.red-400}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "key": "{color.palette.red-400}"
+    },
+    "name": "token-color-palette-red-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-400"
+    ]
+  },
+  {
+    "key": "{color.palette.red-300}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "key": "{color.palette.red-300}"
+    },
+    "name": "token-color-palette-red-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-300"
+    ]
+  },
+  {
+    "key": "{color.palette.red-200}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "key": "{color.palette.red-200}"
+    },
+    "name": "token-color-palette-red-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-200"
+    ]
+  },
+  {
+    "key": "{color.palette.red-100}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "key": "{color.palette.red-100}"
+    },
+    "name": "token-color-palette-red-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-100"
+    ]
+  },
+  {
+    "key": "{color.palette.red-50}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "key": "{color.palette.red-50}"
+    },
+    "name": "token-color-palette-red-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-700}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "key": "{color.palette.neutral-700}"
+    },
+    "name": "token-color-palette-neutral-700",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-700"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-600}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "key": "{color.palette.neutral-600}"
+    },
+    "name": "token-color-palette-neutral-600",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-600"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-500}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "key": "{color.palette.neutral-500}"
+    },
+    "name": "token-color-palette-neutral-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-500"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-400}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "key": "{color.palette.neutral-400}"
+    },
+    "name": "token-color-palette-neutral-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-400"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-300}",
+    "$type": "color",
+    "$value": "#c2c5cb",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "key": "{color.palette.neutral-300}"
+    },
+    "name": "token-color-palette-neutral-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-300"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-200}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "key": "{color.palette.neutral-200}"
+    },
+    "name": "token-color-palette-neutral-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-200"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-100}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "key": "{color.palette.neutral-100}"
+    },
+    "name": "token-color-palette-neutral-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-100"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-50}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "key": "{color.palette.neutral-50}"
+    },
+    "name": "token-color-palette-neutral-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-0}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "palette",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#ffffff",
+      "cds-g10": "#ffffff",
+      "cds-g90": "#ffffff",
+      "cds-g100": "#ffffff"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.color.white.0}",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.color.white.0}",
+        "cds-g10": "{carbon.color.white.0}",
+        "cds-g90": "{carbon.color.white.0}",
+        "cds-g100": "{carbon.color.white.0}"
+      },
+      "key": "{color.palette.neutral-0}"
+    },
+    "name": "token-color-palette-neutral-0",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-0"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-300}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "alpha": "0.4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-600}",
+      "alpha": "0.4",
+      "group": "palette",
+      "key": "{color.palette.alpha-300}"
+    },
+    "name": "token-color-palette-alpha-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-300"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-200}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "alpha": "0.2",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.2",
+      "group": "palette",
+      "key": "{color.palette.alpha-200}"
+    },
+    "name": "token-color-palette-alpha-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-200"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-100}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "alpha": "0.1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.1",
+      "group": "palette",
+      "key": "{color.palette.alpha-100}"
+    },
+    "name": "token-color-palette-alpha-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-100"
+    ]
+  },
+  {
+    "key": "{color.border.primary}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-200}",
+      "group": "semantic",
+      "key": "{color.border.primary}"
+    },
+    "name": "token-color-border-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.border.faint}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-100}",
+      "group": "semantic",
+      "key": "{color.border.faint}"
+    },
+    "name": "token-color-border-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.border.strong}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-300}",
+      "group": "semantic",
+      "key": "{color.border.strong}"
+    },
+    "name": "token-color-border-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.border.action}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-100}",
+      "group": "semantic",
+      "key": "{color.border.action}"
+    },
+    "name": "token-color-border-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.border.highlight}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-100}",
+      "group": "semantic",
+      "key": "{color.border.highlight}"
+    },
+    "name": "token-color-border-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.border.success}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-100}",
+      "group": "semantic",
+      "key": "{color.border.success}"
+    },
+    "name": "token-color-border-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.border.warning}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-100}",
+      "group": "semantic",
+      "key": "{color.border.warning}"
+    },
+    "name": "token-color-border-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.border.critical}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-100}",
+      "group": "semantic",
+      "key": "{color.border.critical}"
+    },
+    "name": "token-color-border-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.focus.action.internal}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.focus.action.internal}"
+    },
+    "name": "token-color-focus-action-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.action.external}",
+    "$type": "color",
+    "$value": "#5990ff",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.action.external}"
+    },
+    "name": "token-color-focus-action-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.internal}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.focus.critical.internal}"
+    },
+    "name": "token-color-focus-critical-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.external}",
+    "$type": "color",
+    "$value": "#dd7578",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.critical.external}"
+    },
+    "name": "token-color-focus-critical-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.foreground.strong}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-700}",
+      "group": "semantic",
+      "key": "{color.foreground.strong}"
+    },
+    "name": "token-color-foreground-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.foreground.primary}",
+    "$type": "color",
+    "$value": "#161616",
+    "group": "semantic",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#161616",
+      "cds-g10": "#161616",
+      "cds-g90": "#f4f4f4",
+      "cds-g100": "#f4f4f4"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.themes.g10.textPrimary}",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.themes.white.textPrimary}",
+        "cds-g10": "{carbon.themes.g10.textPrimary}",
+        "cds-g90": "{carbon.themes.g90.textPrimary}",
+        "cds-g100": "{carbon.themes.g100.textPrimary}"
+      },
+      "key": "{color.foreground.primary}"
+    },
+    "name": "token-color-foreground-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.foreground.faint}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "semantic",
+      "key": "{color.foreground.faint}"
+    },
+    "name": "token-color-foreground-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.foreground.high-contrast}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.foreground.high-contrast}"
+    },
+    "name": "token-color-foreground-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.disabled}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "semantic",
+      "key": "{color.foreground.disabled}"
+    },
+    "name": "token-color-foreground-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "disabled"
+    ]
+  },
+  {
+    "key": "{color.foreground.action}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "semantic",
+      "key": "{color.foreground.action}"
+    },
+    "name": "token-color-foreground-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.foreground.action-hover}"
+    },
+    "name": "token-color-foreground-action-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-hover"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-active}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "semantic",
+      "key": "{color.foreground.action-active}"
+    },
+    "name": "token-color-foreground-action-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-active"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-200}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight}"
+    },
+    "name": "token-color-foreground-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-on-surface}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-300}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-on-surface}"
+    },
+    "name": "token-color-foreground-highlight-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-high-contrast}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-500}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-high-contrast}"
+    },
+    "name": "token-color-foreground-highlight-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.success}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-200}",
+      "group": "semantic",
+      "key": "{color.foreground.success}"
+    },
+    "name": "token-color-foreground-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-on-surface}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-300}",
+      "group": "semantic",
+      "key": "{color.foreground.success-on-surface}"
+    },
+    "name": "token-color-foreground-success-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-high-contrast}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-500}",
+      "group": "semantic",
+      "key": "{color.foreground.success-high-contrast}"
+    },
+    "name": "token-color-foreground-success-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-200}",
+      "group": "semantic",
+      "key": "{color.foreground.warning}"
+    },
+    "name": "token-color-foreground-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-on-surface}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-300}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-on-surface}"
+    },
+    "name": "token-color-foreground-warning-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-high-contrast}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-500}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-high-contrast}"
+    },
+    "name": "token-color-foreground-warning-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-200}",
+      "group": "semantic",
+      "key": "{color.foreground.critical}"
+    },
+    "name": "token-color-foreground-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-on-surface}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-on-surface}"
+    },
+    "name": "token-color-foreground-critical-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-high-contrast}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-500}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-high-contrast}"
+    },
+    "name": "token-color-foreground-critical-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.page.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.page.primary}"
+    },
+    "name": "token-color-page-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.page.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.page.faint}"
+    },
+    "name": "token-color-page-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.primary}"
+    },
+    "name": "token-color-surface-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.surface.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.faint}"
+    },
+    "name": "token-color-surface-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.strong}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.strong}"
+    },
+    "name": "token-color-surface-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.interactive}"
+    },
+    "name": "token-color-surface-interactive",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-hover}"
+    },
+    "name": "token-color-surface-interactive-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-200}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-active}"
+    },
+    "name": "token-color-surface-interactive-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-disabled}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-disabled}"
+    },
+    "name": "token-color-surface-interactive-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-disabled"
+    ]
+  },
+  {
+    "key": "{color.surface.action}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-50}",
+      "group": "semantic",
+      "key": "{color.surface.action}"
+    },
+    "name": "token-color-surface-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.surface.highlight}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-50}",
+      "group": "semantic",
+      "key": "{color.surface.highlight}"
+    },
+    "name": "token-color-surface-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.surface.success}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-50}",
+      "group": "semantic",
+      "key": "{color.surface.success}"
+    },
+    "name": "token-color-surface-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.surface.warning}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-50}",
+      "group": "semantic",
+      "key": "{color.surface.warning}"
+    },
+    "name": "token-color-surface-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.surface.critical}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-50}",
+      "group": "semantic",
+      "key": "{color.surface.critical}"
+    },
+    "name": "token-color-surface-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.hashicorp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hashicorp-brand}",
+      "group": "branding",
+      "key": "{color.hashicorp.brand}"
+    },
+    "name": "token-color-hashicorp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hashicorp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.brand}",
+    "$type": "color",
+    "$value": "#f24c53",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-brand}",
+      "group": "branding",
+      "key": "{color.boundary.brand}"
+    },
+    "name": "token-color-boundary-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.foreground}",
+    "$type": "color",
+    "$value": "#cf2d32",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-500}",
+      "group": "branding",
+      "key": "{color.boundary.foreground}"
+    },
+    "name": "token-color-boundary-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.boundary.surface}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.surface}"
+    },
+    "name": "token-color-boundary-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.boundary.border}",
+    "$type": "color",
+    "$value": "#fbd7d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-100}",
+      "group": "branding",
+      "key": "{color.boundary.border}"
+    },
+    "name": "token-color-boundary-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#f97076",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-300}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.start}"
+    },
+    "name": "token-color-boundary-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#db363b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-400}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.stop}"
+    },
+    "name": "token-color-boundary-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffafa",
+    "group": "branding",
+    "comment": "this is the 'boundary-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "key": "{color.boundary.gradient.faint.start}"
+    },
+    "name": "token-color-boundary-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.faint.stop}"
+    },
+    "name": "token-color-boundary-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.brand}",
+    "$type": "color",
+    "$value": "#e03875",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-brand}",
+      "group": "branding",
+      "key": "{color.consul.brand}"
+    },
+    "name": "token-color-consul-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.consul.foreground}",
+    "$type": "color",
+    "$value": "#d01c5b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-500}",
+      "group": "branding",
+      "key": "{color.consul.foreground}"
+    },
+    "name": "token-color-consul-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.consul.surface}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.surface}"
+    },
+    "name": "token-color-consul-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.consul.border}",
+    "$type": "color",
+    "$value": "#ffcede",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-100}",
+      "group": "branding",
+      "key": "{color.consul.border}"
+    },
+    "name": "token-color-consul-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#ff99be",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-300}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.start}"
+    },
+    "name": "token-color-consul-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#da306e",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-400}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.stop}"
+    },
+    "name": "token-color-consul-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fff9fb",
+    "group": "branding",
+    "comment": "this is the 'consul-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "key": "{color.consul.gradient.faint.start}"
+    },
+    "name": "token-color-consul-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.gradient.faint.stop}"
+    },
+    "name": "token-color-consul-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.hcp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hcp-brand}",
+      "group": "branding",
+      "key": "{color.hcp.brand}"
+    },
+    "name": "token-color-hcp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hcp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.brand}",
+    "$type": "color",
+    "$value": "#06d092",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-brand}",
+      "group": "branding",
+      "key": "{color.nomad.brand}"
+    },
+    "name": "token-color-nomad-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.foreground}",
+    "$type": "color",
+    "$value": "#008661",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-500}",
+      "group": "branding",
+      "key": "{color.nomad.foreground}"
+    },
+    "name": "token-color-nomad-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.nomad.surface}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.surface}"
+    },
+    "name": "token-color-nomad-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.nomad.border}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.border}"
+    },
+    "name": "token-color-nomad-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.start}"
+    },
+    "name": "token-color-nomad-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#60dea9",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-200}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.stop}"
+    },
+    "name": "token-color-nomad-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fff9",
+    "group": "branding",
+    "comment": "this is the 'nomad-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "key": "{color.nomad.gradient.faint.start}"
+    },
+    "name": "token-color-nomad-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.faint.stop}"
+    },
+    "name": "token-color-nomad-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.brand}",
+    "$type": "color",
+    "$value": "#02a8ef",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-brand}",
+      "group": "branding",
+      "key": "{color.packer.brand}"
+    },
+    "name": "token-color-packer-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.packer.foreground}",
+    "$type": "color",
+    "$value": "#007eb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-500}",
+      "group": "branding",
+      "key": "{color.packer.foreground}"
+    },
+    "name": "token-color-packer-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.packer.surface}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.surface}"
+    },
+    "name": "token-color-packer-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.packer.border}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.border}"
+    },
+    "name": "token-color-packer-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.start}"
+    },
+    "name": "token-color-packer-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#63d0ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-200}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.stop}"
+    },
+    "name": "token-color-packer-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fcff",
+    "group": "branding",
+    "comment": "this is the 'packer-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#F3FCFF",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "key": "{color.packer.gradient.faint.start}"
+    },
+    "name": "token-color-packer-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.gradient.faint.stop}"
+    },
+    "name": "token-color-packer-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand}",
+    "$type": "color",
+    "$value": "#7b42bc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-brand}",
+      "group": "branding",
+      "key": "{color.terraform.brand}"
+    },
+    "name": "token-color-terraform-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand-on-dark}",
+    "$type": "color",
+    "$value": "#a067da",
+    "group": "branding",
+    "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+    "original": {
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "key": "{color.terraform.brand-on-dark}"
+    },
+    "name": "token-color-terraform-brand-on-dark",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand-on-dark"
+    ]
+  },
+  {
+    "key": "{color.terraform.foreground}",
+    "$type": "color",
+    "$value": "#773cb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-500}",
+      "group": "branding",
+      "key": "{color.terraform.foreground}"
+    },
+    "name": "token-color-terraform-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.terraform.surface}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.surface}"
+    },
+    "name": "token-color-terraform-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.terraform.border}",
+    "$type": "color",
+    "$value": "#ebdbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-100}",
+      "group": "branding",
+      "key": "{color.terraform.border}"
+    },
+    "name": "token-color-terraform-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bb8deb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-300}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.start}"
+    },
+    "name": "token-color-terraform-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#844fba",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-400}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.stop}"
+    },
+    "name": "token-color-terraform-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fcfaff",
+    "group": "branding",
+    "comment": "this is the 'terraform-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "key": "{color.terraform.gradient.faint.start}"
+    },
+    "name": "token-color-terraform-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.faint.stop}"
+    },
+    "name": "token-color-terraform-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.brand}",
+    "$type": "color",
+    "$value": "#1868f2",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-brand}",
+      "group": "branding",
+      "key": "{color.vagrant.brand}"
+    },
+    "name": "token-color-vagrant-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vagrant.foreground}",
+    "$type": "color",
+    "$value": "#1c61d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-500}",
+      "group": "branding",
+      "key": "{color.vagrant.foreground}"
+    },
+    "name": "token-color-vagrant-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vagrant.surface}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.surface}"
+    },
+    "name": "token-color-vagrant-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vagrant.border}",
+    "$type": "color",
+    "$value": "#c7dbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-100}",
+      "group": "branding",
+      "key": "{color.vagrant.border}"
+    },
+    "name": "token-color-vagrant-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#639cff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-300}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.start}"
+    },
+    "name": "token-color-vagrant-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#2e71e5",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-400}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.stop}"
+    },
+    "name": "token-color-vagrant-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f4faff",
+    "group": "branding",
+    "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "key": "{color.vagrant.gradient.faint.start}"
+    },
+    "name": "token-color-vagrant-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.faint.stop}"
+    },
+    "name": "token-color-vagrant-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-brand}",
+      "group": "branding",
+      "key": "{color.vault-radar.brand}"
+    },
+    "name": "token-color-vault-radar-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "key": "{color.vault-radar.brand-alt}"
+    },
+    "name": "token-color-vault-radar-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-500}",
+      "group": "branding",
+      "key": "{color.vault-radar.foreground}"
+    },
+    "name": "token-color-vault-radar-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.surface}"
+    },
+    "name": "token-color-vault-radar-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.border}"
+    },
+    "name": "token-color-vault-radar-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.start}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-200}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "key": "{color.vault-radar.gradient.faint.start}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-brand}",
+      "group": "branding",
+      "key": "{color.vault-secrets.brand}"
+    },
+    "name": "token-color-vault-secrets-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand-alt}",
+    "group": "branding",
+    "$type": "color",
+    "$value": "#000000",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+    "original": {
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "key": "{color.vault-secrets.brand-alt}"
+    },
+    "name": "token-color-vault-secrets-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-500}",
+      "group": "branding",
+      "key": "{color.vault-secrets.foreground}"
+    },
+    "name": "token-color-vault-secrets-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.surface}"
+    },
+    "name": "token-color-vault-secrets-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.border}"
+    },
+    "name": "token-color-vault-secrets-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-200}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "key": "{color.vault-secrets.gradient.faint.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-brand}",
+      "group": "branding",
+      "key": "{color.vault.brand}"
+    },
+    "name": "token-color-vault-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "key": "{color.vault.brand-alt}"
+    },
+    "name": "token-color-vault-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-500}",
+      "group": "branding",
+      "key": "{color.vault.foreground}"
+    },
+    "name": "token-color-vault-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.surface}"
+    },
+    "name": "token-color-vault-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.border}"
+    },
+    "name": "token-color-vault-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.start}"
+    },
+    "name": "token-color-vault-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-200}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "key": "{color.vault.gradient.faint.start}"
+    },
+    "name": "token-color-vault-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.brand}",
+    "$type": "color",
+    "$value": "#14c6cb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-brand}",
+      "group": "branding",
+      "key": "{color.waypoint.brand}"
+    },
+    "name": "token-color-waypoint-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.waypoint.foreground}",
+    "$type": "color",
+    "$value": "#008196",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-500}",
+      "group": "branding",
+      "key": "{color.waypoint.foreground}"
+    },
+    "name": "token-color-waypoint-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.waypoint.surface}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.surface}"
+    },
+    "name": "token-color-waypoint-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.waypoint.border}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.border}"
+    },
+    "name": "token-color-waypoint-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.start}"
+    },
+    "name": "token-color-waypoint-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#62d4dc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-200}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.stop}"
+    },
+    "name": "token-color-waypoint-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f6feff",
+    "group": "branding",
+    "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "key": "{color.waypoint.gradient.faint.start}"
+    },
+    "name": "token-color-waypoint-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.faint.stop}"
+    },
+    "name": "token-color-waypoint-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{elevation.inset.box-shadow}",
+    "$value": "inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-01}",
+      "key": "{elevation.inset.box-shadow}"
+    },
+    "name": "token-elevation-inset-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.low.box-shadow}",
+    "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+      "key": "{elevation.low.box-shadow}"
+    },
+    "name": "token-elevation-low-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.mid.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+      "key": "{elevation.mid.box-shadow}"
+    },
+    "name": "token-elevation-mid-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.high.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+      "key": "{elevation.high.box-shadow}"
+    },
+    "name": "token-elevation-high-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.higher.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+      "key": "{elevation.higher.box-shadow}"
+    },
+    "name": "token-elevation-higher-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.overlay.box-shadow}",
+    "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+      "key": "{elevation.overlay.box-shadow}"
+    },
+    "name": "token-elevation-overlay-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.inset.box-shadow}",
+    "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+      "key": "{surface.inset.box-shadow}"
+    },
+    "name": "token-surface-inset-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.base.box-shadow}",
+    "$value": "0 0 0 1px #656a7633",
+    "original": {
+      "$value": "{elevation.base.box-shadow-border}",
+      "key": "{surface.base.box-shadow}"
+    },
+    "name": "token-surface-base-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "base",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.low.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+      "key": "{surface.low.box-shadow}"
+    },
+    "name": "token-surface-low-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.mid.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+      "key": "{surface.mid.box-shadow}"
+    },
+    "name": "token-surface-mid-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.high.box-shadow}",
+    "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+      "key": "{surface.high.box-shadow}"
+    },
+    "name": "token-surface-high-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.higher.box-shadow}",
+    "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+      "key": "{surface.higher.box-shadow}"
+    },
+    "name": "token-surface-higher-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.overlay.box-shadow}",
+    "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+      "key": "{surface.overlay.box-shadow}"
+    },
+    "name": "token-surface-overlay-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.action.box-shadow}",
+    "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+    "original": {
+      "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+      "key": "{focus-ring.action.box-shadow}"
+    },
+    "name": "token-focus-ring-action-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "action",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.critical.box-shadow}",
+    "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+    "original": {
+      "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+      "key": "{focus-ring.critical.box-shadow}"
+    },
+    "name": "token-focus-ring-critical-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "critical",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{app-header.height}",
+    "$type": "dimension",
+    "$value": "60px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "60",
+      "unit": "px",
+      "key": "{app-header.height}"
+    },
+    "name": "token-app-header-height",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-header.home-link.size}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-header.home-link.size}"
+    },
+    "name": "token-app-header-home-link-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "home-link",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-header.logo.size}",
+    "$type": "dimension",
+    "$value": "28px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "28",
+      "unit": "px",
+      "key": "{app-header.logo.size}"
+    },
+    "name": "token-app-header-logo-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "logo",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.border.width}"
+    },
+    "name": "token-app-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-200)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "key": "{app-side-nav.wrapper.border.color}"
+    },
+    "name": "token-app-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-app-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.padding}"
+    },
+    "name": "token-app-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.header.actions.spacing}"
+    },
+    "name": "token-app-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{app-side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.height}"
+    },
+    "name": "token-app-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-app-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.primary}"
+    },
+    "name": "token-app-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.strong}"
+    },
+    "name": "token-app-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.faint}"
+    },
+    "name": "token-app-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.surface.primary}"
+    },
+    "name": "token-app-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-interactive-hover)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-300)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{form.label.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.label.color}"
+    },
+    "name": "token-form-label-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "label",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.legend.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{form.label.color}",
+      "group": "components",
+      "key": "{form.legend.color}"
+    },
+    "name": "token-form-legend-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "legend",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.helper-text.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.helper-text.color}"
+    },
+    "name": "token-form-helper-text-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "helper-text",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.indicator.optional.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.indicator.optional.color}"
+    },
+    "name": "token-form-indicator-optional-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "indicator",
+      "optional",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.color}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.error.color}"
+    },
+    "name": "token-form-error-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.icon-size}",
+    "$type": "dimension",
+    "$value": "14px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "14",
+      "unit": "px",
+      "key": "{form.error.icon-size}"
+    },
+    "name": "token-form-error-icon-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "icon-size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.checkbox.size}"
+    },
+    "name": "token-form-checkbox-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.checkbox.border.radius}"
+    },
+    "name": "token-form-checkbox-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.checkbox.border.width}"
+    },
+    "name": "token-form-checkbox-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.checkbox.background-image.size}"
+    },
+    "name": "token-form-checkbox-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url}"
+    },
+    "name": "token-form-checkbox-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate-disabled"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.value-color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.control.base.foreground.value-color}"
+    },
+    "name": "token-form-control-base-foreground-value-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "value-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.placeholder-color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.control.base.foreground.placeholder-color}"
+    },
+    "name": "token-form-control-base-foreground-placeholder-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "placeholder-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.default}"
+    },
+    "name": "token-form-control-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-hover}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.hover}"
+    },
+    "name": "token-form-control-base-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.default}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "components",
+      "key": "{form.control.base.border-color.default}"
+    },
+    "name": "token-form-control-base-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.hover}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "components",
+      "key": "{form.control.base.border-color.hover}"
+    },
+    "name": "token-form-control-base-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.foreground-color}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.high-contrast}",
+      "group": "components",
+      "key": "{form.control.checked.foreground-color}"
+    },
+    "name": "token-form-control-checked-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.default}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.default}"
+    },
+    "name": "token-form-control-checked-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.hover}"
+    },
+    "name": "token-form-control-checked-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.default}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.default}"
+    },
+    "name": "token-form-control-checked-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.hover}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.hover}"
+    },
+    "name": "token-form-control-checked-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.default}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.default}"
+    },
+    "name": "token-form-control-invalid-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.hover}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-400}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.hover}"
+    },
+    "name": "token-form-control-invalid-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.foreground-color}",
+    "$type": "color",
+    "$value": "#161616",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.primary}",
+      "group": "components",
+      "key": "{form.control.readonly.foreground-color}"
+    },
+    "name": "token-form-control-readonly-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.surface-color}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "key": "{form.control.readonly.surface-color}"
+    },
+    "name": "token-form-control-readonly-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.border-color}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.faint}",
+      "group": "components",
+      "key": "{form.control.readonly.border-color}"
+    },
+    "name": "token-form-control-readonly-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.foreground-color}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.foreground-color}"
+    },
+    "name": "token-form-control-disabled-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.surface-color}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.surface-color}"
+    },
+    "name": "token-form-control-disabled-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.border-color}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.primary}",
+      "group": "components",
+      "key": "{form.control.disabled.border-color}"
+    },
+    "name": "token-form-control-disabled-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.padding}",
+    "$type": "dimension",
+    "$value": "7px",
+    "unit": "px",
+    "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+    "original": {
+      "$type": "dimension",
+      "$value": "7",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "key": "{form.control.padding}"
+    },
+    "name": "token-form-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "padding"
+    ]
+  },
+  {
+    "key": "{form.control.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{form.control.border.radius}"
+    },
+    "name": "token-form-control-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.control.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.control.border.width}"
+    },
+    "name": "token-form-control-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radio.size}"
+    },
+    "name": "token-form-radio-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radio.border.width}"
+    },
+    "name": "token-form-radio-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.radio.background-image.size}"
+    },
+    "name": "token-form-radio-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url}"
+    },
+    "name": "token-form-radio-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url-disabled}"
+    },
+    "name": "token-form-radio-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.radiocard-group.gap}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radiocard-group.gap}"
+    },
+    "name": "token-form-radiocard-group-gap",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard-group",
+      "gap"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radiocard.border.width}"
+    },
+    "name": "token-form-radiocard-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.radius}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{form.radiocard.border.radius}"
+    },
+    "name": "token-form-radiocard-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.radiocard.content-padding}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{form.radiocard.content-padding}"
+    },
+    "name": "token-form-radiocard-content-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "content-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.control-padding}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{form.radiocard.control-padding}"
+    },
+    "name": "token-form-radiocard-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "control-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.radiocard.transition.duration}"
+    },
+    "name": "token-form-radiocard-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.select.background-image.size}"
+    },
+    "name": "token-form-select-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-right-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.select.background-image.position-right-x}"
+    },
+    "name": "token-form-select-background-image-position-right-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-right-x"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-top-y}",
+    "$type": "dimension",
+    "$value": "9px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "9",
+      "unit": "px",
+      "key": "{form.select.background-image.position-top-y}"
+    },
+    "name": "token-form-select-background-image-position-top-y",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-top-y"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url}"
+    },
+    "name": "token-form-select-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url-disabled}"
+    },
+    "name": "token-form-select-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.text-input.background-image.size}"
+    },
+    "name": "token-form-text-input-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.text-input.background-image.position-x}"
+    },
+    "name": "token-form-text-input-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-date}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-date}"
+    },
+    "name": "token-form-text-input-background-image-data-url-date",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-date"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-time}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-time}"
+    },
+    "name": "token-form-text-input-background-image-data-url-time",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-time"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-cancel}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-cancel}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-cancel",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-cancel"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-loading}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color and animation are hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-loading}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-loading",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-loading"
+    ]
+  },
+  {
+    "key": "{form.toggle.width}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{form.toggle.width}"
+    },
+    "name": "token-form-toggle-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.height}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.toggle.height}"
+    },
+    "name": "token-form-toggle-height",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "height"
+    ]
+  },
+  {
+    "key": "{form.toggle.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "comment": "the toggle has a different base surface color, compared to the other controls",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "key": "{form.toggle.base.surface-color.default}"
+    },
+    "name": "token-form-toggle-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.toggle.border.radius}"
+    },
+    "name": "token-form-toggle-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.toggle.border.width}"
+    },
+    "name": "token-form-toggle-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.toggle.background-image.size}"
+    },
+    "name": "token-form-toggle-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{form.toggle.background-image.position-x}"
+    },
+    "name": "token-form-toggle-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url}"
+    },
+    "name": "token-form-toggle-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url-disabled}"
+    },
+    "name": "token-form-toggle-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.toggle.transition.duration}"
+    },
+    "name": "token-form-toggle-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.timing-function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.68,
+        -0.2,
+        0.265,
+        1.15
+      ],
+      "key": "{form.toggle.transition.timing-function}"
+    },
+    "name": "token-form-toggle-transition-timing-function",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "timing-function"
+    ]
+  },
+  {
+    "key": "{form.toggle.thumb-size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.toggle.height}",
+      "key": "{form.toggle.thumb-size}"
+    },
+    "name": "token-form-toggle-thumb-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "thumb-size"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{pagination.nav.control.height}"
+    },
+    "name": "token-pagination-nav-control-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{pagination.nav.control.padding.horizontal}"
+    },
+    "name": "token-pagination-nav-control-padding-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.focus-inset}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{pagination.nav.control.focus-inset}"
+    },
+    "name": "token-pagination-nav-control-focus-inset",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.icon-spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.control.icon-spacing}"
+    },
+    "name": "token-pagination-nav-control-icon-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "icon-spacing"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.height}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.height}"
+    },
+    "name": "token-pagination-nav-indicator-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.spacing}"
+    },
+    "name": "token-pagination-nav-indicator-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{pagination.child.spacing.vertical}"
+    },
+    "name": "token-pagination-child-spacing-vertical",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.horizontal}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{pagination.child.spacing.horizontal}"
+    },
+    "name": "token-pagination-child-spacing-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{side-nav.wrapper.border.width}"
+    },
+    "name": "token-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "key": "{side-nav.wrapper.border.color}"
+    },
+    "name": "token-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.padding}"
+    },
+    "name": "token-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.header.actions.spacing}"
+    },
+    "name": "token-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.height}"
+    },
+    "name": "token-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "key": "{side-nav.color.foreground.primary}"
+    },
+    "name": "token-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#fff",
+      "group": "components",
+      "key": "{side-nav.color.foreground.strong}"
+    },
+    "name": "token-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "key": "{side-nav.color.foreground.faint}"
+    },
+    "name": "token-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "key": "{side-nav.color.surface.primary}"
+    },
+    "name": "token-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.medium}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{tabs.tab.height.medium}"
+    },
+    "name": "token-tabs-tab-height-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.large}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{tabs.tab.height.large}"
+    },
+    "name": "token-tabs-tab-height-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.medium}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.medium}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.large}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.large}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.vertical}",
+    "$type": "dimension",
+    "$value": "0px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "0",
+      "unit": "px",
+      "key": "{tabs.tab.padding.vertical}"
+    },
+    "name": "token-tabs-tab-padding-vertical",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tabs.tab.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tabs.tab.border-radius}"
+    },
+    "name": "token-tabs-tab-border-radius",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tabs.tab.focus-inset}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.focus-inset}"
+    },
+    "name": "token-tabs-tab-focus-inset",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{tabs.tab.gutter}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.gutter}"
+    },
+    "name": "token-tabs-tab-gutter",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "gutter"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.height}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{tabs.indicator.height}"
+    },
+    "name": "token-tabs-indicator-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.5,
+        1,
+        0.89,
+        1
+      ],
+      "key": "{tabs.indicator.transition.function}"
+    },
+    "name": "token-tabs-indicator-transition-function",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.duration}",
+    "$type": "duration",
+    "$value": "0.6s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.6",
+      "unit": "s",
+      "key": "{tabs.indicator.transition.duration}"
+    },
+    "name": "token-tabs-indicator-transition-duration",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{tabs.divider.height}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{tabs.divider.height}"
+    },
+    "name": "token-tabs-divider-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "divider",
+      "height"
+    ]
+  },
+  {
+    "key": "{tooltip.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tooltip.border-radius}"
+    },
+    "name": "token-tooltip-border-radius",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tooltip.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-high-contrast)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "key": "{tooltip.color.foreground.primary}"
+    },
+    "name": "token-tooltip-color-foreground-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-700)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "key": "{tooltip.color.surface.primary}"
+    },
+    "name": "token-tooltip-color-surface-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.focus-offset}",
+    "$type": "dimension",
+    "$value": "-2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "-2",
+      "unit": "px",
+      "key": "{tooltip.focus-offset}"
+    },
+    "name": "token-tooltip-focus-offset",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "focus-offset"
+    ]
+  },
+  {
+    "key": "{tooltip.max-width}",
+    "$type": "dimension",
+    "$value": "280px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "280",
+      "unit": "px",
+      "key": "{tooltip.max-width}"
+    },
+    "name": "token-tooltip-max-width",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "max-width"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tooltip.padding.horizontal}"
+    },
+    "name": "token-tooltip-padding-horizontal",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{tooltip.padding.vertical}"
+    },
+    "name": "token-tooltip-padding-vertical",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tooltip.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.54,
+        1.5,
+        0.38,
+        1.11
+      ],
+      "key": "{tooltip.transition.function}"
+    },
+    "name": "token-tooltip-transition-function",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.display}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.display.macOS}",
+        "{typography.font-stack.sans.display.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.display.emoji}"
+      ],
+      "key": "{typography.font-stack.display}"
+    },
+    "name": "token-typography-font-stack-display",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "display"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.text}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.text.macOS}",
+        "{typography.font-stack.sans.text.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.text.emoji}"
+      ],
+      "key": "{typography.font-stack.text}"
+    },
+    "name": "token-typography-font-stack-text",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "text"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.code}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.monospace.code.macOS}",
+        "{typography.font-stack.monospace.code.windows}",
+        "monospace"
+      ],
+      "key": "{typography.font-stack.code}"
+    },
+    "name": "token-typography-font-stack-code",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "code"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.regular}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "400",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "400",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.regular}"
+    },
+    "name": "token-typography-font-weight-regular",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "regular"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.medium}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "500",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "500",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.medium}"
+    },
+    "name": "token-typography-font-weight-medium",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "medium"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.semibold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "600",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "600",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.semibold}"
+    },
+    "name": "token-typography-font-weight-semibold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "semibold"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.bold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "700",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "700",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.bold}"
+    },
+    "name": "token-typography-font-weight-bold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "bold"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-500.font-family}"
+    },
+    "name": "token-typography-display-500-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-size}",
+    "$type": "font-size",
+    "$value": "1.875rem",
+    "unit": "px",
+    "comment": "30px/1.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "30",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "key": "{typography.display-500.font-size}"
+    },
+    "name": "token-typography-display-500-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-500.line-height}",
+    "$type": "number",
+    "$value": 1.2666,
+    "comment": "38px",
+    "original": {
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "key": "{typography.display-500.line-height}"
+    },
+    "name": "token-typography-display-500-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-400.font-family}"
+    },
+    "name": "token-typography-display-400-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-size}",
+    "$type": "font-size",
+    "$value": "1.5rem",
+    "unit": "px",
+    "comment": "24px/1.5rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "24",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "key": "{typography.display-400.font-size}"
+    },
+    "name": "token-typography-display-400-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-400.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "32px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "key": "{typography.display-400.line-height}"
+    },
+    "name": "token-typography-display-400-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-300.font-family}"
+    },
+    "name": "token-typography-display-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-size}",
+    "$type": "font-size",
+    "$value": "1.125rem",
+    "unit": "px",
+    "comment": "18px/1.125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "18",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "key": "{typography.display-300.font-size}"
+    },
+    "name": "token-typography-display-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-300.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "key": "{typography.display-300.line-height}"
+    },
+    "name": "token-typography-display-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-300.letter-spacing}"
+    },
+    "name": "token-typography-display-300-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-200.font-family}"
+    },
+    "name": "token-typography-display-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.display-200.font-size}"
+    },
+    "name": "token-typography-display-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-200.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.display-200.line-height}"
+    },
+    "name": "token-typography-display-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-200.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-200.letter-spacing}"
+    },
+    "name": "token-typography-display-200-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-100.font-family}"
+    },
+    "name": "token-typography-display-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.display-100.font-size}"
+    },
+    "name": "token-typography-display-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.display-100.line-height}"
+    },
+    "name": "token-typography-display-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-300.font-family}"
+    },
+    "name": "token-typography-body-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.body-300.font-size}"
+    },
+    "name": "token-typography-body-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-300.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.body-300.line-height}"
+    },
+    "name": "token-typography-body-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-200.font-family}"
+    },
+    "name": "token-typography-body-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.body-200.font-size}"
+    },
+    "name": "token-typography-body-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-200.line-height}",
+    "$type": "number",
+    "$value": 1.4286,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "key": "{typography.body-200.line-height}"
+    },
+    "name": "token-typography-body-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-100.font-family}"
+    },
+    "name": "token-typography-body-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.body-100.font-size}"
+    },
+    "name": "token-typography-body-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.body-100.line-height}"
+    },
+    "name": "token-typography-body-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-100.font-family}"
+    },
+    "name": "token-typography-code-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.code-100.font-size}"
+    },
+    "name": "token-typography-code-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-100.line-height}",
+    "$type": "number",
+    "$value": 1.23,
+    "comment": "16px",
+    "original": {
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "key": "{typography.code-100.line-height}"
+    },
+    "name": "token-typography-code-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-200.font-family}"
+    },
+    "name": "token-typography-code-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.code-200.font-size}"
+    },
+    "name": "token-typography-code-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-200.line-height}",
+    "$type": "number",
+    "$value": 1.125,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "key": "{typography.code-200.line-height}"
+    },
+    "name": "token-typography-code-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-300.font-family}"
+    },
+    "name": "token-typography-code-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.code-300.font-size}"
+    },
+    "name": "token-typography-code-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-300.line-height}",
+    "$type": "number",
+    "$value": 1.25,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "key": "{typography.code-300.line-height}"
+    },
+    "name": "token-typography-code-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "line-height"
+    ]
+  }
+]
\ No newline at end of file
diff --git a/packages/tokens/dist/docs/products/themed-tokens/cds-g100.json b/packages/tokens/dist/docs/products/themed-tokens/cds-g100.json
new file mode 100644
index 00000000000..d8874ac7d5f
--- /dev/null
+++ b/packages/tokens/dist/docs/products/themed-tokens/cds-g100.json
@@ -0,0 +1,8352 @@
+[
+  {
+    "key": "{border.radius.x-small}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{border.radius.x-small}"
+    },
+    "name": "token-border-radius-x-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "x-small"
+    ]
+  },
+  {
+    "key": "{border.radius.small}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{border.radius.small}"
+    },
+    "name": "token-border-radius-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "small"
+    ]
+  },
+  {
+    "key": "{border.radius.medium}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{border.radius.medium}"
+    },
+    "name": "token-border-radius-medium",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "medium"
+    ]
+  },
+  {
+    "key": "{border.radius.large}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{border.radius.large}"
+    },
+    "name": "token-border-radius-large",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "large"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-500}",
+    "$type": "color",
+    "$value": "#1c345f",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "key": "{color.palette.blue-500}"
+    },
+    "name": "token-color-palette-blue-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-500"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-400}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "key": "{color.palette.blue-400}"
+    },
+    "name": "token-color-palette-blue-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-400"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-300}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "key": "{color.palette.blue-300}"
+    },
+    "name": "token-color-palette-blue-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-300"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-200}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "key": "{color.palette.blue-200}"
+    },
+    "name": "token-color-palette-blue-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-200"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-100}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "key": "{color.palette.blue-100}"
+    },
+    "name": "token-color-palette-blue-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-100"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-50}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "key": "{color.palette.blue-50}"
+    },
+    "name": "token-color-palette-blue-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-50"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-500}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "key": "{color.palette.purple-500}"
+    },
+    "name": "token-color-palette-purple-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-500"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-400}",
+    "$type": "color",
+    "$value": "#7b00db",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "key": "{color.palette.purple-400}"
+    },
+    "name": "token-color-palette-purple-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-400"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-300}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "key": "{color.palette.purple-300}"
+    },
+    "name": "token-color-palette-purple-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-300"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-200}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "key": "{color.palette.purple-200}"
+    },
+    "name": "token-color-palette-purple-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-200"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-100}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "key": "{color.palette.purple-100}"
+    },
+    "name": "token-color-palette-purple-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-100"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-50}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "key": "{color.palette.purple-50}"
+    },
+    "name": "token-color-palette-purple-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-50"
+    ]
+  },
+  {
+    "key": "{color.palette.green-500}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "key": "{color.palette.green-500}"
+    },
+    "name": "token-color-palette-green-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-500"
+    ]
+  },
+  {
+    "key": "{color.palette.green-400}",
+    "$type": "color",
+    "$value": "#006619",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "key": "{color.palette.green-400}"
+    },
+    "name": "token-color-palette-green-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-400"
+    ]
+  },
+  {
+    "key": "{color.palette.green-300}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "key": "{color.palette.green-300}"
+    },
+    "name": "token-color-palette-green-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-300"
+    ]
+  },
+  {
+    "key": "{color.palette.green-200}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "key": "{color.palette.green-200}"
+    },
+    "name": "token-color-palette-green-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-200"
+    ]
+  },
+  {
+    "key": "{color.palette.green-100}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "key": "{color.palette.green-100}"
+    },
+    "name": "token-color-palette-green-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-100"
+    ]
+  },
+  {
+    "key": "{color.palette.green-50}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "key": "{color.palette.green-50}"
+    },
+    "name": "token-color-palette-green-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-50"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-500}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "key": "{color.palette.amber-500}"
+    },
+    "name": "token-color-palette-amber-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-500"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-400}",
+    "$type": "color",
+    "$value": "#803d00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "key": "{color.palette.amber-400}"
+    },
+    "name": "token-color-palette-amber-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-400"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-300}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "key": "{color.palette.amber-300}"
+    },
+    "name": "token-color-palette-amber-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-300"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-200}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "key": "{color.palette.amber-200}"
+    },
+    "name": "token-color-palette-amber-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-200"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-100}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "key": "{color.palette.amber-100}"
+    },
+    "name": "token-color-palette-amber-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-100"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-50}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "key": "{color.palette.amber-50}"
+    },
+    "name": "token-color-palette-amber-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-50"
+    ]
+  },
+  {
+    "key": "{color.palette.red-500}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "key": "{color.palette.red-500}"
+    },
+    "name": "token-color-palette-red-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-500"
+    ]
+  },
+  {
+    "key": "{color.palette.red-400}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "key": "{color.palette.red-400}"
+    },
+    "name": "token-color-palette-red-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-400"
+    ]
+  },
+  {
+    "key": "{color.palette.red-300}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "key": "{color.palette.red-300}"
+    },
+    "name": "token-color-palette-red-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-300"
+    ]
+  },
+  {
+    "key": "{color.palette.red-200}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "key": "{color.palette.red-200}"
+    },
+    "name": "token-color-palette-red-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-200"
+    ]
+  },
+  {
+    "key": "{color.palette.red-100}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "key": "{color.palette.red-100}"
+    },
+    "name": "token-color-palette-red-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-100"
+    ]
+  },
+  {
+    "key": "{color.palette.red-50}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "key": "{color.palette.red-50}"
+    },
+    "name": "token-color-palette-red-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-700}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "key": "{color.palette.neutral-700}"
+    },
+    "name": "token-color-palette-neutral-700",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-700"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-600}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "key": "{color.palette.neutral-600}"
+    },
+    "name": "token-color-palette-neutral-600",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-600"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-500}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "key": "{color.palette.neutral-500}"
+    },
+    "name": "token-color-palette-neutral-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-500"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-400}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "key": "{color.palette.neutral-400}"
+    },
+    "name": "token-color-palette-neutral-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-400"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-300}",
+    "$type": "color",
+    "$value": "#c2c5cb",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "key": "{color.palette.neutral-300}"
+    },
+    "name": "token-color-palette-neutral-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-300"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-200}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "key": "{color.palette.neutral-200}"
+    },
+    "name": "token-color-palette-neutral-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-200"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-100}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "key": "{color.palette.neutral-100}"
+    },
+    "name": "token-color-palette-neutral-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-100"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-50}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "key": "{color.palette.neutral-50}"
+    },
+    "name": "token-color-palette-neutral-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-0}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "palette",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#ffffff",
+      "cds-g10": "#ffffff",
+      "cds-g90": "#ffffff",
+      "cds-g100": "#ffffff"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.color.white.0}",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.color.white.0}",
+        "cds-g10": "{carbon.color.white.0}",
+        "cds-g90": "{carbon.color.white.0}",
+        "cds-g100": "{carbon.color.white.0}"
+      },
+      "key": "{color.palette.neutral-0}"
+    },
+    "name": "token-color-palette-neutral-0",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-0"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-300}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "alpha": "0.4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-600}",
+      "alpha": "0.4",
+      "group": "palette",
+      "key": "{color.palette.alpha-300}"
+    },
+    "name": "token-color-palette-alpha-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-300"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-200}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "alpha": "0.2",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.2",
+      "group": "palette",
+      "key": "{color.palette.alpha-200}"
+    },
+    "name": "token-color-palette-alpha-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-200"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-100}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "alpha": "0.1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.1",
+      "group": "palette",
+      "key": "{color.palette.alpha-100}"
+    },
+    "name": "token-color-palette-alpha-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-100"
+    ]
+  },
+  {
+    "key": "{color.border.primary}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-200}",
+      "group": "semantic",
+      "key": "{color.border.primary}"
+    },
+    "name": "token-color-border-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.border.faint}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-100}",
+      "group": "semantic",
+      "key": "{color.border.faint}"
+    },
+    "name": "token-color-border-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.border.strong}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-300}",
+      "group": "semantic",
+      "key": "{color.border.strong}"
+    },
+    "name": "token-color-border-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.border.action}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-100}",
+      "group": "semantic",
+      "key": "{color.border.action}"
+    },
+    "name": "token-color-border-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.border.highlight}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-100}",
+      "group": "semantic",
+      "key": "{color.border.highlight}"
+    },
+    "name": "token-color-border-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.border.success}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-100}",
+      "group": "semantic",
+      "key": "{color.border.success}"
+    },
+    "name": "token-color-border-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.border.warning}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-100}",
+      "group": "semantic",
+      "key": "{color.border.warning}"
+    },
+    "name": "token-color-border-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.border.critical}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-100}",
+      "group": "semantic",
+      "key": "{color.border.critical}"
+    },
+    "name": "token-color-border-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.focus.action.internal}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.focus.action.internal}"
+    },
+    "name": "token-color-focus-action-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.action.external}",
+    "$type": "color",
+    "$value": "#5990ff",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.action.external}"
+    },
+    "name": "token-color-focus-action-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.internal}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.focus.critical.internal}"
+    },
+    "name": "token-color-focus-critical-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.external}",
+    "$type": "color",
+    "$value": "#dd7578",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.critical.external}"
+    },
+    "name": "token-color-focus-critical-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.foreground.strong}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-700}",
+      "group": "semantic",
+      "key": "{color.foreground.strong}"
+    },
+    "name": "token-color-foreground-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.foreground.primary}",
+    "$type": "color",
+    "$value": "#f4f4f4",
+    "group": "semantic",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#161616",
+      "cds-g10": "#161616",
+      "cds-g90": "#f4f4f4",
+      "cds-g100": "#f4f4f4"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.themes.g100.textPrimary}",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.themes.white.textPrimary}",
+        "cds-g10": "{carbon.themes.g10.textPrimary}",
+        "cds-g90": "{carbon.themes.g90.textPrimary}",
+        "cds-g100": "{carbon.themes.g100.textPrimary}"
+      },
+      "key": "{color.foreground.primary}"
+    },
+    "name": "token-color-foreground-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.foreground.faint}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "semantic",
+      "key": "{color.foreground.faint}"
+    },
+    "name": "token-color-foreground-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.foreground.high-contrast}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.foreground.high-contrast}"
+    },
+    "name": "token-color-foreground-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.disabled}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "semantic",
+      "key": "{color.foreground.disabled}"
+    },
+    "name": "token-color-foreground-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "disabled"
+    ]
+  },
+  {
+    "key": "{color.foreground.action}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "semantic",
+      "key": "{color.foreground.action}"
+    },
+    "name": "token-color-foreground-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.foreground.action-hover}"
+    },
+    "name": "token-color-foreground-action-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-hover"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-active}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "semantic",
+      "key": "{color.foreground.action-active}"
+    },
+    "name": "token-color-foreground-action-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-active"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-200}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight}"
+    },
+    "name": "token-color-foreground-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-on-surface}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-300}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-on-surface}"
+    },
+    "name": "token-color-foreground-highlight-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-high-contrast}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-500}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-high-contrast}"
+    },
+    "name": "token-color-foreground-highlight-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.success}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-200}",
+      "group": "semantic",
+      "key": "{color.foreground.success}"
+    },
+    "name": "token-color-foreground-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-on-surface}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-300}",
+      "group": "semantic",
+      "key": "{color.foreground.success-on-surface}"
+    },
+    "name": "token-color-foreground-success-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-high-contrast}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-500}",
+      "group": "semantic",
+      "key": "{color.foreground.success-high-contrast}"
+    },
+    "name": "token-color-foreground-success-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-200}",
+      "group": "semantic",
+      "key": "{color.foreground.warning}"
+    },
+    "name": "token-color-foreground-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-on-surface}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-300}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-on-surface}"
+    },
+    "name": "token-color-foreground-warning-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-high-contrast}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-500}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-high-contrast}"
+    },
+    "name": "token-color-foreground-warning-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-200}",
+      "group": "semantic",
+      "key": "{color.foreground.critical}"
+    },
+    "name": "token-color-foreground-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-on-surface}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-on-surface}"
+    },
+    "name": "token-color-foreground-critical-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-high-contrast}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-500}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-high-contrast}"
+    },
+    "name": "token-color-foreground-critical-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.page.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.page.primary}"
+    },
+    "name": "token-color-page-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.page.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.page.faint}"
+    },
+    "name": "token-color-page-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.primary}"
+    },
+    "name": "token-color-surface-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.surface.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.faint}"
+    },
+    "name": "token-color-surface-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.strong}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.strong}"
+    },
+    "name": "token-color-surface-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.interactive}"
+    },
+    "name": "token-color-surface-interactive",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-hover}"
+    },
+    "name": "token-color-surface-interactive-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-200}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-active}"
+    },
+    "name": "token-color-surface-interactive-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-disabled}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-disabled}"
+    },
+    "name": "token-color-surface-interactive-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-disabled"
+    ]
+  },
+  {
+    "key": "{color.surface.action}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-50}",
+      "group": "semantic",
+      "key": "{color.surface.action}"
+    },
+    "name": "token-color-surface-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.surface.highlight}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-50}",
+      "group": "semantic",
+      "key": "{color.surface.highlight}"
+    },
+    "name": "token-color-surface-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.surface.success}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-50}",
+      "group": "semantic",
+      "key": "{color.surface.success}"
+    },
+    "name": "token-color-surface-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.surface.warning}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-50}",
+      "group": "semantic",
+      "key": "{color.surface.warning}"
+    },
+    "name": "token-color-surface-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.surface.critical}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-50}",
+      "group": "semantic",
+      "key": "{color.surface.critical}"
+    },
+    "name": "token-color-surface-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.hashicorp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hashicorp-brand}",
+      "group": "branding",
+      "key": "{color.hashicorp.brand}"
+    },
+    "name": "token-color-hashicorp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hashicorp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.brand}",
+    "$type": "color",
+    "$value": "#f24c53",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-brand}",
+      "group": "branding",
+      "key": "{color.boundary.brand}"
+    },
+    "name": "token-color-boundary-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.foreground}",
+    "$type": "color",
+    "$value": "#cf2d32",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-500}",
+      "group": "branding",
+      "key": "{color.boundary.foreground}"
+    },
+    "name": "token-color-boundary-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.boundary.surface}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.surface}"
+    },
+    "name": "token-color-boundary-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.boundary.border}",
+    "$type": "color",
+    "$value": "#fbd7d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-100}",
+      "group": "branding",
+      "key": "{color.boundary.border}"
+    },
+    "name": "token-color-boundary-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#f97076",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-300}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.start}"
+    },
+    "name": "token-color-boundary-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#db363b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-400}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.stop}"
+    },
+    "name": "token-color-boundary-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffafa",
+    "group": "branding",
+    "comment": "this is the 'boundary-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "key": "{color.boundary.gradient.faint.start}"
+    },
+    "name": "token-color-boundary-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.faint.stop}"
+    },
+    "name": "token-color-boundary-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.brand}",
+    "$type": "color",
+    "$value": "#e03875",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-brand}",
+      "group": "branding",
+      "key": "{color.consul.brand}"
+    },
+    "name": "token-color-consul-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.consul.foreground}",
+    "$type": "color",
+    "$value": "#d01c5b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-500}",
+      "group": "branding",
+      "key": "{color.consul.foreground}"
+    },
+    "name": "token-color-consul-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.consul.surface}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.surface}"
+    },
+    "name": "token-color-consul-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.consul.border}",
+    "$type": "color",
+    "$value": "#ffcede",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-100}",
+      "group": "branding",
+      "key": "{color.consul.border}"
+    },
+    "name": "token-color-consul-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#ff99be",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-300}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.start}"
+    },
+    "name": "token-color-consul-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#da306e",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-400}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.stop}"
+    },
+    "name": "token-color-consul-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fff9fb",
+    "group": "branding",
+    "comment": "this is the 'consul-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "key": "{color.consul.gradient.faint.start}"
+    },
+    "name": "token-color-consul-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.gradient.faint.stop}"
+    },
+    "name": "token-color-consul-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.hcp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hcp-brand}",
+      "group": "branding",
+      "key": "{color.hcp.brand}"
+    },
+    "name": "token-color-hcp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hcp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.brand}",
+    "$type": "color",
+    "$value": "#06d092",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-brand}",
+      "group": "branding",
+      "key": "{color.nomad.brand}"
+    },
+    "name": "token-color-nomad-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.foreground}",
+    "$type": "color",
+    "$value": "#008661",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-500}",
+      "group": "branding",
+      "key": "{color.nomad.foreground}"
+    },
+    "name": "token-color-nomad-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.nomad.surface}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.surface}"
+    },
+    "name": "token-color-nomad-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.nomad.border}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.border}"
+    },
+    "name": "token-color-nomad-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.start}"
+    },
+    "name": "token-color-nomad-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#60dea9",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-200}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.stop}"
+    },
+    "name": "token-color-nomad-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fff9",
+    "group": "branding",
+    "comment": "this is the 'nomad-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "key": "{color.nomad.gradient.faint.start}"
+    },
+    "name": "token-color-nomad-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.faint.stop}"
+    },
+    "name": "token-color-nomad-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.brand}",
+    "$type": "color",
+    "$value": "#02a8ef",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-brand}",
+      "group": "branding",
+      "key": "{color.packer.brand}"
+    },
+    "name": "token-color-packer-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.packer.foreground}",
+    "$type": "color",
+    "$value": "#007eb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-500}",
+      "group": "branding",
+      "key": "{color.packer.foreground}"
+    },
+    "name": "token-color-packer-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.packer.surface}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.surface}"
+    },
+    "name": "token-color-packer-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.packer.border}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.border}"
+    },
+    "name": "token-color-packer-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.start}"
+    },
+    "name": "token-color-packer-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#63d0ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-200}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.stop}"
+    },
+    "name": "token-color-packer-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fcff",
+    "group": "branding",
+    "comment": "this is the 'packer-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#F3FCFF",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "key": "{color.packer.gradient.faint.start}"
+    },
+    "name": "token-color-packer-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.gradient.faint.stop}"
+    },
+    "name": "token-color-packer-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand}",
+    "$type": "color",
+    "$value": "#7b42bc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-brand}",
+      "group": "branding",
+      "key": "{color.terraform.brand}"
+    },
+    "name": "token-color-terraform-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand-on-dark}",
+    "$type": "color",
+    "$value": "#a067da",
+    "group": "branding",
+    "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+    "original": {
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "key": "{color.terraform.brand-on-dark}"
+    },
+    "name": "token-color-terraform-brand-on-dark",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand-on-dark"
+    ]
+  },
+  {
+    "key": "{color.terraform.foreground}",
+    "$type": "color",
+    "$value": "#773cb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-500}",
+      "group": "branding",
+      "key": "{color.terraform.foreground}"
+    },
+    "name": "token-color-terraform-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.terraform.surface}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.surface}"
+    },
+    "name": "token-color-terraform-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.terraform.border}",
+    "$type": "color",
+    "$value": "#ebdbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-100}",
+      "group": "branding",
+      "key": "{color.terraform.border}"
+    },
+    "name": "token-color-terraform-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bb8deb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-300}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.start}"
+    },
+    "name": "token-color-terraform-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#844fba",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-400}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.stop}"
+    },
+    "name": "token-color-terraform-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fcfaff",
+    "group": "branding",
+    "comment": "this is the 'terraform-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "key": "{color.terraform.gradient.faint.start}"
+    },
+    "name": "token-color-terraform-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.faint.stop}"
+    },
+    "name": "token-color-terraform-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.brand}",
+    "$type": "color",
+    "$value": "#1868f2",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-brand}",
+      "group": "branding",
+      "key": "{color.vagrant.brand}"
+    },
+    "name": "token-color-vagrant-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vagrant.foreground}",
+    "$type": "color",
+    "$value": "#1c61d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-500}",
+      "group": "branding",
+      "key": "{color.vagrant.foreground}"
+    },
+    "name": "token-color-vagrant-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vagrant.surface}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.surface}"
+    },
+    "name": "token-color-vagrant-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vagrant.border}",
+    "$type": "color",
+    "$value": "#c7dbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-100}",
+      "group": "branding",
+      "key": "{color.vagrant.border}"
+    },
+    "name": "token-color-vagrant-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#639cff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-300}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.start}"
+    },
+    "name": "token-color-vagrant-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#2e71e5",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-400}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.stop}"
+    },
+    "name": "token-color-vagrant-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f4faff",
+    "group": "branding",
+    "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "key": "{color.vagrant.gradient.faint.start}"
+    },
+    "name": "token-color-vagrant-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.faint.stop}"
+    },
+    "name": "token-color-vagrant-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-brand}",
+      "group": "branding",
+      "key": "{color.vault-radar.brand}"
+    },
+    "name": "token-color-vault-radar-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "key": "{color.vault-radar.brand-alt}"
+    },
+    "name": "token-color-vault-radar-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-500}",
+      "group": "branding",
+      "key": "{color.vault-radar.foreground}"
+    },
+    "name": "token-color-vault-radar-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.surface}"
+    },
+    "name": "token-color-vault-radar-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.border}"
+    },
+    "name": "token-color-vault-radar-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.start}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-200}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "key": "{color.vault-radar.gradient.faint.start}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-brand}",
+      "group": "branding",
+      "key": "{color.vault-secrets.brand}"
+    },
+    "name": "token-color-vault-secrets-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand-alt}",
+    "group": "branding",
+    "$type": "color",
+    "$value": "#000000",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+    "original": {
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "key": "{color.vault-secrets.brand-alt}"
+    },
+    "name": "token-color-vault-secrets-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-500}",
+      "group": "branding",
+      "key": "{color.vault-secrets.foreground}"
+    },
+    "name": "token-color-vault-secrets-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.surface}"
+    },
+    "name": "token-color-vault-secrets-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.border}"
+    },
+    "name": "token-color-vault-secrets-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-200}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "key": "{color.vault-secrets.gradient.faint.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-brand}",
+      "group": "branding",
+      "key": "{color.vault.brand}"
+    },
+    "name": "token-color-vault-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "key": "{color.vault.brand-alt}"
+    },
+    "name": "token-color-vault-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-500}",
+      "group": "branding",
+      "key": "{color.vault.foreground}"
+    },
+    "name": "token-color-vault-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.surface}"
+    },
+    "name": "token-color-vault-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.border}"
+    },
+    "name": "token-color-vault-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.start}"
+    },
+    "name": "token-color-vault-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-200}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "key": "{color.vault.gradient.faint.start}"
+    },
+    "name": "token-color-vault-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.brand}",
+    "$type": "color",
+    "$value": "#14c6cb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-brand}",
+      "group": "branding",
+      "key": "{color.waypoint.brand}"
+    },
+    "name": "token-color-waypoint-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.waypoint.foreground}",
+    "$type": "color",
+    "$value": "#008196",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-500}",
+      "group": "branding",
+      "key": "{color.waypoint.foreground}"
+    },
+    "name": "token-color-waypoint-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.waypoint.surface}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.surface}"
+    },
+    "name": "token-color-waypoint-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.waypoint.border}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.border}"
+    },
+    "name": "token-color-waypoint-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.start}"
+    },
+    "name": "token-color-waypoint-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#62d4dc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-200}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.stop}"
+    },
+    "name": "token-color-waypoint-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f6feff",
+    "group": "branding",
+    "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "key": "{color.waypoint.gradient.faint.start}"
+    },
+    "name": "token-color-waypoint-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.faint.stop}"
+    },
+    "name": "token-color-waypoint-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{elevation.inset.box-shadow}",
+    "$value": "inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-01}",
+      "key": "{elevation.inset.box-shadow}"
+    },
+    "name": "token-elevation-inset-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.low.box-shadow}",
+    "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+      "key": "{elevation.low.box-shadow}"
+    },
+    "name": "token-elevation-low-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.mid.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+      "key": "{elevation.mid.box-shadow}"
+    },
+    "name": "token-elevation-mid-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.high.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+      "key": "{elevation.high.box-shadow}"
+    },
+    "name": "token-elevation-high-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.higher.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+      "key": "{elevation.higher.box-shadow}"
+    },
+    "name": "token-elevation-higher-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.overlay.box-shadow}",
+    "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+      "key": "{elevation.overlay.box-shadow}"
+    },
+    "name": "token-elevation-overlay-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.inset.box-shadow}",
+    "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+      "key": "{surface.inset.box-shadow}"
+    },
+    "name": "token-surface-inset-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.base.box-shadow}",
+    "$value": "0 0 0 1px #656a7633",
+    "original": {
+      "$value": "{elevation.base.box-shadow-border}",
+      "key": "{surface.base.box-shadow}"
+    },
+    "name": "token-surface-base-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "base",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.low.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+      "key": "{surface.low.box-shadow}"
+    },
+    "name": "token-surface-low-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.mid.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+      "key": "{surface.mid.box-shadow}"
+    },
+    "name": "token-surface-mid-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.high.box-shadow}",
+    "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+      "key": "{surface.high.box-shadow}"
+    },
+    "name": "token-surface-high-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.higher.box-shadow}",
+    "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+      "key": "{surface.higher.box-shadow}"
+    },
+    "name": "token-surface-higher-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.overlay.box-shadow}",
+    "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+      "key": "{surface.overlay.box-shadow}"
+    },
+    "name": "token-surface-overlay-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.action.box-shadow}",
+    "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+    "original": {
+      "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+      "key": "{focus-ring.action.box-shadow}"
+    },
+    "name": "token-focus-ring-action-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "action",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.critical.box-shadow}",
+    "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+    "original": {
+      "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+      "key": "{focus-ring.critical.box-shadow}"
+    },
+    "name": "token-focus-ring-critical-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "critical",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{app-header.height}",
+    "$type": "dimension",
+    "$value": "60px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "60",
+      "unit": "px",
+      "key": "{app-header.height}"
+    },
+    "name": "token-app-header-height",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-header.home-link.size}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-header.home-link.size}"
+    },
+    "name": "token-app-header-home-link-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "home-link",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-header.logo.size}",
+    "$type": "dimension",
+    "$value": "28px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "28",
+      "unit": "px",
+      "key": "{app-header.logo.size}"
+    },
+    "name": "token-app-header-logo-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "logo",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.border.width}"
+    },
+    "name": "token-app-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-200)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "key": "{app-side-nav.wrapper.border.color}"
+    },
+    "name": "token-app-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-app-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.padding}"
+    },
+    "name": "token-app-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.header.actions.spacing}"
+    },
+    "name": "token-app-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{app-side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.height}"
+    },
+    "name": "token-app-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-app-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.primary}"
+    },
+    "name": "token-app-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.strong}"
+    },
+    "name": "token-app-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.faint}"
+    },
+    "name": "token-app-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.surface.primary}"
+    },
+    "name": "token-app-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-interactive-hover)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-300)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{form.label.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.label.color}"
+    },
+    "name": "token-form-label-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "label",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.legend.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{form.label.color}",
+      "group": "components",
+      "key": "{form.legend.color}"
+    },
+    "name": "token-form-legend-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "legend",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.helper-text.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.helper-text.color}"
+    },
+    "name": "token-form-helper-text-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "helper-text",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.indicator.optional.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.indicator.optional.color}"
+    },
+    "name": "token-form-indicator-optional-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "indicator",
+      "optional",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.color}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.error.color}"
+    },
+    "name": "token-form-error-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.icon-size}",
+    "$type": "dimension",
+    "$value": "14px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "14",
+      "unit": "px",
+      "key": "{form.error.icon-size}"
+    },
+    "name": "token-form-error-icon-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "icon-size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.checkbox.size}"
+    },
+    "name": "token-form-checkbox-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.checkbox.border.radius}"
+    },
+    "name": "token-form-checkbox-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.checkbox.border.width}"
+    },
+    "name": "token-form-checkbox-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.checkbox.background-image.size}"
+    },
+    "name": "token-form-checkbox-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url}"
+    },
+    "name": "token-form-checkbox-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate-disabled"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.value-color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.control.base.foreground.value-color}"
+    },
+    "name": "token-form-control-base-foreground-value-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "value-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.placeholder-color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.control.base.foreground.placeholder-color}"
+    },
+    "name": "token-form-control-base-foreground-placeholder-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "placeholder-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.default}"
+    },
+    "name": "token-form-control-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-hover}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.hover}"
+    },
+    "name": "token-form-control-base-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.default}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "components",
+      "key": "{form.control.base.border-color.default}"
+    },
+    "name": "token-form-control-base-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.hover}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "components",
+      "key": "{form.control.base.border-color.hover}"
+    },
+    "name": "token-form-control-base-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.foreground-color}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.high-contrast}",
+      "group": "components",
+      "key": "{form.control.checked.foreground-color}"
+    },
+    "name": "token-form-control-checked-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.default}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.default}"
+    },
+    "name": "token-form-control-checked-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.hover}"
+    },
+    "name": "token-form-control-checked-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.default}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.default}"
+    },
+    "name": "token-form-control-checked-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.hover}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.hover}"
+    },
+    "name": "token-form-control-checked-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.default}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.default}"
+    },
+    "name": "token-form-control-invalid-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.hover}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-400}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.hover}"
+    },
+    "name": "token-form-control-invalid-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.foreground-color}",
+    "$type": "color",
+    "$value": "#f4f4f4",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.primary}",
+      "group": "components",
+      "key": "{form.control.readonly.foreground-color}"
+    },
+    "name": "token-form-control-readonly-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.surface-color}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "key": "{form.control.readonly.surface-color}"
+    },
+    "name": "token-form-control-readonly-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.border-color}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.faint}",
+      "group": "components",
+      "key": "{form.control.readonly.border-color}"
+    },
+    "name": "token-form-control-readonly-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.foreground-color}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.foreground-color}"
+    },
+    "name": "token-form-control-disabled-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.surface-color}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.surface-color}"
+    },
+    "name": "token-form-control-disabled-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.border-color}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.primary}",
+      "group": "components",
+      "key": "{form.control.disabled.border-color}"
+    },
+    "name": "token-form-control-disabled-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.padding}",
+    "$type": "dimension",
+    "$value": "7px",
+    "unit": "px",
+    "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+    "original": {
+      "$type": "dimension",
+      "$value": "7",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "key": "{form.control.padding}"
+    },
+    "name": "token-form-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "padding"
+    ]
+  },
+  {
+    "key": "{form.control.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{form.control.border.radius}"
+    },
+    "name": "token-form-control-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.control.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.control.border.width}"
+    },
+    "name": "token-form-control-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radio.size}"
+    },
+    "name": "token-form-radio-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radio.border.width}"
+    },
+    "name": "token-form-radio-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.radio.background-image.size}"
+    },
+    "name": "token-form-radio-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url}"
+    },
+    "name": "token-form-radio-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url-disabled}"
+    },
+    "name": "token-form-radio-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.radiocard-group.gap}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radiocard-group.gap}"
+    },
+    "name": "token-form-radiocard-group-gap",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard-group",
+      "gap"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radiocard.border.width}"
+    },
+    "name": "token-form-radiocard-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.radius}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{form.radiocard.border.radius}"
+    },
+    "name": "token-form-radiocard-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.radiocard.content-padding}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{form.radiocard.content-padding}"
+    },
+    "name": "token-form-radiocard-content-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "content-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.control-padding}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{form.radiocard.control-padding}"
+    },
+    "name": "token-form-radiocard-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "control-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.radiocard.transition.duration}"
+    },
+    "name": "token-form-radiocard-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.select.background-image.size}"
+    },
+    "name": "token-form-select-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-right-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.select.background-image.position-right-x}"
+    },
+    "name": "token-form-select-background-image-position-right-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-right-x"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-top-y}",
+    "$type": "dimension",
+    "$value": "9px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "9",
+      "unit": "px",
+      "key": "{form.select.background-image.position-top-y}"
+    },
+    "name": "token-form-select-background-image-position-top-y",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-top-y"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url}"
+    },
+    "name": "token-form-select-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url-disabled}"
+    },
+    "name": "token-form-select-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.text-input.background-image.size}"
+    },
+    "name": "token-form-text-input-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.text-input.background-image.position-x}"
+    },
+    "name": "token-form-text-input-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-date}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-date}"
+    },
+    "name": "token-form-text-input-background-image-data-url-date",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-date"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-time}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-time}"
+    },
+    "name": "token-form-text-input-background-image-data-url-time",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-time"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-cancel}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-cancel}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-cancel",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-cancel"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-loading}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color and animation are hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-loading}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-loading",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-loading"
+    ]
+  },
+  {
+    "key": "{form.toggle.width}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{form.toggle.width}"
+    },
+    "name": "token-form-toggle-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.height}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.toggle.height}"
+    },
+    "name": "token-form-toggle-height",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "height"
+    ]
+  },
+  {
+    "key": "{form.toggle.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "comment": "the toggle has a different base surface color, compared to the other controls",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "key": "{form.toggle.base.surface-color.default}"
+    },
+    "name": "token-form-toggle-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.toggle.border.radius}"
+    },
+    "name": "token-form-toggle-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.toggle.border.width}"
+    },
+    "name": "token-form-toggle-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.toggle.background-image.size}"
+    },
+    "name": "token-form-toggle-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{form.toggle.background-image.position-x}"
+    },
+    "name": "token-form-toggle-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url}"
+    },
+    "name": "token-form-toggle-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url-disabled}"
+    },
+    "name": "token-form-toggle-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.toggle.transition.duration}"
+    },
+    "name": "token-form-toggle-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.timing-function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.68,
+        -0.2,
+        0.265,
+        1.15
+      ],
+      "key": "{form.toggle.transition.timing-function}"
+    },
+    "name": "token-form-toggle-transition-timing-function",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "timing-function"
+    ]
+  },
+  {
+    "key": "{form.toggle.thumb-size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.toggle.height}",
+      "key": "{form.toggle.thumb-size}"
+    },
+    "name": "token-form-toggle-thumb-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "thumb-size"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{pagination.nav.control.height}"
+    },
+    "name": "token-pagination-nav-control-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{pagination.nav.control.padding.horizontal}"
+    },
+    "name": "token-pagination-nav-control-padding-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.focus-inset}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{pagination.nav.control.focus-inset}"
+    },
+    "name": "token-pagination-nav-control-focus-inset",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.icon-spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.control.icon-spacing}"
+    },
+    "name": "token-pagination-nav-control-icon-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "icon-spacing"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.height}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.height}"
+    },
+    "name": "token-pagination-nav-indicator-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.spacing}"
+    },
+    "name": "token-pagination-nav-indicator-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{pagination.child.spacing.vertical}"
+    },
+    "name": "token-pagination-child-spacing-vertical",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.horizontal}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{pagination.child.spacing.horizontal}"
+    },
+    "name": "token-pagination-child-spacing-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{side-nav.wrapper.border.width}"
+    },
+    "name": "token-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "key": "{side-nav.wrapper.border.color}"
+    },
+    "name": "token-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.padding}"
+    },
+    "name": "token-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.header.actions.spacing}"
+    },
+    "name": "token-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.height}"
+    },
+    "name": "token-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "key": "{side-nav.color.foreground.primary}"
+    },
+    "name": "token-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#fff",
+      "group": "components",
+      "key": "{side-nav.color.foreground.strong}"
+    },
+    "name": "token-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "key": "{side-nav.color.foreground.faint}"
+    },
+    "name": "token-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "key": "{side-nav.color.surface.primary}"
+    },
+    "name": "token-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.medium}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{tabs.tab.height.medium}"
+    },
+    "name": "token-tabs-tab-height-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.large}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{tabs.tab.height.large}"
+    },
+    "name": "token-tabs-tab-height-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.medium}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.medium}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.large}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.large}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.vertical}",
+    "$type": "dimension",
+    "$value": "0px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "0",
+      "unit": "px",
+      "key": "{tabs.tab.padding.vertical}"
+    },
+    "name": "token-tabs-tab-padding-vertical",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tabs.tab.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tabs.tab.border-radius}"
+    },
+    "name": "token-tabs-tab-border-radius",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tabs.tab.focus-inset}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.focus-inset}"
+    },
+    "name": "token-tabs-tab-focus-inset",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{tabs.tab.gutter}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.gutter}"
+    },
+    "name": "token-tabs-tab-gutter",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "gutter"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.height}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{tabs.indicator.height}"
+    },
+    "name": "token-tabs-indicator-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.5,
+        1,
+        0.89,
+        1
+      ],
+      "key": "{tabs.indicator.transition.function}"
+    },
+    "name": "token-tabs-indicator-transition-function",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.duration}",
+    "$type": "duration",
+    "$value": "0.6s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.6",
+      "unit": "s",
+      "key": "{tabs.indicator.transition.duration}"
+    },
+    "name": "token-tabs-indicator-transition-duration",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{tabs.divider.height}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{tabs.divider.height}"
+    },
+    "name": "token-tabs-divider-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "divider",
+      "height"
+    ]
+  },
+  {
+    "key": "{tooltip.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tooltip.border-radius}"
+    },
+    "name": "token-tooltip-border-radius",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tooltip.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-high-contrast)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "key": "{tooltip.color.foreground.primary}"
+    },
+    "name": "token-tooltip-color-foreground-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-700)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "key": "{tooltip.color.surface.primary}"
+    },
+    "name": "token-tooltip-color-surface-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.focus-offset}",
+    "$type": "dimension",
+    "$value": "-2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "-2",
+      "unit": "px",
+      "key": "{tooltip.focus-offset}"
+    },
+    "name": "token-tooltip-focus-offset",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "focus-offset"
+    ]
+  },
+  {
+    "key": "{tooltip.max-width}",
+    "$type": "dimension",
+    "$value": "280px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "280",
+      "unit": "px",
+      "key": "{tooltip.max-width}"
+    },
+    "name": "token-tooltip-max-width",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "max-width"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tooltip.padding.horizontal}"
+    },
+    "name": "token-tooltip-padding-horizontal",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{tooltip.padding.vertical}"
+    },
+    "name": "token-tooltip-padding-vertical",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tooltip.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.54,
+        1.5,
+        0.38,
+        1.11
+      ],
+      "key": "{tooltip.transition.function}"
+    },
+    "name": "token-tooltip-transition-function",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.display}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.display.macOS}",
+        "{typography.font-stack.sans.display.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.display.emoji}"
+      ],
+      "key": "{typography.font-stack.display}"
+    },
+    "name": "token-typography-font-stack-display",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "display"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.text}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.text.macOS}",
+        "{typography.font-stack.sans.text.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.text.emoji}"
+      ],
+      "key": "{typography.font-stack.text}"
+    },
+    "name": "token-typography-font-stack-text",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "text"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.code}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.monospace.code.macOS}",
+        "{typography.font-stack.monospace.code.windows}",
+        "monospace"
+      ],
+      "key": "{typography.font-stack.code}"
+    },
+    "name": "token-typography-font-stack-code",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "code"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.regular}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "400",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "400",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.regular}"
+    },
+    "name": "token-typography-font-weight-regular",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "regular"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.medium}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "500",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "500",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.medium}"
+    },
+    "name": "token-typography-font-weight-medium",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "medium"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.semibold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "600",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "600",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.semibold}"
+    },
+    "name": "token-typography-font-weight-semibold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "semibold"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.bold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "700",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "700",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.bold}"
+    },
+    "name": "token-typography-font-weight-bold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "bold"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-500.font-family}"
+    },
+    "name": "token-typography-display-500-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-size}",
+    "$type": "font-size",
+    "$value": "1.875rem",
+    "unit": "px",
+    "comment": "30px/1.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "30",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "key": "{typography.display-500.font-size}"
+    },
+    "name": "token-typography-display-500-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-500.line-height}",
+    "$type": "number",
+    "$value": 1.2666,
+    "comment": "38px",
+    "original": {
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "key": "{typography.display-500.line-height}"
+    },
+    "name": "token-typography-display-500-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-400.font-family}"
+    },
+    "name": "token-typography-display-400-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-size}",
+    "$type": "font-size",
+    "$value": "1.5rem",
+    "unit": "px",
+    "comment": "24px/1.5rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "24",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "key": "{typography.display-400.font-size}"
+    },
+    "name": "token-typography-display-400-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-400.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "32px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "key": "{typography.display-400.line-height}"
+    },
+    "name": "token-typography-display-400-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-300.font-family}"
+    },
+    "name": "token-typography-display-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-size}",
+    "$type": "font-size",
+    "$value": "1.125rem",
+    "unit": "px",
+    "comment": "18px/1.125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "18",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "key": "{typography.display-300.font-size}"
+    },
+    "name": "token-typography-display-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-300.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "key": "{typography.display-300.line-height}"
+    },
+    "name": "token-typography-display-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-300.letter-spacing}"
+    },
+    "name": "token-typography-display-300-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-200.font-family}"
+    },
+    "name": "token-typography-display-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.display-200.font-size}"
+    },
+    "name": "token-typography-display-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-200.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.display-200.line-height}"
+    },
+    "name": "token-typography-display-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-200.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-200.letter-spacing}"
+    },
+    "name": "token-typography-display-200-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-100.font-family}"
+    },
+    "name": "token-typography-display-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.display-100.font-size}"
+    },
+    "name": "token-typography-display-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.display-100.line-height}"
+    },
+    "name": "token-typography-display-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-300.font-family}"
+    },
+    "name": "token-typography-body-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.body-300.font-size}"
+    },
+    "name": "token-typography-body-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-300.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.body-300.line-height}"
+    },
+    "name": "token-typography-body-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-200.font-family}"
+    },
+    "name": "token-typography-body-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.body-200.font-size}"
+    },
+    "name": "token-typography-body-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-200.line-height}",
+    "$type": "number",
+    "$value": 1.4286,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "key": "{typography.body-200.line-height}"
+    },
+    "name": "token-typography-body-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-100.font-family}"
+    },
+    "name": "token-typography-body-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.body-100.font-size}"
+    },
+    "name": "token-typography-body-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.body-100.line-height}"
+    },
+    "name": "token-typography-body-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-100.font-family}"
+    },
+    "name": "token-typography-code-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.code-100.font-size}"
+    },
+    "name": "token-typography-code-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-100.line-height}",
+    "$type": "number",
+    "$value": 1.23,
+    "comment": "16px",
+    "original": {
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "key": "{typography.code-100.line-height}"
+    },
+    "name": "token-typography-code-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-200.font-family}"
+    },
+    "name": "token-typography-code-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.code-200.font-size}"
+    },
+    "name": "token-typography-code-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-200.line-height}",
+    "$type": "number",
+    "$value": 1.125,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "key": "{typography.code-200.line-height}"
+    },
+    "name": "token-typography-code-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-300.font-family}"
+    },
+    "name": "token-typography-code-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.code-300.font-size}"
+    },
+    "name": "token-typography-code-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-300.line-height}",
+    "$type": "number",
+    "$value": 1.25,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "key": "{typography.code-300.line-height}"
+    },
+    "name": "token-typography-code-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "line-height"
+    ]
+  }
+]
\ No newline at end of file
diff --git a/packages/tokens/dist/docs/products/themed-tokens/cds-g90.json b/packages/tokens/dist/docs/products/themed-tokens/cds-g90.json
new file mode 100644
index 00000000000..d16ea7b4f5d
--- /dev/null
+++ b/packages/tokens/dist/docs/products/themed-tokens/cds-g90.json
@@ -0,0 +1,8352 @@
+[
+  {
+    "key": "{border.radius.x-small}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{border.radius.x-small}"
+    },
+    "name": "token-border-radius-x-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "x-small"
+    ]
+  },
+  {
+    "key": "{border.radius.small}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{border.radius.small}"
+    },
+    "name": "token-border-radius-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "small"
+    ]
+  },
+  {
+    "key": "{border.radius.medium}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{border.radius.medium}"
+    },
+    "name": "token-border-radius-medium",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "medium"
+    ]
+  },
+  {
+    "key": "{border.radius.large}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{border.radius.large}"
+    },
+    "name": "token-border-radius-large",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "large"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-500}",
+    "$type": "color",
+    "$value": "#1c345f",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "key": "{color.palette.blue-500}"
+    },
+    "name": "token-color-palette-blue-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-500"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-400}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "key": "{color.palette.blue-400}"
+    },
+    "name": "token-color-palette-blue-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-400"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-300}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "key": "{color.palette.blue-300}"
+    },
+    "name": "token-color-palette-blue-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-300"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-200}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "key": "{color.palette.blue-200}"
+    },
+    "name": "token-color-palette-blue-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-200"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-100}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "key": "{color.palette.blue-100}"
+    },
+    "name": "token-color-palette-blue-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-100"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-50}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "key": "{color.palette.blue-50}"
+    },
+    "name": "token-color-palette-blue-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-50"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-500}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "key": "{color.palette.purple-500}"
+    },
+    "name": "token-color-palette-purple-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-500"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-400}",
+    "$type": "color",
+    "$value": "#7b00db",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "key": "{color.palette.purple-400}"
+    },
+    "name": "token-color-palette-purple-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-400"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-300}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "key": "{color.palette.purple-300}"
+    },
+    "name": "token-color-palette-purple-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-300"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-200}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "key": "{color.palette.purple-200}"
+    },
+    "name": "token-color-palette-purple-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-200"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-100}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "key": "{color.palette.purple-100}"
+    },
+    "name": "token-color-palette-purple-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-100"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-50}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "key": "{color.palette.purple-50}"
+    },
+    "name": "token-color-palette-purple-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-50"
+    ]
+  },
+  {
+    "key": "{color.palette.green-500}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "key": "{color.palette.green-500}"
+    },
+    "name": "token-color-palette-green-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-500"
+    ]
+  },
+  {
+    "key": "{color.palette.green-400}",
+    "$type": "color",
+    "$value": "#006619",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "key": "{color.palette.green-400}"
+    },
+    "name": "token-color-palette-green-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-400"
+    ]
+  },
+  {
+    "key": "{color.palette.green-300}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "key": "{color.palette.green-300}"
+    },
+    "name": "token-color-palette-green-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-300"
+    ]
+  },
+  {
+    "key": "{color.palette.green-200}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "key": "{color.palette.green-200}"
+    },
+    "name": "token-color-palette-green-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-200"
+    ]
+  },
+  {
+    "key": "{color.palette.green-100}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "key": "{color.palette.green-100}"
+    },
+    "name": "token-color-palette-green-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-100"
+    ]
+  },
+  {
+    "key": "{color.palette.green-50}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "key": "{color.palette.green-50}"
+    },
+    "name": "token-color-palette-green-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-50"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-500}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "key": "{color.palette.amber-500}"
+    },
+    "name": "token-color-palette-amber-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-500"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-400}",
+    "$type": "color",
+    "$value": "#803d00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "key": "{color.palette.amber-400}"
+    },
+    "name": "token-color-palette-amber-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-400"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-300}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "key": "{color.palette.amber-300}"
+    },
+    "name": "token-color-palette-amber-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-300"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-200}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "key": "{color.palette.amber-200}"
+    },
+    "name": "token-color-palette-amber-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-200"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-100}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "key": "{color.palette.amber-100}"
+    },
+    "name": "token-color-palette-amber-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-100"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-50}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "key": "{color.palette.amber-50}"
+    },
+    "name": "token-color-palette-amber-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-50"
+    ]
+  },
+  {
+    "key": "{color.palette.red-500}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "key": "{color.palette.red-500}"
+    },
+    "name": "token-color-palette-red-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-500"
+    ]
+  },
+  {
+    "key": "{color.palette.red-400}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "key": "{color.palette.red-400}"
+    },
+    "name": "token-color-palette-red-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-400"
+    ]
+  },
+  {
+    "key": "{color.palette.red-300}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "key": "{color.palette.red-300}"
+    },
+    "name": "token-color-palette-red-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-300"
+    ]
+  },
+  {
+    "key": "{color.palette.red-200}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "key": "{color.palette.red-200}"
+    },
+    "name": "token-color-palette-red-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-200"
+    ]
+  },
+  {
+    "key": "{color.palette.red-100}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "key": "{color.palette.red-100}"
+    },
+    "name": "token-color-palette-red-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-100"
+    ]
+  },
+  {
+    "key": "{color.palette.red-50}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "key": "{color.palette.red-50}"
+    },
+    "name": "token-color-palette-red-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-700}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "key": "{color.palette.neutral-700}"
+    },
+    "name": "token-color-palette-neutral-700",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-700"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-600}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "key": "{color.palette.neutral-600}"
+    },
+    "name": "token-color-palette-neutral-600",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-600"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-500}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "key": "{color.palette.neutral-500}"
+    },
+    "name": "token-color-palette-neutral-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-500"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-400}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "key": "{color.palette.neutral-400}"
+    },
+    "name": "token-color-palette-neutral-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-400"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-300}",
+    "$type": "color",
+    "$value": "#c2c5cb",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "key": "{color.palette.neutral-300}"
+    },
+    "name": "token-color-palette-neutral-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-300"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-200}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "key": "{color.palette.neutral-200}"
+    },
+    "name": "token-color-palette-neutral-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-200"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-100}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "key": "{color.palette.neutral-100}"
+    },
+    "name": "token-color-palette-neutral-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-100"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-50}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "key": "{color.palette.neutral-50}"
+    },
+    "name": "token-color-palette-neutral-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-0}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "palette",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#ffffff",
+      "cds-g10": "#ffffff",
+      "cds-g90": "#ffffff",
+      "cds-g100": "#ffffff"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.color.white.0}",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.color.white.0}",
+        "cds-g10": "{carbon.color.white.0}",
+        "cds-g90": "{carbon.color.white.0}",
+        "cds-g100": "{carbon.color.white.0}"
+      },
+      "key": "{color.palette.neutral-0}"
+    },
+    "name": "token-color-palette-neutral-0",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-0"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-300}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "alpha": "0.4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-600}",
+      "alpha": "0.4",
+      "group": "palette",
+      "key": "{color.palette.alpha-300}"
+    },
+    "name": "token-color-palette-alpha-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-300"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-200}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "alpha": "0.2",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.2",
+      "group": "palette",
+      "key": "{color.palette.alpha-200}"
+    },
+    "name": "token-color-palette-alpha-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-200"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-100}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "alpha": "0.1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.1",
+      "group": "palette",
+      "key": "{color.palette.alpha-100}"
+    },
+    "name": "token-color-palette-alpha-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-100"
+    ]
+  },
+  {
+    "key": "{color.border.primary}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-200}",
+      "group": "semantic",
+      "key": "{color.border.primary}"
+    },
+    "name": "token-color-border-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.border.faint}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-100}",
+      "group": "semantic",
+      "key": "{color.border.faint}"
+    },
+    "name": "token-color-border-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.border.strong}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-300}",
+      "group": "semantic",
+      "key": "{color.border.strong}"
+    },
+    "name": "token-color-border-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.border.action}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-100}",
+      "group": "semantic",
+      "key": "{color.border.action}"
+    },
+    "name": "token-color-border-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.border.highlight}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-100}",
+      "group": "semantic",
+      "key": "{color.border.highlight}"
+    },
+    "name": "token-color-border-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.border.success}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-100}",
+      "group": "semantic",
+      "key": "{color.border.success}"
+    },
+    "name": "token-color-border-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.border.warning}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-100}",
+      "group": "semantic",
+      "key": "{color.border.warning}"
+    },
+    "name": "token-color-border-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.border.critical}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-100}",
+      "group": "semantic",
+      "key": "{color.border.critical}"
+    },
+    "name": "token-color-border-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.focus.action.internal}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.focus.action.internal}"
+    },
+    "name": "token-color-focus-action-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.action.external}",
+    "$type": "color",
+    "$value": "#5990ff",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.action.external}"
+    },
+    "name": "token-color-focus-action-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.internal}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.focus.critical.internal}"
+    },
+    "name": "token-color-focus-critical-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.external}",
+    "$type": "color",
+    "$value": "#dd7578",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.critical.external}"
+    },
+    "name": "token-color-focus-critical-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.foreground.strong}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-700}",
+      "group": "semantic",
+      "key": "{color.foreground.strong}"
+    },
+    "name": "token-color-foreground-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.foreground.primary}",
+    "$type": "color",
+    "$value": "#f4f4f4",
+    "group": "semantic",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#161616",
+      "cds-g10": "#161616",
+      "cds-g90": "#f4f4f4",
+      "cds-g100": "#f4f4f4"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "{carbon.themes.g90.textPrimary}",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.themes.white.textPrimary}",
+        "cds-g10": "{carbon.themes.g10.textPrimary}",
+        "cds-g90": "{carbon.themes.g90.textPrimary}",
+        "cds-g100": "{carbon.themes.g100.textPrimary}"
+      },
+      "key": "{color.foreground.primary}"
+    },
+    "name": "token-color-foreground-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.foreground.faint}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "semantic",
+      "key": "{color.foreground.faint}"
+    },
+    "name": "token-color-foreground-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.foreground.high-contrast}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.foreground.high-contrast}"
+    },
+    "name": "token-color-foreground-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.disabled}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "semantic",
+      "key": "{color.foreground.disabled}"
+    },
+    "name": "token-color-foreground-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "disabled"
+    ]
+  },
+  {
+    "key": "{color.foreground.action}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "semantic",
+      "key": "{color.foreground.action}"
+    },
+    "name": "token-color-foreground-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.foreground.action-hover}"
+    },
+    "name": "token-color-foreground-action-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-hover"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-active}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "semantic",
+      "key": "{color.foreground.action-active}"
+    },
+    "name": "token-color-foreground-action-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-active"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-200}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight}"
+    },
+    "name": "token-color-foreground-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-on-surface}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-300}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-on-surface}"
+    },
+    "name": "token-color-foreground-highlight-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-high-contrast}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-500}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-high-contrast}"
+    },
+    "name": "token-color-foreground-highlight-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.success}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-200}",
+      "group": "semantic",
+      "key": "{color.foreground.success}"
+    },
+    "name": "token-color-foreground-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-on-surface}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-300}",
+      "group": "semantic",
+      "key": "{color.foreground.success-on-surface}"
+    },
+    "name": "token-color-foreground-success-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-high-contrast}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-500}",
+      "group": "semantic",
+      "key": "{color.foreground.success-high-contrast}"
+    },
+    "name": "token-color-foreground-success-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-200}",
+      "group": "semantic",
+      "key": "{color.foreground.warning}"
+    },
+    "name": "token-color-foreground-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-on-surface}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-300}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-on-surface}"
+    },
+    "name": "token-color-foreground-warning-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-high-contrast}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-500}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-high-contrast}"
+    },
+    "name": "token-color-foreground-warning-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-200}",
+      "group": "semantic",
+      "key": "{color.foreground.critical}"
+    },
+    "name": "token-color-foreground-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-on-surface}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-on-surface}"
+    },
+    "name": "token-color-foreground-critical-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-high-contrast}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-500}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-high-contrast}"
+    },
+    "name": "token-color-foreground-critical-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.page.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.page.primary}"
+    },
+    "name": "token-color-page-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.page.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.page.faint}"
+    },
+    "name": "token-color-page-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.primary}"
+    },
+    "name": "token-color-surface-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.surface.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.faint}"
+    },
+    "name": "token-color-surface-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.strong}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.strong}"
+    },
+    "name": "token-color-surface-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.interactive}"
+    },
+    "name": "token-color-surface-interactive",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-hover}"
+    },
+    "name": "token-color-surface-interactive-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-200}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-active}"
+    },
+    "name": "token-color-surface-interactive-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-disabled}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-disabled}"
+    },
+    "name": "token-color-surface-interactive-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-disabled"
+    ]
+  },
+  {
+    "key": "{color.surface.action}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-50}",
+      "group": "semantic",
+      "key": "{color.surface.action}"
+    },
+    "name": "token-color-surface-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.surface.highlight}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-50}",
+      "group": "semantic",
+      "key": "{color.surface.highlight}"
+    },
+    "name": "token-color-surface-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.surface.success}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-50}",
+      "group": "semantic",
+      "key": "{color.surface.success}"
+    },
+    "name": "token-color-surface-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.surface.warning}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-50}",
+      "group": "semantic",
+      "key": "{color.surface.warning}"
+    },
+    "name": "token-color-surface-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.surface.critical}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-50}",
+      "group": "semantic",
+      "key": "{color.surface.critical}"
+    },
+    "name": "token-color-surface-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.hashicorp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hashicorp-brand}",
+      "group": "branding",
+      "key": "{color.hashicorp.brand}"
+    },
+    "name": "token-color-hashicorp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hashicorp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.brand}",
+    "$type": "color",
+    "$value": "#f24c53",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-brand}",
+      "group": "branding",
+      "key": "{color.boundary.brand}"
+    },
+    "name": "token-color-boundary-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.foreground}",
+    "$type": "color",
+    "$value": "#cf2d32",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-500}",
+      "group": "branding",
+      "key": "{color.boundary.foreground}"
+    },
+    "name": "token-color-boundary-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.boundary.surface}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.surface}"
+    },
+    "name": "token-color-boundary-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.boundary.border}",
+    "$type": "color",
+    "$value": "#fbd7d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-100}",
+      "group": "branding",
+      "key": "{color.boundary.border}"
+    },
+    "name": "token-color-boundary-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#f97076",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-300}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.start}"
+    },
+    "name": "token-color-boundary-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#db363b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-400}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.stop}"
+    },
+    "name": "token-color-boundary-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffafa",
+    "group": "branding",
+    "comment": "this is the 'boundary-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "key": "{color.boundary.gradient.faint.start}"
+    },
+    "name": "token-color-boundary-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.faint.stop}"
+    },
+    "name": "token-color-boundary-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.brand}",
+    "$type": "color",
+    "$value": "#e03875",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-brand}",
+      "group": "branding",
+      "key": "{color.consul.brand}"
+    },
+    "name": "token-color-consul-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.consul.foreground}",
+    "$type": "color",
+    "$value": "#d01c5b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-500}",
+      "group": "branding",
+      "key": "{color.consul.foreground}"
+    },
+    "name": "token-color-consul-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.consul.surface}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.surface}"
+    },
+    "name": "token-color-consul-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.consul.border}",
+    "$type": "color",
+    "$value": "#ffcede",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-100}",
+      "group": "branding",
+      "key": "{color.consul.border}"
+    },
+    "name": "token-color-consul-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#ff99be",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-300}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.start}"
+    },
+    "name": "token-color-consul-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#da306e",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-400}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.stop}"
+    },
+    "name": "token-color-consul-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fff9fb",
+    "group": "branding",
+    "comment": "this is the 'consul-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "key": "{color.consul.gradient.faint.start}"
+    },
+    "name": "token-color-consul-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.gradient.faint.stop}"
+    },
+    "name": "token-color-consul-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.hcp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hcp-brand}",
+      "group": "branding",
+      "key": "{color.hcp.brand}"
+    },
+    "name": "token-color-hcp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hcp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.brand}",
+    "$type": "color",
+    "$value": "#06d092",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-brand}",
+      "group": "branding",
+      "key": "{color.nomad.brand}"
+    },
+    "name": "token-color-nomad-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.foreground}",
+    "$type": "color",
+    "$value": "#008661",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-500}",
+      "group": "branding",
+      "key": "{color.nomad.foreground}"
+    },
+    "name": "token-color-nomad-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.nomad.surface}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.surface}"
+    },
+    "name": "token-color-nomad-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.nomad.border}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.border}"
+    },
+    "name": "token-color-nomad-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.start}"
+    },
+    "name": "token-color-nomad-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#60dea9",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-200}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.stop}"
+    },
+    "name": "token-color-nomad-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fff9",
+    "group": "branding",
+    "comment": "this is the 'nomad-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "key": "{color.nomad.gradient.faint.start}"
+    },
+    "name": "token-color-nomad-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.faint.stop}"
+    },
+    "name": "token-color-nomad-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.brand}",
+    "$type": "color",
+    "$value": "#02a8ef",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-brand}",
+      "group": "branding",
+      "key": "{color.packer.brand}"
+    },
+    "name": "token-color-packer-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.packer.foreground}",
+    "$type": "color",
+    "$value": "#007eb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-500}",
+      "group": "branding",
+      "key": "{color.packer.foreground}"
+    },
+    "name": "token-color-packer-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.packer.surface}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.surface}"
+    },
+    "name": "token-color-packer-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.packer.border}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.border}"
+    },
+    "name": "token-color-packer-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.start}"
+    },
+    "name": "token-color-packer-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#63d0ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-200}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.stop}"
+    },
+    "name": "token-color-packer-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fcff",
+    "group": "branding",
+    "comment": "this is the 'packer-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#F3FCFF",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "key": "{color.packer.gradient.faint.start}"
+    },
+    "name": "token-color-packer-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.gradient.faint.stop}"
+    },
+    "name": "token-color-packer-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand}",
+    "$type": "color",
+    "$value": "#7b42bc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-brand}",
+      "group": "branding",
+      "key": "{color.terraform.brand}"
+    },
+    "name": "token-color-terraform-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand-on-dark}",
+    "$type": "color",
+    "$value": "#a067da",
+    "group": "branding",
+    "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+    "original": {
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "key": "{color.terraform.brand-on-dark}"
+    },
+    "name": "token-color-terraform-brand-on-dark",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand-on-dark"
+    ]
+  },
+  {
+    "key": "{color.terraform.foreground}",
+    "$type": "color",
+    "$value": "#773cb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-500}",
+      "group": "branding",
+      "key": "{color.terraform.foreground}"
+    },
+    "name": "token-color-terraform-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.terraform.surface}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.surface}"
+    },
+    "name": "token-color-terraform-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.terraform.border}",
+    "$type": "color",
+    "$value": "#ebdbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-100}",
+      "group": "branding",
+      "key": "{color.terraform.border}"
+    },
+    "name": "token-color-terraform-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bb8deb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-300}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.start}"
+    },
+    "name": "token-color-terraform-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#844fba",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-400}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.stop}"
+    },
+    "name": "token-color-terraform-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fcfaff",
+    "group": "branding",
+    "comment": "this is the 'terraform-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "key": "{color.terraform.gradient.faint.start}"
+    },
+    "name": "token-color-terraform-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.faint.stop}"
+    },
+    "name": "token-color-terraform-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.brand}",
+    "$type": "color",
+    "$value": "#1868f2",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-brand}",
+      "group": "branding",
+      "key": "{color.vagrant.brand}"
+    },
+    "name": "token-color-vagrant-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vagrant.foreground}",
+    "$type": "color",
+    "$value": "#1c61d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-500}",
+      "group": "branding",
+      "key": "{color.vagrant.foreground}"
+    },
+    "name": "token-color-vagrant-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vagrant.surface}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.surface}"
+    },
+    "name": "token-color-vagrant-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vagrant.border}",
+    "$type": "color",
+    "$value": "#c7dbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-100}",
+      "group": "branding",
+      "key": "{color.vagrant.border}"
+    },
+    "name": "token-color-vagrant-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#639cff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-300}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.start}"
+    },
+    "name": "token-color-vagrant-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#2e71e5",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-400}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.stop}"
+    },
+    "name": "token-color-vagrant-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f4faff",
+    "group": "branding",
+    "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "key": "{color.vagrant.gradient.faint.start}"
+    },
+    "name": "token-color-vagrant-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.faint.stop}"
+    },
+    "name": "token-color-vagrant-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-brand}",
+      "group": "branding",
+      "key": "{color.vault-radar.brand}"
+    },
+    "name": "token-color-vault-radar-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "key": "{color.vault-radar.brand-alt}"
+    },
+    "name": "token-color-vault-radar-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-500}",
+      "group": "branding",
+      "key": "{color.vault-radar.foreground}"
+    },
+    "name": "token-color-vault-radar-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.surface}"
+    },
+    "name": "token-color-vault-radar-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.border}"
+    },
+    "name": "token-color-vault-radar-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.start}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-200}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "key": "{color.vault-radar.gradient.faint.start}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-brand}",
+      "group": "branding",
+      "key": "{color.vault-secrets.brand}"
+    },
+    "name": "token-color-vault-secrets-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand-alt}",
+    "group": "branding",
+    "$type": "color",
+    "$value": "#000000",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+    "original": {
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "key": "{color.vault-secrets.brand-alt}"
+    },
+    "name": "token-color-vault-secrets-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-500}",
+      "group": "branding",
+      "key": "{color.vault-secrets.foreground}"
+    },
+    "name": "token-color-vault-secrets-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.surface}"
+    },
+    "name": "token-color-vault-secrets-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.border}"
+    },
+    "name": "token-color-vault-secrets-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-200}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "key": "{color.vault-secrets.gradient.faint.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-brand}",
+      "group": "branding",
+      "key": "{color.vault.brand}"
+    },
+    "name": "token-color-vault-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "key": "{color.vault.brand-alt}"
+    },
+    "name": "token-color-vault-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-500}",
+      "group": "branding",
+      "key": "{color.vault.foreground}"
+    },
+    "name": "token-color-vault-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.surface}"
+    },
+    "name": "token-color-vault-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.border}"
+    },
+    "name": "token-color-vault-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.start}"
+    },
+    "name": "token-color-vault-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-200}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "key": "{color.vault.gradient.faint.start}"
+    },
+    "name": "token-color-vault-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.brand}",
+    "$type": "color",
+    "$value": "#14c6cb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-brand}",
+      "group": "branding",
+      "key": "{color.waypoint.brand}"
+    },
+    "name": "token-color-waypoint-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.waypoint.foreground}",
+    "$type": "color",
+    "$value": "#008196",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-500}",
+      "group": "branding",
+      "key": "{color.waypoint.foreground}"
+    },
+    "name": "token-color-waypoint-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.waypoint.surface}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.surface}"
+    },
+    "name": "token-color-waypoint-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.waypoint.border}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.border}"
+    },
+    "name": "token-color-waypoint-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.start}"
+    },
+    "name": "token-color-waypoint-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#62d4dc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-200}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.stop}"
+    },
+    "name": "token-color-waypoint-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f6feff",
+    "group": "branding",
+    "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "key": "{color.waypoint.gradient.faint.start}"
+    },
+    "name": "token-color-waypoint-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.faint.stop}"
+    },
+    "name": "token-color-waypoint-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{elevation.inset.box-shadow}",
+    "$value": "inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-01}",
+      "key": "{elevation.inset.box-shadow}"
+    },
+    "name": "token-elevation-inset-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.low.box-shadow}",
+    "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+      "key": "{elevation.low.box-shadow}"
+    },
+    "name": "token-elevation-low-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.mid.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+      "key": "{elevation.mid.box-shadow}"
+    },
+    "name": "token-elevation-mid-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.high.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+      "key": "{elevation.high.box-shadow}"
+    },
+    "name": "token-elevation-high-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.higher.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+      "key": "{elevation.higher.box-shadow}"
+    },
+    "name": "token-elevation-higher-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.overlay.box-shadow}",
+    "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+      "key": "{elevation.overlay.box-shadow}"
+    },
+    "name": "token-elevation-overlay-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.inset.box-shadow}",
+    "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+      "key": "{surface.inset.box-shadow}"
+    },
+    "name": "token-surface-inset-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.base.box-shadow}",
+    "$value": "0 0 0 1px #656a7633",
+    "original": {
+      "$value": "{elevation.base.box-shadow-border}",
+      "key": "{surface.base.box-shadow}"
+    },
+    "name": "token-surface-base-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "base",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.low.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+      "key": "{surface.low.box-shadow}"
+    },
+    "name": "token-surface-low-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.mid.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+      "key": "{surface.mid.box-shadow}"
+    },
+    "name": "token-surface-mid-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.high.box-shadow}",
+    "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+      "key": "{surface.high.box-shadow}"
+    },
+    "name": "token-surface-high-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.higher.box-shadow}",
+    "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+      "key": "{surface.higher.box-shadow}"
+    },
+    "name": "token-surface-higher-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.overlay.box-shadow}",
+    "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+      "key": "{surface.overlay.box-shadow}"
+    },
+    "name": "token-surface-overlay-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.action.box-shadow}",
+    "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+    "original": {
+      "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+      "key": "{focus-ring.action.box-shadow}"
+    },
+    "name": "token-focus-ring-action-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "action",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.critical.box-shadow}",
+    "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+    "original": {
+      "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+      "key": "{focus-ring.critical.box-shadow}"
+    },
+    "name": "token-focus-ring-critical-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "critical",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{app-header.height}",
+    "$type": "dimension",
+    "$value": "60px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "60",
+      "unit": "px",
+      "key": "{app-header.height}"
+    },
+    "name": "token-app-header-height",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-header.home-link.size}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-header.home-link.size}"
+    },
+    "name": "token-app-header-home-link-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "home-link",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-header.logo.size}",
+    "$type": "dimension",
+    "$value": "28px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "28",
+      "unit": "px",
+      "key": "{app-header.logo.size}"
+    },
+    "name": "token-app-header-logo-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "logo",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.border.width}"
+    },
+    "name": "token-app-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-200)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "key": "{app-side-nav.wrapper.border.color}"
+    },
+    "name": "token-app-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-app-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.padding}"
+    },
+    "name": "token-app-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.header.actions.spacing}"
+    },
+    "name": "token-app-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{app-side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.height}"
+    },
+    "name": "token-app-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-app-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.primary}"
+    },
+    "name": "token-app-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.strong}"
+    },
+    "name": "token-app-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.faint}"
+    },
+    "name": "token-app-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.surface.primary}"
+    },
+    "name": "token-app-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-interactive-hover)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-300)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{form.label.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.label.color}"
+    },
+    "name": "token-form-label-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "label",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.legend.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{form.label.color}",
+      "group": "components",
+      "key": "{form.legend.color}"
+    },
+    "name": "token-form-legend-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "legend",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.helper-text.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.helper-text.color}"
+    },
+    "name": "token-form-helper-text-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "helper-text",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.indicator.optional.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.indicator.optional.color}"
+    },
+    "name": "token-form-indicator-optional-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "indicator",
+      "optional",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.color}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.error.color}"
+    },
+    "name": "token-form-error-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.icon-size}",
+    "$type": "dimension",
+    "$value": "14px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "14",
+      "unit": "px",
+      "key": "{form.error.icon-size}"
+    },
+    "name": "token-form-error-icon-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "icon-size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.checkbox.size}"
+    },
+    "name": "token-form-checkbox-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.checkbox.border.radius}"
+    },
+    "name": "token-form-checkbox-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.checkbox.border.width}"
+    },
+    "name": "token-form-checkbox-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.checkbox.background-image.size}"
+    },
+    "name": "token-form-checkbox-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url}"
+    },
+    "name": "token-form-checkbox-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate-disabled"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.value-color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.control.base.foreground.value-color}"
+    },
+    "name": "token-form-control-base-foreground-value-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "value-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.placeholder-color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.control.base.foreground.placeholder-color}"
+    },
+    "name": "token-form-control-base-foreground-placeholder-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "placeholder-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.default}"
+    },
+    "name": "token-form-control-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-hover}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.hover}"
+    },
+    "name": "token-form-control-base-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.default}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "components",
+      "key": "{form.control.base.border-color.default}"
+    },
+    "name": "token-form-control-base-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.hover}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "components",
+      "key": "{form.control.base.border-color.hover}"
+    },
+    "name": "token-form-control-base-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.foreground-color}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.high-contrast}",
+      "group": "components",
+      "key": "{form.control.checked.foreground-color}"
+    },
+    "name": "token-form-control-checked-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.default}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.default}"
+    },
+    "name": "token-form-control-checked-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.hover}"
+    },
+    "name": "token-form-control-checked-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.default}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.default}"
+    },
+    "name": "token-form-control-checked-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.hover}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.hover}"
+    },
+    "name": "token-form-control-checked-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.default}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.default}"
+    },
+    "name": "token-form-control-invalid-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.hover}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-400}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.hover}"
+    },
+    "name": "token-form-control-invalid-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.foreground-color}",
+    "$type": "color",
+    "$value": "#f4f4f4",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.primary}",
+      "group": "components",
+      "key": "{form.control.readonly.foreground-color}"
+    },
+    "name": "token-form-control-readonly-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.surface-color}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "key": "{form.control.readonly.surface-color}"
+    },
+    "name": "token-form-control-readonly-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.border-color}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.faint}",
+      "group": "components",
+      "key": "{form.control.readonly.border-color}"
+    },
+    "name": "token-form-control-readonly-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.foreground-color}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.foreground-color}"
+    },
+    "name": "token-form-control-disabled-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.surface-color}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.surface-color}"
+    },
+    "name": "token-form-control-disabled-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.border-color}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.primary}",
+      "group": "components",
+      "key": "{form.control.disabled.border-color}"
+    },
+    "name": "token-form-control-disabled-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.padding}",
+    "$type": "dimension",
+    "$value": "7px",
+    "unit": "px",
+    "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+    "original": {
+      "$type": "dimension",
+      "$value": "7",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "key": "{form.control.padding}"
+    },
+    "name": "token-form-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "padding"
+    ]
+  },
+  {
+    "key": "{form.control.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{form.control.border.radius}"
+    },
+    "name": "token-form-control-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.control.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.control.border.width}"
+    },
+    "name": "token-form-control-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radio.size}"
+    },
+    "name": "token-form-radio-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radio.border.width}"
+    },
+    "name": "token-form-radio-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.radio.background-image.size}"
+    },
+    "name": "token-form-radio-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url}"
+    },
+    "name": "token-form-radio-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url-disabled}"
+    },
+    "name": "token-form-radio-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.radiocard-group.gap}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radiocard-group.gap}"
+    },
+    "name": "token-form-radiocard-group-gap",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard-group",
+      "gap"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radiocard.border.width}"
+    },
+    "name": "token-form-radiocard-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.radius}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{form.radiocard.border.radius}"
+    },
+    "name": "token-form-radiocard-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.radiocard.content-padding}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{form.radiocard.content-padding}"
+    },
+    "name": "token-form-radiocard-content-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "content-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.control-padding}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{form.radiocard.control-padding}"
+    },
+    "name": "token-form-radiocard-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "control-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.radiocard.transition.duration}"
+    },
+    "name": "token-form-radiocard-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.select.background-image.size}"
+    },
+    "name": "token-form-select-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-right-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.select.background-image.position-right-x}"
+    },
+    "name": "token-form-select-background-image-position-right-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-right-x"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-top-y}",
+    "$type": "dimension",
+    "$value": "9px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "9",
+      "unit": "px",
+      "key": "{form.select.background-image.position-top-y}"
+    },
+    "name": "token-form-select-background-image-position-top-y",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-top-y"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url}"
+    },
+    "name": "token-form-select-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url-disabled}"
+    },
+    "name": "token-form-select-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.text-input.background-image.size}"
+    },
+    "name": "token-form-text-input-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.text-input.background-image.position-x}"
+    },
+    "name": "token-form-text-input-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-date}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-date}"
+    },
+    "name": "token-form-text-input-background-image-data-url-date",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-date"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-time}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-time}"
+    },
+    "name": "token-form-text-input-background-image-data-url-time",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-time"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-cancel}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-cancel}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-cancel",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-cancel"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-loading}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color and animation are hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-loading}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-loading",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-loading"
+    ]
+  },
+  {
+    "key": "{form.toggle.width}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{form.toggle.width}"
+    },
+    "name": "token-form-toggle-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.height}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.toggle.height}"
+    },
+    "name": "token-form-toggle-height",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "height"
+    ]
+  },
+  {
+    "key": "{form.toggle.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "comment": "the toggle has a different base surface color, compared to the other controls",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "key": "{form.toggle.base.surface-color.default}"
+    },
+    "name": "token-form-toggle-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.toggle.border.radius}"
+    },
+    "name": "token-form-toggle-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.toggle.border.width}"
+    },
+    "name": "token-form-toggle-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.toggle.background-image.size}"
+    },
+    "name": "token-form-toggle-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{form.toggle.background-image.position-x}"
+    },
+    "name": "token-form-toggle-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url}"
+    },
+    "name": "token-form-toggle-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url-disabled}"
+    },
+    "name": "token-form-toggle-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.toggle.transition.duration}"
+    },
+    "name": "token-form-toggle-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.timing-function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.68,
+        -0.2,
+        0.265,
+        1.15
+      ],
+      "key": "{form.toggle.transition.timing-function}"
+    },
+    "name": "token-form-toggle-transition-timing-function",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "timing-function"
+    ]
+  },
+  {
+    "key": "{form.toggle.thumb-size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.toggle.height}",
+      "key": "{form.toggle.thumb-size}"
+    },
+    "name": "token-form-toggle-thumb-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "thumb-size"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{pagination.nav.control.height}"
+    },
+    "name": "token-pagination-nav-control-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{pagination.nav.control.padding.horizontal}"
+    },
+    "name": "token-pagination-nav-control-padding-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.focus-inset}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{pagination.nav.control.focus-inset}"
+    },
+    "name": "token-pagination-nav-control-focus-inset",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.icon-spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.control.icon-spacing}"
+    },
+    "name": "token-pagination-nav-control-icon-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "icon-spacing"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.height}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.height}"
+    },
+    "name": "token-pagination-nav-indicator-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.spacing}"
+    },
+    "name": "token-pagination-nav-indicator-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{pagination.child.spacing.vertical}"
+    },
+    "name": "token-pagination-child-spacing-vertical",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.horizontal}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{pagination.child.spacing.horizontal}"
+    },
+    "name": "token-pagination-child-spacing-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{side-nav.wrapper.border.width}"
+    },
+    "name": "token-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "key": "{side-nav.wrapper.border.color}"
+    },
+    "name": "token-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.padding}"
+    },
+    "name": "token-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.header.actions.spacing}"
+    },
+    "name": "token-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.height}"
+    },
+    "name": "token-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "key": "{side-nav.color.foreground.primary}"
+    },
+    "name": "token-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#fff",
+      "group": "components",
+      "key": "{side-nav.color.foreground.strong}"
+    },
+    "name": "token-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "key": "{side-nav.color.foreground.faint}"
+    },
+    "name": "token-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "key": "{side-nav.color.surface.primary}"
+    },
+    "name": "token-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.medium}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{tabs.tab.height.medium}"
+    },
+    "name": "token-tabs-tab-height-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.large}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{tabs.tab.height.large}"
+    },
+    "name": "token-tabs-tab-height-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.medium}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.medium}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.large}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.large}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.vertical}",
+    "$type": "dimension",
+    "$value": "0px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "0",
+      "unit": "px",
+      "key": "{tabs.tab.padding.vertical}"
+    },
+    "name": "token-tabs-tab-padding-vertical",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tabs.tab.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tabs.tab.border-radius}"
+    },
+    "name": "token-tabs-tab-border-radius",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tabs.tab.focus-inset}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.focus-inset}"
+    },
+    "name": "token-tabs-tab-focus-inset",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{tabs.tab.gutter}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.gutter}"
+    },
+    "name": "token-tabs-tab-gutter",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "gutter"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.height}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{tabs.indicator.height}"
+    },
+    "name": "token-tabs-indicator-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.5,
+        1,
+        0.89,
+        1
+      ],
+      "key": "{tabs.indicator.transition.function}"
+    },
+    "name": "token-tabs-indicator-transition-function",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.duration}",
+    "$type": "duration",
+    "$value": "0.6s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.6",
+      "unit": "s",
+      "key": "{tabs.indicator.transition.duration}"
+    },
+    "name": "token-tabs-indicator-transition-duration",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{tabs.divider.height}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{tabs.divider.height}"
+    },
+    "name": "token-tabs-divider-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "divider",
+      "height"
+    ]
+  },
+  {
+    "key": "{tooltip.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tooltip.border-radius}"
+    },
+    "name": "token-tooltip-border-radius",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tooltip.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-high-contrast)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "key": "{tooltip.color.foreground.primary}"
+    },
+    "name": "token-tooltip-color-foreground-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-700)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "key": "{tooltip.color.surface.primary}"
+    },
+    "name": "token-tooltip-color-surface-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.focus-offset}",
+    "$type": "dimension",
+    "$value": "-2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "-2",
+      "unit": "px",
+      "key": "{tooltip.focus-offset}"
+    },
+    "name": "token-tooltip-focus-offset",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "focus-offset"
+    ]
+  },
+  {
+    "key": "{tooltip.max-width}",
+    "$type": "dimension",
+    "$value": "280px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "280",
+      "unit": "px",
+      "key": "{tooltip.max-width}"
+    },
+    "name": "token-tooltip-max-width",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "max-width"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tooltip.padding.horizontal}"
+    },
+    "name": "token-tooltip-padding-horizontal",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{tooltip.padding.vertical}"
+    },
+    "name": "token-tooltip-padding-vertical",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tooltip.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.54,
+        1.5,
+        0.38,
+        1.11
+      ],
+      "key": "{tooltip.transition.function}"
+    },
+    "name": "token-tooltip-transition-function",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.display}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.display.macOS}",
+        "{typography.font-stack.sans.display.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.display.emoji}"
+      ],
+      "key": "{typography.font-stack.display}"
+    },
+    "name": "token-typography-font-stack-display",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "display"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.text}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.text.macOS}",
+        "{typography.font-stack.sans.text.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.text.emoji}"
+      ],
+      "key": "{typography.font-stack.text}"
+    },
+    "name": "token-typography-font-stack-text",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "text"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.code}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.monospace.code.macOS}",
+        "{typography.font-stack.monospace.code.windows}",
+        "monospace"
+      ],
+      "key": "{typography.font-stack.code}"
+    },
+    "name": "token-typography-font-stack-code",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "code"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.regular}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "400",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "400",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.regular}"
+    },
+    "name": "token-typography-font-weight-regular",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "regular"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.medium}",
+    "$type": "font-weight",
+    "$value": 400,
+    "$modes": {
+      "default": "500",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.regular}",
+      "$modes": {
+        "default": "500",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.medium}"
+    },
+    "name": "token-typography-font-weight-medium",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "medium"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.semibold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "600",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "600",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.semibold}"
+    },
+    "name": "token-typography-font-weight-semibold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "semibold"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.bold}",
+    "$type": "font-weight",
+    "$value": 600,
+    "$modes": {
+      "default": "700",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "{carbon.typography.font-weight.semibold}",
+      "$modes": {
+        "default": "700",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.bold}"
+    },
+    "name": "token-typography-font-weight-bold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "bold"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-500.font-family}"
+    },
+    "name": "token-typography-display-500-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-size}",
+    "$type": "font-size",
+    "$value": "1.875rem",
+    "unit": "px",
+    "comment": "30px/1.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "30",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "key": "{typography.display-500.font-size}"
+    },
+    "name": "token-typography-display-500-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-500.line-height}",
+    "$type": "number",
+    "$value": 1.2666,
+    "comment": "38px",
+    "original": {
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "key": "{typography.display-500.line-height}"
+    },
+    "name": "token-typography-display-500-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-400.font-family}"
+    },
+    "name": "token-typography-display-400-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-size}",
+    "$type": "font-size",
+    "$value": "1.5rem",
+    "unit": "px",
+    "comment": "24px/1.5rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "24",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "key": "{typography.display-400.font-size}"
+    },
+    "name": "token-typography-display-400-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-400.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "32px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "key": "{typography.display-400.line-height}"
+    },
+    "name": "token-typography-display-400-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-300.font-family}"
+    },
+    "name": "token-typography-display-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-size}",
+    "$type": "font-size",
+    "$value": "1.125rem",
+    "unit": "px",
+    "comment": "18px/1.125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "18",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "key": "{typography.display-300.font-size}"
+    },
+    "name": "token-typography-display-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-300.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "key": "{typography.display-300.line-height}"
+    },
+    "name": "token-typography-display-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-300.letter-spacing}"
+    },
+    "name": "token-typography-display-300-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-200.font-family}"
+    },
+    "name": "token-typography-display-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.display-200.font-size}"
+    },
+    "name": "token-typography-display-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-200.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.display-200.line-height}"
+    },
+    "name": "token-typography-display-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-200.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-200.letter-spacing}"
+    },
+    "name": "token-typography-display-200-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-100.font-family}"
+    },
+    "name": "token-typography-display-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.display-100.font-size}"
+    },
+    "name": "token-typography-display-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.display-100.line-height}"
+    },
+    "name": "token-typography-display-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-300.font-family}"
+    },
+    "name": "token-typography-body-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.body-300.font-size}"
+    },
+    "name": "token-typography-body-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-300.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.body-300.line-height}"
+    },
+    "name": "token-typography-body-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-200.font-family}"
+    },
+    "name": "token-typography-body-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.body-200.font-size}"
+    },
+    "name": "token-typography-body-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-200.line-height}",
+    "$type": "number",
+    "$value": 1.4286,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "key": "{typography.body-200.line-height}"
+    },
+    "name": "token-typography-body-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-100.font-family}"
+    },
+    "name": "token-typography-body-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.body-100.font-size}"
+    },
+    "name": "token-typography-body-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.body-100.line-height}"
+    },
+    "name": "token-typography-body-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-100.font-family}"
+    },
+    "name": "token-typography-code-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.code-100.font-size}"
+    },
+    "name": "token-typography-code-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-100.line-height}",
+    "$type": "number",
+    "$value": 1.23,
+    "comment": "16px",
+    "original": {
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "key": "{typography.code-100.line-height}"
+    },
+    "name": "token-typography-code-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-200.font-family}"
+    },
+    "name": "token-typography-code-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.code-200.font-size}"
+    },
+    "name": "token-typography-code-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-200.line-height}",
+    "$type": "number",
+    "$value": 1.125,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "key": "{typography.code-200.line-height}"
+    },
+    "name": "token-typography-code-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-family}",
+    "$type": "font-family",
+    "$value": "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-300.font-family}"
+    },
+    "name": "token-typography-code-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.code-300.font-size}"
+    },
+    "name": "token-typography-code-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-300.line-height}",
+    "$type": "number",
+    "$value": 1.25,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "key": "{typography.code-300.line-height}"
+    },
+    "name": "token-typography-code-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "line-height"
+    ]
+  }
+]
\ No newline at end of file
diff --git a/packages/tokens/dist/docs/products/themed-tokens/default.json b/packages/tokens/dist/docs/products/themed-tokens/default.json
new file mode 100644
index 00000000000..3b5e7f0801c
--- /dev/null
+++ b/packages/tokens/dist/docs/products/themed-tokens/default.json
@@ -0,0 +1,8352 @@
+[
+  {
+    "key": "{border.radius.x-small}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{border.radius.x-small}"
+    },
+    "name": "token-border-radius-x-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "x-small"
+    ]
+  },
+  {
+    "key": "{border.radius.small}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{border.radius.small}"
+    },
+    "name": "token-border-radius-small",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "small"
+    ]
+  },
+  {
+    "key": "{border.radius.medium}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{border.radius.medium}"
+    },
+    "name": "token-border-radius-medium",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "medium"
+    ]
+  },
+  {
+    "key": "{border.radius.large}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{border.radius.large}"
+    },
+    "name": "token-border-radius-large",
+    "attributes": {
+      "category": "border"
+    },
+    "path": [
+      "border",
+      "radius",
+      "large"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-500}",
+    "$type": "color",
+    "$value": "#1c345f",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1c345f",
+      "group": "palette",
+      "key": "{color.palette.blue-500}"
+    },
+    "name": "token-color-palette-blue-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-500"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-400}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0046d1",
+      "group": "palette",
+      "key": "{color.palette.blue-400}"
+    },
+    "name": "token-color-palette-blue-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-400"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-300}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c56e9",
+      "group": "palette",
+      "key": "{color.palette.blue-300}"
+    },
+    "name": "token-color-palette-blue-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-300"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-200}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#1060ff",
+      "group": "palette",
+      "key": "{color.palette.blue-200}"
+    },
+    "name": "token-color-palette-blue-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-200"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-100}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cce3fe",
+      "group": "palette",
+      "key": "{color.palette.blue-100}"
+    },
+    "name": "token-color-palette-blue-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-100"
+    ]
+  },
+  {
+    "key": "{color.palette.blue-50}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2f8ff",
+      "group": "palette",
+      "key": "{color.palette.blue-50}"
+    },
+    "name": "token-color-palette-blue-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "blue-50"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-500}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#42215b",
+      "group": "palette",
+      "key": "{color.palette.purple-500}"
+    },
+    "name": "token-color-palette-purple-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-500"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-400}",
+    "$type": "color",
+    "$value": "#7b00db",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#7b00db",
+      "group": "palette",
+      "key": "{color.palette.purple-400}"
+    },
+    "name": "token-color-palette-purple-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-400"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-300}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#911ced",
+      "group": "palette",
+      "key": "{color.palette.purple-300}"
+    },
+    "name": "token-color-palette-purple-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-300"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-200}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#a737ff",
+      "group": "palette",
+      "key": "{color.palette.purple-200}"
+    },
+    "name": "token-color-palette-purple-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-200"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-100}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#ead2fe",
+      "group": "palette",
+      "key": "{color.palette.purple-100}"
+    },
+    "name": "token-color-palette-purple-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-100"
+    ]
+  },
+  {
+    "key": "{color.palette.purple-50}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f9f2ff",
+      "group": "palette",
+      "key": "{color.palette.purple-50}"
+    },
+    "name": "token-color-palette-purple-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "purple-50"
+    ]
+  },
+  {
+    "key": "{color.palette.green-500}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#054220",
+      "group": "palette",
+      "key": "{color.palette.green-500}"
+    },
+    "name": "token-color-palette-green-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-500"
+    ]
+  },
+  {
+    "key": "{color.palette.green-400}",
+    "$type": "color",
+    "$value": "#006619",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#006619",
+      "group": "palette",
+      "key": "{color.palette.green-400}"
+    },
+    "name": "token-color-palette-green-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-400"
+    ]
+  },
+  {
+    "key": "{color.palette.green-300}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#00781e",
+      "group": "palette",
+      "key": "{color.palette.green-300}"
+    },
+    "name": "token-color-palette-green-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-300"
+    ]
+  },
+  {
+    "key": "{color.palette.green-200}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#008a22",
+      "group": "palette",
+      "key": "{color.palette.green-200}"
+    },
+    "name": "token-color-palette-green-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-200"
+    ]
+  },
+  {
+    "key": "{color.palette.green-100}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#cceeda",
+      "group": "palette",
+      "key": "{color.palette.green-100}"
+    },
+    "name": "token-color-palette-green-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-100"
+    ]
+  },
+  {
+    "key": "{color.palette.green-50}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f2fbf6",
+      "group": "palette",
+      "key": "{color.palette.green-50}"
+    },
+    "name": "token-color-palette-green-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "green-50"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-500}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#542800",
+      "group": "palette",
+      "key": "{color.palette.amber-500}"
+    },
+    "name": "token-color-palette-amber-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-500"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-400}",
+    "$type": "color",
+    "$value": "#803d00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#803d00",
+      "group": "palette",
+      "key": "{color.palette.amber-400}"
+    },
+    "name": "token-color-palette-amber-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-400"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-300}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#9e4b00",
+      "group": "palette",
+      "key": "{color.palette.amber-300}"
+    },
+    "name": "token-color-palette-amber-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-300"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-200}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#bb5a00",
+      "group": "palette",
+      "key": "{color.palette.amber-200}"
+    },
+    "name": "token-color-palette-amber-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-200"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-100}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbeabf",
+      "group": "palette",
+      "key": "{color.palette.amber-100}"
+    },
+    "name": "token-color-palette-amber-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-100"
+    ]
+  },
+  {
+    "key": "{color.palette.amber-50}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9e8",
+      "group": "palette",
+      "key": "{color.palette.amber-50}"
+    },
+    "name": "token-color-palette-amber-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "amber-50"
+    ]
+  },
+  {
+    "key": "{color.palette.red-500}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#51130a",
+      "group": "palette",
+      "key": "{color.palette.red-500}"
+    },
+    "name": "token-color-palette-red-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-500"
+    ]
+  },
+  {
+    "key": "{color.palette.red-400}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#940004",
+      "group": "palette",
+      "key": "{color.palette.red-400}"
+    },
+    "name": "token-color-palette-red-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-400"
+    ]
+  },
+  {
+    "key": "{color.palette.red-300}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c00005",
+      "group": "palette",
+      "key": "{color.palette.red-300}"
+    },
+    "name": "token-color-palette-red-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-300"
+    ]
+  },
+  {
+    "key": "{color.palette.red-200}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#e52228",
+      "group": "palette",
+      "key": "{color.palette.red-200}"
+    },
+    "name": "token-color-palette-red-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-200"
+    ]
+  },
+  {
+    "key": "{color.palette.red-100}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fbd4d4",
+      "group": "palette",
+      "key": "{color.palette.red-100}"
+    },
+    "name": "token-color-palette-red-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-100"
+    ]
+  },
+  {
+    "key": "{color.palette.red-50}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fff5f5",
+      "group": "palette",
+      "key": "{color.palette.red-50}"
+    },
+    "name": "token-color-palette-red-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "red-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-700}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "palette",
+      "key": "{color.palette.neutral-700}"
+    },
+    "name": "token-color-palette-neutral-700",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-700"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-600}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "palette",
+      "key": "{color.palette.neutral-600}"
+    },
+    "name": "token-color-palette-neutral-600",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-600"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-500}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "palette",
+      "key": "{color.palette.neutral-500}"
+    },
+    "name": "token-color-palette-neutral-500",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-500"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-400}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "palette",
+      "key": "{color.palette.neutral-400}"
+    },
+    "name": "token-color-palette-neutral-400",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-400"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-300}",
+    "$type": "color",
+    "$value": "#c2c5cb",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#c2c5cb",
+      "group": "palette",
+      "key": "{color.palette.neutral-300}"
+    },
+    "name": "token-color-palette-neutral-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-300"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-200}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "palette",
+      "key": "{color.palette.neutral-200}"
+    },
+    "name": "token-color-palette-neutral-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-200"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-100}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#f1f2f3",
+      "group": "palette",
+      "key": "{color.palette.neutral-100}"
+    },
+    "name": "token-color-palette-neutral-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-100"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-50}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "#fafafa",
+      "group": "palette",
+      "key": "{color.palette.neutral-50}"
+    },
+    "name": "token-color-palette-neutral-50",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-50"
+    ]
+  },
+  {
+    "key": "{color.palette.neutral-0}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "palette",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#ffffff",
+      "cds-g10": "#ffffff",
+      "cds-g90": "#ffffff",
+      "cds-g100": "#ffffff"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.color.white.0}",
+        "cds-g10": "{carbon.color.white.0}",
+        "cds-g90": "{carbon.color.white.0}",
+        "cds-g100": "{carbon.color.white.0}"
+      },
+      "key": "{color.palette.neutral-0}"
+    },
+    "name": "token-color-palette-neutral-0",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "neutral-0"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-300}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "alpha": "0.4",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-600}",
+      "alpha": "0.4",
+      "group": "palette",
+      "key": "{color.palette.alpha-300}"
+    },
+    "name": "token-color-palette-alpha-300",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-300"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-200}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "alpha": "0.2",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.2",
+      "group": "palette",
+      "key": "{color.palette.alpha-200}"
+    },
+    "name": "token-color-palette-alpha-200",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-200"
+    ]
+  },
+  {
+    "key": "{color.palette.alpha-100}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "alpha": "0.1",
+    "group": "palette",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "alpha": "0.1",
+      "group": "palette",
+      "key": "{color.palette.alpha-100}"
+    },
+    "name": "token-color-palette-alpha-100",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "palette",
+      "alpha-100"
+    ]
+  },
+  {
+    "key": "{color.border.primary}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-200}",
+      "group": "semantic",
+      "key": "{color.border.primary}"
+    },
+    "name": "token-color-border-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.border.faint}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-100}",
+      "group": "semantic",
+      "key": "{color.border.faint}"
+    },
+    "name": "token-color-border-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.border.strong}",
+    "$type": "color",
+    "$value": "#3b3d4566",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.alpha-300}",
+      "group": "semantic",
+      "key": "{color.border.strong}"
+    },
+    "name": "token-color-border-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.border.action}",
+    "$type": "color",
+    "$value": "#cce3fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-100}",
+      "group": "semantic",
+      "key": "{color.border.action}"
+    },
+    "name": "token-color-border-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.border.highlight}",
+    "$type": "color",
+    "$value": "#ead2fe",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-100}",
+      "group": "semantic",
+      "key": "{color.border.highlight}"
+    },
+    "name": "token-color-border-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.border.success}",
+    "$type": "color",
+    "$value": "#cceeda",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-100}",
+      "group": "semantic",
+      "key": "{color.border.success}"
+    },
+    "name": "token-color-border-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.border.warning}",
+    "$type": "color",
+    "$value": "#fbeabf",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-100}",
+      "group": "semantic",
+      "key": "{color.border.warning}"
+    },
+    "name": "token-color-border-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.border.critical}",
+    "$type": "color",
+    "$value": "#fbd4d4",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-100}",
+      "group": "semantic",
+      "key": "{color.border.critical}"
+    },
+    "name": "token-color-border-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "border",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.focus.action.internal}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.focus.action.internal}"
+    },
+    "name": "token-color-focus-action-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.action.external}",
+    "$type": "color",
+    "$value": "#5990ff",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#5990ff",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.action.external}"
+    },
+    "name": "token-color-focus-action-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "action",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.internal}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.focus.critical.internal}"
+    },
+    "name": "token-color-focus-critical-internal",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "internal"
+    ]
+  },
+  {
+    "key": "{color.focus.critical.external}",
+    "$type": "color",
+    "$value": "#dd7578",
+    "group": "semantic",
+    "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+    "original": {
+      "$type": "color",
+      "$value": "#dd7578",
+      "group": "semantic",
+      "comment": "this is a special color used only for the focus style, to pass color contrast for a11y purpose",
+      "key": "{color.focus.critical.external}"
+    },
+    "name": "token-color-focus-critical-external",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "focus",
+      "critical",
+      "external"
+    ]
+  },
+  {
+    "key": "{color.foreground.strong}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-700}",
+      "group": "semantic",
+      "key": "{color.foreground.strong}"
+    },
+    "name": "token-color-foreground-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.foreground.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#161616",
+      "cds-g10": "#161616",
+      "cds-g90": "#f4f4f4",
+      "cds-g100": "#f4f4f4"
+    },
+    "original": {
+      "$type": "color",
+      "$value": "#ffffff",
+      "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.themes.white.textPrimary}",
+        "cds-g10": "{carbon.themes.g10.textPrimary}",
+        "cds-g90": "{carbon.themes.g90.textPrimary}",
+        "cds-g100": "{carbon.themes.g100.textPrimary}"
+      },
+      "key": "{color.foreground.primary}"
+    },
+    "name": "token-color-foreground-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.foreground.faint}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "semantic",
+      "key": "{color.foreground.faint}"
+    },
+    "name": "token-color-foreground-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.foreground.high-contrast}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.foreground.high-contrast}"
+    },
+    "name": "token-color-foreground-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.disabled}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "semantic",
+      "key": "{color.foreground.disabled}"
+    },
+    "name": "token-color-foreground-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "disabled"
+    ]
+  },
+  {
+    "key": "{color.foreground.action}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "semantic",
+      "key": "{color.foreground.action}"
+    },
+    "name": "token-color-foreground-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "semantic",
+      "key": "{color.foreground.action-hover}"
+    },
+    "name": "token-color-foreground-action-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-hover"
+    ]
+  },
+  {
+    "key": "{color.foreground.action-active}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "semantic",
+      "key": "{color.foreground.action-active}"
+    },
+    "name": "token-color-foreground-action-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "action-active"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight}",
+    "$type": "color",
+    "$value": "#a737ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-200}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight}"
+    },
+    "name": "token-color-foreground-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-on-surface}",
+    "$type": "color",
+    "$value": "#911ced",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-300}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-on-surface}"
+    },
+    "name": "token-color-foreground-highlight-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.highlight-high-contrast}",
+    "$type": "color",
+    "$value": "#42215b",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-500}",
+      "group": "semantic",
+      "key": "{color.foreground.highlight-high-contrast}"
+    },
+    "name": "token-color-foreground-highlight-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "highlight-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.success}",
+    "$type": "color",
+    "$value": "#008a22",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-200}",
+      "group": "semantic",
+      "key": "{color.foreground.success}"
+    },
+    "name": "token-color-foreground-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-on-surface}",
+    "$type": "color",
+    "$value": "#00781e",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-300}",
+      "group": "semantic",
+      "key": "{color.foreground.success-on-surface}"
+    },
+    "name": "token-color-foreground-success-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.success-high-contrast}",
+    "$type": "color",
+    "$value": "#054220",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-500}",
+      "group": "semantic",
+      "key": "{color.foreground.success-high-contrast}"
+    },
+    "name": "token-color-foreground-success-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "success-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning}",
+    "$type": "color",
+    "$value": "#bb5a00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-200}",
+      "group": "semantic",
+      "key": "{color.foreground.warning}"
+    },
+    "name": "token-color-foreground-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-on-surface}",
+    "$type": "color",
+    "$value": "#9e4b00",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-300}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-on-surface}"
+    },
+    "name": "token-color-foreground-warning-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.warning-high-contrast}",
+    "$type": "color",
+    "$value": "#542800",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-500}",
+      "group": "semantic",
+      "key": "{color.foreground.warning-high-contrast}"
+    },
+    "name": "token-color-foreground-warning-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "warning-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical}",
+    "$type": "color",
+    "$value": "#e52228",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-200}",
+      "group": "semantic",
+      "key": "{color.foreground.critical}"
+    },
+    "name": "token-color-foreground-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-on-surface}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-on-surface}"
+    },
+    "name": "token-color-foreground-critical-on-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-on-surface"
+    ]
+  },
+  {
+    "key": "{color.foreground.critical-high-contrast}",
+    "$type": "color",
+    "$value": "#51130a",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-500}",
+      "group": "semantic",
+      "key": "{color.foreground.critical-high-contrast}"
+    },
+    "name": "token-color-foreground-critical-high-contrast",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "foreground",
+      "critical-high-contrast"
+    ]
+  },
+  {
+    "key": "{color.page.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.page.primary}"
+    },
+    "name": "token-color-page-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.page.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.page.faint}"
+    },
+    "name": "token-color-page-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "page",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.primary}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.primary}"
+    },
+    "name": "token-color-surface-primary",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{color.surface.faint}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.faint}"
+    },
+    "name": "token-color-surface-faint",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "faint"
+    ]
+  },
+  {
+    "key": "{color.surface.strong}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.strong}"
+    },
+    "name": "token-color-surface-strong",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "strong"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-0}",
+      "group": "semantic",
+      "key": "{color.surface.interactive}"
+    },
+    "name": "token-color-surface-interactive",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-100}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-hover}"
+    },
+    "name": "token-color-surface-interactive-hover",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-200}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-active}"
+    },
+    "name": "token-color-surface-interactive-active",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{color.surface.interactive-disabled}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-50}",
+      "group": "semantic",
+      "key": "{color.surface.interactive-disabled}"
+    },
+    "name": "token-color-surface-interactive-disabled",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "interactive-disabled"
+    ]
+  },
+  {
+    "key": "{color.surface.action}",
+    "$type": "color",
+    "$value": "#f2f8ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-50}",
+      "group": "semantic",
+      "key": "{color.surface.action}"
+    },
+    "name": "token-color-surface-action",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "action"
+    ]
+  },
+  {
+    "key": "{color.surface.highlight}",
+    "$type": "color",
+    "$value": "#f9f2ff",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.purple-50}",
+      "group": "semantic",
+      "key": "{color.surface.highlight}"
+    },
+    "name": "token-color-surface-highlight",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "highlight"
+    ]
+  },
+  {
+    "key": "{color.surface.success}",
+    "$type": "color",
+    "$value": "#f2fbf6",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.green-50}",
+      "group": "semantic",
+      "key": "{color.surface.success}"
+    },
+    "name": "token-color-surface-success",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "success"
+    ]
+  },
+  {
+    "key": "{color.surface.warning}",
+    "$type": "color",
+    "$value": "#fff9e8",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.amber-50}",
+      "group": "semantic",
+      "key": "{color.surface.warning}"
+    },
+    "name": "token-color-surface-warning",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "warning"
+    ]
+  },
+  {
+    "key": "{color.surface.critical}",
+    "$type": "color",
+    "$value": "#fff5f5",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-50}",
+      "group": "semantic",
+      "key": "{color.surface.critical}"
+    },
+    "name": "token-color-surface-critical",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "surface",
+      "critical"
+    ]
+  },
+  {
+    "key": "{color.hashicorp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hashicorp-brand}",
+      "group": "branding",
+      "key": "{color.hashicorp.brand}"
+    },
+    "name": "token-color-hashicorp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hashicorp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.brand}",
+    "$type": "color",
+    "$value": "#f24c53",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-brand}",
+      "group": "branding",
+      "key": "{color.boundary.brand}"
+    },
+    "name": "token-color-boundary-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.boundary.foreground}",
+    "$type": "color",
+    "$value": "#cf2d32",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-500}",
+      "group": "branding",
+      "key": "{color.boundary.foreground}"
+    },
+    "name": "token-color-boundary-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.boundary.surface}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.surface}"
+    },
+    "name": "token-color-boundary-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.boundary.border}",
+    "$type": "color",
+    "$value": "#fbd7d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-100}",
+      "group": "branding",
+      "key": "{color.boundary.border}"
+    },
+    "name": "token-color-boundary-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#f97076",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-300}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.start}"
+    },
+    "name": "token-color-boundary-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#db363b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-400}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.primary.stop}"
+    },
+    "name": "token-color-boundary-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffafa",
+    "group": "branding",
+    "comment": "this is the 'boundary-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffafa",
+      "group": "branding",
+      "comment": "this is the 'boundary-50' value at 25% opacity on white",
+      "key": "{color.boundary.gradient.faint.start}"
+    },
+    "name": "token-color-boundary-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.boundary.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffecec",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.boundary-50}",
+      "group": "branding",
+      "key": "{color.boundary.gradient.faint.stop}"
+    },
+    "name": "token-color-boundary-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "boundary",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.brand}",
+    "$type": "color",
+    "$value": "#e03875",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-brand}",
+      "group": "branding",
+      "key": "{color.consul.brand}"
+    },
+    "name": "token-color-consul-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.consul.foreground}",
+    "$type": "color",
+    "$value": "#d01c5b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-500}",
+      "group": "branding",
+      "key": "{color.consul.foreground}"
+    },
+    "name": "token-color-consul-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.consul.surface}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.surface}"
+    },
+    "name": "token-color-consul-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.consul.border}",
+    "$type": "color",
+    "$value": "#ffcede",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-100}",
+      "group": "branding",
+      "key": "{color.consul.border}"
+    },
+    "name": "token-color-consul-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#ff99be",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-300}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.start}"
+    },
+    "name": "token-color-consul-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#da306e",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-400}",
+      "group": "branding",
+      "key": "{color.consul.gradient.primary.stop}"
+    },
+    "name": "token-color-consul-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fff9fb",
+    "group": "branding",
+    "comment": "this is the 'consul-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fff9fb",
+      "group": "branding",
+      "comment": "this is the 'consul-50' value at 25% opacity on white",
+      "key": "{color.consul.gradient.faint.start}"
+    },
+    "name": "token-color-consul-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.consul.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#ffe9f1",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.consul-50}",
+      "group": "branding",
+      "key": "{color.consul.gradient.faint.stop}"
+    },
+    "name": "token-color-consul-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "consul",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.hcp.brand}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.hcp-brand}",
+      "group": "branding",
+      "key": "{color.hcp.brand}"
+    },
+    "name": "token-color-hcp-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "hcp",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.brand}",
+    "$type": "color",
+    "$value": "#06d092",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-brand}",
+      "group": "branding",
+      "key": "{color.nomad.brand}"
+    },
+    "name": "token-color-nomad-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.nomad.foreground}",
+    "$type": "color",
+    "$value": "#008661",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-500}",
+      "group": "branding",
+      "key": "{color.nomad.foreground}"
+    },
+    "name": "token-color-nomad-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.nomad.surface}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.surface}"
+    },
+    "name": "token-color-nomad-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.nomad.border}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.border}"
+    },
+    "name": "token-color-nomad-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bff3dd",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-100}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.start}"
+    },
+    "name": "token-color-nomad-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#60dea9",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-200}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.primary.stop}"
+    },
+    "name": "token-color-nomad-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fff9",
+    "group": "branding",
+    "comment": "this is the 'nomad-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f3fff9",
+      "group": "branding",
+      "comment": "this is the 'nomad-50' value at 25% opacity on white",
+      "key": "{color.nomad.gradient.faint.start}"
+    },
+    "name": "token-color-nomad-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.nomad.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d3fdeb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.nomad-50}",
+      "group": "branding",
+      "key": "{color.nomad.gradient.faint.stop}"
+    },
+    "name": "token-color-nomad-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "nomad",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.brand}",
+    "$type": "color",
+    "$value": "#02a8ef",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-brand}",
+      "group": "branding",
+      "key": "{color.packer.brand}"
+    },
+    "name": "token-color-packer-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.packer.foreground}",
+    "$type": "color",
+    "$value": "#007eb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-500}",
+      "group": "branding",
+      "key": "{color.packer.foreground}"
+    },
+    "name": "token-color-packer-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.packer.surface}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.surface}"
+    },
+    "name": "token-color-packer-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.packer.border}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.border}"
+    },
+    "name": "token-color-packer-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#b4e4ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-100}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.start}"
+    },
+    "name": "token-color-packer-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#63d0ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-200}",
+      "group": "branding",
+      "key": "{color.packer.gradient.primary.stop}"
+    },
+    "name": "token-color-packer-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f3fcff",
+    "group": "branding",
+    "comment": "this is the 'packer-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#F3FCFF",
+      "group": "branding",
+      "comment": "this is the 'packer-50' value at 25% opacity on white",
+      "key": "{color.packer.gradient.faint.start}"
+    },
+    "name": "token-color-packer-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.packer.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d4f2ff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.packer-50}",
+      "group": "branding",
+      "key": "{color.packer.gradient.faint.stop}"
+    },
+    "name": "token-color-packer-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "packer",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand}",
+    "$type": "color",
+    "$value": "#7b42bc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-brand}",
+      "group": "branding",
+      "key": "{color.terraform.brand}"
+    },
+    "name": "token-color-terraform-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.terraform.brand-on-dark}",
+    "$type": "color",
+    "$value": "#a067da",
+    "group": "branding",
+    "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+    "original": {
+      "$type": "color",
+      "$value": "#a067da",
+      "group": "branding",
+      "comment": "this is an alternative brand color meant to be used on dark backgrounds",
+      "key": "{color.terraform.brand-on-dark}"
+    },
+    "name": "token-color-terraform-brand-on-dark",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "brand-on-dark"
+    ]
+  },
+  {
+    "key": "{color.terraform.foreground}",
+    "$type": "color",
+    "$value": "#773cb4",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-500}",
+      "group": "branding",
+      "key": "{color.terraform.foreground}"
+    },
+    "name": "token-color-terraform-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.terraform.surface}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.surface}"
+    },
+    "name": "token-color-terraform-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.terraform.border}",
+    "$type": "color",
+    "$value": "#ebdbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-100}",
+      "group": "branding",
+      "key": "{color.terraform.border}"
+    },
+    "name": "token-color-terraform-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#bb8deb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-300}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.start}"
+    },
+    "name": "token-color-terraform-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#844fba",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-400}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.primary.stop}"
+    },
+    "name": "token-color-terraform-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fcfaff",
+    "group": "branding",
+    "comment": "this is the 'terraform-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fcfaff",
+      "group": "branding",
+      "comment": "this is the 'terraform-50' value at 25% opacity on white",
+      "key": "{color.terraform.gradient.faint.start}"
+    },
+    "name": "token-color-terraform-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.terraform.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#f4ecff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.terraform-50}",
+      "group": "branding",
+      "key": "{color.terraform.gradient.faint.stop}"
+    },
+    "name": "token-color-terraform-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "terraform",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.brand}",
+    "$type": "color",
+    "$value": "#1868f2",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-brand}",
+      "group": "branding",
+      "key": "{color.vagrant.brand}"
+    },
+    "name": "token-color-vagrant-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vagrant.foreground}",
+    "$type": "color",
+    "$value": "#1c61d8",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-500}",
+      "group": "branding",
+      "key": "{color.vagrant.foreground}"
+    },
+    "name": "token-color-vagrant-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vagrant.surface}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.surface}"
+    },
+    "name": "token-color-vagrant-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vagrant.border}",
+    "$type": "color",
+    "$value": "#c7dbfc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-100}",
+      "group": "branding",
+      "key": "{color.vagrant.border}"
+    },
+    "name": "token-color-vagrant-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#639cff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-300}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.start}"
+    },
+    "name": "token-color-vagrant-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#2e71e5",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-400}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.primary.stop}"
+    },
+    "name": "token-color-vagrant-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f4faff",
+    "group": "branding",
+    "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f4faff",
+      "group": "branding",
+      "comment": "this is the 'vagrant-50' value at 25% opacity on white",
+      "key": "{color.vagrant.gradient.faint.start}"
+    },
+    "name": "token-color-vagrant-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vagrant.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#d6ebff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vagrant-50}",
+      "group": "branding",
+      "key": "{color.vagrant.gradient.faint.stop}"
+    },
+    "name": "token-color-vagrant-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vagrant",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-brand}",
+      "group": "branding",
+      "key": "{color.vault-radar.brand}"
+    },
+    "name": "token-color-vault-radar-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work",
+      "key": "{color.vault-radar.brand-alt}"
+    },
+    "name": "token-color-vault-radar-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-500}",
+      "group": "branding",
+      "key": "{color.vault-radar.foreground}"
+    },
+    "name": "token-color-vault-radar-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.surface}"
+    },
+    "name": "token-color-vault-radar-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.border}"
+    },
+    "name": "token-color-vault-radar-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-100}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.start}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-200}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-radar-50' value at 25% opacity on white",
+      "key": "{color.vault-radar.gradient.faint.start}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-radar.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-radar-50}",
+      "group": "branding",
+      "key": "{color.vault-radar.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-radar-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-radar",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-brand}",
+      "group": "branding",
+      "key": "{color.vault-secrets.brand}"
+    },
+    "name": "token-color-vault-secrets-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.brand-alt}",
+    "group": "branding",
+    "$type": "color",
+    "$value": "#000000",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+    "original": {
+      "group": "branding",
+      "$type": "color",
+      "$value": "#000",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work",
+      "key": "{color.vault-secrets.brand-alt}"
+    },
+    "name": "token-color-vault-secrets-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-500}",
+      "group": "branding",
+      "key": "{color.vault-secrets.foreground}"
+    },
+    "name": "token-color-vault-secrets-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.surface}"
+    },
+    "name": "token-color-vault-secrets-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.border}"
+    },
+    "name": "token-color-vault-secrets-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-100}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-200}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-secrets-50' value at 25% opacity on white",
+      "key": "{color.vault-secrets.gradient.faint.start}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault-secrets.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-secrets-50}",
+      "group": "branding",
+      "key": "{color.vault-secrets.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-secrets-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault-secrets",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.brand}",
+    "$type": "color",
+    "$value": "#ffcf25",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-brand}",
+      "group": "branding",
+      "key": "{color.vault.brand}"
+    },
+    "name": "token-color-vault-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.vault.brand-alt}",
+    "$type": "color",
+    "$value": "#000000",
+    "group": "branding",
+    "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+    "original": {
+      "$type": "color",
+      "$value": "#000",
+      "group": "branding",
+      "comment": "this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work",
+      "key": "{color.vault.brand-alt}"
+    },
+    "name": "token-color-vault-brand-alt",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "brand-alt"
+    ]
+  },
+  {
+    "key": "{color.vault.foreground}",
+    "$type": "color",
+    "$value": "#9a6f00",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-500}",
+      "group": "branding",
+      "key": "{color.vault.foreground}"
+    },
+    "name": "token-color-vault-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.vault.surface}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.surface}"
+    },
+    "name": "token-color-vault-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.vault.border}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.border}"
+    },
+    "name": "token-color-vault-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#feec7b",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-100}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.start}"
+    },
+    "name": "token-color-vault-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#ffe543",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-200}",
+      "group": "branding",
+      "key": "{color.vault.gradient.primary.stop}"
+    },
+    "name": "token-color-vault-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#fffdf2",
+    "group": "branding",
+    "comment": "this is the 'vault-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#fffdf2",
+      "group": "branding",
+      "comment": "this is the 'vault-50' value at 25% opacity on white",
+      "key": "{color.vault.gradient.faint.start}"
+    },
+    "name": "token-color-vault-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.vault.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#fff9cf",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.vault-50}",
+      "group": "branding",
+      "key": "{color.vault.gradient.faint.stop}"
+    },
+    "name": "token-color-vault-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "vault",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.brand}",
+    "$type": "color",
+    "$value": "#14c6cb",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-brand}",
+      "group": "branding",
+      "key": "{color.waypoint.brand}"
+    },
+    "name": "token-color-waypoint-brand",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "brand"
+    ]
+  },
+  {
+    "key": "{color.waypoint.foreground}",
+    "$type": "color",
+    "$value": "#008196",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-500}",
+      "group": "branding",
+      "key": "{color.waypoint.foreground}"
+    },
+    "name": "token-color-waypoint-foreground",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "foreground"
+    ]
+  },
+  {
+    "key": "{color.waypoint.surface}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.surface}"
+    },
+    "name": "token-color-waypoint-surface",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "surface"
+    ]
+  },
+  {
+    "key": "{color.waypoint.border}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.border}"
+    },
+    "name": "token-color-waypoint-border",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "border"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.start}",
+    "$type": "color",
+    "$value": "#cbf1f3",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-100}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.start}"
+    },
+    "name": "token-color-waypoint-gradient-primary-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.primary.stop}",
+    "$type": "color",
+    "$value": "#62d4dc",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-200}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.primary.stop}"
+    },
+    "name": "token-color-waypoint-gradient-primary-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "primary",
+      "stop"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.start}",
+    "$type": "color",
+    "$value": "#f6feff",
+    "group": "branding",
+    "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+    "original": {
+      "$type": "color",
+      "$value": "#f6feff",
+      "group": "branding",
+      "comment": "this is the 'waypoint-50' value at 25% opacity on white",
+      "key": "{color.waypoint.gradient.faint.start}"
+    },
+    "name": "token-color-waypoint-gradient-faint-start",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "start"
+    ]
+  },
+  {
+    "key": "{color.waypoint.gradient.faint.stop}",
+    "$type": "color",
+    "$value": "#e0fcff",
+    "group": "branding",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.waypoint-50}",
+      "group": "branding",
+      "key": "{color.waypoint.gradient.faint.stop}"
+    },
+    "name": "token-color-waypoint-gradient-faint-stop",
+    "attributes": {
+      "category": "color"
+    },
+    "path": [
+      "color",
+      "waypoint",
+      "gradient",
+      "faint",
+      "stop"
+    ]
+  },
+  {
+    "key": "{elevation.inset.box-shadow}",
+    "$value": "inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-01}",
+      "key": "{elevation.inset.box-shadow}"
+    },
+    "name": "token-elevation-inset-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.low.box-shadow}",
+    "$value": "0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-01}, {elevation.low.box-shadow-02}",
+      "key": "{elevation.low.box-shadow}"
+    },
+    "name": "token-elevation-low-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.mid.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-01}, {elevation.mid.box-shadow-02}",
+      "key": "{elevation.mid.box-shadow}"
+    },
+    "name": "token-elevation-mid-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.high.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-01}, {elevation.high.box-shadow-02}",
+      "key": "{elevation.high.box-shadow}"
+    },
+    "name": "token-elevation-high-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.higher.box-shadow}",
+    "$value": "0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-01}, {elevation.higher.box-shadow-02}",
+      "key": "{elevation.higher.box-shadow}"
+    },
+    "name": "token-elevation-higher-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{elevation.overlay.box-shadow}",
+    "$value": "0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-01}, {elevation.overlay.box-shadow-02}",
+      "key": "{elevation.overlay.box-shadow}"
+    },
+    "name": "token-elevation-overlay-box-shadow",
+    "attributes": {
+      "category": "elevation"
+    },
+    "path": [
+      "elevation",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.inset.box-shadow}",
+    "$value": "inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a",
+    "original": {
+      "$value": "{elevation.inset.box-shadow-border}, {elevation.inset.box-shadow}",
+      "key": "{surface.inset.box-shadow}"
+    },
+    "name": "token-surface-inset-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "inset",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.base.box-shadow}",
+    "$value": "0 0 0 1px #656a7633",
+    "original": {
+      "$value": "{elevation.base.box-shadow-border}",
+      "key": "{surface.base.box-shadow}"
+    },
+    "name": "token-surface-base-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "base",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.low.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d",
+    "original": {
+      "$value": "{elevation.low.box-shadow-border}, {elevation.low.box-shadow}",
+      "key": "{surface.low.box-shadow}"
+    },
+    "name": "token-surface-low-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "low",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.mid.box-shadow}",
+    "$value": "0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.mid.box-shadow-border}, {elevation.mid.box-shadow}",
+      "key": "{surface.mid.box-shadow}"
+    },
+    "name": "token-surface-mid-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "mid",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.high.box-shadow}",
+    "$value": "0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633",
+    "original": {
+      "$value": "{elevation.high.box-shadow-border}, {elevation.high.box-shadow}",
+      "key": "{surface.high.box-shadow}"
+    },
+    "name": "token-surface-high-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "high",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.higher.box-shadow}",
+    "$value": "0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640",
+    "original": {
+      "$value": "{elevation.higher.box-shadow-border}, {elevation.higher.box-shadow}",
+      "key": "{surface.higher.box-shadow}"
+    },
+    "name": "token-surface-higher-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "higher",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{surface.overlay.box-shadow}",
+    "$value": "0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559",
+    "original": {
+      "$value": "{elevation.overlay.box-shadow-border}, {elevation.overlay.box-shadow}",
+      "key": "{surface.overlay.box-shadow}"
+    },
+    "name": "token-surface-overlay-box-shadow",
+    "attributes": {
+      "category": "surface"
+    },
+    "path": [
+      "surface",
+      "overlay",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.action.box-shadow}",
+    "$value": "inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff",
+    "original": {
+      "$value": "{focus-ring.action.internal-box-shadow}, {focus-ring.action.external-box-shadow}",
+      "key": "{focus-ring.action.box-shadow}"
+    },
+    "name": "token-focus-ring-action-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "action",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{focus-ring.critical.box-shadow}",
+    "$value": "inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578",
+    "original": {
+      "$value": "{focus-ring.critical.internal-box-shadow}, {focus-ring.critical.external-box-shadow}",
+      "key": "{focus-ring.critical.box-shadow}"
+    },
+    "name": "token-focus-ring-critical-box-shadow",
+    "attributes": {
+      "category": "focus-ring"
+    },
+    "path": [
+      "focus-ring",
+      "critical",
+      "box-shadow"
+    ]
+  },
+  {
+    "key": "{app-header.height}",
+    "$type": "dimension",
+    "$value": "60px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "60",
+      "unit": "px",
+      "key": "{app-header.height}"
+    },
+    "name": "token-app-header-height",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-header.home-link.size}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-header.home-link.size}"
+    },
+    "name": "token-app-header-home-link-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "home-link",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-header.logo.size}",
+    "$type": "dimension",
+    "$value": "28px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "28",
+      "unit": "px",
+      "key": "{app-header.logo.size}"
+    },
+    "name": "token-app-header-logo-size",
+    "attributes": {
+      "category": "app-header"
+    },
+    "path": [
+      "app-header",
+      "logo",
+      "size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.border.width}"
+    },
+    "name": "token-app-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-200)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-200)",
+      "group": "components",
+      "key": "{app-side-nav.wrapper.border.color}"
+    },
+    "name": "token-app-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{app-side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-app-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-app-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.padding}"
+    },
+    "name": "token-app-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{app-side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-app-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{app-side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.header.actions.spacing}"
+    },
+    "name": "token-app-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{app-side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.height}"
+    },
+    "name": "token-app-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-app-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-app-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{app-side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{app-side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-app-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.primary}"
+    },
+    "name": "token-app-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-primary)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-primary)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.strong}"
+    },
+    "name": "token-app-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.foreground.faint}"
+    },
+    "name": "token-app-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-faint)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-faint)",
+      "group": "components",
+      "key": "{app-side-nav.color.surface.primary}"
+    },
+    "name": "token-app-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "var(--token-color-surface-interactive-hover)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-surface-interactive-hover)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{app-side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-300)",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-300)",
+      "group": "semantic",
+      "key": "{app-side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-app-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "app-side-nav"
+    },
+    "path": [
+      "app-side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{form.label.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.label.color}"
+    },
+    "name": "token-form-label-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "label",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.legend.color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{form.label.color}",
+      "group": "components",
+      "key": "{form.legend.color}"
+    },
+    "name": "token-form-legend-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "legend",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.helper-text.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.helper-text.color}"
+    },
+    "name": "token-form-helper-text-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "helper-text",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.indicator.optional.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.indicator.optional.color}"
+    },
+    "name": "token-form-indicator-optional-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "indicator",
+      "optional",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.color}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.error.color}"
+    },
+    "name": "token-form-error-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "color"
+    ]
+  },
+  {
+    "key": "{form.error.icon-size}",
+    "$type": "dimension",
+    "$value": "14px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "14",
+      "unit": "px",
+      "key": "{form.error.icon-size}"
+    },
+    "name": "token-form-error-icon-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "error",
+      "icon-size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.checkbox.size}"
+    },
+    "name": "token-form-checkbox-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.checkbox.border.radius}"
+    },
+    "name": "token-form-checkbox-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.checkbox.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.checkbox.border.width}"
+    },
+    "name": "token-form-checkbox-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.checkbox.background-image.size}"
+    },
+    "name": "token-form-checkbox-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url}"
+    },
+    "name": "token-form-checkbox-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dash' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dash' color is hardcoded here!",
+      "key": "{form.checkbox.background-image.data-url-indeterminate-disabled}"
+    },
+    "name": "token-form-checkbox-background-image-data-url-indeterminate-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "checkbox",
+      "background-image",
+      "data-url-indeterminate-disabled"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.value-color}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.strong}",
+      "group": "components",
+      "key": "{form.control.base.foreground.value-color}"
+    },
+    "name": "token-form-control-base-foreground-value-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "value-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.foreground.placeholder-color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.faint}",
+      "group": "components",
+      "key": "{form.control.base.foreground.placeholder-color}"
+    },
+    "name": "token-form-control-base-foreground-placeholder-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "foreground",
+      "placeholder-color"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.default}"
+    },
+    "name": "token-form-control-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.surface-color.hover}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-hover}",
+      "group": "components",
+      "key": "{form.control.base.surface-color.hover}"
+    },
+    "name": "token-form-control-base-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.default}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-400}",
+      "group": "components",
+      "key": "{form.control.base.border-color.default}"
+    },
+    "name": "token-form-control-base-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.base.border-color.hover}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.neutral-500}",
+      "group": "components",
+      "key": "{form.control.base.border-color.hover}"
+    },
+    "name": "token-form-control-base-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "base",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.foreground-color}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.high-contrast}",
+      "group": "components",
+      "key": "{form.control.checked.foreground-color}"
+    },
+    "name": "token-form-control-checked-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.default}",
+    "$type": "color",
+    "$value": "#1060ff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-200}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.default}"
+    },
+    "name": "token-form-control-checked-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.surface-color.hover}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.surface-color.hover}"
+    },
+    "name": "token-form-control-checked-surface-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "surface-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.default}",
+    "$type": "color",
+    "$value": "#0c56e9",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-300}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.default}"
+    },
+    "name": "token-form-control-checked-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.checked.border-color.hover}",
+    "$type": "color",
+    "$value": "#0046d1",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.blue-400}",
+      "group": "components",
+      "key": "{form.control.checked.border-color.hover}"
+    },
+    "name": "token-form-control-checked-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "checked",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.default}",
+    "$type": "color",
+    "$value": "#c00005",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-300}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.default}"
+    },
+    "name": "token-form-control-invalid-border-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.control.invalid.border-color.hover}",
+    "$type": "color",
+    "$value": "#940004",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.palette.red-400}",
+      "group": "components",
+      "key": "{form.control.invalid.border-color.hover}"
+    },
+    "name": "token-form-control-invalid-border-color-hover",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "invalid",
+      "border-color",
+      "hover"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.foreground-color}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.primary}",
+      "group": "components",
+      "key": "{form.control.readonly.foreground-color}"
+    },
+    "name": "token-form-control-readonly-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.surface-color}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "key": "{form.control.readonly.surface-color}"
+    },
+    "name": "token-form-control-readonly-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.readonly.border-color}",
+    "$type": "color",
+    "$value": "#656a761a",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.faint}",
+      "group": "components",
+      "key": "{form.control.readonly.border-color}"
+    },
+    "name": "token-form-control-readonly-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "readonly",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.foreground-color}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.foreground.disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.foreground-color}"
+    },
+    "name": "token-form-control-disabled-foreground-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "foreground-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.surface-color}",
+    "$type": "color",
+    "$value": "#fafafa",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.interactive-disabled}",
+      "group": "components",
+      "key": "{form.control.disabled.surface-color}"
+    },
+    "name": "token-form-control-disabled-surface-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "surface-color"
+    ]
+  },
+  {
+    "key": "{form.control.disabled.border-color}",
+    "$type": "color",
+    "$value": "#656a7633",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "{color.border.primary}",
+      "group": "components",
+      "key": "{form.control.disabled.border-color}"
+    },
+    "name": "token-form-control-disabled-border-color",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "disabled",
+      "border-color"
+    ]
+  },
+  {
+    "key": "{form.control.padding}",
+    "$type": "dimension",
+    "$value": "7px",
+    "unit": "px",
+    "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+    "original": {
+      "$type": "dimension",
+      "$value": "7",
+      "unit": "px",
+      "comment": "Notice: we have to take in account the border, so it's 1px less than in Figma.",
+      "key": "{form.control.padding}"
+    },
+    "name": "token-form-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "padding"
+    ]
+  },
+  {
+    "key": "{form.control.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{form.control.border.radius}"
+    },
+    "name": "token-form-control-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.control.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.control.border.width}"
+    },
+    "name": "token-form-control-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "control",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radio.size}"
+    },
+    "name": "token-form-radio-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radio.border.width}"
+    },
+    "name": "token-form-radio-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.radio.background-image.size}"
+    },
+    "name": "token-form-radio-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url}"
+    },
+    "name": "token-form-radio-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.radio.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'dot' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'dot' color is hardcoded here!",
+      "key": "{form.radio.background-image.data-url-disabled}"
+    },
+    "name": "token-form-radio-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radio",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.radiocard-group.gap}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.radiocard-group.gap}"
+    },
+    "name": "token-form-radiocard-group-gap",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard-group",
+      "gap"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.radiocard.border.width}"
+    },
+    "name": "token-form-radiocard-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.radiocard.border.radius}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{form.radiocard.border.radius}"
+    },
+    "name": "token-form-radiocard-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.radiocard.content-padding}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{form.radiocard.content-padding}"
+    },
+    "name": "token-form-radiocard-content-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "content-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.control-padding}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{form.radiocard.control-padding}"
+    },
+    "name": "token-form-radiocard-control-padding",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "control-padding"
+    ]
+  },
+  {
+    "key": "{form.radiocard.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.radiocard.transition.duration}"
+    },
+    "name": "token-form-radiocard-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "radiocard",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.select.background-image.size}"
+    },
+    "name": "token-form-select-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-right-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.select.background-image.position-right-x}"
+    },
+    "name": "token-form-select-background-image-position-right-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-right-x"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.position-top-y}",
+    "$type": "dimension",
+    "$value": "9px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "9",
+      "unit": "px",
+      "key": "{form.select.background-image.position-top-y}"
+    },
+    "name": "token-form-select-background-image-position-top-y",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "position-top-y"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url}"
+    },
+    "name": "token-form-select-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.select.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+    "comment": "notice: the 'caret' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E\")",
+      "comment": "notice: the 'caret' color is hardcoded here!",
+      "key": "{form.select.background-image.data-url-disabled}"
+    },
+    "name": "token-form-select-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "select",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.text-input.background-image.size}"
+    },
+    "name": "token-form-text-input-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "7px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.control.padding}",
+      "key": "{form.text-input.background-image.position-x}"
+    },
+    "name": "token-form-text-input-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-date}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-date}"
+    },
+    "name": "token-form-text-input-background-image-data-url-date",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-date"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-time}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-time}"
+    },
+    "name": "token-form-text-input-background-image-data-url-time",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-time"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-cancel}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color is hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-cancel}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-cancel",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-cancel"
+    ]
+  },
+  {
+    "key": "{form.text-input.background-image.data-url-search-loading}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+    "comment": "notice: the icon color and animation are hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e\")",
+      "comment": "notice: the icon color and animation are hardcoded here!",
+      "key": "{form.text-input.background-image.data-url-search-loading}"
+    },
+    "name": "token-form-text-input-background-image-data-url-search-loading",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "text-input",
+      "background-image",
+      "data-url-search-loading"
+    ]
+  },
+  {
+    "key": "{form.toggle.width}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{form.toggle.width}"
+    },
+    "name": "token-form-toggle-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.height}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{form.toggle.height}"
+    },
+    "name": "token-form-toggle-height",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "height"
+    ]
+  },
+  {
+    "key": "{form.toggle.base.surface-color.default}",
+    "$type": "color",
+    "$value": "#f1f2f3",
+    "group": "components",
+    "comment": "the toggle has a different base surface color, compared to the other controls",
+    "original": {
+      "$type": "color",
+      "$value": "{color.surface.strong}",
+      "group": "components",
+      "comment": "the toggle has a different base surface color, compared to the other controls",
+      "key": "{form.toggle.base.surface-color.default}"
+    },
+    "name": "token-form-toggle-base-surface-color-default",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "base",
+      "surface-color",
+      "default"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.radius}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{form.toggle.border.radius}"
+    },
+    "name": "token-form-toggle-border-radius",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{form.toggle.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{form.toggle.border.width}"
+    },
+    "name": "token-form-toggle-border-width",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.size}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{form.toggle.background-image.size}"
+    },
+    "name": "token-form-toggle-background-image-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "size"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.position-x}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{form.toggle.background-image.position-x}"
+    },
+    "name": "token-form-toggle-background-image-position-x",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "position-x"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url}"
+    },
+    "name": "token-form-toggle-background-image-data-url",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url"
+    ]
+  },
+  {
+    "key": "{form.toggle.background-image.data-url-disabled}",
+    "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+    "comment": "notice: the 'tick' color is hardcoded here!",
+    "original": {
+      "$value": "url(\"data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e\")",
+      "comment": "notice: the 'tick' color is hardcoded here!",
+      "key": "{form.toggle.background-image.data-url-disabled}"
+    },
+    "name": "token-form-toggle-background-image-data-url-disabled",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "background-image",
+      "data-url-disabled"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.duration}",
+    "$type": "duration",
+    "$value": "0.2s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.2",
+      "unit": "s",
+      "key": "{form.toggle.transition.duration}"
+    },
+    "name": "token-form-toggle-transition-duration",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{form.toggle.transition.timing-function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.68, -0.2, 0.265, 1.15)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.68,
+        -0.2,
+        0.265,
+        1.15
+      ],
+      "key": "{form.toggle.transition.timing-function}"
+    },
+    "name": "token-form-toggle-transition-timing-function",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "transition",
+      "timing-function"
+    ]
+  },
+  {
+    "key": "{form.toggle.thumb-size}",
+    "$type": "dimension",
+    "$value": "16px",
+    "original": {
+      "$type": "dimension",
+      "$value": "{form.toggle.height}",
+      "key": "{form.toggle.thumb-size}"
+    },
+    "name": "token-form-toggle-thumb-size",
+    "attributes": {
+      "category": "form"
+    },
+    "path": [
+      "form",
+      "toggle",
+      "thumb-size"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{pagination.nav.control.height}"
+    },
+    "name": "token-pagination-nav-control-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{pagination.nav.control.padding.horizontal}"
+    },
+    "name": "token-pagination-nav-control-padding-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.focus-inset}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{pagination.nav.control.focus-inset}"
+    },
+    "name": "token-pagination-nav-control-focus-inset",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{pagination.nav.control.icon-spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.control.icon-spacing}"
+    },
+    "name": "token-pagination-nav-control-icon-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "control",
+      "icon-spacing"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.height}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.height}"
+    },
+    "name": "token-pagination-nav-indicator-height",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{pagination.nav.indicator.spacing}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{pagination.nav.indicator.spacing}"
+    },
+    "name": "token-pagination-nav-indicator-spacing",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "nav",
+      "indicator",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{pagination.child.spacing.vertical}"
+    },
+    "name": "token-pagination-child-spacing-vertical",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{pagination.child.spacing.horizontal}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{pagination.child.spacing.horizontal}"
+    },
+    "name": "token-pagination-child-spacing-horizontal",
+    "attributes": {
+      "category": "pagination"
+    },
+    "path": [
+      "pagination",
+      "child",
+      "spacing",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.width}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{side-nav.wrapper.border.width}"
+    },
+    "name": "token-side-nav-wrapper-border-width",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "width"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.border.color}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "components",
+      "key": "{side-nav.wrapper.border.color}"
+    },
+    "name": "token-side-nav-wrapper-border-color",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "border",
+      "color"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical}",
+    "$type": "dimension",
+    "$value": "16px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "16",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.horizontal-minimized}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.horizontal-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-horizontal-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "horizontal-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.wrapper.padding.vertical-minimized}",
+    "$type": "dimension",
+    "$value": "22px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "22",
+      "unit": "px",
+      "key": "{side-nav.wrapper.padding.vertical-minimized}"
+    },
+    "name": "token-side-nav-wrapper-padding-vertical-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "wrapper",
+      "padding",
+      "vertical-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.toggle-button.border.radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.toggle-button.border.radius}"
+    },
+    "name": "token-side-nav-toggle-button-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "toggle-button",
+      "border",
+      "radius"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.padding}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.padding}"
+    },
+    "name": "token-side-nav-header-home-link-padding",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "padding"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size"
+    ]
+  },
+  {
+    "key": "{side-nav.header.home-link.logo-size-minimized}",
+    "$type": "dimension",
+    "$value": "32px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "32",
+      "unit": "px",
+      "key": "{side-nav.header.home-link.logo-size-minimized}"
+    },
+    "name": "token-side-nav-header-home-link-logo-size-minimized",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "home-link",
+      "logo-size-minimized"
+    ]
+  },
+  {
+    "key": "{side-nav.header.actions.spacing}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.header.actions.spacing}"
+    },
+    "name": "token-side-nav-header-actions-spacing",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "header",
+      "actions",
+      "spacing"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list.margin-vertical}",
+    "$type": "dimension",
+    "$value": "24px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "24",
+      "unit": "px",
+      "key": "{side-nav.body.list.margin-vertical}"
+    },
+    "name": "token-side-nav-body-list-margin-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list",
+      "margin-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.height}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.height}"
+    },
+    "name": "token-side-nav-body-list-item-height",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "height"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-padding-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.padding.vertical}",
+    "$type": "dimension",
+    "$value": "4px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "4",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.padding.vertical}"
+    },
+    "name": "token-side-nav-body-list-item-padding-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.spacing-vertical}",
+    "$type": "dimension",
+    "$value": "2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "2",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.spacing-vertical}"
+    },
+    "name": "token-side-nav-body-list-item-spacing-vertical",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "spacing-vertical"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.content-spacing-horizontal}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.content-spacing-horizontal}"
+    },
+    "name": "token-side-nav-body-list-item-content-spacing-horizontal",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "content-spacing-horizontal"
+    ]
+  },
+  {
+    "key": "{side-nav.body.list-item.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{side-nav.body.list-item.border-radius}"
+    },
+    "name": "token-side-nav-body-list-item-border-radius",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "body",
+      "list-item",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.primary}",
+    "$type": "color",
+    "$value": "#dedfe3",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#dedfe3",
+      "group": "components",
+      "key": "{side-nav.color.foreground.primary}"
+    },
+    "name": "token-side-nav-color-foreground-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.strong}",
+    "$type": "color",
+    "$value": "#ffffff",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#fff",
+      "group": "components",
+      "key": "{side-nav.color.foreground.strong}"
+    },
+    "name": "token-side-nav-color-foreground-strong",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "strong"
+    ]
+  },
+  {
+    "key": "{side-nav.color.foreground.faint}",
+    "$type": "color",
+    "$value": "#8c909c",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#8c909c",
+      "group": "components",
+      "key": "{side-nav.color.foreground.faint}"
+    },
+    "name": "token-side-nav-color-foreground-faint",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "foreground",
+      "faint"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.primary}",
+    "$type": "color",
+    "$value": "#0c0c0e",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "#0c0c0e",
+      "group": "components",
+      "key": "{side-nav.color.surface.primary}"
+    },
+    "name": "token-side-nav-color-surface-primary",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-hover}",
+    "$type": "color",
+    "$value": "#3b3d45",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#3b3d45",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-hover}"
+    },
+    "name": "token-side-nav-color-surface-interactive-hover",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-hover"
+    ]
+  },
+  {
+    "key": "{side-nav.color.surface.interactive-active}",
+    "$type": "color",
+    "$value": "#656a76",
+    "group": "semantic",
+    "original": {
+      "$type": "color",
+      "$value": "#656a76",
+      "group": "semantic",
+      "key": "{side-nav.color.surface.interactive-active}"
+    },
+    "name": "token-side-nav-color-surface-interactive-active",
+    "attributes": {
+      "category": "side-nav"
+    },
+    "path": [
+      "side-nav",
+      "color",
+      "surface",
+      "interactive-active"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.medium}",
+    "$type": "dimension",
+    "$value": "36px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "36",
+      "unit": "px",
+      "key": "{tabs.tab.height.medium}"
+    },
+    "name": "token-tabs-tab-height-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.height.large}",
+    "$type": "dimension",
+    "$value": "48px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "48",
+      "unit": "px",
+      "key": "{tabs.tab.height.large}"
+    },
+    "name": "token-tabs-tab-height-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "height",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.medium}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.medium}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-medium",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "medium"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.horizontal.large}",
+    "$type": "dimension",
+    "$value": "20px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "20",
+      "unit": "px",
+      "key": "{tabs.tab.padding.horizontal.large}"
+    },
+    "name": "token-tabs-tab-padding-horizontal-large",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "horizontal",
+      "large"
+    ]
+  },
+  {
+    "key": "{tabs.tab.padding.vertical}",
+    "$type": "dimension",
+    "$value": "0px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "0",
+      "unit": "px",
+      "key": "{tabs.tab.padding.vertical}"
+    },
+    "name": "token-tabs-tab-padding-vertical",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tabs.tab.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tabs.tab.border-radius}"
+    },
+    "name": "token-tabs-tab-border-radius",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tabs.tab.focus-inset}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.focus-inset}"
+    },
+    "name": "token-tabs-tab-focus-inset",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "focus-inset"
+    ]
+  },
+  {
+    "key": "{tabs.tab.gutter}",
+    "$type": "dimension",
+    "$value": "6px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "6",
+      "unit": "px",
+      "key": "{tabs.tab.gutter}"
+    },
+    "name": "token-tabs-tab-gutter",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "tab",
+      "gutter"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.height}",
+    "$type": "dimension",
+    "$value": "3px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "3",
+      "unit": "px",
+      "key": "{tabs.indicator.height}"
+    },
+    "name": "token-tabs-indicator-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "height"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.5, 1, 0.89, 1)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.5,
+        1,
+        0.89,
+        1
+      ],
+      "key": "{tabs.indicator.transition.function}"
+    },
+    "name": "token-tabs-indicator-transition-function",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{tabs.indicator.transition.duration}",
+    "$type": "duration",
+    "$value": "0.6s",
+    "unit": "s",
+    "original": {
+      "$type": "duration",
+      "$value": "0.6",
+      "unit": "s",
+      "key": "{tabs.indicator.transition.duration}"
+    },
+    "name": "token-tabs-indicator-transition-duration",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "indicator",
+      "transition",
+      "duration"
+    ]
+  },
+  {
+    "key": "{tabs.divider.height}",
+    "$type": "dimension",
+    "$value": "1px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "1",
+      "unit": "px",
+      "key": "{tabs.divider.height}"
+    },
+    "name": "token-tabs-divider-height",
+    "attributes": {
+      "category": "tabs"
+    },
+    "path": [
+      "tabs",
+      "divider",
+      "height"
+    ]
+  },
+  {
+    "key": "{tooltip.border-radius}",
+    "$type": "dimension",
+    "$value": "5px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "5",
+      "unit": "px",
+      "key": "{tooltip.border-radius}"
+    },
+    "name": "token-tooltip-border-radius",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "border-radius"
+    ]
+  },
+  {
+    "key": "{tooltip.color.foreground.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-foreground-high-contrast)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-foreground-high-contrast)",
+      "group": "components",
+      "key": "{tooltip.color.foreground.primary}"
+    },
+    "name": "token-tooltip-color-foreground-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "foreground",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.color.surface.primary}",
+    "$type": "color",
+    "$value": "var(--token-color-palette-neutral-700)",
+    "group": "components",
+    "original": {
+      "$type": "color",
+      "$value": "var(--token-color-palette-neutral-700)",
+      "group": "components",
+      "key": "{tooltip.color.surface.primary}"
+    },
+    "name": "token-tooltip-color-surface-primary",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "color",
+      "surface",
+      "primary"
+    ]
+  },
+  {
+    "key": "{tooltip.focus-offset}",
+    "$type": "dimension",
+    "$value": "-2px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "-2",
+      "unit": "px",
+      "key": "{tooltip.focus-offset}"
+    },
+    "name": "token-tooltip-focus-offset",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "focus-offset"
+    ]
+  },
+  {
+    "key": "{tooltip.max-width}",
+    "$type": "dimension",
+    "$value": "280px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "280",
+      "unit": "px",
+      "key": "{tooltip.max-width}"
+    },
+    "name": "token-tooltip-max-width",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "max-width"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.horizontal}",
+    "$type": "dimension",
+    "$value": "12px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "12",
+      "unit": "px",
+      "key": "{tooltip.padding.horizontal}"
+    },
+    "name": "token-tooltip-padding-horizontal",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "horizontal"
+    ]
+  },
+  {
+    "key": "{tooltip.padding.vertical}",
+    "$type": "dimension",
+    "$value": "8px",
+    "unit": "px",
+    "original": {
+      "$type": "dimension",
+      "$value": "8",
+      "unit": "px",
+      "key": "{tooltip.padding.vertical}"
+    },
+    "name": "token-tooltip-padding-vertical",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "padding",
+      "vertical"
+    ]
+  },
+  {
+    "key": "{tooltip.transition.function}",
+    "$type": "cubicBezier",
+    "$value": "cubic-bezier(0.54, 1.5, 0.38, 1.11)",
+    "original": {
+      "$type": "cubicBezier",
+      "$value": [
+        0.54,
+        1.5,
+        0.38,
+        1.11
+      ],
+      "key": "{tooltip.transition.function}"
+    },
+    "name": "token-tooltip-transition-function",
+    "attributes": {
+      "category": "tooltip"
+    },
+    "path": [
+      "tooltip",
+      "transition",
+      "function"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.display}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.display.macOS}",
+        "{typography.font-stack.sans.display.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.display.emoji}"
+      ],
+      "key": "{typography.font-stack.display}"
+    },
+    "name": "token-typography-font-stack-display",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "display"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.text}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.sans.text.macOS}",
+        "{typography.font-stack.sans.text.windows}",
+        "{typography.font-stack.sans.display.sans}",
+        "{typography.font-stack.sans.text.emoji}"
+      ],
+      "key": "{typography.font-stack.text}"
+    },
+    "name": "token-typography-font-stack-text",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "text"
+    ]
+  },
+  {
+    "key": "{typography.font-stack.code}",
+    "$type": "font-family",
+    "$value": "ui-monospace, Menlo, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": [
+        "{typography.font-stack.monospace.code.macOS}",
+        "{typography.font-stack.monospace.code.windows}",
+        "monospace"
+      ],
+      "key": "{typography.font-stack.code}"
+    },
+    "name": "token-typography-font-stack-code",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-stack",
+      "code"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.regular}",
+    "$type": "font-weight",
+    "$value": "400",
+    "$modes": {
+      "default": "400",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "400",
+      "$modes": {
+        "default": "400",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.regular}"
+    },
+    "name": "token-typography-font-weight-regular",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "regular"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.medium}",
+    "$type": "font-weight",
+    "$value": "500",
+    "$modes": {
+      "default": "500",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "500",
+      "$modes": {
+        "default": "500",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
+      "key": "{typography.font-weight.medium}"
+    },
+    "name": "token-typography-font-weight-medium",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "medium"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.semibold}",
+    "$type": "font-weight",
+    "$value": "600",
+    "$modes": {
+      "default": "600",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "600",
+      "$modes": {
+        "default": "600",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.semibold}"
+    },
+    "name": "token-typography-font-weight-semibold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "semibold"
+    ]
+  },
+  {
+    "key": "{typography.font-weight.bold}",
+    "$type": "font-weight",
+    "$value": "700",
+    "$modes": {
+      "default": "700",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
+    "original": {
+      "$type": "font-weight",
+      "$value": "700",
+      "$modes": {
+        "default": "700",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
+      "key": "{typography.font-weight.bold}"
+    },
+    "name": "token-typography-font-weight-bold",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "font-weight",
+      "bold"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-500.font-family}"
+    },
+    "name": "token-typography-display-500-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-500.font-size}",
+    "$type": "font-size",
+    "$value": "1.875rem",
+    "unit": "px",
+    "comment": "30px/1.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "30",
+      "unit": "px",
+      "comment": "30px/1.875rem",
+      "key": "{typography.display-500.font-size}"
+    },
+    "name": "token-typography-display-500-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-500.line-height}",
+    "$type": "number",
+    "$value": 1.2666,
+    "comment": "38px",
+    "original": {
+      "$type": "number",
+      "$value": 1.2666,
+      "comment": "38px",
+      "key": "{typography.display-500.line-height}"
+    },
+    "name": "token-typography-display-500-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-500",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-400.font-family}"
+    },
+    "name": "token-typography-display-400-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-400.font-size}",
+    "$type": "font-size",
+    "$value": "1.5rem",
+    "unit": "px",
+    "comment": "24px/1.5rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "24",
+      "unit": "px",
+      "comment": "24px/1.5rem",
+      "key": "{typography.display-400.font-size}"
+    },
+    "name": "token-typography-display-400-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-400.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "32px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "32px",
+      "key": "{typography.display-400.line-height}"
+    },
+    "name": "token-typography-display-400-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-400",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-300.font-family}"
+    },
+    "name": "token-typography-display-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-300.font-size}",
+    "$type": "font-size",
+    "$value": "1.125rem",
+    "unit": "px",
+    "comment": "18px/1.125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "18",
+      "unit": "px",
+      "comment": "18px/1.125rem",
+      "key": "{typography.display-300.font-size}"
+    },
+    "name": "token-typography-display-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-300.line-height}",
+    "$type": "number",
+    "$value": 1.3333,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3333,
+      "comment": "24px",
+      "key": "{typography.display-300.line-height}"
+    },
+    "name": "token-typography-display-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-300.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-300.letter-spacing}"
+    },
+    "name": "token-typography-display-300-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-300",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.display}",
+      "key": "{typography.display-200.font-family}"
+    },
+    "name": "token-typography-display-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-200.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.display-200.font-size}"
+    },
+    "name": "token-typography-display-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-200.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.display-200.line-height}"
+    },
+    "name": "token-typography-display-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.display-200.letter-spacing}",
+    "$type": "letter-spacing",
+    "$value": "-0.5px",
+    "unit": "px",
+    "comment": "this is `tracking`",
+    "original": {
+      "$type": "letter-spacing",
+      "$value": -0.5,
+      "unit": "px",
+      "comment": "this is `tracking`",
+      "key": "{typography.display-200.letter-spacing}"
+    },
+    "name": "token-typography-display-200-letter-spacing",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-200",
+      "letter-spacing"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.display-100.font-family}"
+    },
+    "name": "token-typography-display-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.display-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.display-100.font-size}"
+    },
+    "name": "token-typography-display-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.display-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.display-100.line-height}"
+    },
+    "name": "token-typography-display-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "display-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-300.font-family}"
+    },
+    "name": "token-typography-body-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.body-300.font-size}"
+    },
+    "name": "token-typography-body-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-300.line-height}",
+    "$type": "number",
+    "$value": 1.5,
+    "comment": "24px",
+    "original": {
+      "$type": "number",
+      "$value": 1.5,
+      "comment": "24px",
+      "key": "{typography.body-300.line-height}"
+    },
+    "name": "token-typography-body-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-300",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-200.font-family}"
+    },
+    "name": "token-typography-body-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.body-200.font-size}"
+    },
+    "name": "token-typography-body-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-200.line-height}",
+    "$type": "number",
+    "$value": 1.4286,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.4286,
+      "comment": "20px",
+      "key": "{typography.body-200.line-height}"
+    },
+    "name": "token-typography-body-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-family}",
+    "$type": "font-family",
+    "$value": "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.text}",
+      "key": "{typography.body-100.font-family}"
+    },
+    "name": "token-typography-body-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.body-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.body-100.font-size}"
+    },
+    "name": "token-typography-body-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.body-100.line-height}",
+    "$type": "number",
+    "$value": 1.3846,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.3846,
+      "comment": "18px",
+      "key": "{typography.body-100.line-height}"
+    },
+    "name": "token-typography-body-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "body-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-family}",
+    "$type": "font-family",
+    "$value": "ui-monospace, Menlo, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-100.font-family}"
+    },
+    "name": "token-typography-code-100-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-100.font-size}",
+    "$type": "font-size",
+    "$value": "0.8125rem",
+    "unit": "px",
+    "comment": "13px/0.8125rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "13",
+      "unit": "px",
+      "comment": "13px/0.8125rem",
+      "key": "{typography.code-100.font-size}"
+    },
+    "name": "token-typography-code-100-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-100.line-height}",
+    "$type": "number",
+    "$value": 1.23,
+    "comment": "16px",
+    "original": {
+      "$type": "number",
+      "$value": 1.23,
+      "comment": "16px",
+      "key": "{typography.code-100.line-height}"
+    },
+    "name": "token-typography-code-100-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-100",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-family}",
+    "$type": "font-family",
+    "$value": "ui-monospace, Menlo, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-200.font-family}"
+    },
+    "name": "token-typography-code-200-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-200.font-size}",
+    "$type": "font-size",
+    "$value": "0.875rem",
+    "unit": "px",
+    "comment": "14px/0.875rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "14",
+      "unit": "px",
+      "comment": "14px/0.875rem",
+      "key": "{typography.code-200.font-size}"
+    },
+    "name": "token-typography-code-200-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-200.line-height}",
+    "$type": "number",
+    "$value": 1.125,
+    "comment": "18px",
+    "original": {
+      "$type": "number",
+      "$value": 1.125,
+      "comment": "18px",
+      "key": "{typography.code-200.line-height}"
+    },
+    "name": "token-typography-code-200-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-200",
+      "line-height"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-family}",
+    "$type": "font-family",
+    "$value": "ui-monospace, Menlo, Consolas, monospace",
+    "original": {
+      "$type": "font-family",
+      "$value": "{typography.font-stack.code}",
+      "key": "{typography.code-300.font-family}"
+    },
+    "name": "token-typography-code-300-font-family",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-family"
+    ]
+  },
+  {
+    "key": "{typography.code-300.font-size}",
+    "$type": "font-size",
+    "$value": "1rem",
+    "unit": "px",
+    "comment": "16px/1rem",
+    "original": {
+      "$type": "font-size",
+      "$value": "16",
+      "unit": "px",
+      "comment": "16px/1rem",
+      "key": "{typography.code-300.font-size}"
+    },
+    "name": "token-typography-code-300-font-size",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "font-size"
+    ]
+  },
+  {
+    "key": "{typography.code-300.line-height}",
+    "$type": "number",
+    "$value": 1.25,
+    "comment": "20px",
+    "original": {
+      "$type": "number",
+      "$value": 1.25,
+      "comment": "20px",
+      "key": "{typography.code-300.line-height}"
+    },
+    "name": "token-typography-code-300-line-height",
+    "attributes": {
+      "category": "typography"
+    },
+    "path": [
+      "typography",
+      "code-300",
+      "line-height"
+    ]
+  }
+]
\ No newline at end of file
diff --git a/packages/tokens/dist/docs/products/tokens.json b/packages/tokens/dist/docs/products/tokens.json
index 42700c3efb9..5dacd2e4150 100644
--- a/packages/tokens/dist/docs/products/tokens.json
+++ b/packages/tokens/dist/docs/products/tokens.json
@@ -886,10 +886,24 @@
     "$type": "color",
     "$value": "#ffffff",
     "group": "palette",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#ffffff",
+      "cds-g10": "#ffffff",
+      "cds-g90": "#ffffff",
+      "cds-g100": "#ffffff"
+    },
     "original": {
       "$type": "color",
       "$value": "#ffffff",
       "group": "palette",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.color.white.0}",
+        "cds-g10": "{carbon.color.white.0}",
+        "cds-g90": "{carbon.color.white.0}",
+        "cds-g100": "{carbon.color.white.0}"
+      },
       "key": "{color.palette.neutral-0}"
     },
     "name": "token-color-palette-neutral-0",
@@ -1257,10 +1271,24 @@
     "$type": "color",
     "$value": "#3b3d45",
     "group": "semantic",
+    "$modes": {
+      "default": "#ffffff",
+      "cds-g0": "#161616",
+      "cds-g10": "#161616",
+      "cds-g90": "#f4f4f4",
+      "cds-g100": "#f4f4f4"
+    },
     "original": {
       "$type": "color",
       "$value": "{color.palette.neutral-600}",
       "group": "semantic",
+      "$modes": {
+        "default": "#ffffff",
+        "cds-g0": "{carbon.themes.white.textPrimary}",
+        "cds-g10": "{carbon.themes.g10.textPrimary}",
+        "cds-g90": "{carbon.themes.g90.textPrimary}",
+        "cds-g100": "{carbon.themes.g100.textPrimary}"
+      },
       "key": "{color.foreground.primary}"
     },
     "name": "token-color-foreground-primary",
@@ -7453,10 +7481,24 @@
   {
     "key": "{typography.font-weight.regular}",
     "$type": "font-weight",
-    "$value": 400,
+    "$value": "400",
+    "$modes": {
+      "default": "400",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
     "original": {
       "$type": "font-weight",
-      "$value": 400,
+      "$value": "400",
+      "$modes": {
+        "default": "400",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
       "key": "{typography.font-weight.regular}"
     },
     "name": "token-typography-font-weight-regular",
@@ -7472,10 +7514,24 @@
   {
     "key": "{typography.font-weight.medium}",
     "$type": "font-weight",
-    "$value": 500,
+    "$value": "500",
+    "$modes": {
+      "default": "500",
+      "cds-g0": 400,
+      "cds-g10": 400,
+      "cds-g90": 400,
+      "cds-g100": 400
+    },
     "original": {
       "$type": "font-weight",
-      "$value": 500,
+      "$value": "500",
+      "$modes": {
+        "default": "500",
+        "cds-g0": "{carbon.typography.font-weight.regular}",
+        "cds-g10": "{carbon.typography.font-weight.regular}",
+        "cds-g90": "{carbon.typography.font-weight.regular}",
+        "cds-g100": "{carbon.typography.font-weight.regular}"
+      },
       "key": "{typography.font-weight.medium}"
     },
     "name": "token-typography-font-weight-medium",
@@ -7491,10 +7547,24 @@
   {
     "key": "{typography.font-weight.semibold}",
     "$type": "font-weight",
-    "$value": 600,
+    "$value": "600",
+    "$modes": {
+      "default": "600",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
     "original": {
       "$type": "font-weight",
-      "$value": 600,
+      "$value": "600",
+      "$modes": {
+        "default": "600",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
       "key": "{typography.font-weight.semibold}"
     },
     "name": "token-typography-font-weight-semibold",
@@ -7510,10 +7580,24 @@
   {
     "key": "{typography.font-weight.bold}",
     "$type": "font-weight",
-    "$value": 700,
+    "$value": "700",
+    "$modes": {
+      "default": "700",
+      "cds-g0": 600,
+      "cds-g10": 600,
+      "cds-g90": 600,
+      "cds-g100": 600
+    },
     "original": {
       "$type": "font-weight",
-      "$value": 700,
+      "$value": "700",
+      "$modes": {
+        "default": "700",
+        "cds-g0": "{carbon.typography.font-weight.semibold}",
+        "cds-g10": "{carbon.typography.font-weight.semibold}",
+        "cds-g90": "{carbon.typography.font-weight.semibold}",
+        "cds-g100": "{carbon.typography.font-weight.semibold}"
+      },
       "key": "{typography.font-weight.bold}"
     },
     "name": "token-typography-font-weight-bold",
diff --git a/packages/tokens/dist/marketing/css/helpers/typography.css b/packages/tokens/dist/marketing/css/helpers/typography.css
index 393b8900901..c0913ef1a67 100644
--- a/packages/tokens/dist/marketing/css/helpers/typography.css
+++ b/packages/tokens/dist/marketing/css/helpers/typography.css
@@ -5,10 +5,10 @@
 .hds-font-family-sans-display { font-family: var(--token-typography-font-stack-display); }
 .hds-font-family-sans-text { font-family: var(--token-typography-font-stack-text); }
 .hds-font-family-mono-code { font-family: var(--token-typography-font-stack-code); }
-.hds-font-weight-regular { font-weight: 400; }
-.hds-font-weight-medium { font-weight: 500; }
-.hds-font-weight-semibold { font-weight: 600; }
-.hds-font-weight-bold { font-weight: 700; }
+.hds-font-weight-regular { font-weight: var(--token-typography-font-weight-regular); }
+.hds-font-weight-medium { font-weight: var(--token-typography-font-weight-medium); }
+.hds-font-weight-semibold { font-weight: var(--token-typography-font-weight-semibold); }
+.hds-font-weight-bold { font-weight: var(--token-typography-font-weight-bold); }
 .hds-typography-display-500 { font-family: var(--token-typography-display-500-font-family); font-size: var(--token-typography-display-500-font-size); line-height: var(--token-typography-display-500-line-height); margin: 0; padding: 0; }
 .hds-typography-display-400 { font-family: var(--token-typography-display-400-font-family); font-size: var(--token-typography-display-400-font-size); line-height: var(--token-typography-display-400-line-height); margin: 0; padding: 0; }
 .hds-typography-display-300 { font-family: var(--token-typography-display-300-font-family); font-size: var(--token-typography-display-300-font-size); line-height: var(--token-typography-display-300-line-height); margin: 0; padding: 0; }
diff --git a/packages/tokens/dist/marketing/tokens.json b/packages/tokens/dist/marketing/tokens.json
index 705017893fe..efe48b76ff4 100644
--- a/packages/tokens/dist/marketing/tokens.json
+++ b/packages/tokens/dist/marketing/tokens.json
@@ -976,12 +976,26 @@
         "$type": "color",
         "$value": "#ffffff",
         "group": "palette",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "#ffffff",
+          "cds-g10": "#ffffff",
+          "cds-g90": "#ffffff",
+          "cds-g100": "#ffffff"
+        },
         "filePath": "src/global/color/palette-neutrals.json",
         "isSource": true,
         "original": {
           "$type": "color",
           "$value": "#ffffff",
           "group": "palette",
+          "$modes": {
+            "default": "#ffffff",
+            "cds-g0": "{carbon.color.white.0}",
+            "cds-g10": "{carbon.color.white.0}",
+            "cds-g90": "{carbon.color.white.0}",
+            "cds-g100": "{carbon.color.white.0}"
+          },
           "key": "{color.palette.neutral-0}"
         },
         "name": "token-color-palette-neutral-0",
@@ -1391,12 +1405,26 @@
         "$type": "color",
         "$value": "#3b3d45",
         "group": "semantic",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "#161616",
+          "cds-g10": "#161616",
+          "cds-g90": "#f4f4f4",
+          "cds-g100": "#f4f4f4"
+        },
         "filePath": "src/global/color/semantic-foreground.json",
         "isSource": true,
         "original": {
           "$type": "color",
           "$value": "{color.palette.neutral-600}",
           "group": "semantic",
+          "$modes": {
+            "default": "#ffffff",
+            "cds-g0": "{carbon.themes.white.textPrimary}",
+            "cds-g10": "{carbon.themes.g10.textPrimary}",
+            "cds-g90": "{carbon.themes.g90.textPrimary}",
+            "cds-g100": "{carbon.themes.g100.textPrimary}"
+          },
           "key": "{color.foreground.primary}"
         },
         "name": "token-color-foreground-primary",
@@ -8483,12 +8511,26 @@
       "regular": {
         "key": "{typography.font-weight.regular}",
         "$type": "font-weight",
-        "$value": 400,
+        "$value": "400",
+        "$modes": {
+          "default": "400",
+          "cds-g0": 400,
+          "cds-g10": 400,
+          "cds-g90": 400,
+          "cds-g100": 400
+        },
         "filePath": "src/products/shared/typography.json",
         "isSource": true,
         "original": {
           "$type": "font-weight",
-          "$value": 400,
+          "$value": "400",
+          "$modes": {
+            "default": "400",
+            "cds-g0": "{carbon.typography.font-weight.regular}",
+            "cds-g10": "{carbon.typography.font-weight.regular}",
+            "cds-g90": "{carbon.typography.font-weight.regular}",
+            "cds-g100": "{carbon.typography.font-weight.regular}"
+          },
           "key": "{typography.font-weight.regular}"
         },
         "name": "token-typography-font-weight-regular",
@@ -8504,12 +8546,26 @@
       "medium": {
         "key": "{typography.font-weight.medium}",
         "$type": "font-weight",
-        "$value": 500,
+        "$value": "500",
+        "$modes": {
+          "default": "500",
+          "cds-g0": 400,
+          "cds-g10": 400,
+          "cds-g90": 400,
+          "cds-g100": 400
+        },
         "filePath": "src/products/shared/typography.json",
         "isSource": true,
         "original": {
           "$type": "font-weight",
-          "$value": 500,
+          "$value": "500",
+          "$modes": {
+            "default": "500",
+            "cds-g0": "{carbon.typography.font-weight.regular}",
+            "cds-g10": "{carbon.typography.font-weight.regular}",
+            "cds-g90": "{carbon.typography.font-weight.regular}",
+            "cds-g100": "{carbon.typography.font-weight.regular}"
+          },
           "key": "{typography.font-weight.medium}"
         },
         "name": "token-typography-font-weight-medium",
@@ -8525,12 +8581,26 @@
       "semibold": {
         "key": "{typography.font-weight.semibold}",
         "$type": "font-weight",
-        "$value": 600,
+        "$value": "600",
+        "$modes": {
+          "default": "600",
+          "cds-g0": 600,
+          "cds-g10": 600,
+          "cds-g90": 600,
+          "cds-g100": 600
+        },
         "filePath": "src/products/shared/typography.json",
         "isSource": true,
         "original": {
           "$type": "font-weight",
-          "$value": 600,
+          "$value": "600",
+          "$modes": {
+            "default": "600",
+            "cds-g0": "{carbon.typography.font-weight.semibold}",
+            "cds-g10": "{carbon.typography.font-weight.semibold}",
+            "cds-g90": "{carbon.typography.font-weight.semibold}",
+            "cds-g100": "{carbon.typography.font-weight.semibold}"
+          },
           "key": "{typography.font-weight.semibold}"
         },
         "name": "token-typography-font-weight-semibold",
@@ -8546,12 +8616,26 @@
       "bold": {
         "key": "{typography.font-weight.bold}",
         "$type": "font-weight",
-        "$value": 700,
+        "$value": "700",
+        "$modes": {
+          "default": "700",
+          "cds-g0": 600,
+          "cds-g10": 600,
+          "cds-g90": 600,
+          "cds-g100": 600
+        },
         "filePath": "src/products/shared/typography.json",
         "isSource": true,
         "original": {
           "$type": "font-weight",
-          "$value": 700,
+          "$value": "700",
+          "$modes": {
+            "default": "700",
+            "cds-g0": "{carbon.typography.font-weight.semibold}",
+            "cds-g10": "{carbon.typography.font-weight.semibold}",
+            "cds-g90": "{carbon.typography.font-weight.semibold}",
+            "cds-g100": "{carbon.typography.font-weight.semibold}"
+          },
           "key": "{typography.font-weight.bold}"
         },
         "name": "token-typography-font-weight-bold",
diff --git a/packages/tokens/dist/products/css/helpers/typography.css b/packages/tokens/dist/products/css/helpers/typography.css
index 393b8900901..c0913ef1a67 100644
--- a/packages/tokens/dist/products/css/helpers/typography.css
+++ b/packages/tokens/dist/products/css/helpers/typography.css
@@ -5,10 +5,10 @@
 .hds-font-family-sans-display { font-family: var(--token-typography-font-stack-display); }
 .hds-font-family-sans-text { font-family: var(--token-typography-font-stack-text); }
 .hds-font-family-mono-code { font-family: var(--token-typography-font-stack-code); }
-.hds-font-weight-regular { font-weight: 400; }
-.hds-font-weight-medium { font-weight: 500; }
-.hds-font-weight-semibold { font-weight: 600; }
-.hds-font-weight-bold { font-weight: 700; }
+.hds-font-weight-regular { font-weight: var(--token-typography-font-weight-regular); }
+.hds-font-weight-medium { font-weight: var(--token-typography-font-weight-medium); }
+.hds-font-weight-semibold { font-weight: var(--token-typography-font-weight-semibold); }
+.hds-font-weight-bold { font-weight: var(--token-typography-font-weight-bold); }
 .hds-typography-display-500 { font-family: var(--token-typography-display-500-font-family); font-size: var(--token-typography-display-500-font-size); line-height: var(--token-typography-display-500-line-height); margin: 0; padding: 0; }
 .hds-typography-display-400 { font-family: var(--token-typography-display-400-font-family); font-size: var(--token-typography-display-400-font-size); line-height: var(--token-typography-display-400-line-height); margin: 0; padding: 0; }
 .hds-typography-display-300 { font-family: var(--token-typography-display-300-font-family); font-size: var(--token-typography-display-300-font-size); line-height: var(--token-typography-display-300-line-height); margin: 0; padding: 0; }
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-css-selectors--advanced/tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-css-selectors--advanced/tokens.css
new file mode 100644
index 00000000000..929cdb3d1b2
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-css-selectors--advanced/tokens.css
@@ -0,0 +1,538 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root,
+.hds-theme-default {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #ffffff;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 500;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 700;
+}
+
+@media (prefers-color-scheme: light) {
+  .hds-theme-system {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #161616;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@media (prefers-color-scheme: dark) {
+  .hds-theme-system {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #f4f4f4;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+.hds-theme-light,
+.hds-mode-cds-g0 {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #161616;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+.hds-theme-dark,
+.hds-mode-cds-g100 {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #f4f4f4;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+.hds-mode-cds-g10 {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #161616;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+.hds-mode-cds-g90 {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #f4f4f4;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+/*
+
+WHY ARE ALL "COMPUTED" CSS VARIABLES REDECLARED IN EACH THEME SCOPE?
+
+CSS custom properties (variables) inherit from parent to child, but when a variable is defined
+as a calculation or alias of another variable (e.g., `--alias-value: var(--source-value)`, its value is fixed
+at the scope where it is declared—using whatever is visible at that level in the DOM (eg. `:root`).
+
+This block of "common/shared" CSS variables contains a lot of these aliases, so if we only declare these
+"computed" variables at `:root` level, their values do not update in themed blocks that override
+the "source" variables (e.g., `--source-value`) at a lower scope.
+This results in _stale_ variables, where the computed value is always stuck on the `:root` value,
+even inside a themed block where the source variable is assigned.
+
+To make sure every themed block/scoped context (eg. `.hds-theme-light`) correctly computes the aliased values,
+we redeclare each "computed" variable in every theme scope where its "source" variable is overridden.
+
+*/
+
+:root,
+.hds-theme-default,
+.hds-theme-system,
+.hds-theme-light,
+.hds-theme-dark,
+.hds-mode-cds-g0,
+.hds-mode-cds-g10,
+.hds-mode-cds-g90,
+.hds-mode-cds-g100 {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow:
+    0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow:
+    0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow:
+    0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow:
+    0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow:
+    0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow:
+    inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow:
+    0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow:
+    0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow:
+    0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626,
+    0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow:
+    0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow:
+    0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow:
+    inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow:
+    inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(
+    --token-color-palette-neutral-200
+  );
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(
+    --token-color-foreground-primary
+  );
+  --token-app-side-nav-color-foreground-strong: var(
+    --token-color-foreground-primary
+  );
+  --token-app-side-nav-color-foreground-faint: var(
+    --token-color-foreground-faint
+  );
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(
+    --token-color-surface-interactive-hover
+  );
+  --token-app-side-nav-color-surface-interactive-active: var(
+    --token-color-palette-neutral-300
+  );
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #ffffff;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(
+    0.68,
+    -0.2,
+    0.265,
+    1.15
+  );
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(
+    --token-color-foreground-high-contrast
+  );
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-display-500-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-css-selectors--migration/tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-css-selectors--migration/tokens.css
new file mode 100644
index 00000000000..16f138de40d
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-css-selectors--migration/tokens.css
@@ -0,0 +1,514 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root,
+.hds-theme-default {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #ffffff;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 500;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 700;
+}
+
+@media (prefers-color-scheme: light) {
+  .hds-theme-system {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #161616;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@media (prefers-color-scheme: dark) {
+  .hds-theme-system {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #f4f4f4;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+.hds-theme-light {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #161616;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+.hds-theme-dark {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #f4f4f4;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+/*
+
+WHY ARE ALL "COMPUTED" CSS VARIABLES REDECLARED IN EACH THEME SCOPE?
+
+CSS custom properties (variables) inherit from parent to child, but when a variable is defined
+as a calculation or alias of another variable (e.g., `--alias-value: var(--source-value)`, its value is fixed
+at the scope where it is declared—using whatever is visible at that level in the DOM (eg. `:root`).
+
+This block of "common/shared" CSS variables contains a lot of these aliases, so if we only declare these
+"computed" variables at `:root` level, their values do not update in themed blocks that override
+the "source" variables (e.g., `--source-value`) at a lower scope.
+This results in _stale_ variables, where the computed value is always stuck on the `:root` value,
+even inside a themed block where the source variable is assigned.
+
+To make sure every themed block/scoped context (eg. `.hds-theme-light`) correctly computes the aliased values,
+we redeclare each "computed" variable in every theme scope where its "source" variable is overridden.
+
+*/
+
+:root,
+.hds-theme-default,
+.hds-theme-system,
+.hds-theme-light,
+.hds-theme-dark {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow:
+    0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow:
+    0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow:
+    0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow:
+    0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow:
+    0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow:
+    inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow:
+    0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow:
+    0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow:
+    0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626,
+    0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow:
+    0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow:
+    0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow:
+    inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow:
+    inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(
+    --token-color-palette-neutral-200
+  );
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(
+    --token-color-foreground-primary
+  );
+  --token-app-side-nav-color-foreground-strong: var(
+    --token-color-foreground-primary
+  );
+  --token-app-side-nav-color-foreground-faint: var(
+    --token-color-foreground-faint
+  );
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(
+    --token-color-surface-interactive-hover
+  );
+  --token-app-side-nav-color-surface-interactive-active: var(
+    --token-color-palette-neutral-300
+  );
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #ffffff;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(
+    0.68,
+    -0.2,
+    0.265,
+    1.15
+  );
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(
+    --token-color-foreground-high-contrast
+  );
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-display-500-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-css-selectors/tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-css-selectors/tokens.css
new file mode 100644
index 00000000000..7ec79b3bb62
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-css-selectors/tokens.css
@@ -0,0 +1,512 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #161616;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+@media (prefers-color-scheme: light) {
+  .hds-theme-system {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #161616;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@media (prefers-color-scheme: dark) {
+  .hds-theme-system {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #f4f4f4;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+.hds-theme-light {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #161616;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+.hds-theme-dark {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #f4f4f4;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
+
+/*
+
+WHY ARE ALL "COMPUTED" CSS VARIABLES REDECLARED IN EACH THEME SCOPE?
+
+CSS custom properties (variables) inherit from parent to child, but when a variable is defined
+as a calculation or alias of another variable (e.g., `--alias-value: var(--source-value)`, its value is fixed
+at the scope where it is declared—using whatever is visible at that level in the DOM (eg. `:root`).
+
+This block of "common/shared" CSS variables contains a lot of these aliases, so if we only declare these
+"computed" variables at `:root` level, their values do not update in themed blocks that override
+the "source" variables (e.g., `--source-value`) at a lower scope.
+This results in _stale_ variables, where the computed value is always stuck on the `:root` value,
+even inside a themed block where the source variable is assigned.
+
+To make sure every themed block/scoped context (eg. `.hds-theme-light`) correctly computes the aliased values,
+we redeclare each "computed" variable in every theme scope where its "source" variable is overridden.
+
+*/
+
+:root,
+.hds-theme-system,
+.hds-theme-light,
+.hds-theme-dark {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow:
+    0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow:
+    0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow:
+    0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow:
+    0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow:
+    0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow:
+    inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow:
+    0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow:
+    0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow:
+    0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626,
+    0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow:
+    0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow:
+    0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow:
+    inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow:
+    inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(
+    --token-color-palette-neutral-200
+  );
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(
+    --token-color-foreground-primary
+  );
+  --token-app-side-nav-color-foreground-strong: var(
+    --token-color-foreground-primary
+  );
+  --token-app-side-nav-color-foreground-faint: var(
+    --token-color-foreground-faint
+  );
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(
+    --token-color-surface-interactive-hover
+  );
+  --token-app-side-nav-color-surface-interactive-active: var(
+    --token-color-palette-neutral-300
+  );
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #ffffff;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(
+    0.68,
+    -0.2,
+    0.265,
+    1.15
+  );
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(
+    --token-color-foreground-high-contrast
+  );
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-display-500-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family:
+    -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family:
+    ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g0/common-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g0/common-tokens.css
new file mode 100644
index 00000000000..68a70888748
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g0/common-tokens.css
@@ -0,0 +1,385 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow: 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow: 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow: 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow: 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow: 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow: inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow: 0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow: 0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow: 0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow: 0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow: 0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow: inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(--token-color-palette-neutral-200);
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-strong: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-faint: var(--token-color-foreground-faint);
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(--token-color-surface-interactive-hover);
+  --token-app-side-nav-color-surface-interactive-active: var(--token-color-palette-neutral-300);
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #161616;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(0.68, -0.2, 0.265, 1.15);
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(--token-color-foreground-high-contrast);
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-display-500-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g0/themed-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g0/themed-tokens.css
new file mode 100644
index 00000000000..7d64c22dd81
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g0/themed-tokens.css
@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #161616;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g10/common-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g10/common-tokens.css
new file mode 100644
index 00000000000..68a70888748
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g10/common-tokens.css
@@ -0,0 +1,385 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow: 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow: 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow: 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow: 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow: 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow: inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow: 0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow: 0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow: 0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow: 0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow: 0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow: inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(--token-color-palette-neutral-200);
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-strong: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-faint: var(--token-color-foreground-faint);
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(--token-color-surface-interactive-hover);
+  --token-app-side-nav-color-surface-interactive-active: var(--token-color-palette-neutral-300);
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #161616;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(0.68, -0.2, 0.265, 1.15);
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(--token-color-foreground-high-contrast);
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-display-500-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g10/themed-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g10/themed-tokens.css
new file mode 100644
index 00000000000..7d64c22dd81
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g10/themed-tokens.css
@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #161616;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g100/common-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g100/common-tokens.css
new file mode 100644
index 00000000000..30bc0f275e4
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g100/common-tokens.css
@@ -0,0 +1,385 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow: 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow: 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow: 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow: 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow: 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow: inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow: 0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow: 0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow: 0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow: 0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow: 0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow: inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(--token-color-palette-neutral-200);
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-strong: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-faint: var(--token-color-foreground-faint);
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(--token-color-surface-interactive-hover);
+  --token-app-side-nav-color-surface-interactive-active: var(--token-color-palette-neutral-300);
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #f4f4f4;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(0.68, -0.2, 0.265, 1.15);
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(--token-color-foreground-high-contrast);
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-display-500-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g100/themed-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g100/themed-tokens.css
new file mode 100644
index 00000000000..37475826396
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g100/themed-tokens.css
@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #f4f4f4;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g90/common-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g90/common-tokens.css
new file mode 100644
index 00000000000..30bc0f275e4
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g90/common-tokens.css
@@ -0,0 +1,385 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow: 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow: 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow: 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow: 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow: 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow: inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow: 0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow: 0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow: 0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow: 0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow: 0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow: inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(--token-color-palette-neutral-200);
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-strong: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-faint: var(--token-color-foreground-faint);
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(--token-color-surface-interactive-hover);
+  --token-app-side-nav-color-surface-interactive-active: var(--token-color-palette-neutral-300);
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #f4f4f4;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(0.68, -0.2, 0.265, 1.15);
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(--token-color-foreground-high-contrast);
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-display-500-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g90/themed-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g90/themed-tokens.css
new file mode 100644
index 00000000000..37475826396
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g90/themed-tokens.css
@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #f4f4f4;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 400;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 600;
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/default/common-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/default/common-tokens.css
new file mode 100644
index 00000000000..b1d45ed0a2f
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/default/common-tokens.css
@@ -0,0 +1,385 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-border-radius-x-small: 3px;
+  --token-border-radius-small: 5px;
+  --token-border-radius-medium: 6px;
+  --token-border-radius-large: 8px;
+  --token-color-palette-blue-500: #1c345f;
+  --token-color-palette-blue-400: #0046d1;
+  --token-color-palette-blue-300: #0c56e9;
+  --token-color-palette-blue-200: #1060ff;
+  --token-color-palette-blue-100: #cce3fe;
+  --token-color-palette-blue-50: #f2f8ff;
+  --token-color-palette-purple-500: #42215b;
+  --token-color-palette-purple-400: #7b00db;
+  --token-color-palette-purple-300: #911ced;
+  --token-color-palette-purple-200: #a737ff;
+  --token-color-palette-purple-100: #ead2fe;
+  --token-color-palette-purple-50: #f9f2ff;
+  --token-color-palette-green-500: #054220;
+  --token-color-palette-green-400: #006619;
+  --token-color-palette-green-300: #00781e;
+  --token-color-palette-green-200: #008a22;
+  --token-color-palette-green-100: #cceeda;
+  --token-color-palette-green-50: #f2fbf6;
+  --token-color-palette-amber-500: #542800;
+  --token-color-palette-amber-400: #803d00;
+  --token-color-palette-amber-300: #9e4b00;
+  --token-color-palette-amber-200: #bb5a00;
+  --token-color-palette-amber-100: #fbeabf;
+  --token-color-palette-amber-50: #fff9e8;
+  --token-color-palette-red-500: #51130a;
+  --token-color-palette-red-400: #940004;
+  --token-color-palette-red-300: #c00005;
+  --token-color-palette-red-200: #e52228;
+  --token-color-palette-red-100: #fbd4d4;
+  --token-color-palette-red-50: #fff5f5;
+  --token-color-palette-neutral-700: #0c0c0e;
+  --token-color-palette-neutral-600: #3b3d45;
+  --token-color-palette-neutral-500: #656a76;
+  --token-color-palette-neutral-400: #8c909c;
+  --token-color-palette-neutral-300: #c2c5cb;
+  --token-color-palette-neutral-200: #dedfe3;
+  --token-color-palette-neutral-100: #f1f2f3;
+  --token-color-palette-neutral-50: #fafafa;
+  --token-color-palette-alpha-300: #3b3d4566;
+  --token-color-palette-alpha-200: #656a7633;
+  --token-color-palette-alpha-100: #656a761a;
+  --token-color-border-primary: #656a7633;
+  --token-color-border-faint: #656a761a;
+  --token-color-border-strong: #3b3d4566;
+  --token-color-border-action: #cce3fe;
+  --token-color-border-highlight: #ead2fe;
+  --token-color-border-success: #cceeda;
+  --token-color-border-warning: #fbeabf;
+  --token-color-border-critical: #fbd4d4;
+  --token-color-focus-action-internal: #0c56e9;
+  --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-focus-critical-internal: #c00005;
+  --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+  --token-color-foreground-strong: #0c0c0e;
+  --token-color-foreground-faint: #656a76;
+  --token-color-foreground-high-contrast: #ffffff;
+  --token-color-foreground-disabled: #8c909c;
+  --token-color-foreground-action: #1060ff;
+  --token-color-foreground-action-hover: #0c56e9;
+  --token-color-foreground-action-active: #0046d1;
+  --token-color-foreground-highlight: #a737ff;
+  --token-color-foreground-highlight-on-surface: #911ced;
+  --token-color-foreground-highlight-high-contrast: #42215b;
+  --token-color-foreground-success: #008a22;
+  --token-color-foreground-success-on-surface: #00781e;
+  --token-color-foreground-success-high-contrast: #054220;
+  --token-color-foreground-warning: #bb5a00;
+  --token-color-foreground-warning-on-surface: #9e4b00;
+  --token-color-foreground-warning-high-contrast: #542800;
+  --token-color-foreground-critical: #e52228;
+  --token-color-foreground-critical-on-surface: #c00005;
+  --token-color-foreground-critical-high-contrast: #51130a;
+  --token-color-page-primary: #ffffff;
+  --token-color-page-faint: #fafafa;
+  --token-color-surface-primary: #ffffff;
+  --token-color-surface-faint: #fafafa;
+  --token-color-surface-strong: #f1f2f3;
+  --token-color-surface-interactive: #ffffff;
+  --token-color-surface-interactive-hover: #f1f2f3;
+  --token-color-surface-interactive-active: #dedfe3;
+  --token-color-surface-interactive-disabled: #fafafa;
+  --token-color-surface-action: #f2f8ff;
+  --token-color-surface-highlight: #f9f2ff;
+  --token-color-surface-success: #f2fbf6;
+  --token-color-surface-warning: #fff9e8;
+  --token-color-surface-critical: #fff5f5;
+  --token-color-hashicorp-brand: #000000;
+  --token-color-boundary-brand: #f24c53;
+  --token-color-boundary-foreground: #cf2d32;
+  --token-color-boundary-surface: #ffecec;
+  --token-color-boundary-border: #fbd7d8;
+  --token-color-boundary-gradient-primary-start: #f97076;
+  --token-color-boundary-gradient-primary-stop: #db363b;
+  --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+  --token-color-boundary-gradient-faint-stop: #ffecec;
+  --token-color-consul-brand: #e03875;
+  --token-color-consul-foreground: #d01c5b;
+  --token-color-consul-surface: #ffe9f1;
+  --token-color-consul-border: #ffcede;
+  --token-color-consul-gradient-primary-start: #ff99be;
+  --token-color-consul-gradient-primary-stop: #da306e;
+  --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+  --token-color-consul-gradient-faint-stop: #ffe9f1;
+  --token-color-hcp-brand: #000000;
+  --token-color-nomad-brand: #06d092;
+  --token-color-nomad-foreground: #008661;
+  --token-color-nomad-surface: #d3fdeb;
+  --token-color-nomad-border: #bff3dd;
+  --token-color-nomad-gradient-primary-start: #bff3dd;
+  --token-color-nomad-gradient-primary-stop: #60dea9;
+  --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+  --token-color-nomad-gradient-faint-stop: #d3fdeb;
+  --token-color-packer-brand: #02a8ef;
+  --token-color-packer-foreground: #007eb4;
+  --token-color-packer-surface: #d4f2ff;
+  --token-color-packer-border: #b4e4ff;
+  --token-color-packer-gradient-primary-start: #b4e4ff;
+  --token-color-packer-gradient-primary-stop: #63d0ff;
+  --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+  --token-color-packer-gradient-faint-stop: #d4f2ff;
+  --token-color-terraform-brand: #7b42bc;
+  --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+  --token-color-terraform-foreground: #773cb4;
+  --token-color-terraform-surface: #f4ecff;
+  --token-color-terraform-border: #ebdbfc;
+  --token-color-terraform-gradient-primary-start: #bb8deb;
+  --token-color-terraform-gradient-primary-stop: #844fba;
+  --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+  --token-color-terraform-gradient-faint-stop: #f4ecff;
+  --token-color-vagrant-brand: #1868f2;
+  --token-color-vagrant-foreground: #1c61d8;
+  --token-color-vagrant-surface: #d6ebff;
+  --token-color-vagrant-border: #c7dbfc;
+  --token-color-vagrant-gradient-primary-start: #639cff;
+  --token-color-vagrant-gradient-primary-stop: #2e71e5;
+  --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+  --token-color-vagrant-gradient-faint-stop: #d6ebff;
+  --token-color-vault-radar-brand: #ffcf25;
+  --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+  --token-color-vault-radar-foreground: #9a6f00;
+  --token-color-vault-radar-surface: #fff9cf;
+  --token-color-vault-radar-border: #feec7b;
+  --token-color-vault-radar-gradient-primary-start: #feec7b;
+  --token-color-vault-radar-gradient-primary-stop: #ffe543;
+  --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+  --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+  --token-color-vault-secrets-brand: #ffcf25;
+  --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+  --token-color-vault-secrets-foreground: #9a6f00;
+  --token-color-vault-secrets-surface: #fff9cf;
+  --token-color-vault-secrets-border: #feec7b;
+  --token-color-vault-secrets-gradient-primary-start: #feec7b;
+  --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+  --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+  --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+  --token-color-vault-brand: #ffcf25;
+  --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+  --token-color-vault-foreground: #9a6f00;
+  --token-color-vault-surface: #fff9cf;
+  --token-color-vault-border: #feec7b;
+  --token-color-vault-gradient-primary-start: #feec7b;
+  --token-color-vault-gradient-primary-stop: #ffe543;
+  --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+  --token-color-vault-gradient-faint-stop: #fff9cf;
+  --token-color-waypoint-brand: #14c6cb;
+  --token-color-waypoint-foreground: #008196;
+  --token-color-waypoint-surface: #e0fcff;
+  --token-color-waypoint-border: #cbf1f3;
+  --token-color-waypoint-gradient-primary-start: #cbf1f3;
+  --token-color-waypoint-gradient-primary-stop: #62d4dc;
+  --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+  --token-color-waypoint-gradient-faint-stop: #e0fcff;
+  --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+  --token-elevation-low-box-shadow: 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-elevation-mid-box-shadow: 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-elevation-high-box-shadow: 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-elevation-higher-box-shadow: 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-elevation-overlay-box-shadow: 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-surface-inset-box-shadow: inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+  --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+  --token-surface-low-box-shadow: 0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+  --token-surface-mid-box-shadow: 0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+  --token-surface-high-box-shadow: 0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+  --token-surface-higher-box-shadow: 0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+  --token-surface-overlay-box-shadow: 0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+  --token-focus-ring-critical-box-shadow: inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+  --token-app-header-height: 60px;
+  --token-app-header-home-link-size: 36px;
+  --token-app-header-logo-size: 28px;
+  --token-app-side-nav-wrapper-border-width: 1px;
+  --token-app-side-nav-wrapper-border-color: var(--token-color-palette-neutral-200);
+  --token-app-side-nav-wrapper-padding-horizontal: 16px;
+  --token-app-side-nav-wrapper-padding-vertical: 16px;
+  --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-app-side-nav-toggle-button-border-radius: 5px;
+  --token-app-side-nav-header-home-link-padding: 4px;
+  --token-app-side-nav-header-home-link-logo-size: 48px;
+  --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-app-side-nav-header-actions-spacing: 8px;
+  --token-app-side-nav-body-list-margin-vertical: 24px;
+  --token-app-side-nav-body-list-item-height: 36px;
+  --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-app-side-nav-body-list-item-padding-vertical: 4px;
+  --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-app-side-nav-body-list-item-border-radius: 5px;
+  --token-app-side-nav-color-foreground-primary: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-strong: var(--token-color-foreground-primary);
+  --token-app-side-nav-color-foreground-faint: var(--token-color-foreground-faint);
+  --token-app-side-nav-color-surface-primary: var(--token-color-surface-faint);
+  --token-app-side-nav-color-surface-interactive-hover: var(--token-color-surface-interactive-hover);
+  --token-app-side-nav-color-surface-interactive-active: var(--token-color-palette-neutral-300);
+  --token-form-label-color: #0c0c0e;
+  --token-form-legend-color: #0c0c0e;
+  --token-form-helper-text-color: #656a76;
+  --token-form-indicator-optional-color: #656a76;
+  --token-form-error-color: #c00005;
+  --token-form-error-icon-size: 14px;
+  --token-form-checkbox-size: 16px;
+  --token-form-checkbox-border-radius: 3px;
+  --token-form-checkbox-border-width: 1px;
+  --token-form-checkbox-background-image-size: 12px;
+  --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+  --token-form-control-base-foreground-value-color: #0c0c0e;
+  --token-form-control-base-foreground-placeholder-color: #656a76;
+  --token-form-control-base-surface-color-default: #ffffff;
+  --token-form-control-base-surface-color-hover: #f1f2f3;
+  --token-form-control-base-border-color-default: #8c909c;
+  --token-form-control-base-border-color-hover: #656a76;
+  --token-form-control-checked-foreground-color: #ffffff;
+  --token-form-control-checked-surface-color-default: #1060ff;
+  --token-form-control-checked-surface-color-hover: #0c56e9;
+  --token-form-control-checked-border-color-default: #0c56e9;
+  --token-form-control-checked-border-color-hover: #0046d1;
+  --token-form-control-invalid-border-color-default: #c00005;
+  --token-form-control-invalid-border-color-hover: #940004;
+  --token-form-control-readonly-foreground-color: #ffffff;
+  --token-form-control-readonly-surface-color: #f1f2f3;
+  --token-form-control-readonly-border-color: #656a761a;
+  --token-form-control-disabled-foreground-color: #8c909c;
+  --token-form-control-disabled-surface-color: #fafafa;
+  --token-form-control-disabled-border-color: #656a7633;
+  --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+  --token-form-control-border-radius: 5px;
+  --token-form-control-border-width: 1px;
+  --token-form-radio-size: 16px;
+  --token-form-radio-border-width: 1px;
+  --token-form-radio-background-image-size: 12px;
+  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+  --token-form-radiocard-group-gap: 16px;
+  --token-form-radiocard-border-width: 1px;
+  --token-form-radiocard-border-radius: 6px;
+  --token-form-radiocard-content-padding: 24px;
+  --token-form-radiocard-control-padding: 8px;
+  --token-form-radiocard-transition-duration: 0.2s;
+  --token-form-select-background-image-size: 16px;
+  --token-form-select-background-image-position-right-x: 7px;
+  --token-form-select-background-image-position-top-y: 9px;
+  --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+  --token-form-text-input-background-image-size: 16px;
+  --token-form-text-input-background-image-position-x: 7px;
+  --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+  --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+  --token-form-toggle-width: 32px;
+  --token-form-toggle-height: 16px;
+  --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+  --token-form-toggle-border-radius: 3px;
+  --token-form-toggle-border-width: 1px;
+  --token-form-toggle-background-image-size: 12px;
+  --token-form-toggle-background-image-position-x: 2px;
+  --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+  --token-form-toggle-transition-duration: 0.2s;
+  --token-form-toggle-transition-timing-function: cubic-bezier(0.68, -0.2, 0.265, 1.15);
+  --token-form-toggle-thumb-size: 16px;
+  --token-pagination-nav-control-height: 36px;
+  --token-pagination-nav-control-padding-horizontal: 12px;
+  --token-pagination-nav-control-focus-inset: 4px;
+  --token-pagination-nav-control-icon-spacing: 6px;
+  --token-pagination-nav-indicator-height: 2px;
+  --token-pagination-nav-indicator-spacing: 6px;
+  --token-pagination-child-spacing-vertical: 8px;
+  --token-pagination-child-spacing-horizontal: 20px;
+  --token-side-nav-wrapper-border-width: 1px;
+  --token-side-nav-wrapper-border-color: #656a76;
+  --token-side-nav-wrapper-padding-horizontal: 16px;
+  --token-side-nav-wrapper-padding-vertical: 16px;
+  --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+  --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+  --token-side-nav-toggle-button-border-radius: 5px;
+  --token-side-nav-header-home-link-padding: 4px;
+  --token-side-nav-header-home-link-logo-size: 48px;
+  --token-side-nav-header-home-link-logo-size-minimized: 32px;
+  --token-side-nav-header-actions-spacing: 8px;
+  --token-side-nav-body-list-margin-vertical: 24px;
+  --token-side-nav-body-list-item-height: 36px;
+  --token-side-nav-body-list-item-padding-horizontal: 8px;
+  --token-side-nav-body-list-item-padding-vertical: 4px;
+  --token-side-nav-body-list-item-spacing-vertical: 2px;
+  --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+  --token-side-nav-body-list-item-border-radius: 5px;
+  --token-side-nav-color-foreground-primary: #dedfe3;
+  --token-side-nav-color-foreground-strong: #ffffff;
+  --token-side-nav-color-foreground-faint: #8c909c;
+  --token-side-nav-color-surface-primary: #0c0c0e;
+  --token-side-nav-color-surface-interactive-hover: #3b3d45;
+  --token-side-nav-color-surface-interactive-active: #656a76;
+  --token-tabs-tab-height-medium: 36px;
+  --token-tabs-tab-height-large: 48px;
+  --token-tabs-tab-padding-horizontal-medium: 12px;
+  --token-tabs-tab-padding-horizontal-large: 20px;
+  --token-tabs-tab-padding-vertical: 0px;
+  --token-tabs-tab-border-radius: 5px;
+  --token-tabs-tab-focus-inset: 6px;
+  --token-tabs-tab-gutter: 6px;
+  --token-tabs-indicator-height: 3px;
+  --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+  --token-tabs-indicator-transition-duration: 0.6s;
+  --token-tabs-divider-height: 1px;
+  --token-tooltip-border-radius: 5px;
+  --token-tooltip-color-foreground-primary: var(--token-color-foreground-high-contrast);
+  --token-tooltip-color-surface-primary: var(--token-color-palette-neutral-700);
+  --token-tooltip-focus-offset: -2px;
+  --token-tooltip-max-width: 280px;
+  --token-tooltip-padding-horizontal: 12px;
+  --token-tooltip-padding-vertical: 8px;
+  --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+  --token-typography-font-stack-display: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-text: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-font-stack-code: ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-display-500-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+  --token-typography-display-500-line-height: 1.2666; /** 38px */
+  --token-typography-display-400-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+  --token-typography-display-400-line-height: 1.3333; /** 32px */
+  --token-typography-display-300-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+  --token-typography-display-300-line-height: 1.3333; /** 24px */
+  --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-200-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+  --token-typography-display-200-line-height: 1.5; /** 24px */
+  --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+  --token-typography-display-100-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-display-100-line-height: 1.3846; /** 18px */
+  --token-typography-body-300-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-body-300-line-height: 1.5; /** 24px */
+  --token-typography-body-200-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-body-200-line-height: 1.4286; /** 20px */
+  --token-typography-body-100-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-body-100-line-height: 1.3846; /** 18px */
+  --token-typography-code-100-font-family: ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+  --token-typography-code-100-line-height: 1.23; /** 16px */
+  --token-typography-code-200-font-family: ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+  --token-typography-code-200-line-height: 1.125; /** 18px */
+  --token-typography-code-300-font-family: ui-monospace, Menlo, Consolas, monospace;
+  --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+  --token-typography-code-300-line-height: 1.25; /** 20px */
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-root-selector/default/themed-tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/default/themed-tokens.css
new file mode 100644
index 00000000000..3353619544d
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-root-selector/default/themed-tokens.css
@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --token-color-palette-neutral-0: #ffffff;
+  --token-color-foreground-primary: #ffffff;
+  --token-typography-font-weight-regular: 400;
+  --token-typography-font-weight-medium: 500;
+  --token-typography-font-weight-semibold: 600;
+  --token-typography-font-weight-bold: 700;
+}
diff --git a/packages/tokens/dist/products/css/themed-tokens/with-scss-mixins/tokens.css b/packages/tokens/dist/products/css/themed-tokens/with-scss-mixins/tokens.css
new file mode 100644
index 00000000000..fb3364875bc
--- /dev/null
+++ b/packages/tokens/dist/products/css/themed-tokens/with-scss-mixins/tokens.css
@@ -0,0 +1,528 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+@mixin hds-theme-default() {
+  :root {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #ffffff;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 500;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 700;
+  }
+}
+
+@mixin hds-theme-light() {
+  :root {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #161616;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@mixin hds-theme-dark() {
+  :root {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #f4f4f4;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@mixin hds-mode-cds0() {
+  :root {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #161616;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@mixin hds-mode-cds10() {
+  :root {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #161616;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@mixin hds-mode-cds90() {
+  :root {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #f4f4f4;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@mixin hds-mode-cds100() {
+  :root {
+    --token-color-palette-neutral-0: #ffffff;
+    --token-color-foreground-primary: #f4f4f4;
+    --token-typography-font-weight-regular: 400;
+    --token-typography-font-weight-medium: 400;
+    --token-typography-font-weight-semibold: 600;
+    --token-typography-font-weight-bold: 600;
+  }
+}
+
+@mixin hds-theme-common() {
+  :root {
+    --token-border-radius-x-small: 3px;
+    --token-border-radius-small: 5px;
+    --token-border-radius-medium: 6px;
+    --token-border-radius-large: 8px;
+    --token-color-palette-blue-500: #1c345f;
+    --token-color-palette-blue-400: #0046d1;
+    --token-color-palette-blue-300: #0c56e9;
+    --token-color-palette-blue-200: #1060ff;
+    --token-color-palette-blue-100: #cce3fe;
+    --token-color-palette-blue-50: #f2f8ff;
+    --token-color-palette-purple-500: #42215b;
+    --token-color-palette-purple-400: #7b00db;
+    --token-color-palette-purple-300: #911ced;
+    --token-color-palette-purple-200: #a737ff;
+    --token-color-palette-purple-100: #ead2fe;
+    --token-color-palette-purple-50: #f9f2ff;
+    --token-color-palette-green-500: #054220;
+    --token-color-palette-green-400: #006619;
+    --token-color-palette-green-300: #00781e;
+    --token-color-palette-green-200: #008a22;
+    --token-color-palette-green-100: #cceeda;
+    --token-color-palette-green-50: #f2fbf6;
+    --token-color-palette-amber-500: #542800;
+    --token-color-palette-amber-400: #803d00;
+    --token-color-palette-amber-300: #9e4b00;
+    --token-color-palette-amber-200: #bb5a00;
+    --token-color-palette-amber-100: #fbeabf;
+    --token-color-palette-amber-50: #fff9e8;
+    --token-color-palette-red-500: #51130a;
+    --token-color-palette-red-400: #940004;
+    --token-color-palette-red-300: #c00005;
+    --token-color-palette-red-200: #e52228;
+    --token-color-palette-red-100: #fbd4d4;
+    --token-color-palette-red-50: #fff5f5;
+    --token-color-palette-neutral-700: #0c0c0e;
+    --token-color-palette-neutral-600: #3b3d45;
+    --token-color-palette-neutral-500: #656a76;
+    --token-color-palette-neutral-400: #8c909c;
+    --token-color-palette-neutral-300: #c2c5cb;
+    --token-color-palette-neutral-200: #dedfe3;
+    --token-color-palette-neutral-100: #f1f2f3;
+    --token-color-palette-neutral-50: #fafafa;
+    --token-color-palette-alpha-300: #3b3d4566;
+    --token-color-palette-alpha-200: #656a7633;
+    --token-color-palette-alpha-100: #656a761a;
+    --token-color-border-primary: #656a7633;
+    --token-color-border-faint: #656a761a;
+    --token-color-border-strong: #3b3d4566;
+    --token-color-border-action: #cce3fe;
+    --token-color-border-highlight: #ead2fe;
+    --token-color-border-success: #cceeda;
+    --token-color-border-warning: #fbeabf;
+    --token-color-border-critical: #fbd4d4;
+    --token-color-focus-action-internal: #0c56e9;
+    --token-color-focus-action-external: #5990ff; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+    --token-color-focus-critical-internal: #c00005;
+    --token-color-focus-critical-external: #dd7578; /** this is a special color used only for the focus style, to pass color contrast for a11y purpose */
+    --token-color-foreground-strong: #0c0c0e;
+    --token-color-foreground-faint: #656a76;
+    --token-color-foreground-high-contrast: #ffffff;
+    --token-color-foreground-disabled: #8c909c;
+    --token-color-foreground-action: #1060ff;
+    --token-color-foreground-action-hover: #0c56e9;
+    --token-color-foreground-action-active: #0046d1;
+    --token-color-foreground-highlight: #a737ff;
+    --token-color-foreground-highlight-on-surface: #911ced;
+    --token-color-foreground-highlight-high-contrast: #42215b;
+    --token-color-foreground-success: #008a22;
+    --token-color-foreground-success-on-surface: #00781e;
+    --token-color-foreground-success-high-contrast: #054220;
+    --token-color-foreground-warning: #bb5a00;
+    --token-color-foreground-warning-on-surface: #9e4b00;
+    --token-color-foreground-warning-high-contrast: #542800;
+    --token-color-foreground-critical: #e52228;
+    --token-color-foreground-critical-on-surface: #c00005;
+    --token-color-foreground-critical-high-contrast: #51130a;
+    --token-color-page-primary: #ffffff;
+    --token-color-page-faint: #fafafa;
+    --token-color-surface-primary: #ffffff;
+    --token-color-surface-faint: #fafafa;
+    --token-color-surface-strong: #f1f2f3;
+    --token-color-surface-interactive: #ffffff;
+    --token-color-surface-interactive-hover: #f1f2f3;
+    --token-color-surface-interactive-active: #dedfe3;
+    --token-color-surface-interactive-disabled: #fafafa;
+    --token-color-surface-action: #f2f8ff;
+    --token-color-surface-highlight: #f9f2ff;
+    --token-color-surface-success: #f2fbf6;
+    --token-color-surface-warning: #fff9e8;
+    --token-color-surface-critical: #fff5f5;
+    --token-color-hashicorp-brand: #000000;
+    --token-color-boundary-brand: #f24c53;
+    --token-color-boundary-foreground: #cf2d32;
+    --token-color-boundary-surface: #ffecec;
+    --token-color-boundary-border: #fbd7d8;
+    --token-color-boundary-gradient-primary-start: #f97076;
+    --token-color-boundary-gradient-primary-stop: #db363b;
+    --token-color-boundary-gradient-faint-start: #fffafa; /** this is the 'boundary-50' value at 25% opacity on white */
+    --token-color-boundary-gradient-faint-stop: #ffecec;
+    --token-color-consul-brand: #e03875;
+    --token-color-consul-foreground: #d01c5b;
+    --token-color-consul-surface: #ffe9f1;
+    --token-color-consul-border: #ffcede;
+    --token-color-consul-gradient-primary-start: #ff99be;
+    --token-color-consul-gradient-primary-stop: #da306e;
+    --token-color-consul-gradient-faint-start: #fff9fb; /** this is the 'consul-50' value at 25% opacity on white */
+    --token-color-consul-gradient-faint-stop: #ffe9f1;
+    --token-color-hcp-brand: #000000;
+    --token-color-nomad-brand: #06d092;
+    --token-color-nomad-foreground: #008661;
+    --token-color-nomad-surface: #d3fdeb;
+    --token-color-nomad-border: #bff3dd;
+    --token-color-nomad-gradient-primary-start: #bff3dd;
+    --token-color-nomad-gradient-primary-stop: #60dea9;
+    --token-color-nomad-gradient-faint-start: #f3fff9; /** this is the 'nomad-50' value at 25% opacity on white */
+    --token-color-nomad-gradient-faint-stop: #d3fdeb;
+    --token-color-packer-brand: #02a8ef;
+    --token-color-packer-foreground: #007eb4;
+    --token-color-packer-surface: #d4f2ff;
+    --token-color-packer-border: #b4e4ff;
+    --token-color-packer-gradient-primary-start: #b4e4ff;
+    --token-color-packer-gradient-primary-stop: #63d0ff;
+    --token-color-packer-gradient-faint-start: #f3fcff; /** this is the 'packer-50' value at 25% opacity on white */
+    --token-color-packer-gradient-faint-stop: #d4f2ff;
+    --token-color-terraform-brand: #7b42bc;
+    --token-color-terraform-brand-on-dark: #a067da; /** this is an alternative brand color meant to be used on dark backgrounds */
+    --token-color-terraform-foreground: #773cb4;
+    --token-color-terraform-surface: #f4ecff;
+    --token-color-terraform-border: #ebdbfc;
+    --token-color-terraform-gradient-primary-start: #bb8deb;
+    --token-color-terraform-gradient-primary-stop: #844fba;
+    --token-color-terraform-gradient-faint-start: #fcfaff; /** this is the 'terraform-50' value at 25% opacity on white */
+    --token-color-terraform-gradient-faint-stop: #f4ecff;
+    --token-color-vagrant-brand: #1868f2;
+    --token-color-vagrant-foreground: #1c61d8;
+    --token-color-vagrant-surface: #d6ebff;
+    --token-color-vagrant-border: #c7dbfc;
+    --token-color-vagrant-gradient-primary-start: #639cff;
+    --token-color-vagrant-gradient-primary-stop: #2e71e5;
+    --token-color-vagrant-gradient-faint-start: #f4faff; /** this is the 'vagrant-50' value at 25% opacity on white */
+    --token-color-vagrant-gradient-faint-stop: #d6ebff;
+    --token-color-vault-radar-brand: #ffcf25;
+    --token-color-vault-radar-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault radar would not work */
+    --token-color-vault-radar-foreground: #9a6f00;
+    --token-color-vault-radar-surface: #fff9cf;
+    --token-color-vault-radar-border: #feec7b;
+    --token-color-vault-radar-gradient-primary-start: #feec7b;
+    --token-color-vault-radar-gradient-primary-stop: #ffe543;
+    --token-color-vault-radar-gradient-faint-start: #fffdf2; /** this is the 'vault-radar-50' value at 25% opacity on white */
+    --token-color-vault-radar-gradient-faint-stop: #fff9cf;
+    --token-color-vault-secrets-brand: #ffcf25;
+    --token-color-vault-secrets-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault Secrets would not work */
+    --token-color-vault-secrets-foreground: #9a6f00;
+    --token-color-vault-secrets-surface: #fff9cf;
+    --token-color-vault-secrets-border: #feec7b;
+    --token-color-vault-secrets-gradient-primary-start: #feec7b;
+    --token-color-vault-secrets-gradient-primary-stop: #ffe543;
+    --token-color-vault-secrets-gradient-faint-start: #fffdf2; /** this is the 'vault-secrets-50' value at 25% opacity on white */
+    --token-color-vault-secrets-gradient-faint-stop: #fff9cf;
+    --token-color-vault-brand: #ffcf25;
+    --token-color-vault-brand-alt: #000000; /** this is a special “alternative” color, used as an exception in some contexts where the normal “brand” color for Vault would not work */
+    --token-color-vault-foreground: #9a6f00;
+    --token-color-vault-surface: #fff9cf;
+    --token-color-vault-border: #feec7b;
+    --token-color-vault-gradient-primary-start: #feec7b;
+    --token-color-vault-gradient-primary-stop: #ffe543;
+    --token-color-vault-gradient-faint-start: #fffdf2; /** this is the 'vault-50' value at 25% opacity on white */
+    --token-color-vault-gradient-faint-stop: #fff9cf;
+    --token-color-waypoint-brand: #14c6cb;
+    --token-color-waypoint-foreground: #008196;
+    --token-color-waypoint-surface: #e0fcff;
+    --token-color-waypoint-border: #cbf1f3;
+    --token-color-waypoint-gradient-primary-start: #cbf1f3;
+    --token-color-waypoint-gradient-primary-stop: #62d4dc;
+    --token-color-waypoint-gradient-faint-start: #f6feff; /** this is the 'waypoint-50' value at 25% opacity on white */
+    --token-color-waypoint-gradient-faint-stop: #e0fcff;
+    --token-elevation-inset-box-shadow: inset 0px 1px 2px 1px #656a761a;
+    --token-elevation-low-box-shadow:
+      0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+    --token-elevation-mid-box-shadow:
+      0px 2px 3px 0px #656a761a, 0px 8px 16px -10px #656a7633;
+    --token-elevation-high-box-shadow:
+      0px 2px 3px 0px #656a7626, 0px 16px 16px -10px #656a7633;
+    --token-elevation-higher-box-shadow:
+      0px 2px 3px 0px #656a761a, 0px 12px 28px 0px #656a7640;
+    --token-elevation-overlay-box-shadow:
+      0px 2px 3px 0px #3b3d4540, 0px 12px 24px 0px #3b3d4559;
+    --token-surface-inset-box-shadow:
+      inset 0 0 0 1px #656a764d, inset 0px 1px 2px 1px #656a761a;
+    --token-surface-base-box-shadow: 0 0 0 1px #656a7633;
+    --token-surface-low-box-shadow:
+      0 0 0 1px #656a7626, 0px 1px 1px 0px #656a760d, 0px 2px 2px 0px #656a760d;
+    --token-surface-mid-box-shadow:
+      0 0 0 1px #656a7626, 0px 2px 3px 0px #656a761a,
+      0px 8px 16px -10px #656a7633;
+    --token-surface-high-box-shadow:
+      0 0 0 1px #656a7640, 0px 2px 3px 0px #656a7626,
+      0px 16px 16px -10px #656a7633;
+    --token-surface-higher-box-shadow:
+      0 0 0 1px #656a7633, 0px 2px 3px 0px #656a761a,
+      0px 12px 28px 0px #656a7640;
+    --token-surface-overlay-box-shadow:
+      0 0 0 1px #3b3d4540, 0px 2px 3px 0px #3b3d4540,
+      0px 12px 24px 0px #3b3d4559;
+    --token-focus-ring-action-box-shadow:
+      inset 0 0 0 1px #0c56e9, 0 0 0 3px #5990ff;
+    --token-focus-ring-critical-box-shadow:
+      inset 0 0 0 1px #c00005, 0 0 0 3px #dd7578;
+    --token-app-header-height: 60px;
+    --token-app-header-home-link-size: 36px;
+    --token-app-header-logo-size: 28px;
+    --token-app-side-nav-wrapper-border-width: 1px;
+    --token-app-side-nav-wrapper-border-color: var(
+      --token-color-palette-neutral-200
+    );
+    --token-app-side-nav-wrapper-padding-horizontal: 16px;
+    --token-app-side-nav-wrapper-padding-vertical: 16px;
+    --token-app-side-nav-wrapper-padding-horizontal-minimized: 8px;
+    --token-app-side-nav-wrapper-padding-vertical-minimized: 22px;
+    --token-app-side-nav-toggle-button-border-radius: 5px;
+    --token-app-side-nav-header-home-link-padding: 4px;
+    --token-app-side-nav-header-home-link-logo-size: 48px;
+    --token-app-side-nav-header-home-link-logo-size-minimized: 32px;
+    --token-app-side-nav-header-actions-spacing: 8px;
+    --token-app-side-nav-body-list-margin-vertical: 24px;
+    --token-app-side-nav-body-list-item-height: 36px;
+    --token-app-side-nav-body-list-item-padding-horizontal: 8px;
+    --token-app-side-nav-body-list-item-padding-vertical: 4px;
+    --token-app-side-nav-body-list-item-spacing-vertical: 2px;
+    --token-app-side-nav-body-list-item-content-spacing-horizontal: 8px;
+    --token-app-side-nav-body-list-item-border-radius: 5px;
+    --token-app-side-nav-color-foreground-primary: var(
+      --token-color-foreground-primary
+    );
+    --token-app-side-nav-color-foreground-strong: var(
+      --token-color-foreground-primary
+    );
+    --token-app-side-nav-color-foreground-faint: var(
+      --token-color-foreground-faint
+    );
+    --token-app-side-nav-color-surface-primary: var(
+      --token-color-surface-faint
+    );
+    --token-app-side-nav-color-surface-interactive-hover: var(
+      --token-color-surface-interactive-hover
+    );
+    --token-app-side-nav-color-surface-interactive-active: var(
+      --token-color-palette-neutral-300
+    );
+    --token-form-label-color: #0c0c0e;
+    --token-form-legend-color: #0c0c0e;
+    --token-form-helper-text-color: #656a76;
+    --token-form-indicator-optional-color: #656a76;
+    --token-form-error-color: #c00005;
+    --token-form-error-icon-size: 14px;
+    --token-form-checkbox-size: 16px;
+    --token-form-checkbox-border-radius: 3px;
+    --token-form-checkbox-border-width: 1px;
+    --token-form-checkbox-background-image-size: 12px;
+    --token-form-checkbox-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+    --token-form-checkbox-background-image-data-url-indeterminate: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+    --token-form-checkbox-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+    --token-form-checkbox-background-image-data-url-indeterminate-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m2.03125,6a0.66146,0.75 0 0 1 0.66146,-0.75l6.61458,0a0.66146,0.75 0 0 1 0,1.5l-6.61458,0a0.66146,0.75 0 0 1 -0.66146,-0.75z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dash' color is hardcoded here! */
+    --token-form-control-base-foreground-value-color: #0c0c0e;
+    --token-form-control-base-foreground-placeholder-color: #656a76;
+    --token-form-control-base-surface-color-default: #ffffff;
+    --token-form-control-base-surface-color-hover: #f1f2f3;
+    --token-form-control-base-border-color-default: #8c909c;
+    --token-form-control-base-border-color-hover: #656a76;
+    --token-form-control-checked-foreground-color: #ffffff;
+    --token-form-control-checked-surface-color-default: #1060ff;
+    --token-form-control-checked-surface-color-hover: #0c56e9;
+    --token-form-control-checked-border-color-default: #0c56e9;
+    --token-form-control-checked-border-color-hover: #0046d1;
+    --token-form-control-invalid-border-color-default: #c00005;
+    --token-form-control-invalid-border-color-hover: #940004;
+    --token-form-control-readonly-foreground-color: #ffffff;
+    --token-form-control-readonly-surface-color: #f1f2f3;
+    --token-form-control-readonly-border-color: #656a761a;
+    --token-form-control-disabled-foreground-color: #8c909c;
+    --token-form-control-disabled-surface-color: #fafafa;
+    --token-form-control-disabled-border-color: #656a7633;
+    --token-form-control-padding: 7px; /** Notice: we have to take in account the border, so it's 1px less than in Figma. */
+    --token-form-control-border-radius: 5px;
+    --token-form-control-border-width: 1px;
+    --token-form-radio-size: 16px;
+    --token-form-radio-border-width: 1px;
+    --token-form-radio-background-image-size: 12px;
+    --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+    --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'dot' color is hardcoded here! */
+    --token-form-radiocard-group-gap: 16px;
+    --token-form-radiocard-border-width: 1px;
+    --token-form-radiocard-border-radius: 6px;
+    --token-form-radiocard-content-padding: 24px;
+    --token-form-radiocard-control-padding: 8px;
+    --token-form-radiocard-transition-duration: 0.2s;
+    --token-form-select-background-image-size: 16px;
+    --token-form-select-background-image-position-right-x: 7px;
+    --token-form-select-background-image-position-top-y: 9px;
+    --token-form-select-background-image-data-url: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%23656A76'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+    --token-form-select-background-image-data-url-disabled: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.55 2.24a.75.75 0 0 0-1.1 0L4.2 5.74a.75.75 0 1 0 1.1 1.02L8 3.852l2.7 2.908a.75.75 0 1 0 1.1-1.02l-3.25-3.5Zm-1.1 11.52a.75.75 0 0 0 1.1 0l3.25-3.5a.75.75 0 1 0-1.1-1.02L8 12.148 5.3 9.24a.75.75 0 0 0-1.1 1.02l3.25 3.5Z' fill='%238C909C'/%3E%3C/svg%3E"); /** notice: the 'caret' color is hardcoded here! */
+    --token-form-text-input-background-image-size: 16px;
+    --token-form-text-input-background-image-position-x: 7px;
+    --token-form-text-input-background-image-data-url-date: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11.5.75a.75.75 0 00-1.5 0V1H6V.75a.75.75 0 00-1.5 0V1H3.25A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1H11.5V.75zm-7 2.5V2.5H3.25a.75.75 0 00-.75.75V5h11V3.25a.75.75 0 00-.75-.75H11.5v.75a.75.75 0 01-1.5 0V2.5H6v.75a.75.75 0 01-1.5 0zm9 3.25h-11v6.25c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75V6.5z' fill-rule='evenodd' clip-rule='evenodd' fill='%233B3D45'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+    --token-form-text-input-background-image-data-url-time: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%233B3D45'%3e%3cpath d='M8.5 3.75a.75.75 0 00-1.5 0V8c0 .284.16.544.415.67l2.5 1.25a.75.75 0 10.67-1.34L8.5 7.535V3.75z'/%3e%3cpath d='M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+    --token-form-text-input-background-image-data-url-search: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='%23656A76'%3e%3cpath d='M7.25 2a5.25 5.25 0 103.144 9.455l2.326 2.325a.75.75 0 101.06-1.06l-2.325-2.326A5.25 5.25 0 007.25 2zM3.5 7.25a3.75 3.75 0 117.5 0 3.75 3.75 0 01-7.5 0z' fill-rule='evenodd' clip-rule='evenodd'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+    --token-form-text-input-background-image-data-url-search-cancel: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.78 4.28a.75.75 0 00-1.06-1.06L8 6.94 4.28 3.22a.75.75 0 00-1.06 1.06L6.94 8l-3.72 3.72a.75.75 0 101.06 1.06L8 9.06l3.72 3.72a.75.75 0 101.06-1.06L9.06 8l3.72-3.72z'/%3e%3c/svg%3e"); /** notice: the icon color is hardcoded here! */
+    --token-form-text-input-background-image-data-url-search-loading: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' %3e%3cg fill='%23656A76' fill-rule='evenodd' clip-rule='evenodd'%3e%3canimateTransform attributeName='transform' type='rotate' dur='0.9s' from='0 8 8' to='360 8 8' repeatCount='indefinite'/%3e%3cpath d='M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8z' opacity='.2'/%3e%3cpath d='M7.25.75A.75.75 0 018 0a8 8 0 018 8 .75.75 0 01-1.5 0A6.5 6.5 0 008 1.5a.75.75 0 01-.75-.75z'/%3e%3c/g%3e%3c/svg%3e"); /** notice: the icon color and animation are hardcoded here! */
+    --token-form-toggle-width: 32px;
+    --token-form-toggle-height: 16px;
+    --token-form-toggle-base-surface-color-default: #f1f2f3; /** the toggle has a different base surface color, compared to the other controls */
+    --token-form-toggle-border-radius: 3px;
+    --token-form-toggle-border-width: 1px;
+    --token-form-toggle-background-image-size: 12px;
+    --token-form-toggle-background-image-position-x: 2px;
+    --token-form-toggle-background-image-data-url: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%23FFF'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+    --token-form-toggle-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.78033 3.21967C10.0732 3.51256 10.0732 3.98744 9.78033 4.28033L5.28033 8.78033C4.98744 9.07322 4.51256 9.07322 4.21967 8.78033L2.21967 6.78033C1.92678 6.48744 1.92678 6.01256 2.21967 5.71967C2.51256 5.42678 2.98744 5.42678 3.28033 5.71967L4.75 7.18934L8.71967 3.21967C9.01256 2.92678 9.48744 2.92678 9.78033 3.21967Z' fill='%238C909C'/%3e%3c/svg%3e"); /** notice: the 'tick' color is hardcoded here! */
+    --token-form-toggle-transition-duration: 0.2s;
+    --token-form-toggle-transition-timing-function: cubic-bezier(
+      0.68,
+      -0.2,
+      0.265,
+      1.15
+    );
+    --token-form-toggle-thumb-size: 16px;
+    --token-pagination-nav-control-height: 36px;
+    --token-pagination-nav-control-padding-horizontal: 12px;
+    --token-pagination-nav-control-focus-inset: 4px;
+    --token-pagination-nav-control-icon-spacing: 6px;
+    --token-pagination-nav-indicator-height: 2px;
+    --token-pagination-nav-indicator-spacing: 6px;
+    --token-pagination-child-spacing-vertical: 8px;
+    --token-pagination-child-spacing-horizontal: 20px;
+    --token-side-nav-wrapper-border-width: 1px;
+    --token-side-nav-wrapper-border-color: #656a76;
+    --token-side-nav-wrapper-padding-horizontal: 16px;
+    --token-side-nav-wrapper-padding-vertical: 16px;
+    --token-side-nav-wrapper-padding-horizontal-minimized: 8px;
+    --token-side-nav-wrapper-padding-vertical-minimized: 22px;
+    --token-side-nav-toggle-button-border-radius: 5px;
+    --token-side-nav-header-home-link-padding: 4px;
+    --token-side-nav-header-home-link-logo-size: 48px;
+    --token-side-nav-header-home-link-logo-size-minimized: 32px;
+    --token-side-nav-header-actions-spacing: 8px;
+    --token-side-nav-body-list-margin-vertical: 24px;
+    --token-side-nav-body-list-item-height: 36px;
+    --token-side-nav-body-list-item-padding-horizontal: 8px;
+    --token-side-nav-body-list-item-padding-vertical: 4px;
+    --token-side-nav-body-list-item-spacing-vertical: 2px;
+    --token-side-nav-body-list-item-content-spacing-horizontal: 8px;
+    --token-side-nav-body-list-item-border-radius: 5px;
+    --token-side-nav-color-foreground-primary: #dedfe3;
+    --token-side-nav-color-foreground-strong: #ffffff;
+    --token-side-nav-color-foreground-faint: #8c909c;
+    --token-side-nav-color-surface-primary: #0c0c0e;
+    --token-side-nav-color-surface-interactive-hover: #3b3d45;
+    --token-side-nav-color-surface-interactive-active: #656a76;
+    --token-tabs-tab-height-medium: 36px;
+    --token-tabs-tab-height-large: 48px;
+    --token-tabs-tab-padding-horizontal-medium: 12px;
+    --token-tabs-tab-padding-horizontal-large: 20px;
+    --token-tabs-tab-padding-vertical: 0px;
+    --token-tabs-tab-border-radius: 5px;
+    --token-tabs-tab-focus-inset: 6px;
+    --token-tabs-tab-gutter: 6px;
+    --token-tabs-indicator-height: 3px;
+    --token-tabs-indicator-transition-function: cubic-bezier(0.5, 1, 0.89, 1);
+    --token-tabs-indicator-transition-duration: 0.6s;
+    --token-tabs-divider-height: 1px;
+    --token-tooltip-border-radius: 5px;
+    --token-tooltip-color-foreground-primary: var(
+      --token-color-foreground-high-contrast
+    );
+    --token-tooltip-color-surface-primary: var(
+      --token-color-palette-neutral-700
+    );
+    --token-tooltip-focus-offset: -2px;
+    --token-tooltip-max-width: 280px;
+    --token-tooltip-padding-horizontal: 12px;
+    --token-tooltip-padding-vertical: 8px;
+    --token-tooltip-transition-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+    --token-typography-font-stack-display:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-font-stack-text:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-font-stack-code:
+      ui-monospace, Menlo, Consolas, monospace;
+    --token-typography-display-500-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-display-500-font-size: 1.875rem; /** 30px/1.875rem */
+    --token-typography-display-500-line-height: 1.2666; /** 38px */
+    --token-typography-display-400-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-display-400-font-size: 1.5rem; /** 24px/1.5rem */
+    --token-typography-display-400-line-height: 1.3333; /** 32px */
+    --token-typography-display-300-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-display-300-font-size: 1.125rem; /** 18px/1.125rem */
+    --token-typography-display-300-line-height: 1.3333; /** 24px */
+    --token-typography-display-300-letter-spacing: -0.5px; /** this is `tracking` */
+    --token-typography-display-200-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-display-200-font-size: 1rem; /** 16px/1rem */
+    --token-typography-display-200-line-height: 1.5; /** 24px */
+    --token-typography-display-200-letter-spacing: -0.5px; /** this is `tracking` */
+    --token-typography-display-100-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-display-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+    --token-typography-display-100-line-height: 1.3846; /** 18px */
+    --token-typography-body-300-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-body-300-font-size: 1rem; /** 16px/1rem */
+    --token-typography-body-300-line-height: 1.5; /** 24px */
+    --token-typography-body-200-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-body-200-font-size: 0.875rem; /** 14px/0.875rem */
+    --token-typography-body-200-line-height: 1.4286; /** 20px */
+    --token-typography-body-100-font-family:
+      -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+      Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+    --token-typography-body-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+    --token-typography-body-100-line-height: 1.3846; /** 18px */
+    --token-typography-code-100-font-family:
+      ui-monospace, Menlo, Consolas, monospace;
+    --token-typography-code-100-font-size: 0.8125rem; /** 13px/0.8125rem */
+    --token-typography-code-100-line-height: 1.23; /** 16px */
+    --token-typography-code-200-font-family:
+      ui-monospace, Menlo, Consolas, monospace;
+    --token-typography-code-200-font-size: 0.875rem; /** 14px/0.875rem */
+    --token-typography-code-200-line-height: 1.125; /** 18px */
+    --token-typography-code-300-font-family:
+      ui-monospace, Menlo, Consolas, monospace;
+    --token-typography-code-300-font-size: 1rem; /** 16px/1rem */
+    --token-typography-code-300-line-height: 1.25; /** 20px */
+  }
+}
diff --git a/packages/tokens/scripts/build-parts/@types/Config.d.ts b/packages/tokens/scripts/build-parts/@types/Config.d.ts
deleted file mode 100644
index 3d633c7b38c..00000000000
--- a/packages/tokens/scripts/build-parts/@types/Config.d.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-/**
- * Copyright (c) HashiCorp, Inc.
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import { Config } from 'style-dictionary';
-
-export type ConfigTarget = {
-  source: Config['source'],
-  transformGroup: Config['transformGroup'],
-  platforms: string[],
-};
-
-export type ConfigTargets = {
-  [key: string]: ConfigTarget
-};
diff --git a/packages/tokens/scripts/build-parts/generateCssHelpers.ts b/packages/tokens/scripts/build-parts/generateCssHelpers.ts
index 3c45a42e337..2c48d0dc1b9 100644
--- a/packages/tokens/scripts/build-parts/generateCssHelpers.ts
+++ b/packages/tokens/scripts/build-parts/generateCssHelpers.ts
@@ -17,7 +17,7 @@ export const PREFIX = 'hds';
 
 export async function generateCssHelpers(dictionary: Dictionary, config: PlatformConfig ): Promise<void> {
 
-  fs.ensureDir(`${config.buildPath}helpers/`);
+  await fs.ensureDir(`${config.buildPath}helpers/`);
 
   const header = await fileHeader({});
 
diff --git a/packages/tokens/scripts/build-parts/generateExtraThemingCssFiles.ts b/packages/tokens/scripts/build-parts/generateExtraThemingCssFiles.ts
new file mode 100644
index 00000000000..f87112d3810
--- /dev/null
+++ b/packages/tokens/scripts/build-parts/generateExtraThemingCssFiles.ts
@@ -0,0 +1,118 @@
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+import fs from 'fs-extra';
+import prettier from 'prettier';
+
+import type { Dictionary, PlatformConfig }  from 'style-dictionary';
+import { fileHeader } from 'style-dictionary/utils';
+
+export async function generateExtraThemingCssFiles(_dictionary: Dictionary, config: PlatformConfig): Promise<void> {
+
+  const commonSource = await getSourceFromFileWithRootSelector(config, 'default', 'common-tokens.css');
+  const defaultThemedSource = await getSourceFromFileWithRootSelector(config, 'default', 'themed-tokens.css');
+  const cds0ThemedSource = await getSourceFromFileWithRootSelector(config, 'cds-g0', 'themed-tokens.css');
+  const cds10ThemedSource = await getSourceFromFileWithRootSelector(config, 'cds-g10', 'themed-tokens.css');
+  const cds90ThemedSource = await getSourceFromFileWithRootSelector(config, 'cds-g90', 'themed-tokens.css');
+  const cds100ThemedSource = await getSourceFromFileWithRootSelector(config, 'cds-g100', 'themed-tokens.css');
+
+  const header = await fileHeader({});
+
+  const methods = ['css-selectors', 'css-selectors--migration', 'css-selectors--advanced', 'scss-mixins'];
+
+  for (const method of methods) {
+
+    let outputContent = `${header}\n\n`;
+
+    // CSS file for combined `system/light/dark` themes in the same file (using `.class` selectors)
+    if (method.startsWith('css-selectors')) {
+
+      // this is the `:root`-only fallback if no theme is applied at all (we use the light/`cds-g0` mode)
+      if (method === 'css-selectors') {
+        outputContent += `${cds0ThemedSource}\n\n`;
+      }
+      // this is the `default` mode (standard HDS) - used for development (while migrating or in the showcase) but also as `:root`-only fallback fallback if no theme is applied at all
+      if (method === 'css-selectors--migration' || method === 'css-selectors--advanced') {
+        outputContent += `${defaultThemedSource.replace(/^:root/, ':root, .hds-theme-default')}\n\n`;
+      }
+
+      // these are the themed `carbonized` tokens
+      outputContent += `@media (prefers-color-scheme: light) { ${cds0ThemedSource.replace(/^:root/, '.hds-theme-system')} }\n\n`;
+      outputContent += `@media (prefers-color-scheme: dark) { ${cds100ThemedSource.replace(/^:root/, '.hds-theme-system')} }\n\n`;
+      if (method === 'css-selectors' || method === 'css-selectors--migration') {
+        // note: we use `cds-g0` for `light` and `cds-g100` for `dark`
+        outputContent += `${cds0ThemedSource.replace(/^:root/, '.hds-theme-light')}\n\n`;
+        outputContent += `${cds100ThemedSource.replace(/^:root/, '.hds-theme-dark')}\n\n`;
+      }
+      if (method === 'css-selectors--advanced') {
+        // note: we use `cds-g0` for `light` and `cds-g100` for `dark`
+        outputContent += `${cds0ThemedSource.replace(/^:root/, '.hds-theme-light, .hds-mode-cds-g0')}\n\n`;
+        outputContent += `${cds100ThemedSource.replace(/^:root/, '.hds-theme-dark, .hds-mode-cds-g100')}\n\n`;
+        // we write these _after_ the light/dark selectors so they can overwrite the previous declarations (they all have the same specificity)
+        outputContent += `${cds10ThemedSource.replace(/^:root/, '.hds-mode-cds-g10')}\n\n`;
+        outputContent += `${cds90ThemedSource.replace(/^:root/, '.hds-mode-cds-g90')}\n\n`;
+      }
+
+      // this is the common part
+      outputContent += getCssVariablesStalenessComment();
+      if (method === 'css-selectors') {
+        outputContent += `${commonSource.replace(/^:root/, ':root, .hds-theme-system, .hds-theme-light, .hds-theme-dark')}\n\n`;
+      }
+      if (method === 'css-selectors--migration') {
+        outputContent += `${commonSource.replace(/^:root/, ':root, .hds-theme-default, .hds-theme-system, .hds-theme-light, .hds-theme-dark')}\n\n`;
+      }
+      if (method === 'css-selectors--advanced') {
+        outputContent += `${commonSource.replace(/^:root/, ':root, .hds-theme-default, .hds-theme-system, .hds-theme-light, .hds-theme-dark, .hds-mode-cds-g0, .hds-mode-cds-g10, .hds-mode-cds-g90, .hds-mode-cds-g100')}\n\n`;
+      }
+    }
+
+    // SCSS file for mixins
+    if (method === 'scss-mixins') {
+      outputContent += `@mixin hds-theme-default() { ${defaultThemedSource} }\n\n`;
+      outputContent += `@mixin hds-theme-light() { ${cds0ThemedSource} }\n\n`;
+      outputContent += `@mixin hds-theme-dark() { ${cds100ThemedSource} }\n\n`;
+      outputContent += `@mixin hds-mode-cds0() { ${cds0ThemedSource} }\n\n`;
+      outputContent += `@mixin hds-mode-cds10() { ${cds10ThemedSource} }\n\n`;
+      outputContent += `@mixin hds-mode-cds90() { ${cds90ThemedSource} }\n\n`;
+      outputContent += `@mixin hds-mode-cds100() { ${cds100ThemedSource} }\n\n`;
+      //
+      // this is the mixin that needs to be used to include the common tokens, shared across themes
+      outputContent += `@mixin hds-theme-common() { ${commonSource} }\n\n`;
+    }
+
+    const outputTokensCss = await prettier.format(outputContent, { parser: 'css', tabWidth: 2, });
+
+    const outputFolder = `${config.buildPath}themed-tokens/with-${method}/`;
+    await fs.ensureDir(outputFolder);
+    await fs.writeFile(`${outputFolder}tokens.css`, outputTokensCss);
+  }
+}
+
+async function getSourceFromFileWithRootSelector(config: PlatformConfig, theme: string, path: string): Promise<string> {
+  const rawSource = await fs.readFile(`${config.buildPath}themed-tokens/with-root-selector/${theme}/${path}`, 'utf8');
+  const header = await fileHeader({});
+  return rawSource.replace(header, '');
+}
+
+function getCssVariablesStalenessComment(): string {
+  let comment = '';
+  comment += '\n/*\n\n';
+  comment += 'WHY ARE ALL "COMPUTED" CSS VARIABLES REDECLARED IN EACH THEME SCOPE?\n';
+  comment += '\n';
+  comment += 'CSS custom properties (variables) inherit from parent to child, but when a variable is defined\n';
+  comment += 'as a calculation or alias of another variable (e.g., `--alias-value: var(--source-value)`, its value is fixed\n';
+  comment += 'at the scope where it is declared—using whatever is visible at that level in the DOM (eg. `:root`).\n';
+  comment += '\n';
+  comment += 'This block of "common/shared" CSS variables contains a lot of these aliases, so if we only declare these\n';
+  comment += '"computed" variables at `:root` level, their values do not update in themed blocks that override\n';
+  comment += 'the "source" variables (e.g., `--source-value`) at a lower scope.\n';
+  comment += 'This results in _stale_ variables, where the computed value is always stuck on the `:root` value,\n';
+  comment += 'even inside a themed block where the source variable is assigned.\n';
+  comment += '\n';
+  comment += 'To make sure every themed block/scoped context (eg. `.hds-theme-light`) correctly computes the aliased values,\n';
+  comment += 'we redeclare each "computed" variable in every theme scope where its "source" variable is overridden.\n';
+  comment += '\n*/\n\n';
+  return comment;
+}
diff --git a/packages/tokens/scripts/build-parts/generateExtraThemingDocsFiles.ts b/packages/tokens/scripts/build-parts/generateExtraThemingDocsFiles.ts
new file mode 100644
index 00000000000..1cc469870a6
--- /dev/null
+++ b/packages/tokens/scripts/build-parts/generateExtraThemingDocsFiles.ts
@@ -0,0 +1,40 @@
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+import fs from 'fs-extra';
+
+import type { Dictionary, PlatformConfig }  from 'style-dictionary';
+import type { DesignToken } from 'style-dictionary/types';
+
+export async function generateExtraThemingDocsFiles(_dictionary: Dictionary, config: PlatformConfig): Promise<void> {
+
+  const defaultThemedTokens = await getJsonThemedObjectFromFile(config, 'default');
+  const cds0ThemedTokens = await getJsonThemedObjectFromFile(config, 'cds-g0');
+  const cds10ThemedTokens = await getJsonThemedObjectFromFile(config, 'cds-g10');
+  const cds90ThemedTokens = await getJsonThemedObjectFromFile(config, 'cds-g90');
+  const cds100ThemedTokens = await getJsonThemedObjectFromFile(config, 'cds-g100');
+
+  const allThemedTokens = {
+    'default': defaultThemedTokens,
+    'cds-g0': cds0ThemedTokens,
+    'cds-g10': cds10ThemedTokens,
+    'cds-g90': cds90ThemedTokens,
+    'cds-g100': cds100ThemedTokens,
+  };
+
+  const outputFolder = `${config.buildPath}`;
+  await fs.ensureDir(outputFolder);
+  await fs.writeFile(`${outputFolder}themed-tokens.json`, JSON.stringify(allThemedTokens, null, 2));
+}
+
+async function getJsonThemedObjectFromFile(config: PlatformConfig, theme: string): Promise<Record<string, DesignToken>> {
+  const jsonSource = await fs.readFile(`${config.buildPath}themed-tokens/${theme}.json`, 'utf8');
+  const jsonTokensArray = JSON.parse(jsonSource);
+  const jsonTokensObject = jsonTokensArray.reduce((acc: Record<string, any>, token: any) => {
+    acc[token.name] = token;
+    return acc;
+  }, {});
+  return jsonTokensObject;
+}
\ No newline at end of file
diff --git a/packages/tokens/scripts/build-parts/generateTypographyHelpers.ts b/packages/tokens/scripts/build-parts/generateTypographyHelpers.ts
index 3965f14fef5..82facf7b039 100644
--- a/packages/tokens/scripts/build-parts/generateTypographyHelpers.ts
+++ b/packages/tokens/scripts/build-parts/generateTypographyHelpers.ts
@@ -42,7 +42,8 @@ export function generateTypographyHelpers(tokens: TransformedTokens, outputCssVa
       if (fontWeightTokens) {
         Object.keys(fontWeightTokens).forEach(weight => {
           const selector = `.${PREFIX}-font-weight-${weight}`;
-          helpers.push(`${selector} { font-weight: ${fontWeightTokens[weight].$value}; }`);
+          const valueFontWeight = outputCssVars ? `var(--token-typography-font-weight-${weight})` : fontWeightTokens[weight].$value;
+          helpers.push(`${selector} { font-weight: ${valueFontWeight}; }`);
         });
       }
 
diff --git a/packages/tokens/scripts/build-parts/getStyleDictionaryConfig.ts b/packages/tokens/scripts/build-parts/getStyleDictionaryConfig.ts
new file mode 100644
index 00000000000..9fdb03a8cdd
--- /dev/null
+++ b/packages/tokens/scripts/build-parts/getStyleDictionaryConfig.ts
@@ -0,0 +1,280 @@
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+import type { Config, DesignToken } from 'style-dictionary/types';
+
+export const targets = ['products', 'devdot', 'marketing', 'cloud-email'];
+export const modes = ['default', 'cds-g0', 'cds-g10', 'cds-g90', 'cds-g100'];
+
+export type Target = typeof targets[number];
+export type Mode = typeof modes[number];
+
+// uncomment this to enable debugging
+const baseConfig: Config = {
+  // log: {
+  //   warnings: 'warn', // options: warn | error | disabled
+  //   verbosity: 'verbose', // options: default | silent | verbose
+  //   errors: {
+  //     brokenReferences: 'console', // options: throw | console
+  //   },
+  // }
+};
+
+const excludePrivateTokens = (token: DesignToken) => {
+  return !token.private;
+}
+
+// const getFilterForMode = (mode: Mode) => {
+//   // this function returns a function to filter based on
+//   return function (token: DesignToken) {
+//     // TODO!
+//     console.log('xxx filter for mode', mode);
+//     return !token.private;
+//   };
+// }
+
+export function getStyleDictionaryConfig({ target, mode }: { target: Target, mode?: Mode }): Config {
+
+  // -----------------------
+  // PRODUCTS
+  // -----------------------
+
+  if (target === 'products') {
+
+    if (mode) {
+
+      // ⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃
+      // THEMED TOKENS
+      // ⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃
+
+      return {
+        ...baseConfig,
+        source: [
+          `src/carbon-extracted/**/*.json`,
+          `src/global/**/*.json`,
+          `src/products/shared/**/*.json`
+        ],
+        platforms: {
+          [`web/themed-css-variables--mode-${mode}`]: {
+            buildPath: 'dist/products/css/',
+            transformGroup: 'products/web/themed',
+            prefix: 'token',
+            basePxFontSize: 16,
+            files: [
+              {
+                destination: `themed-tokens/with-root-selector/${mode}/common-tokens.css`,
+                format: 'css/variables',
+                options: {
+                  // TODO understand if is better to output references or not for the "common" definitions (probably yes)
+                  outputReferences: false,
+                  // outputReferences: (token, { dictionary, usesDtcg }) => {
+                  //   // `dictionary` contains `allTokens`, `tokens`, `tokenMap`, `unfilteredTokens`, `unfilteredAllTokens` and `unfilteredTokenMap` props
+                  //   // `usesDtcg` tells you whether the Design Token Community Group spec is used with $ prefixes ($value, $type etc.)
+                  //   // return true or false
+                  // },
+                  // see: https://styledictionary.com/reference/utils/references/#combining-multiple-outputreference-utility-functions
+                  // outputReferences: (token, options) => outputReferencesFilter(token, options) && outputReferencesTransformed(token, options),
+                },
+                filter: (token: DesignToken) => {
+                  return !token.private && !(token.attributes && token.attributes.themeable);
+                },
+              },
+              {
+                destination: `themed-tokens/with-root-selector/${mode}/themed-tokens.css`,
+                format: 'css/variables',
+                options: {
+                  // TODO understand if is better to output references or not for the "themed" definitions (almost certainly yes)
+                  outputReferences: false,
+                  // outputReferences: (token, { dictionary, usesDtcg }) => {
+                  //   // `dictionary` contains `allTokens`, `tokens`, `tokenMap`, `unfilteredTokens`, `unfilteredAllTokens` and `unfilteredTokenMap` props
+                  //   // `usesDtcg` tells you whether the Design Token Community Group spec is used with $ prefixes ($value, $type etc.)
+                  //   // return true or false
+                  // },
+                  // see: https://styledictionary.com/reference/utils/references/#combining-multiple-outputreference-utility-functions
+                  // outputReferences: (token, options) => outputReferencesFilter(token, options) && outputReferencesTransformed(token, options),
+                },
+                filter: (token: DesignToken) => {
+                  return !token.private && (token.attributes && token.attributes.themeable);
+                },
+              }
+            ],
+            // this has been registered in the `build` file
+            preprocessors: [`replace-value-for-mode-${mode}`],
+          },
+          [`docs/themed-json--mode-${mode}`]: {
+            buildPath: 'dist/docs/products/',
+            transformGroup: 'products/web',
+            prefix: 'token',
+            basePxFontSize: 16,
+            files: [
+              {
+                destination: `themed-tokens/${mode}.json`,
+                format: 'docs/json',
+                filter: excludePrivateTokens,
+              }
+            ],
+            // this has been registered in the `build` file
+            preprocessors: [`replace-value-for-mode-${mode}`],
+          }
+        }
+      };
+
+    } else {
+
+      // ⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃
+      // STANDARD TOKENS
+      // ⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃
+
+      return {
+        ...baseConfig,
+        source: [
+          `src/carbon-extracted/**/*.json`,
+          `src/global/**/*.json`,
+          `src/products/shared/**/*.json`
+        ],
+        platforms: {
+          'web/css-variables': {
+            buildPath: 'dist/products/css/',
+            transformGroup: 'products/web',
+            prefix: 'token',
+            basePxFontSize: 16,
+            files: [
+              {
+                destination: 'tokens.css',
+                format: 'css/variables',
+                filter: excludePrivateTokens,
+              }
+            ],
+            actions: ['generate-css-helpers', 'generate-extra-theming-css-files'],
+          },
+          'docs/json': {
+            buildPath: 'dist/docs/products/',
+            transformGroup: 'products/web',
+            prefix: 'token',
+            basePxFontSize: 16,
+            files: [
+              {
+                destination: 'tokens.json',
+                format: 'docs/json',
+                filter: excludePrivateTokens,
+              }
+            ],
+            actions: ['generate-extra-theming-docs-files'],
+          }
+        }
+      };
+    }
+  }
+
+  // -----------------------
+  // DEVDOT
+  // -----------------------
+
+  if (target === 'devdot') {
+    return {
+      ...baseConfig,
+      'source': [
+        `src/carbon-extracted/**/*.json`,
+        `src/global/**/*.json`,
+        `src/products/shared/**/*.json`,
+        // just uncomment the line below to include overrides for 'devdot' tokens
+        `src/devdot/**/*.json`
+      ],
+      'platforms': {
+        'web/css-variables': {
+          buildPath: 'dist/devdot/css/',
+          'transformGroup': 'products/web',
+          prefix: 'token',
+          basePxFontSize: 16,
+          files: [
+            {
+              destination: 'tokens.css',
+              format: 'css/variables',
+              filter: excludePrivateTokens,
+            }
+          ],
+          actions: ['generate-css-helpers'],
+        }
+      }
+    };
+  }
+
+  // -----------------------
+  // MARKETING
+  // -----------------------
+
+  if (target === 'marketing') {
+    return {
+      ...baseConfig,
+      'source': [
+        `src/carbon-extracted/**/*.json`,
+        `src/global/**/*.json`,
+        `src/products/shared/**/*.json`,
+      ],
+      'platforms': {
+        'web/css-variables': {
+          buildPath: 'dist/marketing/css/',
+          'transformGroup': 'marketing/web',
+          prefix: 'token',
+          basePxFontSize: 16,
+          files: [
+            {
+              destination: 'tokens.css',
+              format: 'css/variables',
+              filter: excludePrivateTokens,
+            }
+          ],
+          actions: ['generate-css-helpers'],
+        },
+        'json': {
+          buildPath: 'dist/marketing/',
+          'transformGroup': 'marketing/web',
+          prefix: 'token',
+          basePxFontSize: 16,
+          files: [
+            {
+              destination: 'tokens.json',
+              format: 'json',
+              filter: excludePrivateTokens,
+            }
+          ]
+        }
+      }
+    };
+  }
+
+  // -----------------------
+  // CLOUD-EMAIL
+  // -----------------------
+
+  if (target === 'cloud-email') {
+    // these tokens will be consumed by the email templating system in https://github.com/hashicorp/cloud-email
+    return {
+      ...baseConfig,
+      // we need only foundational tokens (colors, typography, etc)
+      'source': [
+        `src/carbon-extracted/**/*.json`,
+        `src/global/**/*.json`,
+        `src/products/shared/color/**/*.json`,
+        `src/products/shared/typography.json`,
+      ],
+      'platforms': {
+        'email/sass-variables': {
+          buildPath: `dist/cloud-email/`,
+          'transformGroup': 'products/email',
+          prefix: 'token',
+          files: [
+            {
+              destination: 'tokens.scss',
+              format: 'scss/variables',
+              filter: excludePrivateTokens,
+            }
+          ],
+          actions: ['generate-css-helpers'],
+        }
+      }
+    }
+  };
+};
diff --git a/packages/tokens/scripts/build.ts b/packages/tokens/scripts/build.ts
index b79eef05589..a3a47d14871 100644
--- a/packages/tokens/scripts/build.ts
+++ b/packages/tokens/scripts/build.ts
@@ -4,7 +4,8 @@
  */
 
 import StyleDictionary from 'style-dictionary';
-import type { Config, DesignToken, Platform } from 'style-dictionary/types';
+// import { getReferences, usesReferences } from "style-dictionary/utils";
+import type { DesignToken, PlatformConfig } from 'style-dictionary/types';
 
 import tinycolor from 'tinycolor2';
 
@@ -14,9 +15,10 @@ import { fileURLToPath } from 'url';
 import { dirname } from 'path';
 import { cloneDeep } from 'lodash-es';
 
-import type { ConfigTargets } from './build-parts/@types/Config.d.ts';
-
+import { targets, modes, getStyleDictionaryConfig } from './build-parts/getStyleDictionaryConfig.ts';
 import { generateCssHelpers } from './build-parts/generateCssHelpers.ts';
+import { generateExtraThemingCssFiles } from './build-parts/generateExtraThemingCssFiles.ts';
+import { generateExtraThemingDocsFiles } from './build-parts/generateExtraThemingDocsFiles.ts';
 
 // SCRIPT CONFIG
 
@@ -24,8 +26,70 @@ const __filename = fileURLToPath(import.meta.url); // Get the file path of the c
 const __dirname = dirname(__filename); // Get the directory name of the current module
 const distFolder = path.resolve(__dirname, '../dist');
 
+
+// •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
+// •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
+
+
+// CUSTOM PREPROCESSORS
+
+for (const mode of modes) {
+  StyleDictionary.registerPreprocessor({
+    name: `replace-value-for-mode-${mode}`,
+    preprocessor: (dictionary, _options) => {
+      // recursively traverse token objects and replace the `$value` with the corresponding colocated `$modes` theme value
+      // note: the `slice` is always an object (a token or a parent group)
+      function replaceModes(slice: DesignToken) {
+        if (slice.$modes) {
+          if (mode in slice.$modes) {
+            slice.$value = slice.$modes[mode];
+          } else {
+            // TODO! decide if we want to throw here (and test if it works, by removing a value from one of the test files)
+            console.error(`❌ ERROR - Found themed token without '${mode}' value:`, JSON.stringify(slice, null, 2));
+          }
+        } else {
+            Object.values(slice).forEach((value) => {
+              if (typeof value === 'object') {
+                replaceModes(value);
+              }
+            });
+        }
+        return slice;
+      }
+      return replaceModes(dictionary);
+    },
+  });
+}
+
 // CUSTOM TRANSFORMS
 
+StyleDictionary.registerTransform({
+  name: 'attributes/themeable',
+  type: 'attribute',
+  transform: (token: DesignToken) => {
+    let isThemeable = false;
+
+    if ('$modes' in token) {
+      isThemeable = true;
+    }
+
+    // TODO! understand how we can make this themeable using `usesReferences`/`getReferences`
+    // if (token.key === "{typography.display-500.font-family}") {
+    //   console.log('usesReferences', usesReferences(token.original.$value));
+    //   const refs = getReferences(token.original.$value, StyleDictionaryInstance.tokenMap);
+    //   console.log('refs', refs);
+    // }
+
+    // TODO understand if we really need this to split themeable vs non-themeable tokens
+    // if (usesReferences(token.original.$value)) {
+    //   const refs = getReferences(token.original.$value, StyleDictionaryInstance.tokenMap);
+    //   isThemeable = refs.some((ref) => '$modes' in ref);
+    // }
+
+    return isThemeable ? { themeable: true } : { };
+  },
+});
+
 StyleDictionary.registerTransform({
   // the CTI convention is not outdated, but we still need to use the top-level path as `category` for the token
   name: 'attributes/category',
@@ -71,9 +135,9 @@ StyleDictionary.registerTransform({
     // (see `isFontSize()` and the `transforms.sizePx` transformation, for example)
     return token.$type === 'font-size';
   },
-  transform: (token: DesignToken, platform: Platform) => {
+  transform: (token: DesignToken, platformConfig: PlatformConfig) => {
     const val = parseFloat(token.$value);
-    const baseFont = platform?.basePxFontSize || 16;
+    const baseFont = platformConfig?.basePxFontSize || 16;
     const unit = token.unit;
     if (isNaN(val)) {
       console.error(`🚨 Invalid Number: '${token.name}: ${token.$value}' is not a valid number, cannot transform to 'rem'.\n`);
@@ -95,10 +159,10 @@ StyleDictionary.registerTransform({
     // (see `isFontSize()` and the `transforms.sizePx` transformation, for example)
     return token.$type === 'font-size';
   },
-  transform: (token: DesignToken, platform: Platform) => {
+  transform: (token: DesignToken, platformConfig: PlatformConfig) => {
     const val = parseFloat(token.$value);
     const unit = token.unit;
-    const baseFont = platform?.basePxFontSize || 16;
+    const baseFont = platformConfig?.basePxFontSize || 16;
     if (isNaN(val)) {
       console.error(`🚨 Invalid Number: '${token.name}: ${token.$value}' is not a valid number, cannot transform to 'px'.\n`);
     }
@@ -185,18 +249,23 @@ StyleDictionary.registerTransform({
 
 StyleDictionary.registerTransformGroup({
   name: 'products/web',
-  transforms: ['name/kebab', 'typography/font-family', 'typography/font-size/to-rem', 'typography/letter-spacing', 'dimension/unit', 'color/css', 'color/with-alpha', 'time/duration', 'cubicBezier/css', 'attributes/category']
+  transforms: ['attributes/category', 'name/kebab', 'typography/font-family', 'typography/font-size/to-rem', 'typography/letter-spacing', 'dimension/unit', 'color/css', 'color/with-alpha', 'time/duration', 'cubicBezier/css']
+});
+
+StyleDictionary.registerTransformGroup({
+  name: 'products/web/themed',
+  transforms: ['attributes/themeable', 'attributes/category', 'name/kebab', 'typography/font-family', 'typography/font-size/to-rem', 'typography/letter-spacing', 'dimension/unit', 'color/css', 'color/with-alpha', 'time/duration', 'cubicBezier/css']
 });
 
 StyleDictionary.registerTransformGroup({
   name: 'products/email',
   // notice: for emails we need the font-size in `px` (not `rem`)
-  transforms: ['name/kebab', 'typography/font-family', 'typography/font-size/to-px', 'typography/letter-spacing', 'dimension/unit', 'color/css', 'color/with-alpha', 'time/duration', 'cubicBezier/css', 'attributes/category']
+  transforms: ['attributes/category', 'name/kebab', 'typography/font-family', 'typography/font-size/to-px', 'typography/letter-spacing', 'dimension/unit', 'color/css', 'color/with-alpha', 'time/duration', 'cubicBezier/css']
 });
 
 StyleDictionary.registerTransformGroup({
   name: 'marketing/web',
-  transforms: ['name/kebab', 'typography/font-family', 'typography/font-size/to-rem', 'typography/letter-spacing', 'dimension/unit', 'color/css', 'color/with-alpha', 'time/duration', 'cubicBezier/css', 'attributes/category']
+  transforms: ['attributes/category', 'name/kebab', 'typography/font-family', 'typography/font-size/to-rem', 'typography/letter-spacing', 'dimension/unit', 'color/css', 'color/with-alpha', 'time/duration', 'cubicBezier/css']
 });
 
 StyleDictionary.registerFormat({
@@ -224,143 +293,22 @@ StyleDictionary.registerAction({
   undo: () => {}
 });
 
-// DYNAMIC CONFIG
-
-const targets: ConfigTargets = {
-  'products': {
-    'source': [
-      `src/global/**/*.json`,
-      `src/products/shared/**/*.json`
-    ],
-    'transformGroup': 'products/web',
-    'platforms': ['web/css-variables', 'docs/json']
-  },
-  'devdot': {
-    'source': [
-      `src/global/**/*.json`,
-      `src/products/shared/**/*.json`,
-      // just uncomment the line below to include overrides for "devdot" tokens
-      `src/devdot/**/*.json`
-    ],
-    'transformGroup': 'products/web',
-    'platforms': ['web/css-variables']
-  },
-  'marketing': {
-    'source': [
-      `src/global/**/*.json`,
-      `src/products/shared/**/*.json`,
-    ],
-    'transformGroup': 'marketing/web',
-    'platforms': ['web/css-variables', 'json']
-  },
-  // these tokens will be consumed by the email templating system in https://github.com/hashicorp/cloud-email
-  'cloud-email': {
-    // we need only foundational tokens (colors, typography, etc)
-    'source': [
-      `src/global/**/*.json`,
-      `src/products/shared/color/**/*.json`,
-      `src/products/shared/typography.json`,
-    ],
-    'transformGroup': 'products/email',
-    'platforms': ['email/sass-variables']
-  }
-};
-
-function getStyleDictionaryConfig({ target }: { target: string }): Config {
-  // @ts-ignore safe to ignore, since we control the `targets` object, and the `getStyleDictionaryConfig` invocations
-  const { source, transformGroup, platforms } = targets[target];
-
-  // we need to explicitly initialize the `config` object this way to make TS happy
-  const config: Config = {
-    // log: {
-    //   // options: warn | error | disabled
-    //   warnings: 'warn',
-    //   // options: default | silent | verbose
-    //   verbosity: 'verbose',
-    //   errors: {
-    //     // options: throw | console
-    //     brokenReferences: 'console',
-    //   },
-    // }
-  };
-  config.source = source;
-  config.platforms = {};
-
-  if (platforms.includes('web/css-variables')) {
-    config.platforms['web/css-variables'] = {
-      transformGroup,
-      "buildPath": `dist/${target}/css/`,
-      "prefix": "token",
-      "basePxFontSize": 16,
-      "files": [
-        {
-          "destination": "tokens.css",
-          "format": "css/variables",
-          "filter": function(token: DesignToken) {
-            return !token.private;
-          },
-        }
-      ],
-      'actions': ['generate-css-helpers'],
-    }
-  }
+StyleDictionary.registerAction({
+    name: 'generate-extra-theming-css-files',
+    do: generateExtraThemingCssFiles,
+    undo: () => {}
+});
 
-  if (platforms.includes("docs/json")) {
-    config.platforms["docs/json"] = {
-      transformGroup,
-      "buildPath": `dist/docs/${target}/`,
-      "prefix": "token",
-      "basePxFontSize": 16,
-      "files": [
-        {
-          "destination": "tokens.json",
-          "format": "docs/json",
-          "filter": function(token: DesignToken) {
-            return !token.private;
-          },
-        }
-      ]
-    }
-  }
+StyleDictionary.registerAction({
+    name: 'generate-extra-theming-docs-files',
+    do: generateExtraThemingDocsFiles,
+    undo: () => {}
+});
 
-  if (platforms.includes("json")) {
-    config.platforms["json"] = {
-      transformGroup,
-      "buildPath": `dist/${target}/`,
-      "prefix": "token",
-      "basePxFontSize": 16,
-      "files": [
-        {
-          "destination": "tokens.json",
-          "format": "json",
-          "filter": function(token: DesignToken) {
-            return !token.private;
-          },
-        }
-      ]
-    }
-  }
 
-  if (platforms.includes("email/sass-variables")) {
-    config.platforms["email/sass-variables"] = {
-      transformGroup,
-      "buildPath": `dist/${target}/`,
-      "prefix": "token",
-      "files": [
-        {
-          "destination": "tokens.scss",
-          "format": "scss/variables",
-          "filter": function(token: DesignToken) {
-            return !token.private;
-          },
-        }
-      ],
-      'actions': ['generate-css-helpers'],
-    }
-  }
+// •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
+// •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
 
-  return config;
-}
 
 // PROCESS THE DESIGN TOKENS
 
@@ -371,15 +319,20 @@ console.log('\n==============================================');
 console.log(`\nCleaning up dist folder`);
 fs.emptyDirSync(distFolder);
 
-for (const target of Object.keys(targets)) {
-  const StyleDictionaryInstance = new StyleDictionary(getStyleDictionaryConfig({ target }));
-
-  console.log(`\nProcessing target "${target}"...`);
+// generate themed tokens
+for (const mode of modes) {
+  const StyleDictionaryInstance = new StyleDictionary(getStyleDictionaryConfig({ target: 'products', mode }));
+  console.log(`\n---\n\nProcessing mode "${mode}"...`);
   await StyleDictionaryInstance.hasInitialized;
   await StyleDictionaryInstance.buildAllPlatforms()
   console.log('\nEnd processing');
 }
 
-
-console.log('\n==============================================');
-console.log('\nBuild completed!');
+// generate standard tokens
+for (const target of targets) {
+  const StyleDictionaryInstance = new StyleDictionary(getStyleDictionaryConfig({ target }));
+  console.log(`\n---\n\nProcessing target "${target}"...`);
+  await StyleDictionaryInstance.hasInitialized;
+  await StyleDictionaryInstance.buildAllPlatforms()
+  console.log('\nEnd processing');
+}
diff --git a/packages/tokens/src/global/color/palette-neutrals.json b/packages/tokens/src/global/color/palette-neutrals.json
index e064e7503d2..35275c43271 100644
--- a/packages/tokens/src/global/color/palette-neutrals.json
+++ b/packages/tokens/src/global/color/palette-neutrals.json
@@ -44,7 +44,14 @@
       "neutral-0": {
         "$type": "color",
         "$value": "#ffffff",
-        "group": "palette"
+        "group": "palette",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.color.white.0}",
+          "cds-g10": "{carbon.color.white.0}",
+          "cds-g90": "{carbon.color.white.0}",
+          "cds-g100": "{carbon.color.white.0}"
+        }
       },
       "alpha-300": {
         "$type": "color",
diff --git a/packages/tokens/src/global/color/semantic-foreground.json b/packages/tokens/src/global/color/semantic-foreground.json
index 43de0eb66fe..9c897e6b4c3 100644
--- a/packages/tokens/src/global/color/semantic-foreground.json
+++ b/packages/tokens/src/global/color/semantic-foreground.json
@@ -9,7 +9,14 @@
       "primary": {
         "$type": "color",
         "$value": "{color.palette.neutral-600}",
-        "group": "semantic"
+        "group": "semantic",
+        "$modes": {
+          "default": "#ffffff",
+          "cds-g0": "{carbon.themes.white.textPrimary}",
+          "cds-g10": "{carbon.themes.g10.textPrimary}",
+          "cds-g90": "{carbon.themes.g90.textPrimary}",
+          "cds-g100": "{carbon.themes.g100.textPrimary}"
+        }
       },
       "faint": {
         "$type": "color",
diff --git a/packages/tokens/src/products/shared/typography.json b/packages/tokens/src/products/shared/typography.json
index f850e45959d..80e45e332ec 100644
--- a/packages/tokens/src/products/shared/typography.json
+++ b/packages/tokens/src/products/shared/typography.json
@@ -9,6 +9,16 @@
               "-apple-system",
               "BlinkMacSystemFont"
             ],
+            "$modes": {
+              "default": [
+                "-apple-system",
+                "BlinkMacSystemFont"
+              ],
+              "cds-g0": "{carbon.typography.font-family.sans}",
+              "cds-g10": "{carbon.typography.font-family.sans}",
+              "cds-g90": "{carbon.typography.font-family.sans}",
+              "cds-g100": "{carbon.typography.font-family.sans}"
+            },
             "private": "true"
           },
           "windows": {
@@ -44,6 +54,16 @@
               "-apple-system",
               "BlinkMacSystemFont"
             ],
+            "$modes": {
+              "default": [
+                "-apple-system",
+                "BlinkMacSystemFont"
+              ],
+              "cds-g0": "{carbon.typography.font-family.sans}",
+              "cds-g10": "{carbon.typography.font-family.sans}",
+              "cds-g90": "{carbon.typography.font-family.sans}",
+              "cds-g100": "{carbon.typography.font-family.sans}"
+            },
             "private": "true"
           },
           "windows": {
@@ -72,6 +92,16 @@
               "ui-monospace",
               "Menlo"
             ],
+            "$modes": {
+              "default": [
+                "ui-monospace",
+                "Menlo"
+              ],
+              "cds-g0": "{carbon.typography.font-family.mono}",
+              "cds-g10": "{carbon.typography.font-family.mono}",
+              "cds-g90": "{carbon.typography.font-family.mono}",
+              "cds-g100": "{carbon.typography.font-family.mono}"
+            },
             "private": "true"
           },
           "windows": {
@@ -113,19 +143,47 @@
     "font-weight": {
       "regular": {
         "$type": "font-weight",
-        "$value": 400
+        "$value": "400",
+        "$modes": {
+          "default": "400",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        }
       },
       "medium": {
         "$type": "font-weight",
-        "$value": 500
+        "$value": "500",
+        "$modes": {
+          "default": "500",
+          "cds-g0": "{carbon.typography.font-weight.regular}",
+          "cds-g10": "{carbon.typography.font-weight.regular}",
+          "cds-g90": "{carbon.typography.font-weight.regular}",
+          "cds-g100": "{carbon.typography.font-weight.regular}"
+        }
       },
       "semibold": {
         "$type": "font-weight",
-        "$value": 600
+        "$value": "600",
+        "$modes": {
+          "default": "600",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        }
       },
       "bold": {
         "$type": "font-weight",
-        "$value": 700
+        "$value": "700",
+        "$modes": {
+          "default": "700",
+          "cds-g0": "{carbon.typography.font-weight.semibold}",
+          "cds-g10": "{carbon.typography.font-weight.semibold}",
+          "cds-g90": "{carbon.typography.font-weight.semibold}",
+          "cds-g100": "{carbon.typography.font-weight.semibold}"
+        }
       }
     },
     "display-500": {