@sage/design-tokens 14.0.1 → 14.2.0

package/js/common/marketing/small/dark/mode.js

@@ -4792,19 +4792,78 @@ module.exports = {
             path: ["modes", "color", "status", "ai", "default-vertical"],
           },
         },
-        generic: {
-          default: {
+        callout: {
+          defaultAlt: {
+            $extensions: {
+              "studio.tokens": {
+                modify: {
+                  type: "mix",
+                  value: "0.15",
+                  space: "lch",
+                  color: "#00D639",
+                  format: "hex",
+                },
+              },
+            },
             $type: "color",
-            $value: "#008a89",
+            $value: "#122211",
+            $description: "used for marketing banners",
             filePath: "data/tokens/modes/dark.json",
             isSource: true,
             original: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "{primitives.colors.brilliantGreen}",
+                  },
+                },
+              },
               $type: "color",
-              $value: "{primitives.colors.petrol}",
+              $value: "{modes.color.modifier.contrastLess}",
+              $description: "used for marketing banners",
             },
-            name: "modesColorStatusGenericDefault",
+            name: "modesColorStatusCalloutDefaultAlt",
             attributes: {},
-            path: ["modes", "color", "status", "generic", "default"],
+            path: ["modes", "color", "status", "callout", "defaultAlt"],
+          },
+          hoverAlt: {
+            $extensions: {
+              "studio.tokens": {
+                modify: {
+                  type: "mix",
+                  value: "0.10 ",
+                  space: "lch",
+                  color: "#FFFFFF ",
+                  format: "hex",
+                },
+              },
+            },
+            $type: "color",
+            $value: "#263525",
+            $description: "marketing banner hover",
+            filePath: "data/tokens/modes/dark.json",
+            isSource: true,
+            original: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "{primitives.color.modifiers.button.hoverAlt} ",
+                    space: "lch",
+                    color: "{modes.color.modifier.contrastMore} ",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "{modes.color.status.callout.defaultAlt}",
+              $description: "marketing banner hover",
+            },
+            name: "modesColorStatusCalloutHoverAlt",
+            attributes: {},
+            path: ["modes", "color", "status", "callout", "hoverAlt"],
           },
         },
         caution: {
@@ -5226,138 +5285,1760 @@ module.exports = {
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.generic.content.nought}",
+              $value: "{modes.color.generic.content.nought}",
+            },
+            name: "modesColorStatusContentWithHover",
+            attributes: {},
+            path: ["modes", "color", "status", "content", "withHover"],
+          },
+          withHoverAlt: {
+            $type: "color",
+            $value: "#FFFFFF",
+            filePath: "data/tokens/modes/dark.json",
+            isSource: true,
+            original: {
+              $type: "color",
+              $value: "{modes.color.generic.content.extreme}",
+            },
+            name: "modesColorStatusContentWithHoverAlt",
+            attributes: {},
+            path: ["modes", "color", "status", "content", "withHoverAlt"],
+          },
+          loading: {
+            $type: "color",
+            $value: "linear-gradient(135deg, #FFFFFF5C 0%, #FFFFFF0A 100%)",
+            $description: "used on skeleton text",
+            filePath: "data/tokens/modes/dark.json",
+            isSource: true,
+            original: {
+              $type: "color",
+              $value: "linear-gradient(135deg, #FFFFFF5C 0%, #FFFFFF0A 100%)",
+              $description: "used on skeleton text",
+            },
+            name: "modesColorStatusContentLoading",
+            attributes: {},
+            path: ["modes", "color", "status", "content", "loading"],
+          },
+          inverse: {
+            withDefault: {
+              $type: "color",
+              $value: "#FFFFFF",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{modes.color.generic.content.extreme}",
+              },
+              name: "modesColorStatusContentInverseWithDefault",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "content",
+                "inverse",
+                "withDefault",
+              ],
+            },
+            withDefaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "alpha",
+                    value: "0.95",
+                    space: "lch",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#000000f2",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "alpha",
+                      value: "0.95",
+                      space: "lch",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.generic.content.nought}",
+              },
+              name: "modesColorStatusContentInverseWithDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "content",
+                "inverse",
+                "withDefaultAlt",
+              ],
+            },
+            withHover: {
+              $type: "color",
+              $value: "#FFFFFF",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{modes.color.generic.content.extreme}",
+              },
+              name: "modesColorStatusContentInverseWithHover",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "content",
+                "inverse",
+                "withHover",
+              ],
+            },
+            withHoverAlt: {
+              $type: "color",
+              $value: "#000000",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{modes.color.generic.content.nought}",
+              },
+              name: "modesColorStatusContentInverseWithHoverAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "content",
+                "inverse",
+                "withHoverAlt",
+              ],
+            },
+          },
+        },
+        custom: {
+          blue: {
+            default: {
+              $type: "color",
+              $value: "#007FD9",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.blue.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomBlueDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "blue", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#0d1219",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.blue.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomBlueDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "blue",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#4f91df",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.blue.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomBlueHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "blue", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#142131",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.blue.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomBlueHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "blue", "hoverAlt"],
+            },
+          },
+          teal: {
+            default: {
+              $type: "color",
+              $value: "#008A89",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.teal.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomTealDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "teal", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#0a1313",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.teal.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomTealDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "teal",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#449b9a",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.teal.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomTealHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "teal", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#082427",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.teal.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomTealHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "teal", "hoverAlt"],
+            },
+          },
+          green: {
+            default: {
+              $type: "color",
+              $value: "#009023",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.green.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomGreenDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "green", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#0a1408",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.green.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomGreenDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "green",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#44a146",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.green.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomGreenHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "green", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#0b2418",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.green.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomGreenHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "green", "hoverAlt"],
+            },
+          },
+          lime: {
+            default: {
+              $type: "color",
+              $value: "#6E8500",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.lime.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomLimeDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "lime", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#111205",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.lime.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomLimeDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "lime",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#859635",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.lime.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomLimeHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "lime", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#162311",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.lime.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomLimeHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "lime", "hoverAlt"],
+            },
+          },
+          orange: {
+            default: {
+              $type: "color",
+              $value: "#DB4B00",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.orange.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomOrangeDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "orange", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#1c0e04",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.orange.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomOrangeDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "orange",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#e66930",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.orange.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomOrangeHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "orange", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#331816",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.orange.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomOrangeHoverAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "orange",
+                "hoverAlt",
+              ],
+            },
+          },
+          red: {
+            default: {
+              $type: "color",
+              $value: "#F50058",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.red.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomRedDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "red", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#1e0d0d",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.red.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomRedDefaultAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "red", "defaultAlt"],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#fc4e6e",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.red.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomRedHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "red", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#331720",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.red.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomRedHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "red", "hoverAlt"],
+            },
+          },
+          pink: {
+            default: {
+              $type: "color",
+              $value: "#DD2BAB",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.pink.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomPinkDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "pink", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#1b0d16",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.pink.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomPinkDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "pink",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#e558b7",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.pink.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomPinkHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "pink", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#2d192b",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.pink.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomPinkHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "pink", "hoverAlt"],
+            },
+          },
+          purple: {
+            default: {
+              $type: "color",
+              $value: "#985FDC",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.purple.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomPurpleDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "purple", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#150f19",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.purple.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomPurpleDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "purple",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#a977e2",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.purple.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomPurpleHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "purple", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#231c30",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.purple.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomPurpleHoverAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "purple",
+                "hoverAlt",
+              ],
+            },
+          },
+          gray: {
+            default: {
+              $type: "color",
+              $value: "#7C7C7C",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.gray.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomGrayDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "gray", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#111",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.gray.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomGrayDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "gray",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#8e8e8e",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.gray.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomGrayHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "gray", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#1a202b",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.gray.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomGrayHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "gray", "hoverAlt"],
+            },
+          },
+          slate: {
+            default: {
+              $type: "color",
+              $value: "#5C8196",
+              $description: "For pills. Not accessible with white TEXT.",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.slate.500}",
+                $description: "For pills. Not accessible with white TEXT.",
+              },
+              name: "modesColorStatusCustomSlateDefault",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "slate", "default"],
+            },
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#0f1214",
+              $description: "Pill bg",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.9",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{primitives.colors.supplementary.slate.500}",
+                $description: "Pill bg",
+              },
+              name: "modesColorStatusCustomSlateDefaultAlt",
+              attributes: {},
+              path: [
+                "modes",
+                "color",
+                "status",
+                "custom",
+                "slate",
+                "defaultAlt",
+              ],
+            },
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#7493a5",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.slate.default}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomSlateHover",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "slate", "hover"],
+            },
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#007ED9",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#13222c",
+              $description: "used on pill hover states",
+              filePath: "data/tokens/modes/dark.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.default}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.custom.slate.defaultAlt}",
+                $description: "used on pill hover states",
+              },
+              name: "modesColorStatusCustomSlateHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "custom", "slate", "hoverAlt"],
+            },
+          },
+        },
+        generic: {
+          default: {
+            $type: "color",
+            $value: "#F0F",
+            filePath: "data/tokens/modes/dark.json",
+            isSource: true,
+            original: {
+              $type: "color",
+              $value: "#F0F",
+            },
+            name: "modesColorStatusGenericDefault",
+            attributes: {},
+            path: ["modes", "color", "status", "generic", "default"],
+          },
+        },
+        important: {
+          default: {
+            $type: "color",
+            $value: "#8F4CD7",
+            $description:
+              "For tile status keylines to show if something is of high importance.",
+            filePath: "data/tokens/modes/dark.json",
+            isSource: true,
+            original: {
+              $type: "color",
+              $value: "{primitives.colors.supplementary.purple.400}",
+              $description:
+                "For tile status keylines to show if something is of high importance.",
+            },
+            name: "modesColorStatusImportantDefault",
+            attributes: {},
+            path: ["modes", "color", "status", "important", "default"],
+          },
+          defaultAlt: {
+            $extensions: {
+              "studio.tokens": {
+                modify: {
+                  type: "mix",
+                  value: "0.9",
+                  space: "lch",
+                  color: "#000000",
+                  format: "hex",
+                },
+              },
+            },
+            $type: "color",
+            $value: "#150d19",
+            $description: "Subtle message bg",
+            filePath: "data/tokens/modes/dark.json",
+            isSource: true,
+            original: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.9",
+                    space: "lch",
+                    color: "{modes.color.modifier.contrastLess}",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "{primitives.colors.supplementary.purple.400}",
+              $description: "Subtle message bg",
             },
-            name: "modesColorStatusContentWithHover",
+            name: "modesColorStatusImportantDefaultAlt",
             attributes: {},
-            path: ["modes", "color", "status", "content", "withHover"],
+            path: ["modes", "color", "status", "important", "defaultAlt"],
           },
