@neuravision/construct 2.0.2 → 2.1.1

package/tokens/tokens.json

@@ -1,4 +1,17 @@
 {
+  "metadata": {
+    "formatVersion": 1,
+    "layers": [
+      "primitives",
+      "semantic",
+      "components"
+    ],
+    "themes": [
+      "light",
+      "dark",
+      "high-contrast"
+    ]
+  },
   "primitives": {
     "color": {
       "stone": {
@@ -126,6 +139,7 @@
         "extrabold": "800"
       },
       "size": {
+        "2xs": "10px",
         "xs": "12px",
         "sm": "14px",
         "md": "16px",
@@ -138,6 +152,7 @@
         "6xl": "48px"
       },
       "lineHeight": {
+        "2xs": "14px",
         "xs": "16px",
         "sm": "20px",
         "md": "24px",
@@ -272,8 +287,8 @@
         "primaryHover": "#353128",
         "primaryActive": "#211E18",
         "accent": "#F4581C",
-        "accentHover": "#DD4A0F",
-        "accentActive": "#B23C0C",
+        "accentHover": "#FB6E2E",
+        "accentActive": "#FF9462",
         "onAccent": "#16130F"
       },
       "text": {
@@ -287,17 +302,19 @@
         "canvas": "#FAFAF8",
         "surface": "#F1F0EB",
         "elevated": "#FFFFFF",
-        "muted": "#E4E2DB"
+        "muted": "#E4E2DB",
+        "subtle": "#F1F0EB"
       },
       "border": {
         "subtle": "#E4E2DB",
-        "default": "#D3D0C7",
-        "strong": "#8E887A"
+        "default": "#8E887A",
+        "strong": "#8E887A",
+        "muted": "#E4E2DB"
       },
       "state": {
         "info": "#1F5BA6",
-        "success": "#2EA070",
-        "warning": "#C8930A",
+        "success": "#1B6145",
+        "warning": "#694B00",
         "danger": "#BE1F3D",
         "onSolid": "#FFFFFF"
       },
@@ -441,6 +458,60 @@
       "modal": "0 16px 36px rgba(28, 20, 10, 0.13)"
     }
   },
+  "components": {
+    "button": {
+      "background": "#16130F",
+      "backgroundHover": "#353128",
+      "backgroundActive": "#211E18",
+      "border": "#16130F",
+      "color": "#FFFFFF",
+      "height": "40px",
+      "paddingX": "16px",
+      "fontSize": "14px",
+      "lineHeight": "20px",
+      "fontWeight": "600",
+      "radius": "8px",
+      "gap": "6px",
+      "loadingSpinnerSize": "20px"
+    },
+    "control": {
+      "background": "#FFFFFF",
+      "backgroundHover": "#F1F0EB",
+      "backgroundDisabled": "#E4E2DB",
+      "border": "#8E887A",
+      "borderHover": "#8E887A",
+      "borderFocus": "#DD4A0F",
+      "text": "#16130F",
+      "placeholder": "#66604E",
+      "radius": "8px"
+    },
+    "card": {
+      "background": "#FFFFFF",
+      "border": "#E4E2DB",
+      "radius": "12px",
+      "padding": "16px",
+      "shadow": "0 2px 6px rgba(28, 20, 10, 0.09)",
+      "shadowHover": "0 8px 20px rgba(28, 20, 10, 0.11)"
+    },
+    "status": {
+      "gap": "4px",
+      "fontSize": "14px",
+      "iconSize": "16px"
+    },
+    "metric": {
+      "background": "#FFFFFF",
+      "border": "#E4E2DB",
+      "radius": "12px",
+      "padding": "16px",
+      "valueFontSize": "24px",
+      "labelFontSize": "14px"
+    },
+    "meter": {
+      "height": "6px",
+      "radius": "999px",
+      "track": "#E4E2DB"
+    }
+  },
   "semanticThemes": {
     "light": {
       "color": {
@@ -449,8 +520,8 @@
           "primaryHover": "#353128",
           "primaryActive": "#211E18",
           "accent": "#F4581C",
-          "accentHover": "#DD4A0F",
-          "accentActive": "#B23C0C",
+          "accentHover": "#FB6E2E",
+          "accentActive": "#FF9462",
           "onAccent": "#16130F"
         },
         "text": {
@@ -464,17 +535,19 @@
           "canvas": "#FAFAF8",
           "surface": "#F1F0EB",
           "elevated": "#FFFFFF",
-          "muted": "#E4E2DB"
+          "muted": "#E4E2DB",
+          "subtle": "#F1F0EB"
         },
         "border": {
           "subtle": "#E4E2DB",
-          "default": "#D3D0C7",
-          "strong": "#8E887A"
+          "default": "#8E887A",
+          "strong": "#8E887A",
+          "muted": "#E4E2DB"
         },
         "state": {
           "info": "#1F5BA6",
-          "success": "#2EA070",
-          "warning": "#C8930A",
+          "success": "#1B6145",
+          "warning": "#694B00",
           "danger": "#BE1F3D",
           "onSolid": "#FFFFFF"
         },
@@ -632,7 +705,7 @@
         "text": {
           "primary": "#FFFFFF",
           "secondary": "#E4E2DB",
-          "muted": "#B4AFA1",
+          "muted": "#D3D0C7",
           "inverse": "#FFFFFF",
           "onPrimary": "#16130F"
         },
@@ -640,12 +713,14 @@
           "canvas": "#16130F",
           "surface": "#353128",
           "elevated": "#4B473E",
-          "muted": "#211E18"
+          "muted": "#211E18",
+          "subtle": "#353128"
         },
         "border": {
           "subtle": "#4B473E",
-          "default": "#66604E",
-          "strong": "#8E887A"
+          "default": "#B4AFA1",
+          "strong": "#8E887A",
+          "muted": "#4B473E"
         },
         "state": {
           "info": "#76A6DC",
@@ -802,7 +877,7 @@
           "primaryActive": "#353128",
           "accent": "#B23C0C",
           "accentHover": "#882D09",
-          "accentActive": "#DD4A0F",
+          "accentActive": "#5C1E06",
           "onAccent": "#FFFFFF"
         },
         "text": {
@@ -816,12 +891,14 @@
           "canvas": "#FFFFFF",
           "surface": "#FFFFFF",
           "elevated": "#FFFFFF",
-          "muted": "#FAFAF8"
+          "muted": "#FAFAF8",
+          "subtle": "#FFFFFF"
         },
         "border": {
           "subtle": "#B4AFA1",
           "default": "#4B473E",
-          "strong": "#16130F"
+          "strong": "#16130F",
+          "muted": "#B4AFA1"
         },
         "state": {
           "info": "#123356",
@@ -970,5 +1047,671 @@
         "modal": "0 16px 36px rgba(28, 20, 10, 0.13)"
       }
     }
+  },
+  "componentThemes": {
+    "light": {
+      "button": {
+        "background": "#16130F",
+        "backgroundHover": "#353128",
+        "backgroundActive": "#211E18",
+        "border": "#16130F",
+        "color": "#FFFFFF",
+        "height": "40px",
+        "paddingX": "16px",
+        "fontSize": "14px",
+        "lineHeight": "20px",
+        "fontWeight": "600",
+        "radius": "8px",
+        "gap": "6px",
+        "loadingSpinnerSize": "20px"
+      },
+      "control": {
+        "background": "#FFFFFF",
+        "backgroundHover": "#F1F0EB",
+        "backgroundDisabled": "#E4E2DB",
+        "border": "#8E887A",
+        "borderHover": "#8E887A",
+        "borderFocus": "#DD4A0F",
+        "text": "#16130F",
+        "placeholder": "#66604E",
+        "radius": "8px"
+      },
+      "card": {
+        "background": "#FFFFFF",
+        "border": "#E4E2DB",
+        "radius": "12px",
+        "padding": "16px",
+        "shadow": "0 2px 6px rgba(28, 20, 10, 0.09)",
+        "shadowHover": "0 8px 20px rgba(28, 20, 10, 0.11)"
+      },
+      "status": {
+        "gap": "4px",
+        "fontSize": "14px",
+        "iconSize": "16px"
+      },
+      "metric": {
+        "background": "#FFFFFF",
+        "border": "#E4E2DB",
+        "radius": "12px",
+        "padding": "16px",
+        "valueFontSize": "24px",
+        "labelFontSize": "14px"
+      },
+      "meter": {
+        "height": "6px",
+        "radius": "999px",
+        "track": "#E4E2DB"
+      }
+    },
+    "dark": {
+      "button": {
+        "background": "#F1F0EB",
+        "backgroundHover": "#FFFFFF",
+        "backgroundActive": "#E4E2DB",
+        "border": "#F1F0EB",
+        "color": "#16130F",
+        "height": "40px",
+        "paddingX": "16px",
+        "fontSize": "14px",
+        "lineHeight": "20px",
+        "fontWeight": "600",
+        "radius": "8px",
+        "gap": "6px",
+        "loadingSpinnerSize": "20px"
+      },
+      "control": {
+        "background": "#4B473E",
+        "backgroundHover": "#353128",
+        "backgroundDisabled": "#211E18",
+        "border": "#B4AFA1",
+        "borderHover": "#8E887A",
+        "borderFocus": "#FB6E2E",
+        "text": "#FFFFFF",
+        "placeholder": "#D3D0C7",
+        "radius": "8px"
+      },
+      "card": {
+        "background": "#4B473E",
+        "border": "#4B473E",
+        "radius": "12px",
+        "padding": "16px",
+        "shadow": "0 2px 6px rgba(28, 20, 10, 0.09)",
+        "shadowHover": "0 8px 20px rgba(28, 20, 10, 0.11)"
+      },
+      "status": {
+        "gap": "4px",
+        "fontSize": "14px",
+        "iconSize": "16px"
+      },
+      "metric": {
+        "background": "#4B473E",
+        "border": "#4B473E",
+        "radius": "12px",
+        "padding": "16px",
+        "valueFontSize": "24px",
+        "labelFontSize": "14px"
+      },
+      "meter": {
+        "height": "6px",
+        "radius": "999px",
+        "track": "#211E18"
+      }
+    },
+    "highContrast": {
+      "button": {
+        "background": "#16130F",
+        "backgroundHover": "#211E18",
+        "backgroundActive": "#353128",
+        "border": "#16130F",
+        "color": "#FFFFFF",
+        "height": "40px",
+        "paddingX": "16px",
+        "fontSize": "14px",
+        "lineHeight": "20px",
+        "fontWeight": "600",
+        "radius": "8px",
+        "gap": "6px",
+        "loadingSpinnerSize": "20px"
+      },
+      "control": {
+        "background": "#FFFFFF",
+        "backgroundHover": "#FFFFFF",
+        "backgroundDisabled": "#FAFAF8",
+        "border": "#4B473E",
+        "borderHover": "#16130F",
+        "borderFocus": "#B23C0C",
+        "text": "#16130F",
+        "placeholder": "#4B473E",
+        "radius": "8px"
+      },
+      "card": {
+        "background": "#FFFFFF",
+        "border": "#B4AFA1",
+        "radius": "12px",
+        "padding": "16px",
+        "shadow": "0 2px 6px rgba(28, 20, 10, 0.09)",
+        "shadowHover": "0 8px 20px rgba(28, 20, 10, 0.11)"
+      },
+      "status": {
+        "gap": "4px",
+        "fontSize": "14px",
+        "iconSize": "16px"
+      },
+      "metric": {
+        "background": "#FFFFFF",
+        "border": "#B4AFA1",
+        "radius": "12px",
+        "padding": "16px",
+        "valueFontSize": "24px",
+        "labelFontSize": "14px"
+      },
+      "meter": {
+        "height": "6px",
+        "radius": "999px",
+        "track": "#FAFAF8"
+      }
+    }
+  },
+  "cssVars": {
+    "primitives": {
+      "color": {
+        "stone": {
+          "0": "var(--color-stone-0)",
+          "50": "var(--color-stone-50)",
+          "100": "var(--color-stone-100)",
+          "200": "var(--color-stone-200)",
+          "300": "var(--color-stone-300)",
+          "400": "var(--color-stone-400)",
+          "500": "var(--color-stone-500)",
+          "600": "var(--color-stone-600)",
+          "700": "var(--color-stone-700)",
+          "800": "var(--color-stone-800)",
+          "900": "var(--color-stone-900)",
+          "950": "var(--color-stone-950)"
+        },
+        "orange": {
+          "50": "var(--color-orange-50)",
+          "100": "var(--color-orange-100)",
+          "200": "var(--color-orange-200)",
+          "300": "var(--color-orange-300)",
+          "400": "var(--color-orange-400)",
+          "500": "var(--color-orange-500)",
+          "600": "var(--color-orange-600)",
+          "700": "var(--color-orange-700)",
+          "800": "var(--color-orange-800)",
+          "900": "var(--color-orange-900)"
+        },
+        "ocean": {
+          "50": "var(--color-ocean-50)",
+          "100": "var(--color-ocean-100)",
+          "200": "var(--color-ocean-200)",
+          "300": "var(--color-ocean-300)",
+          "400": "var(--color-ocean-400)",
+          "500": "var(--color-ocean-500)",
+          "600": "var(--color-ocean-600)",
+          "700": "var(--color-ocean-700)",
+          "800": "var(--color-ocean-800)",
+          "900": "var(--color-ocean-900)"
+        },
+        "teal": {
+          "50": "var(--color-teal-50)",
+          "100": "var(--color-teal-100)",
+          "200": "var(--color-teal-200)",
+          "300": "var(--color-teal-300)",
+          "400": "var(--color-teal-400)",
+          "500": "var(--color-teal-500)",
+          "600": "var(--color-teal-600)",
+          "700": "var(--color-teal-700)",
+          "800": "var(--color-teal-800)",
+          "900": "var(--color-teal-900)"
+        },
+        "amber": {
+          "50": "var(--color-amber-50)",
+          "100": "var(--color-amber-100)",
+          "200": "var(--color-amber-200)",
+          "300": "var(--color-amber-300)",
+          "400": "var(--color-amber-400)",
+          "500": "var(--color-amber-500)",
+          "600": "var(--color-amber-600)",
+          "700": "var(--color-amber-700)",
+          "800": "var(--color-amber-800)",
+          "900": "var(--color-amber-900)"
+        },
+        "red": {
+          "50": "var(--color-red-50)",
+          "100": "var(--color-red-100)",
+          "200": "var(--color-red-200)",
+          "300": "var(--color-red-300)",
+          "400": "var(--color-red-400)",
+          "500": "var(--color-red-500)",
+          "600": "var(--color-red-600)",
+          "700": "var(--color-red-700)",
+          "800": "var(--color-red-800)",
+          "900": "var(--color-red-900)"
+        },
+        "green": {
+          "50": "var(--color-green-50)",
+          "100": "var(--color-green-100)",
+          "200": "var(--color-green-200)",
+          "300": "var(--color-green-300)",
+          "400": "var(--color-green-400)",
+          "500": "var(--color-green-500)",
+          "600": "var(--color-green-600)",
+          "700": "var(--color-green-700)",
+          "800": "var(--color-green-800)",
+          "900": "var(--color-green-900)"
+        },
+        "purple": {
+          "50": "var(--color-purple-50)",
+          "100": "var(--color-purple-100)",
+          "200": "var(--color-purple-200)",
+          "300": "var(--color-purple-300)",
+          "400": "var(--color-purple-400)",
+          "500": "var(--color-purple-500)",
+          "600": "var(--color-purple-600)",
+          "700": "var(--color-purple-700)",
+          "800": "var(--color-purple-800)",
+          "900": "var(--color-purple-900)"
+        },
+        "pink": {
+          "50": "var(--color-pink-50)",
+          "100": "var(--color-pink-100)",
+          "200": "var(--color-pink-200)",
+          "300": "var(--color-pink-300)",
+          "400": "var(--color-pink-400)",
+          "500": "var(--color-pink-500)",
+          "600": "var(--color-pink-600)",
+          "700": "var(--color-pink-700)",
+          "800": "var(--color-pink-800)",
+          "900": "var(--color-pink-900)"
+        }
+      },
+      "font": {
+        "family": {
+          "brand": "var(--font-family-brand)",
+          "text": "var(--font-family-text)",
+          "mono": "var(--font-family-mono)"
+        },
+        "weight": {
+          "regular": "var(--font-weight-regular)",
+          "medium": "var(--font-weight-medium)",
+          "semibold": "var(--font-weight-semibold)",
+          "bold": "var(--font-weight-bold)",
+          "extrabold": "var(--font-weight-extrabold)"
+        },
+        "size": {
+          "2xs": "var(--font-size-2xs)",
+          "xs": "var(--font-size-xs)",
+          "sm": "var(--font-size-sm)",
+          "md": "var(--font-size-md)",
+          "lg": "var(--font-size-lg)",
+          "xl": "var(--font-size-xl)",
+          "2xl": "var(--font-size-2xl)",
+          "3xl": "var(--font-size-3xl)",
+          "4xl": "var(--font-size-4xl)",
+          "5xl": "var(--font-size-5xl)",
+          "6xl": "var(--font-size-6xl)"
+        },
+        "lineHeight": {
+          "2xs": "var(--line-height-2xs)",
+          "xs": "var(--line-height-xs)",
+          "sm": "var(--line-height-sm)",
+          "md": "var(--line-height-md)",
+          "lg": "var(--line-height-lg)",
+          "xl": "var(--line-height-xl)",
+          "2xl": "var(--line-height-2xl)",
+          "3xl": "var(--line-height-3xl)",
+          "4xl": "var(--line-height-4xl)",
+          "5xl": "var(--line-height-5xl)",
+          "6xl": "var(--line-height-6xl)"
+        },
+        "letterSpacing": {
+          "tight": "var(--letter-spacing-tight)",
+          "normal": "var(--letter-spacing-normal)",
+          "wide": "var(--letter-spacing-wide)"
+        }
+      },
+      "space": {
+        "0": "var(--space-0)",
+        "1": "var(--space-1)",
+        "2": "var(--space-2)",
+        "3": "var(--space-3)",
+        "4": "var(--space-4)",
+        "5": "var(--space-5)",
+        "6": "var(--space-6)",
+        "7": "var(--space-7)",
+        "8": "var(--space-8)",
+        "9": "var(--space-9)",
+        "10": "var(--space-10)",
+        "11": "var(--space-11)",
+        "12": "var(--space-12)",
+        "13": "var(--space-13)"
+      },
+      "radius": {
+        "xs": "var(--radius-xs)",
+        "sm": "var(--radius-sm)",
+        "md": "var(--radius-md)",
+        "lg": "var(--radius-lg)",
+        "xl": "var(--radius-xl)",
+        "2xl": "var(--radius-2xl)",
+        "round": "var(--radius-round)"
+      },
+      "border": {
+        "width": {
+          "thin": "var(--border-thin)",
+          "medium": "var(--border-medium)",
+          "thick": "var(--border-thick)"
+        }
+      },
+      "opacity": {
+        "muted": "var(--opacity-muted)",
+        "disabled": "var(--opacity-disabled)",
+        "overlay": "var(--opacity-overlay)"
+      },
+      "size": {
+        "controlHeight": {
+          "xs": "var(--control-height-xs)",
+          "sm": "var(--control-height-sm)",
+          "md": "var(--control-height-md)",
+          "lg": "var(--control-height-lg)",
+          "calendarDay": "var(--control-height-calendar-day)"
+        },
+        "icon": {
+          "sm": "var(--icon-sm)",
+          "md": "var(--icon-md)",
+          "lg": "var(--icon-lg)",
+          "xl": "var(--icon-xl)"
+        }
+      },
+      "layout": {
+        "container": {
+          "sm": "var(--container-sm)",
+          "md": "var(--container-md)",
+          "lg": "var(--container-lg)",
+          "xl": "var(--container-xl)"
+        },
+        "gutter": {
+          "sm": "var(--gutter-sm)",
+          "md": "var(--gutter-md)",
+          "lg": "var(--gutter-lg)"
+        },
+        "gridGap": {
+          "sm": "var(--grid-gap-sm)",
+          "md": "var(--grid-gap-md)",
+          "lg": "var(--grid-gap-lg)"
+        },
+        "navbar": {
+          "height": "var(--navbar-height)"
+        }
+      },
+      "shadow": {
+        "xs": "var(--shadow-xs)",
+        "sm": "var(--shadow-sm)",
+        "md": "var(--shadow-md)",
+        "lg": "var(--shadow-lg)",
+        "xl": "var(--shadow-xl)"
+      },
+      "motion": {
+        "duration": {
+          "fast": "var(--duration-fast)",
+          "normal": "var(--duration-normal)",
+          "slow": "var(--duration-slow)",
+          "xslow": "var(--duration-xslow)"
+        },
+        "easing": {
+          "standard": "var(--easing-standard)",
+          "decelerate": "var(--easing-decelerate)",
+          "accelerate": "var(--easing-accelerate)"
+        }
+      },
+      "zIndex": {
+        "base": "var(--z-base)",
+        "dropdown": "var(--z-dropdown)",
+        "sticky": "var(--z-sticky)",
+        "overlay": "var(--z-overlay)",
+        "modal": "var(--z-modal)",
+        "toast": "var(--z-toast)",
+        "tooltip": "var(--z-tooltip)"
+      },
+      "breakpoint": {
+        "xs": "var(--bp-xs)",
+        "sm": "var(--bp-sm)",
+        "md": "var(--bp-md)",
+        "lg": "var(--bp-lg)",
+        "xl": "var(--bp-xl)"
+      }
+    },
+    "semantic": {
+      "color": {
+        "brand": {
+          "primary": "var(--color-brand-primary)",
+          "primaryHover": "var(--color-brand-primary-hover)",
+          "primaryActive": "var(--color-brand-primary-active)",
+          "accent": "var(--color-brand-accent)",
+          "accentHover": "var(--color-brand-accent-hover)",
+          "accentActive": "var(--color-brand-accent-active)",
+          "onAccent": "var(--color-brand-on-accent)"
+        },
+        "text": {
+          "primary": "var(--color-text-primary)",
+          "secondary": "var(--color-text-secondary)",
+          "muted": "var(--color-text-muted)",
+          "inverse": "var(--color-text-inverse)",
+          "onPrimary": "var(--color-text-on-primary)"
+        },
+        "background": {
+          "canvas": "var(--color-bg-canvas)",
+          "surface": "var(--color-bg-surface)",
+          "elevated": "var(--color-bg-elevated)",
+          "muted": "var(--color-bg-muted)",
+          "subtle": "var(--color-bg-subtle)"
+        },
+        "border": {
+          "subtle": "var(--color-border-subtle)",
+          "default": "var(--color-border-default)",
+          "strong": "var(--color-border-strong)",
+          "muted": "var(--color-border-muted)"
+        },
+        "state": {
+          "info": "var(--color-state-info)",
+          "success": "var(--color-state-success)",
+          "warning": "var(--color-state-warning)",
+          "danger": "var(--color-state-danger)",
+          "onSolid": "var(--color-state-on-solid)"
+        },
+        "stateSurface": {
+          "info": "var(--color-state-info-surface)",
+          "success": "var(--color-state-success-surface)",
+          "warning": "var(--color-state-warning-surface)",
+          "danger": "var(--color-state-danger-surface)"
+        },
+        "stateBorder": {
+          "info": "var(--color-state-info-border)",
+          "success": "var(--color-state-success-border)",
+          "warning": "var(--color-state-warning-border)",
+          "danger": "var(--color-state-danger-border)"
+        },
+        "stateText": {
+          "info": "var(--color-state-info-text)",
+          "success": "var(--color-state-success-text)",
+          "warning": "var(--color-state-warning-text)",
+          "danger": "var(--color-state-danger-text)"
+        },
+        "overlay": {
+          "scrim": "var(--color-overlay-scrim)"
+        },
+        "focus": {
+          "ring": "var(--color-focus-ring)"
+        },
+        "avatarSeed": {
+          "1Bg": "var(--color-avatar-seed-1-bg)",
+          "1Fg": "var(--color-avatar-seed-1-fg)",
+          "2Bg": "var(--color-avatar-seed-2-bg)",
+          "2Fg": "var(--color-avatar-seed-2-fg)",
+          "3Bg": "var(--color-avatar-seed-3-bg)",
+          "3Fg": "var(--color-avatar-seed-3-fg)",
+          "4Bg": "var(--color-avatar-seed-4-bg)",
+          "4Fg": "var(--color-avatar-seed-4-fg)",
+          "5Bg": "var(--color-avatar-seed-5-bg)",
+          "5Fg": "var(--color-avatar-seed-5-fg)",
+          "6Bg": "var(--color-avatar-seed-6-bg)",
+          "6Fg": "var(--color-avatar-seed-6-fg)",
+          "7Bg": "var(--color-avatar-seed-7-bg)",
+          "7Fg": "var(--color-avatar-seed-7-fg)",
+          "8Bg": "var(--color-avatar-seed-8-bg)",
+          "8Fg": "var(--color-avatar-seed-8-fg)"
+        },
+        "chartSeries": {
+          "1": "var(--color-chart-series-1)",
+          "2": "var(--color-chart-series-2)",
+          "3": "var(--color-chart-series-3)",
+          "4": "var(--color-chart-series-4)",
+          "5": "var(--color-chart-series-5)",
+          "6": "var(--color-chart-series-6)",
+          "7": "var(--color-chart-series-7)",
+          "8": "var(--color-chart-series-8)"
+        }
+      },
+      "theme": {
+        "colorScheme": "var(--theme-color-scheme)"
+      },
+      "font": {
+        "family": {
+          "heading": "var(--font-family-heading)",
+          "body": "var(--font-family-body)",
+          "code": "var(--font-family-code)"
+        }
+      },
+      "typography": {
+        "display": {
+          "fontFamily": "var(--type-display-font-family)",
+          "fontSize": "var(--type-display-font-size)",
+          "lineHeight": "var(--type-display-line-height)",
+          "fontWeight": "var(--type-display-font-weight)",
+          "letterSpacing": "var(--type-display-letter-spacing)"
+        },
+        "h1": {
+          "fontFamily": "var(--type-h1-font-family)",
+          "fontSize": "var(--type-h1-font-size)",
+          "lineHeight": "var(--type-h1-line-height)",
+          "fontWeight": "var(--type-h1-font-weight)",
+          "letterSpacing": "var(--type-h1-letter-spacing)"
+        },
+        "h2": {
+          "fontFamily": "var(--type-h2-font-family)",
+          "fontSize": "var(--type-h2-font-size)",
+          "lineHeight": "var(--type-h2-line-height)",
+          "fontWeight": "var(--type-h2-font-weight)",
+          "letterSpacing": "var(--type-h2-letter-spacing)"
+        },
+        "h3": {
+          "fontFamily": "var(--type-h3-font-family)",
+          "fontSize": "var(--type-h3-font-size)",
+          "lineHeight": "var(--type-h3-line-height)",
+          "fontWeight": "var(--type-h3-font-weight)",
+          "letterSpacing": "var(--type-h3-letter-spacing)"
+        },
+        "h4": {
+          "fontFamily": "var(--type-h4-font-family)",
+          "fontSize": "var(--type-h4-font-size)",
+          "lineHeight": "var(--type-h4-line-height)",
+          "fontWeight": "var(--type-h4-font-weight)",
+          "letterSpacing": "var(--type-h4-letter-spacing)"
+        },
+        "body": {
+          "fontFamily": "var(--type-body-font-family)",
+          "fontSize": "var(--type-body-font-size)",
+          "lineHeight": "var(--type-body-line-height)",
+          "fontWeight": "var(--type-body-font-weight)",
+          "letterSpacing": "var(--type-body-letter-spacing)"
+        },
+        "bodySm": {
+          "fontFamily": "var(--type-body-sm-font-family)",
+          "fontSize": "var(--type-body-sm-font-size)",
+          "lineHeight": "var(--type-body-sm-line-height)",
+          "fontWeight": "var(--type-body-sm-font-weight)",
+          "letterSpacing": "var(--type-body-sm-letter-spacing)"
+        },
+        "label": {
+          "fontFamily": "var(--type-label-font-family)",
+          "fontSize": "var(--type-label-font-size)",
+          "lineHeight": "var(--type-label-line-height)",
+          "fontWeight": "var(--type-label-font-weight)",
+          "letterSpacing": "var(--type-label-letter-spacing)"
+        },
+        "caption": {
+          "fontFamily": "var(--type-caption-font-family)",
+          "fontSize": "var(--type-caption-font-size)",
+          "lineHeight": "var(--type-caption-line-height)",
+          "fontWeight": "var(--type-caption-font-weight)",
+          "letterSpacing": "var(--type-caption-letter-spacing)"
+        }
+      },
+      "radius": {
+        "control": "var(--radius-control)",
+        "card": "var(--radius-card)",
+        "modal": "var(--radius-modal)",
+        "pill": "var(--radius-pill)"
+      },
+      "shadow": {
+        "card": "var(--shadow-card)",
+        "dropdown": "var(--shadow-dropdown)",
+        "modal": "var(--shadow-modal)"
+      }
+    },
+    "components": {
+      "button": {
+        "background": "var(--component-button-background)",
+        "backgroundHover": "var(--component-button-background-hover)",
+        "backgroundActive": "var(--component-button-background-active)",
+        "border": "var(--component-button-border)",
+        "color": "var(--component-button-color)",
+        "height": "var(--component-button-height)",
+        "paddingX": "var(--component-button-padding-x)",
+        "fontSize": "var(--component-button-font-size)",
+        "lineHeight": "var(--component-button-line-height)",
+        "fontWeight": "var(--component-button-font-weight)",
+        "radius": "var(--component-button-radius)",
+        "gap": "var(--component-button-gap)",
+        "loadingSpinnerSize": "var(--component-button-loading-spinner-size)"
+      },
+      "control": {
+        "background": "var(--component-control-background)",
+        "backgroundHover": "var(--component-control-background-hover)",
+        "backgroundDisabled": "var(--component-control-background-disabled)",
+        "border": "var(--component-control-border)",
+        "borderHover": "var(--component-control-border-hover)",
+        "borderFocus": "var(--component-control-border-focus)",
+        "text": "var(--component-control-text)",
+        "placeholder": "var(--component-control-placeholder)",
+        "radius": "var(--component-control-radius)"
+      },
+      "card": {
+        "background": "var(--component-card-background)",
+        "border": "var(--component-card-border)",
+        "radius": "var(--component-card-radius)",
+        "padding": "var(--component-card-padding)",
+        "shadow": "var(--component-card-shadow)",
+        "shadowHover": "var(--component-card-shadow-hover)"
+      },
+      "status": {
+        "gap": "var(--component-status-gap)",
+        "fontSize": "var(--component-status-font-size)",
+        "iconSize": "var(--component-status-icon-size)"
+      },
+      "metric": {
+        "background": "var(--component-metric-background)",
+        "border": "var(--component-metric-border)",
+        "radius": "var(--component-metric-radius)",
+        "padding": "var(--component-metric-padding)",
+        "valueFontSize": "var(--component-metric-value-font-size)",
+        "labelFontSize": "var(--component-metric-label-font-size)"
+      },
+      "meter": {
+        "height": "var(--component-meter-height)",
+        "radius": "var(--component-meter-radius)",
+        "track": "var(--component-meter-track)"
+      }
+    }
   }
 }