@hilum/ui 0.1.1 → 0.1.3

package/dist/tokens.css

@@ -1,17 +1,19 @@
 /* Hilum UI tokens — generated by scripts/build-tokens.mjs. Do not edit by hand. */
 
+@source "../src";
+
 @theme {
-  --color-taupe-50: #f9f7f5;
-  --color-taupe-100: #f2eeea;
-  --color-taupe-200: #e3dcd4;
-  --color-taupe-300: #c9beb3;
-  --color-taupe-400: #a8978a;
-  --color-taupe-500: #7d6960;
-  --color-taupe-600: #5d4e47;
-  --color-taupe-700: #4a3d38;
-  --color-taupe-800: #332924;
-  --color-taupe-900: #26181a;
-  --color-taupe-950: #160e0a;
+  --color-ground-50: #fafafa;
+  --color-ground-100: #f5f5f5;
+  --color-ground-200: #e5e5e5;
+  --color-ground-300: #d4d4d4;
+  --color-ground-400: #a3a3a3;
+  --color-ground-500: #737373;
+  --color-ground-600: #525252;
+  --color-ground-700: #404040;
+  --color-ground-800: #262626;
+  --color-ground-900: #171717;
+  --color-ground-950: #0a0a0a;
   --color-purple-50: #fdf0ff;
   --color-purple-100: #f5d6ff;
   --color-purple-200: #e8a8ff;
@@ -45,7 +47,7 @@
   --radius-base: 0.5rem;
   --radius-sm: calc(0.5rem - 4px);
   --radius-md: calc(0.5rem - 2px);
-  --radius-lg: 0.5rem;
+  --radius-lg: calc(0.5rem + 2px);
   --radius-xl: calc(0.5rem + 4px);
   --radius-full: 9999px;
 
@@ -55,6 +57,13 @@
   --animate-accordion-down: accordion-down 0.2s ease-out;
   --animate-accordion-up: accordion-up 0.2s ease-out;
   --animate-caret-blink: caret-blink 1.25s ease-out infinite;
+
+  --z-dropdown: 40;
+  --z-sticky: 50;
+  --z-fixed: 60;
+  --z-modal: 100;
+  --z-popover: 110;
+  --z-tooltip: 120;
 }
 
 @theme inline {
@@ -85,52 +94,52 @@
 
 :root {
   --background: #ffffff;
-  --foreground: #26181a;
+  --foreground: #171717;
   --card: #ffffff;
-  --card-foreground: #26181a;
-  --surface: #f9f7f5;
-  --surface-foreground: #332924;
-  --border: #f2eeea;
-  --input: #f2eeea;
-  --muted: #f9f7f5;
-  --muted-foreground: #7d6960;
+  --card-foreground: #171717;
+  --surface: #fafafa;
+  --surface-foreground: #262626;
+  --border: #f5f5f5;
+  --input: #f5f5f5;
+  --muted: #fafafa;
+  --muted-foreground: #737373;
   --accent: #fdf0ff;
   --accent-foreground: #740092;
   --primary: #c100f1;
   --primary-foreground: #ffffff;
-  --secondary: #f9f7f5;
-  --secondary-foreground: #4a3d38;
+  --secondary: #fafafa;
+  --secondary-foreground: #404040;
   --destructive: #dc2626;
   --destructive-foreground: #ffffff;
   --success: #CDEA19;
-  --success-foreground: #26181a;
+  --success-foreground: #171717;
   --warning: #fff5bf;
-  --warning-foreground: #26181a;
+  --warning-foreground: #171717;
   --ring: #c100f1;
 }
 
 @media (prefers-color-scheme: dark) {
   :root:not([data-theme="light"]) {
-    --background: #160e0a;
-    --foreground: #f9f7f5;
-    --card: #26181a;
-    --card-foreground: #f9f7f5;
-    --surface: #26181a;
-    --surface-foreground: #f2eeea;
-    --border: #332924;
-    --input: #332924;
-    --muted: #26181a;
-    --muted-foreground: #a8978a;
+    --background: #0a0a0a;
+    --foreground: #fafafa;
+    --card: #171717;
+    --card-foreground: #fafafa;
+    --surface: #171717;
+    --surface-foreground: #f5f5f5;
+    --border: #262626;
+    --input: #262626;
+    --muted: #171717;
+    --muted-foreground: #a3a3a3;
     --accent: #330040;
     --accent-foreground: #f5d6ff;
     --primary: #c100f1;
     --primary-foreground: #ffffff;
-    --secondary: #26181a;
-    --secondary-foreground: #f2eeea;
+    --secondary: #171717;
+    --secondary-foreground: #f5f5f5;
     --destructive: #ef4444;
     --destructive-foreground: #ffffff;
     --success: #CDEA19;
-    --success-foreground: #160e0a;
+    --success-foreground: #0a0a0a;
     --warning: #221600;
     --warning-foreground: #fffad0;
     --ring: #c100f1;
@@ -138,26 +147,26 @@
 }
 
 [data-theme="dark"] {
-  --background: #160e0a;
-  --foreground: #f9f7f5;
-  --card: #26181a;
-  --card-foreground: #f9f7f5;
-  --surface: #26181a;
-  --surface-foreground: #f2eeea;
-  --border: #332924;
-  --input: #332924;
-  --muted: #26181a;
-  --muted-foreground: #a8978a;
+  --background: #0a0a0a;
+  --foreground: #fafafa;
+  --card: #171717;
+  --card-foreground: #fafafa;
+  --surface: #171717;
+  --surface-foreground: #f5f5f5;
+  --border: #262626;
+  --input: #262626;
+  --muted: #171717;
+  --muted-foreground: #a3a3a3;
   --accent: #330040;
   --accent-foreground: #f5d6ff;
   --primary: #c100f1;
   --primary-foreground: #ffffff;
-  --secondary: #26181a;
-  --secondary-foreground: #f2eeea;
+  --secondary: #171717;
+  --secondary-foreground: #f5f5f5;
   --destructive: #ef4444;
   --destructive-foreground: #ffffff;
   --success: #CDEA19;
-  --success-foreground: #160e0a;
+  --success-foreground: #0a0a0a;
   --warning: #221600;
   --warning-foreground: #fffad0;
   --ring: #c100f1;

package/dist/tokens.d.ts

@@ -1,16 +1,16 @@
 declare const tokens: {
-    readonly taupe: {
-        readonly 50: "#f9f7f5";
-        readonly 100: "#f2eeea";
-        readonly 200: "#e3dcd4";
-        readonly 300: "#c9beb3";
-        readonly 400: "#a8978a";
-        readonly 500: "#7d6960";
-        readonly 600: "#5d4e47";
-        readonly 700: "#4a3d38";
-        readonly 800: "#332924";
-        readonly 900: "#26181a";
-        readonly 950: "#160e0a";
+    readonly ground: {
+        readonly 50: "#fafafa";
+        readonly 100: "#f5f5f5";
+        readonly 200: "#e5e5e5";
+        readonly 300: "#d4d4d4";
+        readonly 400: "#a3a3a3";
+        readonly 500: "#737373";
+        readonly 600: "#525252";
+        readonly 700: "#404040";
+        readonly 800: "#262626";
+        readonly 900: "#171717";
+        readonly 950: "#0a0a0a";
     };
     readonly butter: {
         readonly 50: "#ffffe8";
@@ -46,50 +46,50 @@ declare const tokens: {
     readonly semantic: {
         readonly light: {
             readonly background: "#ffffff";
-            readonly foreground: "#26181a";
+            readonly foreground: "#171717";
             readonly card: "#ffffff";
-            readonly cardForeground: "#26181a";
-            readonly surface: "#f9f7f5";
-            readonly surfaceForeground: "#332924";
-            readonly border: "#f2eeea";
-            readonly input: "#f2eeea";
-            readonly muted: "#f9f7f5";
-            readonly mutedForeground: "#7d6960";
+            readonly cardForeground: "#171717";
+            readonly surface: "#fafafa";
+            readonly surfaceForeground: "#262626";
+            readonly border: "#f5f5f5";
+            readonly input: "#f5f5f5";
+            readonly muted: "#fafafa";
+            readonly mutedForeground: "#737373";
             readonly accent: "#fdf0ff";
             readonly accentForeground: "#740092";
             readonly primary: "#c100f1";
             readonly primaryForeground: "#ffffff";
-            readonly secondary: "#f9f7f5";
-            readonly secondaryForeground: "#4a3d38";
+            readonly secondary: "#fafafa";
+            readonly secondaryForeground: "#404040";
             readonly destructive: "#dc2626";
             readonly destructiveForeground: "#ffffff";
             readonly success: "#CDEA19";
-            readonly successForeground: "#26181a";
+            readonly successForeground: "#171717";
             readonly warning: "#fff5bf";
-            readonly warningForeground: "#26181a";
+            readonly warningForeground: "#171717";
             readonly ring: "#c100f1";
         };
         readonly dark: {
-            readonly background: "#160e0a";
-            readonly foreground: "#f9f7f5";
-            readonly card: "#26181a";
-            readonly cardForeground: "#f9f7f5";
-            readonly surface: "#26181a";
-            readonly surfaceForeground: "#f2eeea";
-            readonly border: "#332924";
-            readonly input: "#332924";
-            readonly muted: "#26181a";
-            readonly mutedForeground: "#a8978a";
+            readonly background: "#0a0a0a";
+            readonly foreground: "#fafafa";
+            readonly card: "#171717";
+            readonly cardForeground: "#fafafa";
+            readonly surface: "#171717";
+            readonly surfaceForeground: "#f5f5f5";
+            readonly border: "#262626";
+            readonly input: "#262626";
+            readonly muted: "#171717";
+            readonly mutedForeground: "#a3a3a3";
             readonly accent: "#330040";
             readonly accentForeground: "#f5d6ff";
             readonly primary: "#c100f1";
             readonly primaryForeground: "#ffffff";
-            readonly secondary: "#26181a";
-            readonly secondaryForeground: "#f2eeea";
+            readonly secondary: "#171717";
+            readonly secondaryForeground: "#f5f5f5";
             readonly destructive: "#ef4444";
             readonly destructiveForeground: "#ffffff";
             readonly success: "#CDEA19";
-            readonly successForeground: "#160e0a";
+            readonly successForeground: "#0a0a0a";
             readonly warning: "#221600";
             readonly warningForeground: "#fffad0";
             readonly ring: "#c100f1";
@@ -169,10 +169,18 @@ declare const tokens: {
         readonly base: "0.5rem";
         readonly sm: "calc(0.5rem - 4px)";
         readonly md: "calc(0.5rem - 2px)";
-        readonly lg: "0.5rem";
+        readonly lg: "calc(0.5rem + 2px)";
         readonly xl: "calc(0.5rem + 4px)";
         readonly full: "9999px";
     };
+    readonly zIndex: {
+        readonly dropdown: 40;
+        readonly sticky: 50;
+        readonly fixed: 60;
+        readonly modal: 100;
+        readonly popover: 110;
+        readonly tooltip: 120;
+    };
     readonly shadow: {
         readonly natural: "0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06)";
         readonly elevated: "0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06), 0 6px 6px -3px rgba(0, 0, 0, 0.06), 0 12px 12px -6px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04), 0 24px 24px 2px rgba(0, 0, 0, 0.1)";

package/dist/tokens.js

@@ -1,193 +1,3 @@
-// src/tokens/tokens.ts
-var tokens = {
-  /* ============================================================== *
-   *  PALETTE — concrete colors                                      *
-   * ============================================================== */
-  taupe: {
-    50: "#f9f7f5",
-    100: "#f2eeea",
-    200: "#e3dcd4",
-    300: "#c9beb3",
-    400: "#a8978a",
-    500: "#7d6960",
-    600: "#5d4e47",
-    700: "#4a3d38",
-    800: "#332924",
-    900: "#26181a",
-    950: "#160e0a"
-  },
-  // Pale lemon — anchor: butter-200 = #FFF5BF
-  butter: {
-    50: "#ffffe8",
-    100: "#fffad0",
-    200: "#fff5bf",
-    300: "#fde870",
-    400: "#f6d42a",
-    500: "#dab010",
-    600: "#a88008",
-    700: "#7c5c04",
-    800: "#543e02",
-    900: "#382801",
-    950: "#221600"
-  },
-  // Vivid purple — anchor: purple-500 = #C100F1 (brand.primary)
-  purple: {
-    50: "#fdf0ff",
-    100: "#f5d6ff",
-    200: "#e8a8ff",
-    300: "#d870f9",
-    400: "#c840f6",
-    500: "#c100f1",
-    600: "#9c00c0",
-    700: "#740092",
-    800: "#4e0062",
-    900: "#330040",
-    950: "#200028"
-  },
-  // Legacy functional colors — used by components not yet migrated to the new palette.
-  brand: {
-    primary: "#C100F1",
-    // purple-500
-    secondary: "#FFF5BF"
-    // butter-200
-  },
-  destructive: "#dc2626",
-  // red-600
-  /* ============================================================== *
-   *  SEMANTIC — what components reference                           *
-   * ============================================================== */
-  semantic: {
-    light: {
-      background: "#ffffff",
-      foreground: "#26181a",
-      // taupe-900
-      card: "#ffffff",
-      cardForeground: "#26181a",
-      surface: "#f9f7f5",
-      // taupe-50
-      surfaceForeground: "#332924",
-      // taupe-800
-      border: "#f2eeea",
-      // taupe-100
-      input: "#f2eeea",
-      muted: "#f9f7f5",
-      mutedForeground: "#7d6960",
-      // taupe-500
-      accent: "#fdf0ff",
-      // purple-50
-      accentForeground: "#740092",
-      // purple-700
-      primary: "#c100f1",
-      // purple-500 = brand.primary
-      primaryForeground: "#ffffff",
-      secondary: "#f9f7f5",
-      // taupe-50
-      secondaryForeground: "#4a3d38",
-      // taupe-700
-      destructive: "#dc2626",
-      destructiveForeground: "#ffffff",
-      success: "#CDEA19",
-      // lime — functional semantic only
-      successForeground: "#26181a",
-      warning: "#fff5bf",
-      // butter-200 = brand.secondary
-      warningForeground: "#26181a",
-      // taupe-900
-      ring: "#c100f1"
-      // purple-500 = brand.primary
-    },
-    dark: {
-      background: "#160e0a",
-      // taupe-950
-      foreground: "#f9f7f5",
-      // taupe-50
-      card: "#26181a",
-      // taupe-900
-      cardForeground: "#f9f7f5",
-      surface: "#26181a",
-      surfaceForeground: "#f2eeea",
-      border: "#332924",
-      // taupe-800
-      input: "#332924",
-      muted: "#26181a",
-      mutedForeground: "#a8978a",
-      // taupe-400
-      accent: "#330040",
-      // purple-900
-      accentForeground: "#f5d6ff",
-      // purple-100
-      primary: "#c100f1",
-      // purple-500 — brand stays consistent (D8)
-      primaryForeground: "#ffffff",
-      secondary: "#26181a",
-      secondaryForeground: "#f2eeea",
-      destructive: "#ef4444",
-      // red-500 (slightly lighter for dark)
-      destructiveForeground: "#ffffff",
-      success: "#CDEA19",
-      // lime — functional semantic only
-      successForeground: "#160e0a",
-      warning: "#221600",
-      // butter-950 surface
-      warningForeground: "#fffad0",
-      // butter-100
-      ring: "#c100f1"
-      // purple-500 = brand.primary
-    }
-  },
-  /* ============================================================== *
-   *  TYPOGRAPHY                                                      *
-   * ============================================================== */
-  fontFamily: {
-    sans: 'Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
-    serif: '"Instrument Serif", ui-serif, Georgia, serif',
-    mono: 'ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace'
-  },
-  /** Type scale utilities — emitted as Tailwind v4 `@utility` blocks. */
-  typeScale: {
-    "display-xl": { family: "serif", size: "3rem", weight: 400, lineHeight: "1.15" },
-    display: { family: "serif", size: "2.25rem", weight: 400, lineHeight: "1.15" },
-    "heading-xl": { family: "serif", size: "1.875rem", weight: 400, lineHeight: "1.2" },
-    heading: { family: "serif", size: "1.5rem", weight: 400, lineHeight: "1.2" },
-    subheading: { family: "serif", size: "1.25rem", weight: 400, lineHeight: "1.4" },
-    "body-lg": { family: "sans", size: "1rem", weight: 400, lineHeight: "1.625" },
-    body: { family: "sans", size: "0.875rem", weight: 400, lineHeight: "1.625" },
-    caption: { family: "sans", size: "0.75rem", weight: 400, lineHeight: "1.625" },
-    "caption-xs": { family: "sans", size: "0.625rem", weight: 400, lineHeight: "1.625" },
-    label: {
-      family: "sans",
-      size: "0.75rem",
-      weight: 600,
-      lineHeight: "1",
-      letterSpacing: "0.1em",
-      textTransform: "uppercase"
-    }
-  },
-  /* ============================================================== *
-   *  GEOMETRY                                                        *
-   * ============================================================== */
-  radius: {
-    base: "0.5rem",
-    sm: "calc(0.5rem - 4px)",
-    md: "calc(0.5rem - 2px)",
-    lg: "0.5rem",
-    xl: "calc(0.5rem + 4px)",
-    full: "9999px"
-  },
-  shadow: {
-    natural: "0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06)",
-    elevated: "0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06), 0 6px 6px -3px rgba(0, 0, 0, 0.06), 0 12px 12px -6px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04), 0 24px 24px 2px rgba(0, 0, 0, 0.1)"
-  },
-  /* ============================================================== *
-   *  ANIMATION                                                       *
-   * ============================================================== */
-  animation: {
-    "accordion-down": "accordion-down 0.2s ease-out",
-    "accordion-up": "accordion-up 0.2s ease-out",
-    "caret-blink": "caret-blink 1.25s ease-out infinite"
-  }
-};
-
-export { tokens };
+export { tokens } from './chunk-J2QQDUF4.js';
 //# sourceMappingURL=tokens.js.map
 //# sourceMappingURL=tokens.js.map

package/dist/tokens.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/tokens/tokens.ts"],"names":[],"mappings":"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","file":"tokens.js","sourcesContent":["// @hilum/ui/tokens — JS-first design tokens (D6).\n//\n// This module is the single source of truth for the Hilum visual identity.\n// A build step (scripts/build-tokens.mjs) reads the compiled output of this\n// file and emits dist/tokens.css for consumers to `@import`.\n//\n// Brand model: D8 — fully fixed. No per-app overrides.\n// Color modes:  D7 — light + dark, both auto (`prefers-color-scheme`) and\n//                    explicit via `[data-theme]`.\n//\n// Core brand colors:\n//   brand.primary   #C100F1 — vivid purple — purple-500 on the scale below\n//   brand.secondary #FFF5BF — pale lemon   — butter-200 on the scale below\n//\n// taupe — neutral spine for text, borders, and structure (unchanged)\n\nexport const tokens = {\n  /* ============================================================== *\n   *  PALETTE — concrete colors                                      *\n   * ============================================================== */\n\n  taupe: {\n    50: \"#f9f7f5\",\n    100: \"#f2eeea\",\n    200: \"#e3dcd4\",\n    300: \"#c9beb3\",\n    400: \"#a8978a\",\n    500: \"#7d6960\",\n    600: \"#5d4e47\",\n    700: \"#4a3d38\",\n    800: \"#332924\",\n    900: \"#26181a\",\n    950: \"#160e0a\",\n  },\n\n  // Pale lemon — anchor: butter-200 = #FFF5BF\n  butter: {\n    50: \"#ffffe8\",\n    100: \"#fffad0\",\n    200: \"#fff5bf\",\n    300: \"#fde870\",\n    400: \"#f6d42a\",\n    500: \"#dab010\",\n    600: \"#a88008\",\n    700: \"#7c5c04\",\n    800: \"#543e02\",\n    900: \"#382801\",\n    950: \"#221600\",\n  },\n\n  // Vivid purple — anchor: purple-500 = #C100F1 (brand.primary)\n  purple: {\n    50: \"#fdf0ff\",\n    100: \"#f5d6ff\",\n    200: \"#e8a8ff\",\n    300: \"#d870f9\",\n    400: \"#c840f6\",\n    500: \"#c100f1\",\n    600: \"#9c00c0\",\n    700: \"#740092\",\n    800: \"#4e0062\",\n    900: \"#330040\",\n    950: \"#200028\",\n  },\n\n  // Legacy functional colors — used by components not yet migrated to the new palette.\n  brand: {\n    primary: \"#C100F1\", // purple-500\n    secondary: \"#FFF5BF\", // butter-200\n  },\n\n  destructive: \"#dc2626\", // red-600\n\n  /* ============================================================== *\n   *  SEMANTIC — what components reference                           *\n   * ============================================================== */\n\n  semantic: {\n    light: {\n      background: \"#ffffff\",\n      foreground: \"#26181a\", // taupe-900\n      card: \"#ffffff\",\n      cardForeground: \"#26181a\",\n      surface: \"#f9f7f5\", // taupe-50\n      surfaceForeground: \"#332924\", // taupe-800\n      border: \"#f2eeea\", // taupe-100\n      input: \"#f2eeea\",\n      muted: \"#f9f7f5\",\n      mutedForeground: \"#7d6960\", // taupe-500\n      accent: \"#fdf0ff\", // purple-50\n      accentForeground: \"#740092\", // purple-700\n      primary: \"#c100f1\", // purple-500 = brand.primary\n      primaryForeground: \"#ffffff\",\n      secondary: \"#f9f7f5\", // taupe-50\n      secondaryForeground: \"#4a3d38\", // taupe-700\n      destructive: \"#dc2626\",\n      destructiveForeground: \"#ffffff\",\n      success: \"#CDEA19\", // lime — functional semantic only\n      successForeground: \"#26181a\",\n      warning: \"#fff5bf\", // butter-200 = brand.secondary\n      warningForeground: \"#26181a\", // taupe-900\n      ring: \"#c100f1\", // purple-500 = brand.primary\n    },\n    dark: {\n      background: \"#160e0a\", // taupe-950\n      foreground: \"#f9f7f5\", // taupe-50\n      card: \"#26181a\", // taupe-900\n      cardForeground: \"#f9f7f5\",\n      surface: \"#26181a\",\n      surfaceForeground: \"#f2eeea\",\n      border: \"#332924\", // taupe-800\n      input: \"#332924\",\n      muted: \"#26181a\",\n      mutedForeground: \"#a8978a\", // taupe-400\n      accent: \"#330040\", // purple-900\n      accentForeground: \"#f5d6ff\", // purple-100\n      primary: \"#c100f1\", // purple-500 — brand stays consistent (D8)\n      primaryForeground: \"#ffffff\",\n      secondary: \"#26181a\",\n      secondaryForeground: \"#f2eeea\",\n      destructive: \"#ef4444\", // red-500 (slightly lighter for dark)\n      destructiveForeground: \"#ffffff\",\n      success: \"#CDEA19\", // lime — functional semantic only\n      successForeground: \"#160e0a\",\n      warning: \"#221600\", // butter-950 surface\n      warningForeground: \"#fffad0\", // butter-100\n      ring: \"#c100f1\", // purple-500 = brand.primary\n    },\n  },\n\n  /* ============================================================== *\n   *  TYPOGRAPHY                                                      *\n   * ============================================================== */\n\n  fontFamily: {\n    sans: 'Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif',\n    serif: '\"Instrument Serif\", ui-serif, Georgia, serif',\n    mono: 'ui-monospace, \"SFMono-Regular\", \"Menlo\", \"Consolas\", monospace',\n  },\n\n  /** Type scale utilities — emitted as Tailwind v4 `@utility` blocks. */\n  typeScale: {\n    \"display-xl\": { family: \"serif\", size: \"3rem\", weight: 400, lineHeight: \"1.15\" },\n    display: { family: \"serif\", size: \"2.25rem\", weight: 400, lineHeight: \"1.15\" },\n    \"heading-xl\": { family: \"serif\", size: \"1.875rem\", weight: 400, lineHeight: \"1.2\" },\n    heading: { family: \"serif\", size: \"1.5rem\", weight: 400, lineHeight: \"1.2\" },\n    subheading: { family: \"serif\", size: \"1.25rem\", weight: 400, lineHeight: \"1.4\" },\n    \"body-lg\": { family: \"sans\", size: \"1rem\", weight: 400, lineHeight: \"1.625\" },\n    body: { family: \"sans\", size: \"0.875rem\", weight: 400, lineHeight: \"1.625\" },\n    caption: { family: \"sans\", size: \"0.75rem\", weight: 400, lineHeight: \"1.625\" },\n    \"caption-xs\": { family: \"sans\", size: \"0.625rem\", weight: 400, lineHeight: \"1.625\" },\n    label: {\n      family: \"sans\",\n      size: \"0.75rem\",\n      weight: 600,\n      lineHeight: \"1\",\n      letterSpacing: \"0.1em\",\n      textTransform: \"uppercase\" as const,\n    },\n  },\n\n  /* ============================================================== *\n   *  GEOMETRY                                                        *\n   * ============================================================== */\n\n  radius: {\n    base: \"0.5rem\",\n    sm: \"calc(0.5rem - 4px)\",\n    md: \"calc(0.5rem - 2px)\",\n    lg: \"0.5rem\",\n    xl: \"calc(0.5rem + 4px)\",\n    full: \"9999px\",\n  },\n\n  shadow: {\n    natural:\n      \"0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06)\",\n    elevated:\n      \"0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06), 0 6px 6px -3px rgba(0, 0, 0, 0.06), 0 12px 12px -6px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04), 0 24px 24px 2px rgba(0, 0, 0, 0.1)\",\n  },\n\n  /* ============================================================== *\n   *  ANIMATION                                                       *\n   * ============================================================== */\n\n  animation: {\n    \"accordion-down\": \"accordion-down 0.2s ease-out\",\n    \"accordion-up\": \"accordion-up 0.2s ease-out\",\n    \"caret-blink\": \"caret-blink 1.25s ease-out infinite\",\n  },\n} as const;\n\nexport type Tokens = typeof tokens;\nexport type SemanticTokens = typeof tokens.semantic.light;\n"]}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"tokens.js"}