-          withHoverAlt: {
+          hover: {
+            $extensions: {
+              "studio.tokens": {
+                modify: {
+                  type: "mix",
+                  value: "0.15",
+                  space: "lch",
+                  color: "#FFFFFF",
+                  format: "hex",
+                },
+              },
+            },
             $type: "color",
-            $value: "#FFFFFF",
+            $value: "#a267de",
+            $description: "used on pill hover states",
             filePath: "data/tokens/modes/dark.json",
             isSource: true,
             original: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "{primitives.color.modifiers.button.hover}",
+                    space: "lch",
+                    color: "{modes.color.modifier.contrastMore}",
+                  },
+                },
+              },
               $type: "color",
-              $value: "{modes.color.generic.content.extreme}",
+              $value: "{modes.color.status.important.default}",
+              $description: "used on pill hover states",
             },
-            name: "modesColorStatusContentWithHoverAlt",
+            name: "modesColorStatusImportantHover",
             attributes: {},
-            path: ["modes", "color", "status", "content", "withHoverAlt"],
+            path: ["modes", "color", "status", "important", "hover"],
           },
-          loading: {
+          hoverAlt: {
+            $extensions: {
+              "studio.tokens": {
+                modify: {
+                  type: "mix",
+                  value: "0.15",
+                  space: "lch",
+                  color: "#007ED9",
+                  format: "hex",
+                },
+              },
+            },
             $type: "color",
-            $value: "linear-gradient(135deg, #FFFFFF5C 0%, #FFFFFF0A 100%)",
-            $description: "used on skeleton text",
+            $value: "#231b30",
+            $description: "used on pill hover states and message bg",
             filePath: "data/tokens/modes/dark.json",
             isSource: true,
             original: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "{primitives.color.modifiers.button.hover}",
+                    space: "lch",
+                    color: "{modes.color.status.info.default}",
+                  },
+                },
+              },
               $type: "color",
