@sage/design-tokens 14.0.1 → 14.1.0

package/js/umd/frozenproduct/large/light/mode.js

@@ -4953,21 +4953,78 @@
               path: ["modes", "color", "status", "ai", "default-vertical"],
             },
           },
-          generic: {
-            default: {
+          callout: {
+            defaultAlt: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "mix",
+                    value: "0.85",
+                    space: "lch",
+                    color: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
               $type: "color",
-              $value: "#007c7b",
-              $description: "used in progress bar ",
+              $value: "#e5fae2",
+              $description: "used for marketing banners",
               filePath: "data/tokens/modes/light.json",
               isSource: true,
               original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.85",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastLess}",
+                    },
+                  },
+                },
                 $type: "color",
-                $value: "{primitives.colors.teal}",
-                $description: "used in progress bar ",
+                $value: "{primitives.colors.brilliantGreen}",
+                $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.05",
+                    space: "lch",
+                    color: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#d8ecd5",
+              $description: "used for marketing banners",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $extensions: {
+                  "studio.tokens": {
+                    modify: {
+                      type: "mix",
+                      value: "0.05",
+                      space: "lch",
+                      color: "{modes.color.modifier.contrastMore}",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "{modes.color.status.callout.defaultAlt}",
+                $description: "used for marketing banners",
+              },
+              name: "modesColorStatusCalloutHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "callout", "hoverAlt"],
             },
           },
           caution: {
@@ -5425,145 +5482,1855 @@
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.generic.content.nought}",
-                $description: "for pill hover X",
+                $value: "{modes.color.generic.content.nought}",
+                $description: "for pill hover X",
+              },
+              name: "modesColorStatusContentWithHover",
+              attributes: {},
+              path: ["modes", "color", "status", "content", "withHover"],
+            },
+            withHoverAlt: {
+              $type: "color",
+              $value: "#000000",
+              $description: "for message text",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{modes.color.generic.content.extreme}",
+                $description: "for message text",
+              },
+              name: "modesColorStatusContentWithHoverAlt",
+              attributes: {},
+              path: ["modes", "color", "status", "content", "withHoverAlt"],
+            },
+            loading: {
+              $type: "color",
+              $value: "linear-gradient(135deg, #6F6F6F5c 0%, #6F6F6F0A 100%)",
+              $description: "used on skeleton text",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "linear-gradient(135deg, #6F6F6F5c 0%, #6F6F6F0A 100%)",
+                $description: "used on skeleton text",
+              },
+              name: "modesColorStatusContentLoading",
+              attributes: {},
+              path: ["modes", "color", "status", "content", "loading"],
+            },
+            inverse: {
+              withDefault: {
+                $type: "color",
+                $value: "#000000",
+                filePath: "data/tokens/modes/light.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: "#fffffff2",
+                filePath: "data/tokens/modes/light.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: "#000000",
+                $description: "for pill hover X",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{modes.color.generic.content.extreme}",
+                  $description: "for pill hover X",
+                },
+                name: "modesColorStatusContentInverseWithHover",
+                attributes: {},
+                path: [
+                  "modes",
+                  "color",
+                  "status",
+                  "content",
+                  "inverse",
+                  "withHover",
+                ],
+              },
+              withHoverAlt: {
+                $type: "color",
+                $value: "#FFFFFF",
+                $description: "for message text",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{modes.color.generic.content.nought}",
+                  $description: "for message text",
+                },
+                name: "modesColorStatusContentInverseWithHoverAlt",
+                attributes: {},
+                path: [
+                  "modes",
+                  "color",
+                  "status",
+                  "content",
+                  "inverse",
+                  "withHoverAlt",
+                ],
+              },
+            },
+          },
+          custom: {
+            blue: {
+              default: {
+                $type: "color",
+                $value: "#0071C3",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.blue.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#ebf0f9",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#135fa3",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#ced9ed",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#007C7B",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.teal.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#e9f1f1",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#0e6968",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#c4dde0",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#00811F",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.green.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#e9f2e8",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#0e6d1d",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#c4decf",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#637700",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.lime.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#eff1e6",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#546408",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#cdddc9",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#C54300",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.orange.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#feece5",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#a53a06",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#f2d0ce",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#DC004E",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.red.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#ffebec",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#b81242",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#f1cfd9",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#C8269A",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.pink.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#fcecf5",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#a82581",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#ead2e5",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#8F4CD7",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.purple.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#f5edfc",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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: "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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#7941b4",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#ded4ee",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#6F6F6F",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.gray.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#f0f0f0",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#5e5e5e",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#d3d9e5",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#527386",
+                $description: "For pills. Not accessible with white TEXT.",
+                filePath: "data/tokens/modes/light.json",
+                isSource: true,
+                original: {
+                  $type: "color",
+                  $value: "{primitives.colors.supplementary.slate.400}",
+                  $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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#edf0f2",
+                $description: "Pill bg",
+                filePath: "data/tokens/modes/light.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.400}",
+                  $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: "#000000",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#466171",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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: "#0060A7",
+                      format: "hex",
+                    },
+                  },
+                },
+                $type: "color",
+                $value: "#cbdae6",
+                $description: "used on pill hover states",
+                filePath: "data/tokens/modes/light.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",
+              $description:
+                "TO BE DETLETED: Was #007c7b and used in Progress bar, dataVis colour.",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "#F0F",
+                $description:
+                  "TO BE DETLETED: Was {primitives.colors.teal} and used in Progress bar, dataVis colour.",
+              },
+              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/light.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: "#FFFFFF",
+                    format: "hex",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "#f5edfc",
+              $description: "Subtle message bg",
+              filePath: "data/tokens/modes/light.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: "#000000",
+                    format: "hex",
+                  },
+                },
+              },
               $type: "color",
