@lightsparkdev/ui 0.0.13 → 1.0.0

package/dist/components/CodeInput/CodeInput.cjs

@@ -0,0 +1,4413 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/CodeInput/CodeInput.tsx
+var CodeInput_exports = {};
+__export(CodeInput_exports, {
+  CodeInput: () => CodeInput,
+  StyledCodeInput: () => StyledCodeInput
+});
+module.exports = __toCommonJS(CodeInput_exports);
+var import_styled3 = __toESM(require("@emotion/styled"), 1);
+var import_lodash_es2 = require("lodash-es");
+var import_nanoid = require("nanoid");
+var import_react8 = require("react");
+var import_react_device_detect = require("react-device-detect");
+
+// src/styles/fields.tsx
+var import_react5 = require("@emotion/react");
+var import_styled2 = __toESM(require("@emotion/styled"), 1);
+var import_react6 = require("react");
+
+// src/styles/common.tsx
+var import_react4 = require("@emotion/react");
+var import_styled = __toESM(require("@emotion/styled"), 1);
+
+// src/styles/breakpoints.tsx
+var import_react = require("@emotion/react");
+var import_lodash_es = require("lodash-es");
+var import_react2 = require("react");
+var import_jsx_runtime = require("@emotion/react/jsx-runtime");
+var Breakpoints = /* @__PURE__ */ ((Breakpoints2) => {
+  Breakpoints2["sm"] = "sm";
+  Breakpoints2["md"] = "md";
+  Breakpoints2["lg"] = "lg";
+  return Breakpoints2;
+})(Breakpoints || {});
+var breakpoints = {
+  ["sm" /* sm */]: 640,
+  ["md" /* md */]: 834,
+  ["lg" /* lg */]: 1200
+};
+var breakpointFn = (mq) => (style) => `@media ${mq} { ${style} }`;
+var bp = {
+  key: Breakpoints,
+  ["sm" /* sm */]: breakpointFn(`(max-width:${breakpoints.sm}px)`),
+  ["lg" /* lg */]: breakpointFn(`(min-width:${breakpoints.lg}px)`),
+  ["minSmMaxLg" /* minSmMaxLg */]: breakpointFn(
+    `(min-width:${breakpoints.sm + 1}px) and (max-width:${breakpoints.lg - 1}px)`
+  ),
+  ["minSmMaxMd" /* minSmMaxMd */]: breakpointFn(
+    `(min-width:${breakpoints.sm + 1}px) and (max-width:${breakpoints.md - 1}px)`
+  ),
+  ["minMdMaxLg" /* minMdMaxLg */]: breakpointFn(
+    `(min-width:${breakpoints.md}px) and (max-width:${breakpoints.lg - 1}px)`
+  ),
+  ["maxLg" /* maxLg */]: breakpointFn(`(max-width:${breakpoints.lg - 1}px)`),
+  ["maxMd" /* maxMd */]: breakpointFn(`(max-width:${breakpoints.md - 1}px)`),
+  ["minSm" /* minSm */]: breakpointFn(`(min-width:${breakpoints.sm + 1}px)`),
+  ["minMd" /* minMd */]: breakpointFn(`(min-width:${breakpoints.md + 1}px)`),
+  current: function(assertBp) {
+    const currentBp = (
+      /* window is undefined in first server side render for Next apps: */
+      typeof window === "undefined" ? "sm" /* sm */ : window.getComputedStyle(document.body, ":before").content.replace(/"/g, "")
+    );
+    if (assertBp) {
+      return inRange(
+        currentBp,
+        assertBp
+      );
+    }
+    return currentBp;
+  },
+  switch: (smVal, minSmMaxMdVal, minMdMaxLgVal, lgVal) => {
+    const currentBp = bp.current();
+    if (currentBp === "sm" /* sm */) {
+      return smVal;
+    } else if (currentBp === "minSmMaxMd" /* minSmMaxMd */) {
+      return minSmMaxMdVal;
+    } else if (currentBp === "minMdMaxLg" /* minMdMaxLg */) {
+      return minMdMaxLgVal;
+    }
+    return lgVal;
+  },
+  isSm: () => bp.current("sm" /* sm */),
+  isMinSm: () => bp.current("minSm" /* minSm */),
+  isMinSmMaxMd: () => bp.current("minSmMaxMd" /* minSmMaxMd */),
+  isMinMdMaxLg: () => bp.current("minMdMaxLg" /* minMdMaxLg */),
+  isLg: () => bp.current("lg" /* lg */)
+};
+function inRange(currentBp, assertBp) {
+  const isSm = currentBp === "sm" /* sm */;
+  const isMinSmMaxMd = currentBp === "minSmMaxMd" /* minSmMaxMd */;
+  const isMinMdMaxLg = currentBp === "minMdMaxLg" /* minMdMaxLg */;
+  const isLg = currentBp === "lg" /* lg */;
+  if (assertBp) {
+    switch (assertBp) {
+      case "sm" /* sm */:
+        return isSm;
+      case "minSmMaxMd" /* minSmMaxMd */:
+        return isMinSmMaxMd;
+      case "minMdMaxLg" /* minMdMaxLg */:
+        return isMinMdMaxLg;
+      case "lg" /* lg */:
+        return isLg;
+      case "minSmMaxLg" /* minSmMaxLg */:
+        return isMinSmMaxMd || isMinMdMaxLg;
+      case "maxLg" /* maxLg */:
+        return isSm || isMinSmMaxMd || isMinMdMaxLg;
+      case "maxMd" /* maxMd */:
+        return isSm || isMinSmMaxMd;
+      case "minSm" /* minSm */:
+        return isMinSmMaxMd || isMinMdMaxLg || isLg;
+      case "minMd" /* minMd */:
+        return isMinMdMaxLg || isLg;
+      default:
+        return false;
+    }
+  }
+  return false;
+}
+
+// src/styles/colors.tsx
+var neutral = {
+  black: "#000000",
+  gray5: "#0D0D0D",
+  gray10: "#1A1A1A",
+  gray15: "#262626",
+  gray20: "#333333",
+  gray25: "#404040",
+  gray30: "#4D4D4D",
+  gray40: "#666666",
+  gray50: "#808080",
+  gray57: "#8B8E98",
+  gray60: "#999999",
+  gray70: "#B3B3B3",
+  gray80: "#CCCCCC",
+  gray85: "#D9D9D9",
+  gray90: "#E6E6E6",
+  gray91: "#171717",
+  gray95: "#F2F2F2",
+  gray98: "#F9F9F9",
+  white: "#FFFFFF"
+};
+var darkGradient = "#1d1d1d linear-gradient(180deg, #090909 63.08%, #1d1d1d 100.52%)";
+var primary = "#FFF14E";
+var baseColors = __spreadProps(__spreadValues({}, neutral), {
+  // green
+  success: "#17C27C",
+  green33: "#179257",
+  // blue
+  blue43: "#145BC6",
+  blue22: "#0E2E60",
+  blue39: "#0068C9",
+  blue37: "#21529c",
+  blue58: "#28BFFF",
+  // less than 50% saturated blue
+  grayBlue9: "#16171A",
+  grayBlue32: "#4F5156",
+  grayBlue43: "#686A72",
+  grayBlue45: "#676F80",
+  grayBlue67: "#9BA7B9",
+  grayBlue80: "#C0C9D6",
+  grayBlue88: "#DEDFE4",
+  grayBlue94: "#EBEEF2",
+  grayBlue96: "#F2F5F7",
+  // purple
+  purple43: "#820AD1",
+  purple55: "#8B38DE",
+  // red
+  red42a10: "#D800271A",
+  // yellow
+  primary,
+  warning: primary,
+  // orange
+  danger: "#FD2C0F",
+  // neutral
+  secondary: neutral.black
+});
+var colors = baseColors;
+function isColorKey(key) {
+  return key in colors;
+}
+function hcNeutralFromBg(bgHex, defaultHex, altHex) {
+  const bgRGB = hexToRGB(bgHex);
+  const hcRGB = hexToRGB(defaultHex);
+  if (!bgRGB || !hcRGB)
+    return defaultHex;
+  const c = contrast(bgRGB, hcRGB);
+  if (c < 4.5) {
+    return altHex;
+  }
+  return defaultHex;
+}
+function luminance(r, g, b) {
+  const a = [r, g, b].map(function(v) {
+    v /= 255;
+    return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
+  });
+  return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
+}
+function contrast(rgb1, rgb2) {
+  const lum1 = luminance(rgb1[0], rgb1[1], rgb1[2]);
+  const lum2 = luminance(rgb2[0], rgb2[1], rgb2[2]);
+  const brightest = Math.max(lum1, lum2);
+  const darkest = Math.min(lum1, lum2);
+  return (brightest + 0.05) / (darkest + 0.05);
+}
+function hexToRGB(hex) {
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+  return result ? [
+    parseInt(result[1], 16),
+    parseInt(result[2], 16),
+    parseInt(result[3], 16)
+  ] : [0, 0, 0];
+}
+
+// src/styles/themes.tsx
+var import_react3 = require("@emotion/react");
+var import_deepmerge = __toESM(require("deepmerge"), 1);
+
+// src/styles/buttons.tsx
+var buttonsThemeBase = {
+  defaultSize: "Small",
+  defaultTypography: "Body Strong",
+  defaultBorderRadius: 32,
+  defaultBorderWidth: 1,
+  defaultBackgroundColor: "bg",
+  defaultBorderColor: "bg",
+  defaultHoverBackgroundColor: "bg",
+  defaultHoverBorderColor: "bg",
+  defaultOutlineOffset: 1,
+  defaultPaddingsY: {
+    ExtraSmall: 4,
+    Small: {
+      short: 8,
+      regular: 12
+    },
+    Schmedium: 12,
+    Medium: 12,
+    Mlarge: 12,
+    Large: 12
+  },
+  kinds: {}
+};
+var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
+  kinds: {
+    primary: {
+      defaultBorderWidth: 0,
+      defaultBackgroundColor: "c9Neutral",
+      defaultBorderColor: "c9Neutral",
+      defaultHoverBackgroundColor: "c8Neutral",
+      defaultHoverBorderColor: "c8Neutral"
+    },
+    ghost: {
+      defaultBackgroundColor: "transparent",
+      defaultBorderWidth: 0,
+      defaultHoverBackgroundColor: "transparent",
+      defaultHoverBorderColor: "transparent",
+      defaultPaddingsY: {
+        ExtraSmall: 0,
+        Small: 0,
+        Schmedium: 0,
+        Medium: 0,
+        Mlarge: 0,
+        Large: 0
+      }
+    },
+    secondary: {
+      defaultBackgroundColor: ["bg", "c1Neutral"],
+      defaultBorderColor: ["gray90", "gray20"],
+      defaultHoverBackgroundColor: ["bg", "c1Neutral"],
+      defaultHoverBorderColor: ["gray90", "gray20"]
+    },
+    blue39: {
+      defaultBorderColor: "blue39"
+    }
+  }
+});
+
+// src/styles/tokens/typography.ts
+var FONT_FAMILIES = {
+  main: "Montserrat",
+  code: "Monaco"
+};
+var LINE_HEIGHTS = {
+  ["Lightspark" /* Lightspark */]: {
+    "7xl": "72px",
+    "6xl": "60px",
+    "5xl": "44px",
+    "4xl": "40px",
+    "3xl": "36px",
+    "2xs": "14px",
+    "2xl": "32px",
+    lg: "24px",
+    md: "20px",
+    sm: "18px",
+    xl: "28px",
+    xs: "16px"
+  },
+  ["LightsparkDocs" /* LightsparkDocs */]: {
+    "7xl": "72px",
+    "6xl": "60px",
+    "5xl": "44px",
+    "4xl": "40px",
+    "3xl": "36px",
+    "2xs": "14px",
+    "2xl": "32px",
+    lg: "24px",
+    md: "20px",
+    sm: "18px",
+    xl: "28px",
+    xs: "16px"
+  },
+  ["UmameDocs" /* UmameDocs */]: {
+    "5xl": "72px",
+    "4xl": "60px",
+    "3xl": "44px",
+    "2xs": "16px",
+    "2xl": "40px",
+    lg: "32px",
+    md: "28px",
+    sm: "24px",
+    xl: "36px",
+    xs: "20px"
+  },
+  ["Bridge" /* Bridge */]: {
+    "8xl": "72px",
+    "7xl": "60px",
+    "6xl": "44px",
+    "5xl": "40px",
+    "4xl": "36px",
+    "3xl": "32px",
+    "2xl": "28px",
+    lg: "22px",
+    md: "20px",
+    sm: "18px",
+    xl: "24px",
+    xs: "16px"
+  }
+};
+var FONT_WEIGHTS = {
+  main: {
+    ExtraBold: 800,
+    Bold: 700,
+    SemiBold: 600,
+    Medium: 500
+  },
+  code: {
+    Bold: 700,
+    Regular: 400
+  }
+};
+var FONT_SIZE = {
+  ["Lightspark" /* Lightspark */]: {
+    "2xs": "10px",
+    xs: "12px",
+    sm: "14px",
+    md: "16px",
+    lg: "20px",
+    xl: "24px",
+    "2xl": "28px",
+    "3xl": "32px",
+    "4xl": "36px",
+    "5xl": "48px",
+    "6xl": "64px"
+  },
+  ["LightsparkDocs" /* LightsparkDocs */]: {
+    "2xs": "10px",
+    xs: "12px",
+    sm: "14px",
+    md: "16px",
+    lg: "20px",
+    xl: "24px",
+    "2xl": "28px",
+    "3xl": "32px",
+    "4xl": "36px",
+    "5xl": "48px",
+    "6xl": "64px"
+  },
+  ["UmameDocs" /* UmameDocs */]: {
+    "2xs": "11px",
+    xs: "12px",
+    sm: "14px",
+    md: "16px",
+    lg: "20px",
+    xl: "24px",
+    "2xl": "28px",
+    "3xl": "32px",
+    "4xl": "36px",
+    "5xl": "48px",
+    "6xl": "64px"
+  },
+  ["Bridge" /* Bridge */]: {
+    "2xs": "11px",
+    xs: "12px",
+    md: "14px",
+    lg: "16px",
+    xl: "20px",
+    "2xl": "24px",
+    "3xl": "28px",
+    "4xl": "32px",
+    "5xl": "36px",
+    "6xl": "48px",
+    "7xl": "64px"
+  }
+};
+var LETTER_SPACING = {
+  ["Lightspark" /* Lightspark */]: {
+    "tight-max": "-4%",
+    "tight-high": "-3%",
+    "tight-medium": "-2%",
+    "tight-low": "-0.5%",
+    normal: "0",
+    "loose-max": "1.44px"
+  },
+  ["LightsparkDocs" /* LightsparkDocs */]: {
+    "tight-max": "-4%",
+    "tight-high": "-3%",
+    "tight-medium": "-2%",
+    "tight-low": "-0.5%",
+    normal: "0",
+    "loose-max": "1.44px"
+  },
+  ["UmameDocs" /* UmameDocs */]: {
+    tight: "-.02em",
+    normal: "0",
+    loose: ".1em"
+  },
+  ["Bridge" /* Bridge */]: {
+    tight: "-2%",
+    normal: "0%"
+  }
+};
+var TEXT_CASE = {
+  none: "none",
+  uppercase: "uppercase"
+};
+var TEXT_DECORATION = {
+  none: "none"
+};
+var PARAGRAPH_INDENT = {
+  0: "0px"
+};
+var PARAGRAPH_SPACING = {
+  default: "default",
+  0: "0",
+  16: "16px",
+  40: "40px"
+};
+var TokenSize = {
+  Large: "Large",
+  Mlarge: "Mlarge",
+  Medium: "Medium",
+  Schmedium: "Schmedium",
+  Small: "Small",
+  ExtraSmall: "ExtraSmall"
+};
+var TypographyType = {
+  Display: "Display",
+  Headline: "Headline",
+  Title: "Title",
+  Body: "Body",
+  BodyStrong: "Body Strong",
+  Label: "Label",
+  LabelModerate: "Label Moderate",
+  LabelStrong: "Label Strong",
+  Overline: "Overline",
+  Code: "Code",
+  CodeStrong: "Code Strong"
+};
+function getTypographyTypes(fontFamilies) {
+  return {
+    ["Lightspark" /* Lightspark */]: {
+      Mobile: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["7xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["6xl"]}`,
+            letterSpacing: "-2.56px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["6xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["5xl"]}`,
+            letterSpacing: "-1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["4xl"]}`,
+            letterSpacing: "-1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.ExtraBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["3xl"]}`,
+            letterSpacing: "-.96px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.ExtraBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xl"]}`,
+            letterSpacing: "-.84px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.ExtraBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xl}`,
+            letterSpacing: "-.72px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.4px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.32x",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.28px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: fontFamilies.main,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].sm}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */]["tight-low"]}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.BodyStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: fontFamilies.main,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].sm}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */]["tight-low"]}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Overline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "1.68px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Code]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.CodeStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      },
+      Desktop: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["7xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["6xl"]}`,
+            letterSpacing: "-2.56px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["6xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["5xl"]}`,
+            letterSpacing: "-1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["4xl"]}`,
+            letterSpacing: "-1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.ExtraBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["3xl"]}`,
+            letterSpacing: "-.96px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.ExtraBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xl"]}`,
+            letterSpacing: "-.84px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.ExtraBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xl}`,
+            letterSpacing: "-.72px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.4px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.32x",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.28px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: fontFamilies.main,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].sm}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */]["tight-low"]}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.BodyStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: fontFamilies.main,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].sm}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */]["tight-low"]}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Overline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "1.68px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Code]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.CodeStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      }
+    },
+    ["LightsparkDocs" /* LightsparkDocs */]: {
+      Mobile: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["7xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["6xl"]}`,
+            letterSpacing: "-2.56px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["6xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["5xl"]}`,
+            letterSpacing: "-1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["4xl"]}`,
+            letterSpacing: "-1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["3xl"]}`,
+            letterSpacing: "-.96px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xl"]}`,
+            letterSpacing: "-.84px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xl}`,
+            letterSpacing: "-.72px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.60px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.4px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.32x",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.28px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: fontFamilies.main,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].sm}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */]["tight-low"]}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.BodyStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Overline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "1.68px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Code]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.CodeStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      },
+      Desktop: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["7xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["6xl"]}`,
+            letterSpacing: "-2.56px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["6xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["5xl"]}`,
+            letterSpacing: "-1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["4xl"]}`,
+            letterSpacing: "-1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["3xl"]}`,
+            letterSpacing: "-.96px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xl"]}`,
+            letterSpacing: "-.84px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xl}`,
+            letterSpacing: "-.72px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["xl"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.60px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.4px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.32x",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.28px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: fontFamilies.main,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].sm}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */]["tight-low"]}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.BodyStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: "-.08px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "-.07px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "-.06px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */]["2xs"]}`,
+            letterSpacing: "-.05px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Overline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: "1.92px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: "1.68px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: "1.44px",
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Code]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xl}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].lg}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.CodeStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].lg}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].md}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].md}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].sm}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Lightspark" /* Lightspark */].xs}`,
+            fontSize: `${FONT_SIZE["Lightspark" /* Lightspark */].xs}`,
+            letterSpacing: `${LETTER_SPACING["Lightspark" /* Lightspark */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      }
+    },
+    ["UmameDocs" /* UmameDocs */]: {
+      Mobile: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["6xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["5xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["4xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["3xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xl}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].lg}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xl}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].md}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].lg}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].md}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].lg}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.BodyStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Overline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].loose}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].loose}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].loose}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Code]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.CodeStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      },
+      Desktop: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["6xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["5xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["4xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["3xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xl}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xl"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].lg}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xl}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.ExtraSmall]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].md}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].lg}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[16]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].md}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].lg}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.BodyStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Overline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].loose}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].loose}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */]["2xs"]}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].loose}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.uppercase}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Code]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Regular}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].xs}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.CodeStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].md}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].sm}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.code}`,
+            fontWeight: `${FONT_WEIGHTS.code.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["UmameDocs" /* UmameDocs */].sm}`,
+            fontSize: `${FONT_SIZE["UmameDocs" /* UmameDocs */].xs}`,
+            letterSpacing: `${LETTER_SPACING["UmameDocs" /* UmameDocs */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING.default}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      }
+    },
+    ["Bridge" /* Bridge */]: {
+      Mobile: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["8xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["7xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["7xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["6xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["6xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["5xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["4xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["3xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["lg"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["lg"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["lg"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["sm"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      },
+      Desktop: {
+        [TypographyType.Display]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["8xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["7xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["7xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["6xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["6xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["5xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Headline]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["5xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["4xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["4xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["3xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["3xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].tight}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Title]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["2xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xl"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["lg"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Body]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xl"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["lg"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["lg"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["sm"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.Label]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelModerate]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.SemiBold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        },
+        [TypographyType.LabelStrong]: {
+          [TokenSize.Large]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["md"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["md"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Medium]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          },
+          [TokenSize.Small]: {
+            fontFamily: `${fontFamilies.main}`,
+            fontWeight: `${FONT_WEIGHTS.main.Bold}`,
+            lineHeight: `${LINE_HEIGHTS["Bridge" /* Bridge */]["xs"]}`,
+            fontSize: `${FONT_SIZE["Bridge" /* Bridge */]["2xs"]}`,
+            letterSpacing: `${LETTER_SPACING["Bridge" /* Bridge */].normal}`,
+            paragraphSpacing: `${PARAGRAPH_SPACING[0]}`,
+            paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+            textCase: `${TEXT_CASE.none}`,
+            textDecoration: `${TEXT_DECORATION.none}`
+          }
+        }
+      }
+    }
+  };
+}
+function getTypography(typographyGroup, customFontFamilies) {
+  const fontFamilies = customFontFamilies != null ? customFontFamilies : FONT_FAMILIES;
+  return {
+    group: typographyGroup,
+    fontFamilies,
+    lineHeights: LINE_HEIGHTS[typographyGroup],
+    fontWeights: FONT_WEIGHTS,
+    fontSize: FONT_SIZE[typographyGroup],
+    letterSpacing: LETTER_SPACING[typographyGroup],
+    textCase: TEXT_CASE,
+    textDecoration: TEXT_DECORATION,
+    paragraphIndent: PARAGRAPH_INDENT,
+    paragraphSpacing: PARAGRAPH_SPACING,
+    types: getTypographyTypes(fontFamilies)[typographyGroup]
+  };
+}
+function mayTokensToStyles(tokens) {
+  return Object.entries(tokens).map((entry) => {
+    switch (entry[0]) {
+      case "fontFamily":
+        return `font-family: ${entry[1]};`;
+      case "fontWeight":
+        return `font-weight: ${entry[1]};`;
+      case "lineHeight":
+        return `line-height: ${entry[1]};`;
+      case "fontSize":
+        return `font-size: ${entry[1]};`;
+      case "letterSpacing":
+        return `letter-spacing: ${entry[1]};`;
+      case "textDecoration":
+        return `text-decoration: ${entry[1]};`;
+      case "paragraphSpacing":
+        return "";
+      case "paragraphIndent":
+        return `text-indent: ${entry[1]};`;
+      case "textCase":
+        return `text-transform: ${entry[1]};`;
+      default:
+        return `${entry[0]}: ${entry[1]};`;
+    }
+  }).join("");
+}
+var defaultTokens = {
+  fontFamily: FONT_FAMILIES.main,
+  fontWeight: `${FONT_WEIGHTS.main.Medium}`,
+  lineHeight: LINE_HEIGHTS["Lightspark" /* Lightspark */].sm,
+  fontSize: FONT_SIZE["Lightspark" /* Lightspark */].sm,
+  letterSpacing: LETTER_SPACING["Lightspark" /* Lightspark */].normal,
+  paragraphSpacing: PARAGRAPH_SPACING.default,
+  paragraphIndent: `${PARAGRAPH_INDENT[0]}`,
+  textCase: TEXT_CASE.none,
+  textDecoration: TEXT_DECORATION.none
+};
+var getTypographyString = (theme, typographyType, size) => {
+  const mobileTokenGroups = theme.typography.types["Mobile"];
+  const desktopTokenGroups = theme.typography.types["Desktop"];
+  const mobileTokenSizes = mobileTokenGroups[typographyType];
+  const desktopTokenSizes = desktopTokenGroups[typographyType];
+  let mobileTokens = mobileTokenSizes == null ? void 0 : mobileTokenSizes[size];
+  let desktopTokens = desktopTokenSizes == null ? void 0 : desktopTokenSizes[size];
+  if (!mobileTokens || !desktopTokens) {
+    if (!mobileTokenSizes || !desktopTokenSizes) {
+      console.error(
+        `Attempted to use a typography type "${typographyType}" that does not exist in the current theme. Falling back to default tokens.`
+      );
+    } else {
+      console.error(
+        `Attempted to use a typography size "${size}" that does not exist for typography type "${typographyType}" in the current theme. Falling back to default tokens.`
+      );
+    }
+    mobileTokens = defaultTokens;
+    desktopTokens = defaultTokens;
+  }
+  const typographyStr = `
+    ${mayTokensToStyles(desktopTokens)}
+    ${bp.sm(mayTokensToStyles(mobileTokens))}
+  `;
+  return typographyStr;
+};
+
+// src/styles/themes.tsx
+var baseThemeColors = {
+  bg: colors.white,
+  smBg: colors.white,
+  c05Neutral: colors.gray95,
+  c1Neutral: colors.gray90,
+  c15Neutral: colors.gray85,
+  c2Neutral: colors.gray80,
+  c3Neutral: colors.gray70,
+  c4Neutral: colors.gray60,
+  c5Neutral: colors.gray50,
+  c6Neutral: colors.gray40,
+  c7Neutral: colors.gray30,
+  c8Neutral: colors.gray20,
+  c9Neutral: colors.gray10,
+  danger: colors.danger,
+  hcNeutral: colors.black,
+  info: colors.blue43,
+  lcNeutral: colors.gray80,
+  link: colors.blue43,
+  mcNeutral: colors.gray40,
+  onInfoText: colors.white,
+  onPrimaryText: colors.black,
+  onSuccessText: colors.white,
+  primary: colors.primary,
+  secondary: colors.secondary,
+  success: colors.success,
+  text: colors.black,
+  vlcNeutral: colors.gray95,
+  warning: colors.warning
+};
+var themeOrColorKeyValues = [
+  ...Object.keys(baseThemeColors),
+  ...Object.keys(colors)
+];
+var baseTheme = __spreadProps(__spreadValues({}, baseThemeColors), {
+  // base type should be Themes but default to Light
+  type: "light" /* Light */,
+  typography: getTypography("Lightspark" /* Lightspark */),
+  hcNeutralFromBg: (bgHex) => hcNeutralFromBg(bgHex, colors.black, colors.white),
+  buttons: defaultButtonsTheme,
+  loading: "LoadingSpinner"
+});
+var lightBaseTheme = baseTheme;
+var darkBaseTheme = {
+  type: "dark" /* Dark */,
+  bg: colors.black,
+  smBg: colors.black,
+  c05Neutral: colors.gray5,
+  c1Neutral: colors.gray10,
+  c15Neutral: colors.gray15,
+  c2Neutral: colors.gray20,
+  c3Neutral: colors.gray30,
+  c4Neutral: colors.gray40,
+  c5Neutral: colors.gray50,
+  c6Neutral: colors.gray60,
+  c7Neutral: colors.gray70,
+  c8Neutral: colors.gray80,
+  c9Neutral: colors.gray90,
+  danger: colors.danger,
+  hcNeutral: colors.white,
+  hcNeutralFromBg: (bgHex) => hcNeutralFromBg(bgHex, colors.white, colors.black),
+  info: colors.white,
+  lcNeutral: colors.gray40,
+  link: colors.blue43,
+  mcNeutral: colors.gray60,
+  onInfoText: colors.white,
+  onPrimaryText: colors.black,
+  onSuccessText: colors.white,
+  primary: colors.primary,
+  secondary: colors.secondary,
+  success: colors.success,
+  text: colors.white,
+  typography: getTypography("Lightspark" /* Lightspark */),
+  vlcNeutral: colors.gray20,
+  warning: colors.warning,
+  buttons: defaultButtonsTheme,
+  loading: "LoadingSpinner"
+};
+var lightTheme = extend(lightBaseTheme, {
+  header: extendBase(lightBaseTheme, {
+    text: colors.gray60
+  }),
+  nav: extendBase(lightBaseTheme, {
+    text: colors.gray10,
+    secondary: colors.gray40
+  }),
+  content: extendBase(lightBaseTheme, {
+    bg: colors.white,
+    smBg: colors.white
+  }),
+  controls: extendBase(lightBaseTheme, {
+    bg: colors.gray95,
+    smBg: colors.gray95,
+    text: colors.gray60,
+    secondary: colors.secondary
+  })
+});
+var darkTheme = extend(darkBaseTheme, {
+  header: extendBase(darkBaseTheme, {}),
+  nav: extendBase(darkBaseTheme, {}),
+  content: extendBase(darkBaseTheme, {}),
+  controls: extendBase(darkBaseTheme, {
+    bg: colors.gray40,
+    smBg: colors.gray40,
+    text: colors.white,
+    secondary: colors.secondary
+  })
+});
+var umameDocsLightTheme = extend(lightTheme, {
+  type: "umameDocsLight" /* UmameDocsLight */,
+  bg: colors.gray98,
+  smBg: colors.gray98,
+  secondary: colors.grayBlue43,
+  text: colors.grayBlue9,
+  link: colors.blue39,
+  typography: getTypography("UmameDocs" /* UmameDocs */, {
+    main: "Manrope",
+    code: "Monaco"
+  }),
+  content: extendBase(lightBaseTheme, {
+    bg: colors.gray98,
+    smBg: colors.gray98,
+    text: colors.grayBlue9,
+    secondary: colors.grayBlue43
+  }),
+  controls: extendBase(lightBaseTheme, {
+    text: colors.grayBlue9,
+    secondary: colors.grayBlue43,
+    bg: colors.grayBlue94
+  })
+});
+var umameDocsDarkTheme = extend(darkTheme, {
+  type: "umameDocsDark" /* UmameDocsDark */,
+  bg: colors.gray98,
+  smBg: colors.gray98,
+  secondary: colors.grayBlue43,
+  text: colors.grayBlue9,
+  link: colors.blue39,
+  typography: getTypography("UmameDocs" /* UmameDocs */, {
+    main: "Manrope",
+    code: "Monaco"
+  })
+});
+var lightsparkDocsLightTheme = extend(lightTheme, {
+  type: "lightsparkDocsLight" /* LightsparkDocsLight */,
+  typography: getTypography("LightsparkDocs" /* LightsparkDocs */)
+});
+var lightsparkDocsDarkTheme = extend(darkTheme, {
+  type: "lightsparkDocsDark" /* LightsparkDocsDark */,
+  typography: getTypography("LightsparkDocs" /* LightsparkDocs */)
+});
+var bridgeBaseSettings = {
+  secondary: colors.grayBlue43,
+  mcNeutral: colors.grayBlue43,
+  typography: getTypography("Bridge" /* Bridge */, {
+    main: "Manrope",
+    code: "Monaco"
+  }),
+  buttons: (0, import_deepmerge.default)(buttonsThemeBase, {
+    defaultTypography: "Title",
+    defaultSize: "Medium",
+    defaultBorderRadius: 8,
+    defaultBorderWidth: 0,
+    kinds: {
+      primary: {
+        defaultBackgroundColor: "blue39",
+        defaultHoverBackgroundColor: "blue37"
+      },
+      ghost: {
+        defaultBackgroundColor: "transparent",
+        defaultBorderWidth: 0,
+        defaultHoverBackgroundColor: "transparent",
+        defaultHoverBorderColor: "transparent",
+        defaultPaddingsY: {
+          ExtraSmall: 0,
+          Small: 0,
+          Schmedium: 0,
+          Medium: 0,
+          Mlarge: 0,
+          Large: 0
+        }
+      },
+      secondary: {
+        defaultBackgroundColor: "transparent",
+        defaultHoverBackgroundColor: "grayBlue94",
+        defaultBorderColor: "grayBlue80",
+        defaultBorderWidth: 1
+      }
+    }
+  })
+};
+var bridgeLightTheme = extend(lightTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
+  type: "bridgeLight" /* BridgeLight */,
+  loading: "UmaBridgeLoading",
+  bg: colors.gray98,
+  smBg: colors.gray98,
+  text: colors.grayBlue9,
+  secondary: colors.grayBlue43
+}));
+var bridgeDarkTheme = extend(darkTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
+  type: "bridgeDark" /* BridgeDark */
+}));
+function extend(obj, rest) {
+  return __spreadValues(__spreadValues({}, obj), rest);
+}
+function extendBase(obj, rest) {
+  return __spreadValues(__spreadValues({}, obj), rest);
+}
+function isThemeColorKey(key) {
+  return Boolean(key && typeof key === "string" && key in baseThemeColors);
+}
+function getColor(theme, key) {
+  if (key && isThemeColorKey(key)) {
+    return theme[key];
+  } else if (key && Array.isArray(key)) {
+    const [surface, colorKey] = key;
+    const surfaceTheme = theme[surface];
+    const color = surfaceTheme[colorKey];
+    return color;
+  } else if (key && isColorKey(key)) {
+    return colors[key];
+  }
+  return theme.text;
+}
+function getFontColor(theme, key, defaultColor = "inherit") {
+  if (key === "inherit" || !key && defaultColor === "inherit") {
+    return "inherit";
+  }
+  return getColor(theme, key);
+}
+var isLight = (theme) => [
+  "light" /* Light */,
+  "bridgeLight" /* BridgeLight */,
+  "lightsparkDocsLight" /* LightsparkDocsLight */,
+  "umameDocsLight" /* UmameDocsLight */
+].includes(theme.type);
+var themeOr = (lightValue, darkValue) => ({ theme }) => {
+  return isLight(theme) ? lightValue : darkValue;
+};
+
+// src/styles/common.tsx
+var rootFontSizePx = 12;
+var rootFontSizeRems = rootFontSizePx / 16;
+function buildStandardContentInset(smPx, minSmMaxLgPx, lgPx) {
+  const smCSS = import_react4.css`
+    ${bp.sm(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${smPx * 2}px);
+    `)}
+  `;
+  const minSmMaxLgCSS = import_react4.css`
+    ${bp.minSmMaxLg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${minSmMaxLgPx * 2}px);
+    `)}
+  `;
+  const lgCSS = import_react4.css`
+    ${bp.lg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${lgPx * 2}px);
+      max-width: 1280px;
+    `)}
+  `;
+  return {
+    smPx,
+    minSmMaxLgPx,
+    lgPx,
+    smCSS,
+    minSmMaxLgCSS,
+    lgCSS,
+    css: import_react4.css`
+      ${lgCSS}
+      ${smCSS}
+      ${minSmMaxLgCSS}
+    `
+  };
+}
+var standardContentInset = buildStandardContentInset(16, 24, 32);
+var standardCardShadow = import_react4.css`
+  box-shadow:
+    0px 4px 10px 0px rgba(0, 0, 0, 0.08),
+    0px 8px 24px 0px rgba(0, 0, 0, 0.04);
+`;
+var standardCardShadowHard = import_react4.css`
+  box-shadow:
+    0px 24px 24px -12px rgba(0, 0, 0, 0.06),
+    0px 12px 12px -6px rgba(0, 0, 0, 0.06),
+    0px 6px 6px -3px rgba(0, 0, 0, 0.06),
+    0px 3px 3px -1.5px rgba(0, 0, 0, 0.06),
+    0px 1px 1px -0.5px rgba(0, 0, 0, 0.06),
+    0px 0px 0px 1px rgba(0, 0, 0, 0.06);
+`;
+var pageBorderRadiusPx = 16;
+var pageBorderRadius = `
+  border-radius: ${pageBorderRadiusPx}px;
+`;
+var subtext = ({ theme }) => import_react4.css`
+  color: ${theme.c6Neutral};
+  font-weight: 600;
+`;
+var Subtext = import_styled.default.div`
+  ${subtext}
+`;
+var darkGradientBg = import_react4.css`
+  background: ${darkGradient};
+`;
+
+// src/styles/typography.tsx
+var applyTypography = (theme, typographyType, size, color = "inherit", applyToAll = true) => {
+  const selector = applyToAll ? "&, & *" : "&";
+  return `
+    ${selector} {
+      ${getTypographyString(theme, typographyType, size)};
+      color: ${getFontColor(theme, color)};
+    }
+  `;
+};
+
+// src/styles/z-index.tsx
+var z = {
+  card: 1,
+  fieldError: 1,
+  textInput: 2,
+  select: 3,
+  selectFocused: 4,
+  walletActionPreviewTopGradient: 1,
+  headerContainer: 99,
+  smBanner: 99,
+  headerTop: 100,
+  navMenu: 100,
+  smNavMenu: 100,
+  navAction: 101,
+  smNavAction: 100,
+  // keep under navDropdown
+  notificationBanner: 170,
+  qrReaderVideo: 180,
+  qrReaderOverlay: 181,
+  modalOverlay: 190,
+  modalContainer: 191,
+  dropdown: 192,
+  tooltip: 193,
+  toast: 200
+};
+
+// src/styles/fields.tsx
+var import_jsx_runtime2 = require("@emotion/react/jsx-runtime");
+var maxFieldWidth = "100%";
+var fieldWidth = "100%";
+var formButtonTopMargin = "32px";
+var formButtonTopMarginStyle = import_react5.css`
+  margin-top: ${formButtonTopMargin};
+`;
+var textInputPlaceholderColor = ({ theme }) => theme.c4Neutral;
+var textInputFontWeight = 600;
+var textInputBorderRadiusPx = 8;
+var textInputPaddingPx = 12;
+var textInputPadding = `${textInputPaddingPx}px`;
+var textInputBorderColor = ({ theme }) => themeOr(theme.c1Neutral, theme.c3Neutral)({ theme });
+var textInputBorderColorFocused = ({ theme }) => themeOr(theme.hcNeutral, theme.hcNeutral)({ theme });
+var textInputActiveStyles = ({
+  theme,
+  paddingLeftPx,
+  paddingRightPx
+}) => import_react5.css`
+  border-color: ${textInputBorderColorFocused({ theme })};
+  border-width: 2px;
+  padding: ${textInputPaddingPx - 1}px;
+  ${paddingLeftPx ? `padding-left: ${paddingLeftPx - 1}px;` : ""}
+  ${paddingRightPx ? `padding-right: ${paddingRightPx - 1}px;` : ""}
+`;
+var defaultTextInputTypography = {
+  type: "Body",
+  size: "Small",
+  color: "text"
+};
+var textInputStyle = ({
+  theme,
+  active,
+  disabled,
+  hasError,
+  paddingLeftPx,
+  paddingRightPx,
+  typography
+}) => {
+  var _a;
+  return import_react5.css`
+  border-radius: ${textInputBorderRadiusPx}px;
+  background-color: ${disabled ? theme.vlcNeutral : theme.bg};
+  cursor: ${disabled ? "not-allowed" : "auto"};
+  box-sizing: border-box;
+  font-weight: ${textInputFontWeight};
+
+  position: relative;
+  z-index: ${z.textInput};
+  font-family: ${(_a = theme.typography) == null ? void 0 : _a.fontFamilies.main};
+  padding: ${textInputPaddingPx - (hasError ? 1 : 0)}px;
+  ${paddingLeftPx ? `padding-left: ${paddingLeftPx - (hasError ? 1 : 0)}px;` : ""}
+  ${paddingRightPx ? `padding-right: ${paddingRightPx - (hasError ? 1 : 0)}px;` : ""}
+  border-style: solid;
+  border-width: ${hasError ? "2" : "1"}px;
+  border-color: ${hasError ? theme.danger : textInputBorderColor({ theme })};
+  line-height: 22px;
+  outline: none;
+
+  ${applyTypography(
+    theme,
+    (typography == null ? void 0 : typography.type) || defaultTextInputTypography.type,
+    (typography == null ? void 0 : typography.size) || defaultTextInputTypography.size,
+    (typography == null ? void 0 : typography.color) || defaultTextInputTypography.color
+  )}
+
+  width: ${fieldWidth};
+  max-width: ${maxFieldWidth};
+  text-overflow: ellipsis;
+  &:focus,
+  &:active,
+  &:has(:focus) {
+    ${textInputActiveStyles({ theme, paddingLeftPx, paddingRightPx })}
+  }
+
+  ${active && textInputActiveStyles({ theme, paddingLeftPx, paddingRightPx })}
+
+  &::placeholder {
+    color: ${textInputPlaceholderColor({ theme })};
+  }
+
+  &:focus::placeholder {
+    color: ${textInputPlaceholderColor({ theme })};
+  }
+`;
+};
+var FieldError = import_styled2.default.div`
+  background-color: rgba(242, 239, 255, 1);
+  padding: 16px 16px 8px;
+  margin-top: -8px;
+  border-radius: 0 0 8px 8px;
+  position: relative;
+  z-index: ${z.fieldError};
+`;
+var inputSubtextSeconds = 0.25;
+var StyledInputSubtext = import_styled2.default.div`
+  margin-top: ${({ visible }) => visible ? "8px" : "0px"};
+  margin-left: ${({ visible }) => visible ? "8px" : "0px"};
+  font-size: 12px;
+  font-size: ${({ visible }) => visible ? "12px" : "0px"};
+  opacity: ${({ visible }) => visible ? "1" : "0"};
+  overflow: hidden;
+  transition:
+    font-size ${inputSubtextSeconds}s cubic-bezier(0.25, 0.87, 0.56, 1.23),
+    opacity ${inputSubtextSeconds * 0.8}s cubic-bezier(0.25, 0.87, 0.56, 1.23),
+    margin ${inputSubtextSeconds}s cubic-bezier(0.25, 0.87, 0.56, 1.23);
+  color: ${({ hasError, theme }) => hasError ? theme.danger : theme.text};
+  cursor: ${({ cursorPointer }) => cursorPointer ? "pointer" : "auto"};
+`;
+var labelStyle = ({
+  theme,
+  hasError
+}) => import_react5.css`
+  color: ${hasError ? theme.danger : theme.text};
+  font-size: 14px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  & + * {
+    margin-top: 12px;
+  }
+  * ~ & {
+    margin-top: 40px;
+  }
+`;
+var Label = import_styled2.default.label`
+  ${subtext}
+  ${labelStyle}
+`;
+var LabelDiv = import_styled2.default.div`
+  ${subtext}
+  ${labelStyle}
+`;
+
+// src/components/CodeInput/SingleCodeInput.tsx
+var import_react7 = require("@emotion/react");
+var import_jsx_runtime3 = require("@emotion/react/jsx-runtime");
+var defaultWidth = "42px";
+var vPadding = 15;
+function SingleCodeInput({
+  id,
+  maxLength,
+  onChange = () => {
+  },
+  value,
+  inputRef = null,
+  onKeyUp = () => {
+  },
+  onKeyDown = () => {
+  },
+  onPaste = () => {
+  },
+  type,
+  max,
+  cssProp,
+  ariaLabel,
+  disabled,
+  onBlur,
+  width = defaultWidth
+}) {
+  const theme = (0, import_react7.useTheme)();
+  const defaultCSS = (0, import_react7.css)(
+    `
+      ${textInputStyle({
+      theme,
+      disabled: Boolean(disabled),
+      hasError: false
+    }).styles}
+      width: ${width};
+      max-width: ${defaultWidth};
+      padding: ${vPadding}px 0px;
+      text-align: center;
+      &:not(:last-of-type):not(:focus-visible) {
+        border-right: none;
+      }
+      &:not(:first-of-type):not(:last-of-type) {
+        border-radius: 0;
+      }
+      &:first-of-type {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+      &:last-of-type {
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+      }
+      &:focus,
+      &:active {
+        padding: ${vPadding - 1}px 0px !important;
+      }
+
+      &::-webkit-outer-spin-button,
+      &::-webkit-inner-spin-button {
+        display: none;
+        margin: 0;
+      }
+      -moz-appearance:textfield; /* Firefox */
+    `,
+    cssProp
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "input",
+    {
+      id,
+      maxLength,
+      onChange: (event) => onChange(event, id),
+      value,
+      ref: inputRef,
+      type,
+      "aria-label": ariaLabel,
+      onKeyUp: (event) => onKeyUp(event, id),
+      onKeyDown: (event) => onKeyDown(event, id),
+      onPaste: (event) => onPaste(event),
+      max,
+      css: defaultCSS,
+      onBlur,
+      inputMode: "numeric",
+      pattern: "[0-9]*"
+    }
+  );
+}
+
+// src/components/CodeInput/CodeInput.tsx
+var import_jsx_runtime4 = require("@emotion/react/jsx-runtime");
+function codeFromInputState(inputState) {
+  return Object.values(inputState).map((input) => input.value).join("");
+}
+function getRef(key, refsObj) {
+  if (key && refsObj && typeof refsObj === "object" && refsObj.current) {
+    const ref = refsObj.current[key];
+    if (ref && typeof ref === "object" && ref.current && ref.current instanceof HTMLInputElement) {
+      return ref.current;
+    }
+  }
+  return null;
+}
+function CodeInput({
+  codeLength = 8,
+  onChange,
+  onSubmit,
+  inputCSS,
+  autoFocus = true,
+  onBlur
+}) {
+  const componentId = (0, import_react8.useRef)((0, import_nanoid.nanoid)(5));
+  const inputRefs = (0, import_react8.useRef)({});
+  const autofillValuesRef = (0, import_react8.useRef)("");
+  const getInputId = (0, import_react8.useCallback)((index) => {
+    const idPrefix = `two-factor-input-${componentId.current}-`;
+    return `${idPrefix}-${index}`;
+  }, []);
+  function getInputIndex(id) {
+    return Number.parseInt(id.charAt(id.length - 1), 10);
+  }
+  const firstFieldRefCb = (0, import_react8.useCallback)(
+    (ref) => {
+      if (ref) {
+        inputRefs.current[ref.id] = (0, import_react8.createRef)();
+        inputRefs.current[ref.id].current = ref;
+        if (ref.id === getInputId(0) && autoFocus) {
+          ref.focus();
+        }
+      }
+    },
+    [getInputId, autoFocus]
+  );
+  const [inputState, setInputState] = (0, import_react8.useState)(
+    Array(codeLength).fill(0).reduce((acc, item, i) => {
+      return __spreadProps(__spreadValues({}, acc), {
+        [getInputId(i)]: {
+          value: ""
+        }
+      });
+    }, {})
+  );
+  const onKeyDown = (0, import_react8.useCallback)(
+    (event, inputId) => {
+      const handleKeys = /* @__PURE__ */ new Set([
+        "0",
+        "1",
+        "2",
+        "3",
+        "4",
+        "5",
+        "6",
+        "7",
+        "8",
+        "9",
+        "Enter",
+        "Escape",
+        "Backspace",
+        "Delete",
+        "ArrowLeft",
+        "ArrowRight"
+      ]);
+      if (["e", "E", "+", "-", "."].includes(event.key)) {
+        event.preventDefault();
+        return;
+      }
+      if (!handleKeys.has(event.key)) {
+        return;
+      }
+      let replaceEntireState = false;
+      const currentInputIndex = getInputIndex(inputId);
+      const isFirstInput = currentInputIndex === 0;
+      const isLastInput = currentInputIndex === codeLength - 1;
+      const nextInputIndex = isLastInput ? void 0 : currentInputIndex + 1;
+      const prevInputIndex = isFirstInput ? void 0 : currentInputIndex - 1;
+      const nextInputId = (0, import_lodash_es2.isNumber)(nextInputIndex) ? getInputId(nextInputIndex) : void 0;
+      const prevInputId = (0, import_lodash_es2.isNumber)(prevInputIndex) ? getInputId(prevInputIndex) : void 0;
+      const nextInput = nextInputId ? inputState[nextInputId] : void 0;
+      const prevInput = prevInputId ? inputState[prevInputId] : void 0;
+      const currentInputRef = getRef(inputId, inputRefs);
+      const nextInputRef = getRef(nextInputId, inputRefs);
+      const prevInputRef = getRef(prevInputId, inputRefs);
+      const firstInputRef = getRef(getInputId(0), inputRefs);
+      const lastInputRef = getRef(getInputId(codeLength - 1), inputRefs);
+      if (event.key === "ArrowLeft") {
+        if (firstInputRef && (event.metaKey || event.ctrlKey || event.altKey)) {
+          firstInputRef.focus();
+          return;
+        }
+        if (prevInput && prevInputRef) {
+          prevInputRef.focus();
+          prevInputRef.select();
+        }
+        return;
+      }
+      if (event.key === "ArrowRight") {
+        if (lastInputRef && (event.metaKey || event.ctrlKey || event.altKey)) {
+          lastInputRef.focus();
+          return;
+        }
+        if (nextInput && nextInputRef) {
+          nextInputRef.focus();
+          nextInputRef.select();
+        }
+        return;
+      }
+      if (event.key === "Enter" && onSubmit) {
+        const code2 = codeFromInputState(inputState);
+        onSubmit(code2);
+        return;
+      }
+      if (event.key === "Escape" && currentInputRef) {
+        currentInputRef.blur();
+        return;
+      }
+      if (event.key === "Backspace" && (event.metaKey || event.ctrlKey || event.altKey)) {
+        replaceEntireState = __spreadValues({}, inputState);
+        Object.keys(replaceEntireState).forEach((inputId2) => {
+          const newState2 = replaceEntireState;
+          newState2[inputId2] = __spreadProps(__spreadValues({}, newState2[inputId2]), {
+            value: ""
+          });
+        });
+      }
+      let value = event.key;
+      if (event.key === "Backspace" && !event.metaKey && !event.ctrlKey && !event.altKey) {
+        value = "";
+        if (!isFirstInput && prevInput && prevInputRef) {
+          prevInputRef.focus();
+        }
+      } else if (event.key === "Delete") {
+        value = "";
+        if (!isLastInput && nextInput && nextInputRef) {
+          nextInputRef.focus();
+        }
+      } else if (replaceEntireState) {
+        const lastInputWithValue = Object.entries(replaceEntireState).reverse().find(([, { value: value2 }]) => value2 !== "");
+        if (lastInputWithValue) {
+          const inputId2 = lastInputWithValue[0];
+          const inputRef = getRef(inputId2, inputRefs);
+          inputRef == null ? void 0 : inputRef.focus();
+          inputRef == null ? void 0 : inputRef.select();
+        } else if (firstInputRef) {
+          firstInputRef.focus();
+        }
+      } else if (isLastInput) {
+      } else if (nextInput && nextInputRef) {
+        nextInputRef.focus();
+        nextInputRef.select();
+      }
+      const newState = replaceEntireState ? replaceEntireState : __spreadProps(__spreadValues({}, inputState), {
+        [inputId]: { value }
+      });
+      const code = codeFromInputState(newState);
+      if (onChange) {
+        onChange(code);
+      }
+      setInputState(newState);
+    },
+    [onChange, setInputState, onSubmit, getInputId, inputState, codeLength]
+  );
+  const onPasteCb = (0, import_react8.useCallback)(
+    (event) => {
+      event.preventDefault();
+      const rawText = event.clipboardData.getData("text");
+      const text = rawText == null ? void 0 : rawText.replace(/[\s.]/g, "");
+      if (!text || Number.isNaN(Number.parseInt(text))) {
+        return;
+      }
+      const inputValues = text.split("");
+      const newState = __spreadValues({}, inputState);
+      inputValues.forEach((value, i) => {
+        const inputId = getInputId(i);
+        newState[inputId] = __spreadProps(__spreadValues({}, newState[inputId]), {
+          value
+        });
+      });
+      const firstInputRef = getRef(getInputId(0), inputRefs);
+      const lastInputWithValue = Object.entries(newState).reverse().find(([, { value }]) => value !== "");
+      if (lastInputWithValue) {
+        const inputId = lastInputWithValue[0];
+        const inputRef = getRef(inputId, inputRefs);
+        inputRef == null ? void 0 : inputRef.focus();
+        inputRef == null ? void 0 : inputRef.select();
+      } else if (firstInputRef) {
+        firstInputRef.focus();
+      }
+      const code = codeFromInputState(newState);
+      if (onChange) {
+        onChange(code);
+      }
+      setInputState(newState);
+    },
+    [getInputId, inputState, onChange, setInputState]
+  );
+  const onBlurCb = (0, import_react8.useCallback)(() => {
+    setTimeout(() => {
+      let hasCodeFocused = false;
+      if (inputRefs.current) {
+        Object.values(inputRefs.current).forEach((ref) => {
+          if (ref && ref.current && ref.current === document.activeElement) {
+            hasCodeFocused = true;
+          }
+        });
+        if (!hasCodeFocused && onBlur) {
+          onBlur();
+        }
+      }
+    }, 0);
+  }, [onBlur]);
+  const inputsPerGroup = Math.ceil(codeLength / 2);
+  const inputs = [];
+  for (let i = 0; i < codeLength; i += 1) {
+    const inputId = getInputId(i);
+    inputs.push(
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        SingleCodeInput,
+        {
+          value: inputState[inputId].value,
+          id: inputId,
+          inputRef: firstFieldRefCb,
+          onPaste: onPasteCb,
+          onKeyDown: (event) => onKeyDown(event, inputId),
+          onChange: (event) => {
+            if (import_react_device_detect.isMobileSafari && event.nativeEvent instanceof CustomEvent) {
+              autofillValuesRef.current += event.target.value;
+              if (autofillValuesRef.current.length === codeLength) {
+                const newState = Array(codeLength).fill(0).reduce((acc, item, i2) => {
+                  return __spreadProps(__spreadValues({}, acc), {
+                    [getInputId(i2)]: {
+                      value: autofillValuesRef.current[i2]
+                    }
+                  });
+                }, {});
+                setInputState(newState);
+                if (onSubmit) {
+                  onSubmit(autofillValuesRef.current);
+                }
+                autofillValuesRef.current = "";
+              }
+            } else if (import_react_device_detect.isMobile && import_react_device_detect.isChrome && event.target.value.length === codeLength) {
+              const newState = Array(codeLength).fill(0).reduce((acc, item, i2) => {
+                return __spreadProps(__spreadValues({}, acc), {
+                  [getInputId(i2)]: {
+                    value: event.target.value[i2]
+                  }
+                });
+              }, {});
+              setInputState(newState);
+              if (onSubmit) {
+                onSubmit(event.target.value);
+              }
+            }
+          },
+          type: "number",
+          ariaLabel: `Code input ${i + 1} of ${codeLength}`,
+          cssProp: inputCSS,
+          onBlur: onBlurCb,
+          width: `${(100 / inputsPerGroup).toFixed(2)}%`,
+          max: 9
+        },
+        inputId
+      )
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(StyledCodeInput, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CodeInputGroup, { children: inputs.slice(0, inputsPerGroup) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CodeInputGroupSeparator, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CodeInputGroup, { children: inputs.slice(inputsPerGroup, inputs.length) })
+  ] });
+}
+var StyledCodeInput = import_styled3.default.div`
+  display: inline-flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+`;
+var separatorWidth = 12;
+var separatorMargin = 8;
+var CodeInputGroup = import_styled3.default.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  width: calc(50% - ${(separatorWidth + separatorMargin * 2) / 2}px);
+`;
+var CodeInputGroupSeparator = import_styled3.default.div`
+  width: ${separatorWidth}px;
+  height: 4px;
+  background-color: ${textInputBorderColor};
+  border-radius: 2px;
+  margin: 0 ${separatorMargin}px;
+`;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CodeInput,
+  StyledCodeInput
+});