-              $value: "linear-gradient(135deg, #FFFFFF5C 0%, #FFFFFF0A 100%)",
-              $description: "used on skeleton text",
+              $value: "{modes.color.status.important.defaultAlt}",
+              $description: "used on pill hover states and message bg",
             },
-            name: "modesColorStatusContentLoading",
+            name: "modesColorStatusImportantHoverAlt",
             attributes: {},
-            path: ["modes", "color", "status", "content", "loading"],
+            path: ["modes", "color", "status", "important", "hoverAlt"],
           },
           inverse: {
-            withDefault: {
+            default: {
               $type: "color",
-              $value: "#FFFFFF",
+              $value: "#985FDC",
               filePath: "data/tokens/modes/dark.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.generic.content.extreme}",
+                $value: "{primitives.colors.supplementary.purple.500}",
               },
-              name: "modesColorStatusContentInverseWithDefault",
+              name: "modesColorStatusImportantInverseDefault",
               attributes: {},
               path: [
                 "modes",
                 "color",
                 "status",
-                "content",
+                "important",
                 "inverse",
-                "withDefault",
+                "default",
               ],
             },
-            withDefaultAlt: {
+            defaultAlt: {
               $extensions: {
                 "studio.tokens": {
                   modify: {
-                    type: "alpha",
-                    value: "0.95",
+                    type: "mix",
+                    value: "0.85",
                     space: "lch",
+                    color: "#FFFFFF ",
                     format: "hex",
                   },
                 },
               },
               $type: "color",
-              $value: "#000000f2",
+              $value: "#f1e6fa",
+              $description: "Subtle message bg",
               filePath: "data/tokens/modes/dark.json",
               isSource: true,
               original: {
                 $extensions: {
                   "studio.tokens": {
                     modify: {
-                      type: "alpha",
-                      value: "0.95",
+                      type: "mix",
+                      value: "0.85",
                       space: "lch",
+                      color: "{modes.color.modifier.contrastMore} ",
                     },
                   },
                 },
                 $type: "color",
-                $value: "{modes.color.generic.content.nought}",
+                $value: "{primitives.colors.supplementary.purple.500}",
+                $description: "Subtle message bg",
               },
-              name: "modesColorStatusContentInverseWithDefaultAlt",
+              name: "modesColorStatusImportantInverseDefaultAlt",
               attributes: {},
               path: [
                 "modes",
                 "color",
                 "status",
-                "content",
+                "important",
                 "inverse",
-                "withDefaultAlt",
+                "defaultAlt",
               ],
             },
-            withHover: {
+            hover: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
               $type: "color",
-              $value: "#FFFFFF",
+              $value: "#8051b8",
+              $description: "used on pill hover states",
               filePath: "data/tokens/modes/dark.json",
               isSource: true,
               original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
                 $type: "color",
-                $value: "{modes.color.generic.content.extreme}",
+                $value: "{modes.color.status.important.inverse.default}",
+                $description: "used on pill hover states",
               },
-              name: "modesColorStatusContentInverseWithHover",
+              name: "modesColorStatusImportantInverseHover",
               attributes: {},
               path: [
                 "modes",
                 "color",
                 "status",
-                "content",
+                "important",
                 "inverse",
-                "withHover",
+                "hover",
               ],
             },
-            withHoverAlt: {
+            hoverAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.15",
+                    space: "lch",
+                    color: "#0060A7",
+                    format: "hex",
+                  },
+                },
+              },
               $type: "color",
