@orchard9ai/design-system/dist/tokens.mjs.map

DaisyUI-based component library for Orchard9 applications

{"version":3,"sources":["../src/theme/ThemeProvider.tsx","../src/tokens/hooks.ts","../src/tokens/tokens.json","../src/tokens/constants.ts"],"sourcesContent":["import React, { createContext, useContext, useEffect, useState, useCallback, useMemo } from 'react';\nimport {\n  Theme,\n  ThemeContext as IThemeContext,\n  ThemeColors,\n  ThemeProviderProps,\n  BuiltInTheme,\n} from './types';\n\nconst ThemeContext = createContext<IThemeContext | undefined>(undefined);\n\n// Built-in themes supported by the design system\nconst BUILT_IN_THEMES: BuiltInTheme[] = [\n  'light',\n  'dark',\n  'cupcake',\n  'business',\n  'grove-light',\n  'grove-dark',\n  'dawn',\n  'dusk',\n  'twilight-light',\n  'twilight-dark',\n  'squad-light',\n  'squad-dark',\n  'lounge-light',\n  'lounge-dark',\n  'meadow-light',\n  'meadow-dark',\n  'focus-light',\n  'focus-dark',\n  'peach-light',\n  'peach-dark',\n];\n\n// Script to inject for preventing FOUC\n// Can be customized with defaultTheme parameter\nexport const themeInitScript = (defaultTheme?: string) => `\n  (function() {\n    const theme = localStorage.getItem('theme');\n    const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n    const fallbackTheme = ${defaultTheme ? `'${defaultTheme}'` : 'systemTheme'};\n    document.documentElement.setAttribute('data-theme', theme || fallbackTheme);\n  })();\n`;\n\n/**\n * ThemeProvider with automatic localStorage persistence and system preference detection.\n *\n * @example\n * // Basic usage - themes are automatically persisted\n * <ThemeProvider defaultTheme=\"grove-light\">\n *   <App />\n * </ThemeProvider>\n *\n * // With theme change callback\n * <ThemeProvider\n *   defaultTheme=\"grove-dark\"\n *   onThemeChange={(theme) => analytics.track('theme_changed', { theme })}\n * >\n *   <App />\n * </ThemeProvider>\n *\n * // Access theme state in components\n * const { theme, setTheme, themes } = useTheme();\n *\n * @param props - ThemeProvider configuration\n * @param props.children - Child components to wrap\n * @param props.defaultTheme - Default theme when no stored preference exists\n * @param props.initialTheme - Override theme for testing/Storybook (skips persistence)\n * @param props.onThemeChange - Callback fired when theme changes\n * @param props.disableInitialTransition - Prevent transition animation on initial load (default: true)\n * @param props.customThemes - Array of custom theme names to support (e.g., ['my-custom-dark', 'my-custom-light'])\n */\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n  children,\n  defaultTheme = 'light',\n  initialTheme,\n  onThemeChange,\n  disableInitialTransition = true,\n  customThemes = [],\n}) => {\n  // Development-time prop validation\n  if (typeof process !== 'undefined' && process.env && process.env['NODE_ENV'] === 'development') {\n    // Check for common mistakes\n    const propsToValidate = {\n      children,\n      defaultTheme,\n      initialTheme,\n      onThemeChange,\n      disableInitialTransition,\n      customThemes,\n    };\n    const invalidProps = Object.keys(propsToValidate as Record<string, unknown>).filter(\n      (key) =>\n        ![\n          'children',\n          'defaultTheme',\n          'initialTheme',\n          'onThemeChange',\n          'disableInitialTransition',\n          'customThemes',\n        ].includes(key)\n    );\n\n    if (invalidProps.length > 0) {\n      console.warn(\n        `ThemeProvider: Invalid props detected: ${invalidProps.join(', ')}.\\n` +\n          `Valid props are: children, defaultTheme, initialTheme, onThemeChange, disableInitialTransition, customThemes.\\n` +\n          `See docs: https://design-system.orchard9.ai/theme`\n      );\n    }\n\n    // Validate theme - check if it's a built-in theme or a custom theme\n    const allThemes = [...BUILT_IN_THEMES, ...customThemes];\n    if (defaultTheme && !allThemes.includes(defaultTheme)) {\n      console.warn(\n        `ThemeProvider: Unknown theme \"${defaultTheme}\".\\n` +\n          `Built-in themes: ${BUILT_IN_THEMES.join(', ')}.\\n` +\n          (customThemes.length > 0\n            ? `Custom themes: ${customThemes.join(', ')}.\\n`\n            : `No custom themes provided. Use customThemes prop to add your own themes.\\n`) +\n          `Make sure to import the theme CSS file if using a custom theme.`\n      );\n    }\n  }\n\n  const [theme, setThemeState] = useState<Theme>(initialTheme || defaultTheme);\n  const [systemTheme, setSystemTheme] = useState<'light' | 'dark'>('light');\n  const [colors, setColors] = useState<ThemeColors>({} as ThemeColors);\n  const [isInitialized, setIsInitialized] = useState(false);\n\n  // Merge built-in themes with custom themes\n  const themes = useMemo<Theme[]>(() => [...BUILT_IN_THEMES, ...customThemes], [customThemes]);\n\n  // Get computed theme colors\n  const updateColors = useCallback(() => {\n    const computed = getComputedStyle(document.documentElement);\n    const newColors: Partial<ThemeColors> = {};\n\n    // DaisyUI color variables\n    const colorVars = [\n      'primary',\n      'primary-focus',\n      'primary-content',\n      'secondary',\n      'secondary-focus',\n      'secondary-content',\n      'accent',\n      'accent-focus',\n      'accent-content',\n      'neutral',\n      'neutral-focus',\n      'neutral-content',\n      'base-100',\n      'base-200',\n      'base-300',\n      'base-content',\n      'info',\n      'success',\n      'warning',\n      'error',\n    ];\n\n    colorVars.forEach((color) => {\n      const hsl = computed.getPropertyValue(`--${color}`).trim();\n      if (hsl) {\n        newColors[color as keyof ThemeColors] = `hsl(${hsl})`;\n      }\n    });\n\n    setColors(newColors as ThemeColors);\n  }, []);\n\n  // Initialize theme from localStorage or system preference (skip if initialTheme provided)\n  useEffect(() => {\n    // If initialTheme is provided (e.g., from Storybook), don't override it\n    if (initialTheme) {\n      return;\n    }\n\n    const stored = localStorage.getItem('theme') as Theme | null;\n    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n\n    setSystemTheme(mediaQuery.matches ? 'dark' : 'light');\n\n    if (stored && themes.includes(stored)) {\n      setThemeState(stored);\n    } else if (defaultTheme && themes.includes(defaultTheme)) {\n      // Respect defaultTheme before falling back to system preference\n      setThemeState(defaultTheme);\n    } else if (mediaQuery.matches) {\n      setThemeState('dark');\n    } else {\n      setThemeState('light');\n    }\n\n    const handleChange = (e: MediaQueryListEvent) => {\n      setSystemTheme(e.matches ? 'dark' : 'light');\n      if (!localStorage.getItem('theme')) {\n        setThemeState(e.matches ? 'dark' : 'light');\n      }\n    };\n\n    mediaQuery.addEventListener('change', handleChange);\n    return () => mediaQuery.removeEventListener('change', handleChange);\n  }, [themes, initialTheme, defaultTheme]);\n\n  // Apply theme and update colors\n  useEffect(() => {\n    document.documentElement.setAttribute('data-theme', theme);\n\n    // Only apply transition after initial load to prevent FOUC\n    if (disableInitialTransition && !isInitialized) {\n      // Skip transition on initial load\n    } else {\n      document.documentElement.style.setProperty(\n        'transition',\n        'background-color 0.3s ease, color 0.3s ease'\n      );\n    }\n\n    localStorage.setItem('theme', theme);\n\n    // Update colors after theme change\n    requestAnimationFrame(updateColors);\n\n    // Emit theme change event\n    window.dispatchEvent(new CustomEvent('themechange', { detail: { theme } }));\n\n    // Call optional callback\n    onThemeChange?.(theme);\n  }, [theme, updateColors, onThemeChange, disableInitialTransition, isInitialized]);\n\n  // Mark as initialized after first mount\n  useEffect(() => {\n    setIsInitialized(true);\n  }, []);\n\n  const setTheme = useCallback((newTheme: Theme) => {\n    setThemeState(newTheme);\n  }, []);\n\n  const value: IThemeContext = {\n    theme,\n    setTheme,\n    themes,\n    systemTheme,\n    colors,\n  };\n\n  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;\n};\n\nexport const useTheme = () => {\n  const context = useContext(ThemeContext);\n  if (!context) {\n    throw new Error('useTheme must be used within ThemeProvider');\n  }\n  return context;\n};\n","import { useTheme } from '../theme/ThemeProvider';\nimport { useMemo } from 'react';\nimport tokens from './tokens.json';\nimport type { Tokens } from './types';\n\n/**\n * Hook to get all design tokens for the current theme\n * @returns Complete token object for the active theme\n */\nexport const useTokens = (): Tokens => {\n  const { theme } = useTheme();\n\n  return useMemo(() => {\n    // Fall back to light theme if tokens don't exist for the current theme\n    const themeTokens = tokens[theme as keyof typeof tokens] || tokens.light;\n    return themeTokens as unknown as Tokens;\n  }, [theme]);\n};\n\n/**\n * Hook to get color tokens for the current theme\n * @returns Color token object with all semantic color values\n */\nexport const useColorTokens = () => {\n  const tokens = useTokens();\n  return tokens.colors;\n};\n\n/**\n * Hook to get spacing tokens\n * @returns Spacing scale object with rem/px values\n */\nexport const useSpacingTokens = () => {\n  const tokens = useTokens();\n  return tokens.spacing;\n};\n\n/**\n * Hook to get typography tokens\n * @returns Typography scale with font sizes, weights, and line heights\n */\nexport const useTypographyTokens = () => {\n  const tokens = useTokens();\n  return tokens.typography;\n};\n\n/**\n * Hook to get animation tokens\n * @returns Animation duration and easing values\n */\nexport const useAnimationTokens = () => {\n  const tokens = useTokens();\n  return tokens.animation;\n};\n\n/**\n * Hook to get shadow tokens\n * @returns Box shadow definitions for different elevations\n */\nexport const useShadowTokens = () => {\n  const tokens = useTokens();\n  return tokens.shadows;\n};\n\n/**\n * Hook to get border radius tokens\n * @returns Border radius values for different corner styles\n */\nexport const useBorderRadiusTokens = () => {\n  const tokens = useTokens();\n  return tokens.borderRadius;\n};\n\n/**\n * Hook to get a specific color token value\n * @param colorName - The color token name (e.g., 'primary', 'base-100')\n * @returns The hex color value for the current theme\n */\nexport const useColorValue = (colorName: keyof Tokens['colors']) => {\n  const colors = useColorTokens();\n  return colors[colorName];\n};\n\n/**\n * Hook to get a specific spacing token value\n * @param spacing - The spacing token key (e.g., '4', '8', '16')\n * @returns The spacing value in rem/px\n */\nexport const useSpacingValue = (spacing: keyof Tokens['spacing']) => {\n  const spacingTokens = useSpacingTokens();\n  return spacingTokens[spacing];\n};\n","{\n  \"light\": {\n    \"colors\": {\n      \"primary\": \"#6419E6\",\n      \"primary-focus\": \"#5016C7\",\n      \"primary-content\": \"#FFFFFF\",\n      \"secondary\": \"#E879F9\",\n      \"secondary-focus\": \"#D946EF\",\n      \"secondary-content\": \"#FFFFFF\",\n      \"accent\": \"#F59E0B\",\n      \"accent-focus\": \"#D97706\",\n      \"accent-content\": \"#FFFFFF\",\n      \"neutral\": \"#3D4451\",\n      \"neutral-focus\": \"#2A2E37\",\n      \"neutral-content\": \"#FFFFFF\",\n      \"base-100\": \"#FFFFFF\",\n      \"base-200\": \"#F2F2F2\",\n      \"base-300\": \"#E5E6E6\",\n      \"base-content\": \"#1F2937\",\n      \"info\": \"#3ABFF8\",\n      \"success\": \"#36D399\",\n      \"warning\": \"#FBBD23\",\n      \"error\": \"#F87272\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"dark\": {\n    \"colors\": {\n      \"primary\": \"#6419E6\",\n      \"primary-focus\": \"#5016C7\",\n      \"primary-content\": \"#FFFFFF\",\n      \"secondary\": \"#E879F9\",\n      \"secondary-focus\": \"#D946EF\",\n      \"secondary-content\": \"#FFFFFF\",\n      \"accent\": \"#F59E0B\",\n      \"accent-focus\": \"#D97706\",\n      \"accent-content\": \"#FFFFFF\",\n      \"neutral\": \"#2A2E37\",\n      \"neutral-focus\": \"#16181D\",\n      \"neutral-content\": \"#A6ADBB\",\n      \"base-100\": \"#1D232A\",\n      \"base-200\": \"#191E24\",\n      \"base-300\": \"#15191E\",\n      \"base-content\": \"#A6ADBB\",\n      \"info\": \"#3ABFF8\",\n      \"success\": \"#36D399\",\n      \"warning\": \"#FBBD23\",\n      \"error\": \"#F87272\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"cupcake\": {\n    \"colors\": {\n      \"primary\": \"#0E7490\",\n      \"primary-focus\": \"#0F3F4F\",\n      \"primary-content\": \"#1F2937\",\n      \"secondary\": \"#D946EF\",\n      \"secondary-focus\": \"#C026D3\",\n      \"secondary-content\": \"#1F2937\",\n      \"accent\": \"#EEAF3A\",\n      \"accent-focus\": \"#E9A429\",\n      \"accent-content\": \"#1F2937\",\n      \"neutral\": \"#291334\",\n      \"neutral-focus\": \"#1F0E2B\",\n      \"neutral-content\": \"#D7DDE4\",\n      \"base-100\": \"#FAF7F5\",\n      \"base-200\": \"#EFEAE6\",\n      \"base-300\": \"#E7E2DF\",\n      \"base-content\": \"#291334\",\n      \"info\": \"#3ABFF8\",\n      \"success\": \"#36D399\",\n      \"warning\": \"#FBBD23\",\n      \"error\": \"#F87272\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"business\": {\n    \"colors\": {\n      \"primary\": \"#1C4ED8\",\n      \"primary-focus\": \"#1E40AF\",\n      \"primary-content\": \"#FFFFFF\",\n      \"secondary\": \"#7C3AED\",\n      \"secondary-focus\": \"#6D28D9\",\n      \"secondary-content\": \"#FFFFFF\",\n      \"accent\": \"#F59E0B\",\n      \"accent-focus\": \"#D97706\",\n      \"accent-content\": \"#FFFFFF\",\n      \"neutral\": \"#2D3748\",\n      \"neutral-focus\": \"#1A202C\",\n      \"neutral-content\": \"#A0AEC0\",\n      \"base-100\": \"#FFFFFF\",\n      \"base-200\": \"#F7FAFC\",\n      \"base-300\": \"#EDF2F7\",\n      \"base-content\": \"#1A202C\",\n      \"info\": \"#3182CE\",\n      \"success\": \"#38A169\",\n      \"warning\": \"#D69E2E\",\n      \"error\": \"#E53E3E\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"grove-dark\": {\n    \"colors\": {\n      \"primary\": \"#22c55e\",\n      \"primary-focus\": \"#16a34a\",\n      \"primary-content\": \"#ffffff\",\n      \"secondary\": \"#fbbf24\",\n      \"secondary-focus\": \"#f59e0b\",\n      \"secondary-content\": \"#000000\",\n      \"accent\": \"#22c55e\",\n      \"accent-focus\": \"#16a34a\",\n      \"accent-content\": \"#ffffff\",\n      \"neutral\": \"#27272a\",\n      \"neutral-focus\": \"#18181b\",\n      \"neutral-content\": \"#fafafa\",\n      \"base-100\": \"#09090b\",\n      \"base-200\": \"#18181b\",\n      \"base-300\": \"#27272a\",\n      \"base-content\": \"#fafafa\",\n      \"info\": \"#3b82f6\",\n      \"success\": \"#22c55e\",\n      \"warning\": \"#fbbf24\",\n      \"error\": \"#ef4444\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"grove-light\": {\n    \"colors\": {\n      \"primary\": \"#22c55e\",\n      \"primary-focus\": \"#16a34a\",\n      \"primary-content\": \"#ffffff\",\n      \"secondary\": \"#fbbf24\",\n      \"secondary-focus\": \"#f59e0b\",\n      \"secondary-content\": \"#000000\",\n      \"accent\": \"#22c55e\",\n      \"accent-focus\": \"#16a34a\",\n      \"accent-content\": \"#ffffff\",\n      \"neutral\": \"#f5f5f4\",\n      \"neutral-focus\": \"#e7e5e4\",\n      \"neutral-content\": \"#1c1917\",\n      \"base-100\": \"#fefefe\",\n      \"base-200\": \"#f8f8f7\",\n      \"base-300\": \"#f5f5f4\",\n      \"base-content\": \"#1a1a1a\",\n      \"info\": \"#3b82f6\",\n      \"success\": \"#22c55e\",\n      \"warning\": \"#f59e0b\",\n      \"error\": \"#dc2626\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"dawn\": {\n    \"colors\": {\n      \"primary\": \"#10b981\",\n      \"primary-focus\": \"#059669\",\n      \"primary-content\": \"#ffffff\",\n      \"secondary\": \"#f59e0b\",\n      \"secondary-focus\": \"#d97706\",\n      \"secondary-content\": \"#ffffff\",\n      \"accent\": \"#3b82f6\",\n      \"accent-focus\": \"#2563eb\",\n      \"accent-content\": \"#ffffff\",\n      \"neutral\": \"#1f2937\",\n      \"neutral-focus\": \"#111827\",\n      \"neutral-content\": \"#ffffff\",\n      \"base-100\": \"#ffffff\",\n      \"base-200\": \"#f3f4f6\",\n      \"base-300\": \"#e5e7eb\",\n      \"base-content\": \"#1f2937\",\n      \"info\": \"#3b82f6\",\n      \"success\": \"#10b981\",\n      \"warning\": \"#f59e0b\",\n      \"error\": \"#ef4444\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"dusk\": {\n    \"colors\": {\n      \"primary\": \"#818cf8\",\n      \"primary-focus\": \"#6366f1\",\n      \"primary-content\": \"#ffffff\",\n      \"secondary\": \"#f472b6\",\n      \"secondary-focus\": \"#ec4899\",\n      \"secondary-content\": \"#ffffff\",\n      \"accent\": \"#fbbf24\",\n      \"accent-focus\": \"#f59e0b\",\n      \"accent-content\": \"#000000\",\n      \"neutral\": \"#1e293b\",\n      \"neutral-focus\": \"#0f172a\",\n      \"neutral-content\": \"#ffffff\",\n      \"base-100\": \"#0f172a\",\n      \"base-200\": \"#1e293b\",\n      \"base-300\": \"#334155\",\n      \"base-content\": \"#f1f5f9\",\n      \"info\": \"#60a5fa\",\n      \"success\": \"#34d399\",\n      \"warning\": \"#fbbf24\",\n      \"error\": \"#f87171\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"twilight-light\": {\n    \"colors\": {\n      \"primary\": \"#8b5cf6\",\n      \"primary-focus\": \"#7c3aed\",\n      \"primary-content\": \"#ffffff\",\n      \"secondary\": \"#a78bfa\",\n      \"secondary-focus\": \"#9061f9\",\n      \"secondary-content\": \"#ffffff\",\n      \"accent\": \"#c084fc\",\n      \"accent-focus\": \"#b16cfc\",\n      \"accent-content\": \"#ffffff\",\n      \"neutral\": \"#e9d5ff\",\n      \"neutral-focus\": \"#ddd6fe\",\n      \"neutral-content\": \"#1e1b4b\",\n      \"base-100\": \"#faf5ff\",\n      \"base-200\": \"#f3e8ff\",\n      \"base-300\": \"#ede9fe\",\n      \"base-content\": \"#1e1b4b\",\n      \"info\": \"#60a5fa\",\n      \"success\": \"#34d399\",\n      \"warning\": \"#fbbf24\",\n      \"error\": \"#f87171\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"twilight-dark\": {\n    \"colors\": {\n      \"primary\": \"#8b5cf6\",\n      \"primary-focus\": \"#7c3aed\",\n      \"primary-content\": \"#ffffff\",\n      \"secondary\": \"#a78bfa\",\n      \"secondary-focus\": \"#9061f9\",\n      \"secondary-content\": \"#ffffff\",\n      \"accent\": \"#c084fc\",\n      \"accent-focus\": \"#b16cfc\",\n      \"accent-content\": \"#ffffff\",\n      \"neutral\": \"#2e1065\",\n      \"neutral-focus\": \"#1e0d3a\",\n      \"neutral-content\": \"#f3e8ff\",\n      \"base-100\": \"#0f0519\",\n      \"base-200\": \"#1e0d3a\",\n      \"base-300\": \"#2e1065\",\n      \"base-content\": \"#f3e8ff\",\n      \"info\": \"#60a5fa\",\n      \"success\": \"#34d399\",\n      \"warning\": \"#fbbf24\",\n      \"error\": \"#f87171\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n      \"xl\": \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\"\n    },\n    \"borderRadius\": {\n      \"none\": \"0\",\n      \"sm\": \"0.125rem\",\n      \"base\": \"0.25rem\",\n      \"md\": \"0.375rem\",\n      \"lg\": \"0.5rem\",\n      \"xl\": \"0.75rem\",\n      \"2xl\": \"1rem\",\n      \"full\": \"9999px\"\n    }\n  },\n  \"squad-light\": {\n    \"colors\": {\n      \"primary\": \"#14b8a6\",\n      \"primary-focus\": \"#0d9488\",\n      \"primary-content\": \"#ffffff\",\n      \"secondary\": \"#fbbf24\",\n      \"secondary-focus\": \"#f59e0b\",\n      \"secondary-content\": \"#000000\",\n      \"accent\": \"#ef4444\",\n      \"accent-focus\": \"#dc2626\",\n      \"accent-content\": \"#ffffff\",\n      \"neutral\": \"#64748b\",\n      \"neutral-focus\": \"#475569\",\n      \"neutral-content\": \"#f8fafc\",\n      \"base-100\": \"#fcfcfc\",\n      \"base-200\": \"#f8f9fa\",\n      \"base-300\": \"#f1f3f5\",\n      \"base-content\": \"#1e293b\",\n      \"info\": \"#3b82f6\",\n      \"success\": \"#22c55e\",\n      \"warning\": \"#f59e0b\",\n      \"error\": \"#ef4444\"\n    },\n    \"spacing\": {\n      \"0\": \"0px\",\n      \"1\": \"0.25rem\",\n      \"2\": \"0.5rem\",\n      \"3\": \"0.75rem\",\n      \"4\": \"1rem\",\n      \"5\": \"1.25rem\",\n      \"6\": \"1.5rem\",\n      \"8\": \"2rem\",\n      \"10\": \"2.5rem\",\n      \"12\": \"3rem\",\n      \"16\": \"4rem\",\n      \"20\": \"5rem\",\n      \"24\": \"6rem\"\n    },\n    \"typography\": {\n      \"fontSize\": {\n        \"xs\": [\n          \"0.6875rem\",\n          {\n            \"lineHeight\": \"0.9375rem\"\n          }\n        ],\n        \"sm\": [\n          \"0.8125rem\",\n          {\n            \"lineHeight\": \"1.125rem\"\n          }\n        ],\n        \"base\": [\n          \"0.9375rem\",\n          {\n            \"lineHeight\": \"1.375rem\"\n          }\n        ],\n        \"lg\": [\n          \"1rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"xl\": [\n          \"1.0625rem\",\n          {\n            \"lineHeight\": \"1.5rem\"\n          }\n        ],\n        \"2xl\": [\n          \"1.1875rem\",\n          {\n            \"lineHeight\": \"1.625rem\"\n          }\n        ],\n        \"3xl\": [\n          \"1.375rem\",\n          {\n            \"lineHeight\": \"1.75rem\"\n          }\n        ],\n        \"4xl\": [\n          \"1.625rem\",\n          {\n            \"lineHeight\": \"1.875rem\"\n          }\n        ],\n        \"5xl\": [\n          \"2rem\",\n          {\n            \"lineHeight\": \"1\"\n          }\n        ]\n      },\n      \"fontWeight\": {\n        \"normal\": \"400\",\n        \"medium\": \"500\",\n        \"semibold\": \"600\",\n        \"bold\": \"700\"\n      }\n    },\n    \"animation\": {\n      \"duration\": {\n        \"fast\": \"150ms\",\n        \"base\": \"300ms\",\n        \"slow\": \"500ms\",\n        \"slower\": \"700ms\"\n      },\n      \"easing\": {\n        \"default\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n        \"linear\": \"linear\",\n        \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n        \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n        \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\"\n      }\n    },\n    \"shadows\": {\n      \"sm\": \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n      \"base\": \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n      \"md\": \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n      \"lg\": \"0 10