@tenerife.music/ui 0.0.7 → 1.0.1

package/dist/tokens/index.mjs

@@ -1,170 +1,430 @@
 "use client";
-import { b as h } from "../radius-NOytgRst.js";
-const r = {
-  day: {
-    background: "hsl(var(--background))",
-    foreground: "hsl(var(--foreground))",
-    card: "hsl(var(--card))",
-    cardForeground: "hsl(var(--card-foreground))",
-    popover: "hsl(var(--popover))",
-    popoverForeground: "hsl(var(--popover-foreground))",
-    primary: "hsl(var(--tm-primary))",
-    primaryForeground: "hsl(var(--tm-primary-foreground))",
-    secondary: "hsl(var(--tm-secondary))",
-    secondaryForeground: "hsl(var(--tm-secondary-foreground))",
-    muted: "hsl(var(--muted))",
-    mutedForeground: "hsl(var(--muted-foreground))",
-    accent: "hsl(var(--tm-accent))",
-    accentForeground: "hsl(var(--tm-accent-foreground))",
-    destructive: "hsl(var(--destructive))",
-    destructiveForeground: "hsl(var(--destructive-foreground))",
-    border: "hsl(var(--border))",
-    input: "hsl(var(--input))",
-    ring: "hsl(var(--ring))",
-    chart1: "hsl(12, 76%, 61%)",
-    chart2: "hsl(173, 58%, 39%)",
-    chart3: "hsl(197, 37%, 24%)",
-    chart4: "hsl(43, 74%, 66%)",
-    chart5: "hsl(27, 87%, 67%)"
-  },
-  night: {
-    background: "hsl(var(--background))",
-    foreground: "hsl(var(--foreground))",
-    card: "hsl(var(--card))",
-    cardForeground: "hsl(var(--card-foreground))",
-    popover: "hsl(var(--popover))",
-    popoverForeground: "hsl(var(--popover-foreground))",
-    primary: "hsl(var(--tm-primary))",
-    primaryForeground: "hsl(var(--tm-primary-foreground))",
-    secondary: "hsl(var(--tm-secondary))",
-    secondaryForeground: "hsl(var(--tm-secondary-foreground))",
-    muted: "hsl(var(--muted))",
-    mutedForeground: "hsl(var(--muted-foreground))",
-    accent: "hsl(var(--tm-accent))",
-    accentForeground: "hsl(var(--tm-accent-foreground))",
-    destructive: "hsl(var(--destructive))",
-    destructiveForeground: "hsl(var(--destructive-foreground))",
-    border: "hsl(var(--border))",
-    input: "hsl(var(--input))",
-    ring: "hsl(var(--ring))",
-    chart1: "hsl(220, 70%, 50%)",
-    chart2: "hsl(160, 60%, 45%)",
-    chart3: "hsl(30, 80%, 55%)",
-    chart4: "hsl(280, 65%, 60%)",
-    chart5: "hsl(340, 75%, 55%)"
-  }
-}, e = {
-  background: "hsl(var(--background))",
-  foreground: "hsl(var(--foreground))",
+import { m as x, i as h } from "../motion-CuHacXY1.js";
+import { a as U, n as E, b as L, h as N, e as A, g as B, l as D, p as $, r as G, s as q, d as J, f as K, c as P, o as Q, j as X, t as Y, k as Z } from "../motion-CuHacXY1.js";
+import { r as d } from "../radius-CAu4qr9R.js";
+import { b as ee, c as te, t as le } from "../radius-CAu4qr9R.js";
+const i = {
+  none: "none",
+  xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+  sm: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
+  md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
+  lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",
+  xl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",
+  "2xl": "0 25px 50px -12px rgb(0 0 0 / 0.25)"
+}, g = {
+  xs: "0 1px 2px 0 hsl(var(--primary-500) / 0.15)",
+  sm: "0 2px 4px 0 hsl(var(--primary-500) / 0.2)",
+  md: "0 4px 8px 0 hsl(var(--primary-500) / 0.3)",
+  lg: "0 8px 16px 0 hsl(var(--primary-500) / 0.4)",
+  xl: "0 12px 24px 0 hsl(var(--primary-500) / 0.5)",
+  "2xl": "0 16px 32px 0 hsl(var(--primary-500) / 0.6)"
+}, c = {
+  xs: "0 1px 2px 0 hsl(var(--accent-500) / 0.15)",
+  sm: "0 2px 4px 0 hsl(var(--accent-500) / 0.2)",
+  md: "0 4px 8px 0 hsl(var(--accent-500) / 0.3)",
+  lg: "0 8px 16px 0 hsl(var(--accent-500) / 0.4)",
+  xl: "0 12px 24px 0 hsl(var(--accent-500) / 0.5)",
+  "2xl": "0 16px 32px 0 hsl(var(--accent-500) / 0.6)"
+}, m = {
+  // Primary glow effects
+  "glow-primary": "0 0 20px 0 hsl(var(--primary-500) / 0.5), 0 0 40px 0 hsl(var(--primary-500) / 0.3)",
+  "glow-primary-subtle": "0 0 8px 0 hsl(var(--primary-500) / 0.3)",
+  "glow-primary-medium": "0 0 16px 0 hsl(var(--primary-500) / 0.5)",
+  "glow-primary-strong": "0 0 24px 0 hsl(var(--primary-500) / 0.6)",
+  // Accent glow effects
+  "glow-accent": "0 0 20px 0 hsl(var(--accent-500) / 0.5), 0 0 40px 0 hsl(var(--accent-500) / 0.3)",
+  "glow-accent-subtle": "0 0 8px 0 hsl(var(--accent-500) / 0.3)",
+  "glow-accent-medium": "0 0 16px 0 hsl(var(--accent-500) / 0.5)",
+  "glow-accent-strong": "0 0 24px 0 hsl(var(--accent-500) / 0.6)"
+}, p = {
+  default: "0 0 0 3px hsl(var(--ring) / 0.5)",
+  primary: "0 0 0 3px hsl(var(--primary-500) / 0.3)",
+  accent: "0 0 0 3px hsl(var(--accent-500) / 0.3)",
+  "focus-primary": "0 0 0 3px hsl(var(--primary-500) / 0.3)",
+  "focus-accent": "0 0 0 3px hsl(var(--accent-500) / 0.3)"
+}, y = {
+  // Elevation shadows
+  "--shadow-none": i.none,
+  "--shadow-xs": i.xs,
+  "--shadow-sm": i.sm,
+  "--shadow-md": i.md,
+  "--shadow-lg": i.lg,
+  "--shadow-xl": i.xl,
+  "--shadow-2xl": i["2xl"],
+  // Primary colored shadows
+  "--shadow-primary-xs": g.xs,
+  "--shadow-primary-sm": g.sm,
+  "--shadow-primary-md": g.md,
+  "--shadow-primary-lg": g.lg,
+  "--shadow-primary-xl": g.xl,
+  "--shadow-primary-2xl": g["2xl"],
+  // Accent colored shadows
+  "--shadow-accent-xs": c.xs,
+  "--shadow-accent-sm": c.sm,
+  "--shadow-accent-md": c.md,
+  "--shadow-accent-lg": c.lg,
+  "--shadow-accent-xl": c.xl,
+  "--shadow-accent-2xl": c["2xl"],
+  // Glow effects
+  "--glow-primary": m["glow-primary"],
+  "--glow-primary-subtle": m["glow-primary-subtle"],
+  "--glow-primary-medium": m["glow-primary-medium"],
+  "--glow-primary-strong": m["glow-primary-strong"],
+  "--glow-accent": m["glow-accent"],
+  "--glow-accent-subtle": m["glow-accent-subtle"],
+  "--glow-accent-medium": m["glow-accent-medium"],
+  "--glow-accent-strong": m["glow-accent-strong"],
+  // Focus rings
+  "--focus-ring-default": p.default,
+  "--focus-ring-primary": p.primary,
+  "--focus-ring-accent": p.accent,
+  "--focus-primary": p["focus-primary"],
+  "--focus-accent": p["focus-accent"]
+}, z = {
   card: {
-    DEFAULT: "hsl(var(--card))",
-    foreground: "hsl(var(--card-foreground))"
-  },
-  popover: {
-    DEFAULT: "hsl(var(--popover))",
-    foreground: "hsl(var(--popover-foreground))"
-  },
-  primary: {
-    DEFAULT: "hsl(var(--tm-primary))",
-    foreground: "hsl(var(--tm-primary-foreground))"
-  },
-  secondary: {
-    DEFAULT: "hsl(var(--tm-secondary))",
-    foreground: "hsl(var(--tm-secondary-foreground))"
-  },
-  muted: {
-    DEFAULT: "hsl(var(--muted))",
-    foreground: "hsl(var(--muted-foreground))"
-  },
-  accent: {
-    DEFAULT: "hsl(var(--tm-accent))",
-    foreground: "hsl(var(--tm-accent-foreground))"
-  },
-  destructive: {
-    DEFAULT: "hsl(var(--destructive))",
-    foreground: "hsl(var(--destructive-foreground))"
-  },
-  border: "hsl(var(--border))",
-  input: "hsl(var(--input))",
-  ring: "hsl(var(--ring))",
-  chart: {
-    1: "hsl(var(--chart-1))",
-    2: "hsl(var(--chart-2))",
-    3: "hsl(var(--chart-3))",
-    4: "hsl(var(--chart-4))",
-    5: "hsl(var(--chart-5))"
+    default: i.sm,
+    hover: i.md,
+    active: i.xs,
+    selected: g.sm
+  },
+  button: {
+    default: i.xs,
+    hover: i.sm,
+    active: i.none,
+    focus: p.primary
+  },
+  "button-accent": {
+    default: c.xs,
+    hover: c.sm,
+    active: i.none,
+    focus: p.accent
+  },
+  modal: {
+    default: i.xl,
+    backdrop: "rgba(0, 0, 0, 0.5)"
+  },
+  dropdown: {
+    default: i.md,
+    hover: i.lg
+  },
+  tooltip: {
+    default: i.sm
+  },
+  toast: {
+    default: i.lg,
+    success: "0 10px 15px -3px hsl(var(--success) / 0.3)",
+    error: "0 10px 15px -3px hsl(var(--error) / 0.3)"
   }
-}, o = {
+}, F = {
+  boxShadow: {
+    // Elevation shadows
+    none: i.none,
+    xs: i.xs,
+    sm: i.sm,
+    md: i.md,
+    lg: i.lg,
+    xl: i.xl,
+    "2xl": i["2xl"],
+    // Primary colored shadows
+    "primary-xs": g.xs,
+    "primary-sm": g.sm,
+    "primary-md": g.md,
+    "primary-lg": g.lg,
+    "primary-xl": g.xl,
+    "primary-2xl": g["2xl"],
+    // Accent colored shadows
+    "accent-xs": c.xs,
+    "accent-sm": c.sm,
+    "accent-md": c.md,
+    "accent-lg": c.lg,
+    "accent-xl": c.xl,
+    "accent-2xl": c["2xl"],
+    // Glow effects
+    "glow-primary": m["glow-primary"],
+    "glow-primary-subtle": m["glow-primary-subtle"],
+    "glow-primary-medium": m["glow-primary-medium"],
+    "glow-primary-strong": m["glow-primary-strong"],
+    "glow-accent": m["glow-accent"],
+    "glow-accent-subtle": m["glow-accent-subtle"],
+    "glow-accent-medium": m["glow-accent-medium"],
+    "glow-accent-strong": m["glow-accent-strong"],
+    // Focus rings (using box-shadow for focus states)
+    "focus-ring": p.default,
+    "focus-primary": p["focus-primary"],
+    "focus-accent": p["focus-accent"]
+  },
+  // Ring width (for focus rings using ring utilities)
+  ringWidth: {
+    DEFAULT: "3px",
+    sm: "2px",
+    md: "3px",
+    lg: "4px"
+  },
+  // Ring color (for focus rings)
+  ringColor: {
+    DEFAULT: "hsl(var(--ring) / 0.5)",
+    primary: "hsl(var(--primary-500) / 0.3)",
+    accent: "hsl(var(--accent-500) / 0.3)",
+    "focus-primary": "hsl(var(--primary-500) / 0.3)",
+    "focus-accent": "hsl(var(--accent-500) / 0.3)"
+  }
+}, t = {
+  // Zero spacing
+  0: "0",
   px: "1px",
-  0: "0px",
+  // Half unit (4px)
   0.5: "0.125rem",
-  // 2px
-  1: "0.25rem",
   // 4px
+  // Base unit multiples (8px increments)
+  1: "0.25rem",
+  // 4px (half unit, common)
   1.5: "0.375rem",
-  // 6px
+  // 6px (rare, for fine adjustments)
   2: "0.5rem",
-  // 8px
+  // 8px (base unit)
   2.5: "0.625rem",
-  // 10px
+  // 10px (rare)
   3: "0.75rem",
-  // 12px
+  // 12px (1.5 × base)
   3.5: "0.875rem",
-  // 14px
+  // 14px (rare)
   4: "1rem",
-  // 16px
+  // 16px (2 × base)
   5: "1.25rem",
-  // 20px
+  // 20px (2.5 × base)
   6: "1.5rem",
-  // 24px
+  // 24px (3 × base)
   7: "1.75rem",
-  // 28px
+  // 28px (3.5 × base)
   8: "2rem",
-  // 32px
+  // 32px (4 × base)
   9: "2.25rem",
-  // 36px
+  // 36px (4.5 × base)
   10: "2.5rem",
-  // 40px
+  // 40px (5 × base)
   11: "2.75rem",
-  // 44px
+  // 44px (5.5 × base)
   12: "3rem",
-  // 48px
+  // 48px (6 × base)
   14: "3.5rem",
-  // 56px
+  // 56px (7 × base)
   16: "4rem",
-  // 64px
+  // 64px (8 × base)
   20: "5rem",
-  // 80px
+  // 80px (10 × base)
   24: "6rem",
-  // 96px
+  // 96px (12 × base)
+  // Extended scale for larger spacing
   28: "7rem",
-  // 112px
+  // 112px (14 × base)
   32: "8rem",
-  // 128px
+  // 128px (16 × base)
   36: "9rem",
-  // 144px
+  // 144px (18 × base)
   40: "10rem",
-  // 160px
+  // 160px (20 × base)
   44: "11rem",
-  // 176px
+  // 176px (22 × base)
   48: "12rem",
-  // 192px
+  // 192px (24 × base)
   52: "13rem",
-  // 208px
+  // 208px (26 × base)
   56: "14rem",
-  // 224px
+  // 224px (28 × base)
   60: "15rem",
-  // 240px
+  // 240px (30 × base)
   64: "16rem",
-  // 256px
+  // 256px (32 × base)
   72: "18rem",
-  // 288px
+  // 288px (36 × base)
   80: "20rem",
-  // 320px
+  // 320px (40 × base)
   96: "24rem"
-  // 384px
-}, a = {
+  // 384px (48 × base)
+}, r = {
+  // Extra small spacing (tight, minimal)
+  xs: t[1],
+  // 4px (0.25rem)
+  // Small spacing (compact)
+  sm: t[2],
+  // 8px (0.5rem)
+  // Medium spacing (default)
+  md: t[4],
+  // 16px (1rem)
+  // Large spacing (spacious)
+  lg: t[6],
+  // 24px (1.5rem)
+  // Extra large spacing (very spacious)
+  xl: t[8],
+  // 32px (2rem)
+  // 2XL spacing (section-level)
+  "2xl": t[12],
+  // 48px (3rem)
+  // 3XL spacing (major sections)
+  "3xl": t[16],
+  // 64px (4rem)
+  // 4XL spacing (page sections)
+  "4xl": t[20],
+  // 80px (5rem)
+  // 5XL spacing (hero sections)
+  "5xl": t[24],
+  // 96px (6rem)
+  // None (no spacing)
+  none: t[0]
+  // 0
+}, l = {
+  // Section spacing (vertical spacing between major sections)
+  section: {
+    xs: t[6],
+    // 24px (compact sections)
+    sm: t[8],
+    // 32px (small sections)
+    md: t[12],
+    // 48px (default sections)
+    lg: t[16],
+    // 64px (large sections)
+    xl: t[20],
+    // 80px (extra large sections)
+    "2xl": t[24]
+    // 96px (hero sections)
+  },
+  // Container spacing (padding inside containers)
+  container: {
+    xs: t[2],
+    // 8px (tight containers)
+    sm: t[4],
+    // 16px (compact containers)
+    md: t[6],
+    // 24px (default containers)
+    lg: t[8],
+    // 32px (spacious containers)
+    xl: t[12]
+    // 48px (very spacious containers)
+  },
+  // Grid spacing (gap between grid items)
+  grid: {
+    xs: t[2],
+    // 8px (tight grids)
+    sm: t[4],
+    // 16px (compact grids)
+    md: t[6],
+    // 24px (default grids)
+    lg: t[8],
+    // 32px (spacious grids)
+    xl: t[12]
+    // 48px (very spacious grids)
+  },
+  // Stack spacing (gap between stacked items)
+  stack: {
+    xs: t[1],
+    // 4px (tight stacks)
+    sm: t[2],
+    // 8px (compact stacks)
+    md: t[4],
+    // 16px (default stacks)
+    lg: t[6],
+    // 24px (spacious stacks)
+    xl: t[8]
+    // 32px (very spacious stacks)
+  },
+  // Component internal spacing (padding inside components)
+  component: {
+    xs: t[1],
+    // 4px (tight components)
+    sm: t[2],
+    // 8px (compact components)
+    md: t[4],
+    // 16px (default components)
+    lg: t[6],
+    // 24px (spacious components)
+    xl: t[8]
+    // 32px (extra spacious components)
+  }
+}, f = {
+  // Base spacing scale
+  "--spacing-0": t[0],
+  "--spacing-px": t.px,
+  "--spacing-0-5": t[0.5],
+  "--spacing-1": t[1],
+  "--spacing-1-5": t[1.5],
+  "--spacing-2": t[2],
+  "--spacing-2-5": t[2.5],
+  "--spacing-3": t[3],
+  "--spacing-3-5": t[3.5],
+  "--spacing-4": t[4],
+  "--spacing-5": t[5],
+  "--spacing-6": t[6],
+  "--spacing-7": t[7],
+  "--spacing-8": t[8],
+  "--spacing-9": t[9],
+  "--spacing-10": t[10],
+  "--spacing-11": t[11],
+  "--spacing-12": t[12],
+  "--spacing-14": t[14],
+  "--spacing-16": t[16],
+  "--spacing-20": t[20],
+  "--spacing-24": t[24],
+  // Semantic spacing
+  "--spacing-xs": r.xs,
+  "--spacing-sm": r.sm,
+  "--spacing-md": r.md,
+  "--spacing-lg": r.lg,
+  "--spacing-xl": r.xl,
+  "--spacing-2xl": r["2xl"],
+  "--spacing-3xl": r["3xl"],
+  "--spacing-4xl": r["4xl"],
+  "--spacing-5xl": r["5xl"],
+  "--spacing-none": r.none,
+  // Layout spacing - sections
+  "--layout-section-xs": l.section.xs,
+  "--layout-section-sm": l.section.sm,
+  "--layout-section-md": l.section.md,
+  "--layout-section-lg": l.section.lg,
+  "--layout-section-xl": l.section.xl,
+  "--layout-section-2xl": l.section["2xl"],
+  // Layout spacing - containers
+  "--layout-container-xs": l.container.xs,
+  "--layout-container-sm": l.container.sm,
+  "--layout-container-md": l.container.md,
+  "--layout-container-lg": l.container.lg,
+  "--layout-container-xl": l.container.xl,
+  // Layout spacing - grids
+  "--layout-grid-xs": l.grid.xs,
+  "--layout-grid-sm": l.grid.sm,
+  "--layout-grid-md": l.grid.md,
+  "--layout-grid-lg": l.grid.lg,
+  "--layout-grid-xl": l.grid.xl,
+  // Layout spacing - stacks
+  "--layout-stack-xs": l.stack.xs,
+  "--layout-stack-sm": l.stack.sm,
+  "--layout-stack-md": l.stack.md,
+  "--layout-stack-lg": l.stack.lg,
+  "--layout-stack-xl": l.stack.xl,
+  // Layout spacing - components
+  "--layout-component-xs": l.component.xs,
+  "--layout-component-sm": l.component.sm,
+  "--layout-component-md": l.component.md,
+  "--layout-component-lg": l.component.lg,
+  "--layout-component-xl": l.component.xl
+}, W = {
+  spacing: {
+    ...t,
+    // Add semantic tokens as aliases
+    xs: r.xs,
+    sm: r.sm,
+    md: r.md,
+    lg: r.lg,
+    xl: r.xl,
+    "2xl": r["2xl"],
+    "3xl": r["3xl"],
+    "4xl": r["4xl"],
+    "5xl": r["5xl"],
+    none: r.none
+  }
+}, n = {
+  // Primary font - Inter (default sans)
   sans: [
+    "Inter",
     "ui-sans-serif",
     "system-ui",
     "-apple-system",
@@ -180,14 +440,33 @@ const r = {
     "Segoe UI Symbol",
     "Noto Color Emoji"
   ],
-  serif: [
-    "ui-serif",
-    "Georgia",
-    "Cambria",
-    "Times New Roman",
-    "Times",
-    "serif"
+  // Optional font - Satoshi
+  satoshi: [
+    "Satoshi",
+    "Inter",
+    "ui-sans-serif",
+    "system-ui",
+    "-apple-system",
+    "BlinkMacSystemFont",
+    "Segoe UI",
+    "Roboto",
+    "sans-serif"
+  ],
+  // Display font - Clash Display (for headings and hero sections)
+  display: [
+    "Clash Display",
+    "Inter",
+    "ui-sans-serif",
+    "system-ui",
+    "-apple-system",
+    "BlinkMacSystemFont",
+    "Segoe UI",
+    "Roboto",
+    "sans-serif"
   ],
+  // Serif font family
+  serif: ["ui-serif", "Georgia", "Cambria", "Times New Roman", "Times", "serif"],
+  // Monospace font family
   mono: [
     "ui-monospace",
     "SFMono-Regular",
@@ -198,21 +477,55 @@ const r = {
     "Courier New",
     "monospace"
   ]
-}, n = {
-  xs: ["0.75rem", { lineHeight: "1rem" }],
-  sm: ["0.875rem", { lineHeight: "1.25rem" }],
-  base: ["1rem", { lineHeight: "1.5rem" }],
-  lg: ["1.125rem", { lineHeight: "1.75rem" }],
-  xl: ["1.25rem", { lineHeight: "1.75rem" }],
-  "2xl": ["1.5rem", { lineHeight: "2rem" }],
-  "3xl": ["1.875rem", { lineHeight: "2.25rem" }],
-  "4xl": ["2.25rem", { lineHeight: "2.5rem" }],
-  "5xl": ["3rem", { lineHeight: "1" }],
-  "6xl": ["3.75rem", { lineHeight: "1" }],
-  "7xl": ["4.5rem", { lineHeight: "1" }],
-  "8xl": ["6rem", { lineHeight: "1" }],
-  "9xl": ["8rem", { lineHeight: "1" }]
-}, s = {
+}, e = {
+  // text-xs: 12px base, scales from 0.75rem to 0.875rem
+  xs: [
+    "clamp(0.75rem, 0.7rem + 0.125vw, 0.875rem)",
+    { lineHeight: "1rem", letterSpacing: "0.05em" }
+  ],
+  // text-sm: 14px base, scales from 0.875rem to 1rem
+  sm: [
+    "clamp(0.875rem, 0.8rem + 0.25vw, 1rem)",
+    { lineHeight: "1.25rem", letterSpacing: "0.025em" }
+  ],
+  // text-base: 16px base, scales from 1rem to 1.125rem
+  base: ["clamp(1rem, 0.95rem + 0.25vw, 1.125rem)", { lineHeight: "1.5rem", letterSpacing: "0em" }],
+  // text-lg: 18px base, scales from 1.125rem to 1.25rem
+  lg: [
+    "clamp(1.125rem, 1rem + 0.5vw, 1.25rem)",
+    { lineHeight: "1.75rem", letterSpacing: "-0.025em" }
+  ],
+  // text-xl: 20px base, scales from 1.25rem to 1.5rem
+  xl: [
+    "clamp(1.25rem, 1.1rem + 0.75vw, 1.5rem)",
+    { lineHeight: "1.75rem", letterSpacing: "-0.025em" }
+  ],
+  // text-2xl: 24px base, scales from 1.5rem to 2rem
+  "2xl": [
+    "clamp(1.5rem, 1.25rem + 1.25vw, 2rem)",
+    { lineHeight: "2rem", letterSpacing: "-0.05em" }
+  ],
+  // text-3xl: 30px base, scales from 1.875rem to 2.5rem
+  "3xl": [
+    "clamp(1.875rem, 1.5rem + 1.875vw, 2.5rem)",
+    { lineHeight: "2.25rem", letterSpacing: "-0.05em" }
+  ],
+  // text-4xl: 36px base, scales from 2.25rem to 3rem
+  "4xl": [
+    "clamp(2.25rem, 1.75rem + 2.5vw, 3rem)",
+    { lineHeight: "2.5rem", letterSpacing: "-0.025em" }
+  ],
+  // text-5xl: 48px base, scales from 3rem to 4rem
+  "5xl": ["clamp(3rem, 2rem + 5vw, 4rem)", { lineHeight: "1", letterSpacing: "-0.025em" }],
+  // text-6xl: 60px base, scales from 3.75rem to 5rem
+  "6xl": ["clamp(3.75rem, 2.5rem + 6.25vw, 5rem)", { lineHeight: "1", letterSpacing: "-0.05em" }],
+  // text-7xl: 72px base (optional, for hero sections)
+  "7xl": ["clamp(4.5rem, 3rem + 7.5vw, 6rem)", { lineHeight: "1", letterSpacing: "-0.05em" }],
+  // text-8xl: 96px base (optional, for hero sections)
+  "8xl": ["clamp(6rem, 4rem + 10vw, 8rem)", { lineHeight: "1", letterSpacing: "-0.05em" }],
+  // text-9xl: 128px base (optional, for hero sections)
+  "9xl": ["clamp(8rem, 5rem + 15vw, 12rem)", { lineHeight: "1", letterSpacing: "-0.05em" }]
+}, a = {
   thin: "100",
   extralight: "200",
   light: "300",
@@ -222,29 +535,318 @@ const r = {
   bold: "700",
   extrabold: "800",
   black: "900"
-}, t = {
-  tighter: "-0.05em",
-  tight: "-0.025em",
-  normal: "0em",
-  wide: "0.025em",
-  wider: "0.05em",
-  widest: "0.1em"
-}, l = {
+}, s = {
   none: "1",
   tight: "1.25",
   snug: "1.375",
   normal: "1.5",
   relaxed: "1.625",
   loose: "2"
+}, o = {
+  tighter: "-0.05em",
+  tight: "-0.025em",
+  normal: "0em",
+  wide: "0.025em",
+  wider: "0.05em",
+  widest: "0.1em"
+}, u = {
+  // Font families
+  "--font-sans": n.sans.join(", "),
+  "--font-satoshi": n.satoshi.join(", "),
+  "--font-display": n.display.join(", "),
+  "--font-serif": n.serif.join(", "),
+  "--font-mono": n.mono.join(", "),
+  // Font sizes (using clamp values)
+  "--font-size-xs": e.xs[0],
+  "--font-size-sm": e.sm[0],
+  "--font-size-base": e.base[0],
+  "--font-size-lg": e.lg[0],
+  "--font-size-xl": e.xl[0],
+  "--font-size-2xl": e["2xl"][0],
+  "--font-size-3xl": e["3xl"][0],
+  "--font-size-4xl": e["4xl"][0],
+  "--font-size-5xl": e["5xl"][0],
+  "--font-size-6xl": e["6xl"][0],
+  // Font weights
+  "--font-weight-thin": a.thin,
+  "--font-weight-extralight": a.extralight,
+  "--font-weight-light": a.light,
+  "--font-weight-normal": a.normal,
+  "--font-weight-medium": a.medium,
+  "--font-weight-semibold": a.semibold,
+  "--font-weight-bold": a.bold,
+  "--font-weight-extrabold": a.extrabold,
+  "--font-weight-black": a.black,
+  // Line heights
+  "--line-height-none": s.none,
+  "--line-height-tight": s.tight,
+  "--line-height-snug": s.snug,
+  "--line-height-normal": s.normal,
+  "--line-height-relaxed": s.relaxed,
+  "--line-height-loose": s.loose,
+  // Letter spacing
+  "--letter-spacing-tighter": o.tighter,
+  "--letter-spacing-tight": o.tight,
+  "--letter-spacing-normal": o.normal,
+  "--letter-spacing-wide": o.wide,
+  "--letter-spacing-wider": o.wider,
+  "--letter-spacing-widest": o.widest
+}, M = {
+  // Display styles (for hero sections)
+  display: {
+    fontFamily: n.display.join(", "),
+    fontSize: e["6xl"][0],
+    fontWeight: a.bold,
+    lineHeight: s.none,
+    letterSpacing: o.tight
+  },
+  // Heading styles
+  h1: {
+    fontFamily: n.display.join(", "),
+    fontSize: e["5xl"][0],
+    fontWeight: a.bold,
+    lineHeight: s.tight,
+    letterSpacing: o.tight
+  },
+  h2: {
+    fontFamily: n.display.join(", "),
+    fontSize: e["4xl"][0],
+    fontWeight: a.bold,
+    lineHeight: s.tight,
+    letterSpacing: o.tight
+  },
+  h3: {
+    fontFamily: n.sans.join(", "),
+    fontSize: e["3xl"][0],
+    fontWeight: a.semibold,
+    lineHeight: s.snug,
+    letterSpacing: o.normal
+  },
+  h4: {
+    fontFamily: n.sans.join(", "),
+    fontSize: e["2xl"][0],
+    fontWeight: a.semibold,
+    lineHeight: s.snug,
+    letterSpacing: o.normal
+  },
+  h5: {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.xl[0],
+    fontWeight: a.medium,
+    lineHeight: s.normal,
+    letterSpacing: o.normal
+  },
+  h6: {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.lg[0],
+    fontWeight: a.medium,
+    lineHeight: s.normal,
+    letterSpacing: o.normal
+  },
+  // Body text styles
+  body: {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.base[0],
+    fontWeight: a.normal,
+    lineHeight: s.relaxed,
+    letterSpacing: o.normal
+  },
+  "body-sm": {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.sm[0],
+    fontWeight: a.normal,
+    lineHeight: s.normal,
+    letterSpacing: o.normal
+  },
+  "body-xs": {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.xs[0],
+    fontWeight: a.normal,
+    lineHeight: s.normal,
+    letterSpacing: o.wide
+  },
+  // Label styles
+  label: {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.sm[0],
+    fontWeight: a.medium,
+    lineHeight: s.normal,
+    letterSpacing: o.wide
+  },
+  "label-sm": {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.xs[0],
+    fontWeight: a.medium,
+    lineHeight: s.normal,
+    letterSpacing: o.wider
+  },
+  // Caption styles
+  caption: {
+    fontFamily: n.sans.join(", "),
+    fontSize: e.xs[0],
+    fontWeight: a.normal,
+    lineHeight: s.normal,
+    letterSpacing: o.wide
+  }
+}, V = {
+  fontFamily: {
+    sans: [...n.sans],
+    satoshi: [...n.satoshi],
+    display: [...n.display],
+    serif: [...n.serif],
+    mono: [...n.mono]
+  },
+  fontSize: {
+    xs: [
+      e.xs[0],
+      { lineHeight: e.xs[1].lineHeight, letterSpacing: e.xs[1].letterSpacing }
+    ],
+    sm: [
+      e.sm[0],
+      { lineHeight: e.sm[1].lineHeight, letterSpacing: e.sm[1].letterSpacing }
+    ],
+    base: [
+      e.base[0],
+      { lineHeight: e.base[1].lineHeight, letterSpacing: e.base[1].letterSpacing }
+    ],
+    lg: [
+      e.lg[0],
+      { lineHeight: e.lg[1].lineHeight, letterSpacing: e.lg[1].letterSpacing }
+    ],
+    xl: [
+      e.xl[0],
+      { lineHeight: e.xl[1].lineHeight, letterSpacing: e.xl[1].letterSpacing }
+    ],
+    "2xl": [
+      e["2xl"][0],
+      {
+        lineHeight: e["2xl"][1].lineHeight,
+        letterSpacing: e["2xl"][1].letterSpacing
+      }
+    ],
+    "3xl": [
+      e["3xl"][0],
+      {
+        lineHeight: e["3xl"][1].lineHeight,
+        letterSpacing: e["3xl"][1].letterSpacing
+      }
+    ],
+    "4xl": [
+      e["4xl"][0],
+      {
+        lineHeight: e["4xl"][1].lineHeight,
+        letterSpacing: e["4xl"][1].letterSpacing
+      }
+    ],
+    "5xl": [
+      e["5xl"][0],
+      {
+        lineHeight: e["5xl"][1].lineHeight,
+        letterSpacing: e["5xl"][1].letterSpacing
+      }
+    ],
+    "6xl": [
+      e["6xl"][0],
+      {
+        lineHeight: e["6xl"][1].lineHeight,
+        letterSpacing: e["6xl"][1].letterSpacing
+      }
+    ],
+    "7xl": [
+      e["7xl"][0],
+      {
+        lineHeight: e["7xl"][1].lineHeight,
+        letterSpacing: e["7xl"][1].letterSpacing
+      }
+    ],
+    "8xl": [
+      e["8xl"][0],
+      {
+        lineHeight: e["8xl"][1].lineHeight,
+        letterSpacing: e["8xl"][1].letterSpacing
+      }
+    ],
+    "9xl": [
+      e["9xl"][0],
+      {
+        lineHeight: e["9xl"][1].lineHeight,
+        letterSpacing: e["9xl"][1].letterSpacing
+      }
+    ]
+  },
+  fontWeight: { ...a },
+  lineHeight: { ...s },
+  letterSpacing: { ...o }
+}, S = {
+  ...h,
+  ...u,
+  ...f,
+  ...y,
+  ...d,
+  ...x
+};
+function H(w) {
+  return `:root {
+${Object.entries(w).map(([b, v]) => `    ${b}: ${v};`).join(`
+`)}
+  }`;
+}
+const R = H(S), I = {
+  colors: Object.keys(h).length,
+  typography: Object.keys(u).length,
+  spacing: Object.keys(f).length,
+  shadows: Object.keys(y).length,
+  radius: Object.keys(d).length,
+  motion: Object.keys(x).length,
+  total: Object.keys(S).length
 };
 export {
-  h as borderRadius,
-  r as cssVariableColorTokens,
-  a as fontFamily,
-  n as fontSize,
-  s as fontWeight,
-  t as letterSpacing,
-  l as lineHeight,
-  o as spacing,
-  e as tailwindThemeColors
+  c as accentColoredShadows,
+  U as accentColors,
+  S as allCSSVariables,
+  R as allCSSVariablesCSS,
+  E as animations,
+  L as baseColors,
+  ee as borderRadius,
+  h as colorCSSVariables,
+  te as componentRadius,
+  z as componentShadowMapping,
+  N as cssVariableColorTokens,
+  A as durations,
+  B as easings,
+  i as elevationShadows,
+  p as focusRings,
+  n as fontFamily,
+  e as fontSize,
+  a as fontWeight,
+  H as generateCSSVariablesCSS,
+  m as glowEffects,
+  D as keyframes,
+  l as layoutSpacing,
+  o as letterSpacing,
+  s as lineHeight,
+  x as motionCSSVariables,
+  g as primaryColoredShadows,
+  $ as primaryColors,
+  d as radiusCSSVariables,
+  G as reducedMotion,
+  q as secondaryColors,
+  J as semanticColors,
+  r as semanticSpacing,
+  y as shadowCSSVariables,
+  t as spacing,
+  f as spacingCSSVariables,
+  K as springs,
+  P as surfaceColors,
+  Q as tailwindMotionConfig,
+  le as tailwindRadiusConfig,
+  F as tailwindShadowConfig,
+  W as tailwindSpacingConfig,
+  X as tailwindThemeColors,
+  V as tailwindTypographyConfig,
+  Y as textColors,
+  M as textStyles,
+  I as tokenSystemSummary,
+  Z as transitions,
+  u as typographyCSSVariables
 };