-              $value: "#000000",
+              $value: "#daceed",
+              $description: "used on pill hover states and message bg",
               filePath: "data/tokens/modes/dark.json",
               isSource: true,
               original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "{primitives.color.modifiers.button.hover}",
+                      space: "lch",
+                      color: "{modes.color.status.info.inverse.default}",
+                    },
+                  },
+                },
                 $type: "color",
-                $value: "{modes.color.generic.content.nought}",
+                $value: "{modes.color.status.important.inverse.defaultAlt}",
+                $description: "used on pill hover states and message bg",
               },
-              name: "modesColorStatusContentInverseWithHoverAlt",
+              name: "modesColorStatusImportantInverseHoverAlt",
               attributes: {},
               path: [
                 "modes",
                 "color",
                 "status",
-                "content",
+                "important",
                 "inverse",
-                "withHoverAlt",
+                "hoverAlt",
               ],
             },
           },
@@ -5480,25 +7161,6 @@ module.exports = {
             },
           },
         },
-        important: {
-          default: {
-            $type: "color",
-            $value: "#985FDC",
-            $description:
-              "For tile status keylines to show if something is of high importance.",
-            filePath: "data/tokens/modes/dark.json",
-            isSource: true,
-            original: {
-              $type: "color",
-              $value: "{primitives.colors.supplementary.purple.500}",
-              $description:
-                "For tile status keylines to show if something is of high importance.",
-            },
-            name: "modesColorStatusImportantDefault",
-            attributes: {},
-            path: ["modes", "color", "status", "important", "default"],
-          },
-        },
         info: {
           default: {
             $type: "color",
@@ -6793,80 +8455,6 @@ module.exports = {
             },
           },
         },