-              $value: "#000000",
-              $description: "for message text",
+              $value: "#7941b4",
+              $description: "used on pill hover states",
               filePath: "data/tokens/modes/light.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}",
-                $description: "for message text",
+                $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: "#0060A7",
+                    format: "hex",
+                  },
+                },
+              },
               $type: "color",
-              $value: "linear-gradient(135deg, #6F6F6F5c 0%, #6F6F6F0A 100%)",
-              $description: "used on skeleton text",
+              $value: "#ded4ee",
+              $description: "used on pill hover states and message bg",
               filePath: "data/tokens/modes/light.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, #6F6F6F5c 0%, #6F6F6F0A 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: "#000000",
+                $value: "#985FDC",
                 filePath: "data/tokens/modes/light.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: "#000000 ",
                       format: "hex",
                     },
                   },
                 },
                 $type: "color",
-                $value: "#fffffff2",
+                $value: "#1b1422",
+                $description: "Subtle message bg",
                 filePath: "data/tokens/modes/light.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: "#FFFFFF",
+                      format: "hex",
+                    },
+                  },
+                },
                 $type: "color",
-                $value: "#000000",
-                $description: "for pill hover X",
+                $value: "#a977e2",
+                $description: "used on pill hover states",
                 filePath: "data/tokens/modes/light.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}",
-                  $description: "for pill hover X",
+                  $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: "#007ED9",
+                      format: "hex",
+                    },
+                  },
+                },
                 $type: "color",
-                $value: "#FFFFFF",
-                $description: "for message text",
+                $value: "#282039",
+                $description: "used on pill hover states and message bg",
                 filePath: "data/tokens/modes/light.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}",
-                  $description: "for message text",
+                  $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",
                 ],
               },
             },
@@ -5686,25 +7453,6 @@
               },
             },
           },
-          important: {
-            default: {
-              $type: "color",
-              $value: "#8F4CD7",
-              $description:
-                "For tile status keylines to show if something is of high importance.",
-              filePath: "data/tokens/modes/light.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"],
-            },
-          },
           info: {
             default: {
               $type: "color",
@@ -7055,80 +8803,6 @@
               },
             },
           },
-          callout: {
-            defaultAlt: {
-              $extensions: {
-                "studio.tokens": {
-                  modify: {
-                    type: "mix",
-                    value: "0.85",
-                    space: "lch",
-                    color: "#FFFFFF",
-                    format: "hex",
-                  },
-                },
-              },
-              $type: "color",
-              $value: "#e5fae2",
-              $description: "used for marketing banners",
-              filePath: "data/tokens/modes/light.json",
-              isSource: true,
-              original: {
-                $extensions: {
-                  "studio.tokens": {
-                    modify: {
-                      type: "mix",
-                      value: "0.85",
-                      space: "lch",
-                      color: "{modes.color.modifier.contrastLess}",
-                    },
-                  },
-                },
-                $type: "color",
-                $value: "{primitives.colors.brilliantGreen}",
-                $description: "used for marketing banners",
-              },
-              name: "modesColorStatusCalloutDefaultAlt",
-              attributes: {},
-              path: ["modes", "color", "status", "callout", "defaultAlt"],
-            },
-            hoverAlt: {
-              $extensions: {
-                "studio.tokens": {
-                  modify: {
-                    type: "mix",
-                    value: "0.05",
-                    space: "lch",
-                    color: "#000000",
-                    format: "hex",
-                  },
-                },
-              },
-              $type: "color",
-              $value: "#d8ecd5",
-              $description: "used for marketing banners",
-              filePath: "data/tokens/modes/light.json",
-              isSource: true,
-              original: {
-                $extensions: {
-                  "studio.tokens": {
-                    modify: {
-                      type: "mix",
-                      value: "0.05",
-                      space: "lch",
-                      color: "{modes.color.modifier.contrastMore}",
-                    },
-                  },
-                },
-                $type: "color",
-                $value: "{modes.color.status.callout.defaultAlt}",
-                $description: "used for marketing banners",
-              },
-              name: "modesColorStatusCalloutHoverAlt",
-              attributes: {},
-              path: ["modes", "color", "status", "callout", "hoverAlt"],
-            },
-          },
           reviews: {
             default: {
               $type: "color",