-        callout: {
-          defaultAlt: {
-            $extensions: {
-              "studio.tokens": {
-                modify: {
-                  type: "mix",
-                  value: "0.15",
-                  space: "lch",
-                  color: "#00D639",
-                  format: "hex",
-                },
-              },
-            },
-            $type: "color",
-            $value: "#122211",
-            $description: "used for marketing banners",
-            filePath: "data/tokens/modes/dark.json",
-            isSource: true,
-            original: {
-              $extensions: {
-                "studio.tokens": {
-                  modify: {
-                    type: "mix",
-                    value: "0.15",
-                    space: "lch",
-                    color: "{primitives.colors.brilliantGreen}",
-                  },
-                },
-              },
-              $type: "color",
-              $value: "{modes.color.modifier.contrastLess}",
-              $description: "used for marketing banners",
-            },
-            name: "modesColorStatusCalloutDefaultAlt",
-            attributes: {},
-            path: ["modes", "color", "status", "callout", "defaultAlt"],
-          },
-          hoverAlt: {
-            $extensions: {
-              "studio.tokens": {
-                modify: {
-                  type: "mix",
-                  value: "0.10 ",
-                  space: "lch",
-                  color: "#FFFFFF ",
-                  format: "hex",
-                },
-              },
-            },
-            $type: "color",
-            $value: "#263525",
-            $description: "marketing banner hover",
-            filePath: "data/tokens/modes/dark.json",
-            isSource: true,
-            original: {
-              $extensions: {
-                "studio.tokens": {
-                  modify: {
-                    type: "mix",
-                    value: "{primitives.color.modifiers.button.hoverAlt} ",
-                    space: "lch",
-                    color: "{modes.color.modifier.contrastMore} ",
-                  },
-                },
-              },
-              $type: "color",
-              $value: "{modes.color.status.callout.defaultAlt}",
-              $description: "marketing banner hover",
-            },
-            name: "modesColorStatusCalloutHoverAlt",
-            attributes: {},
-            path: ["modes", "color", "status", "callout", "hoverAlt"],
-          },
-        },
         reviews: {
           default: {
             $type: "color",