@layer tokens {
  :root {
    --gw-color-primary: #0033ff;
    --gw-color-primary-dark: #0028cc;
    --gw-color-primary-light: #3357ff;
    --gw-color-secondary: #6b7cff;
    --gw-color-accent: #ff6b35;
    --gw-color-background: #ffffff;
    --gw-color-surface: #f8f9ff;
    --gw-color-text: #1a1a2e;
    --gw-color-text-muted: #5a5a6e;
    --gw-color-border: #e0e5ff;
    --gw-color-error: #e63946;
    --gw-color-success: #06d6a0;

    --gw-space-xs: clamp(0.25rem, 0.5vw, 0.5rem);
    --gw-space-sm: clamp(0.5rem, 1vw, 0.75rem);
    --gw-space-md: clamp(1rem, 2vw, 1.5rem);
    --gw-space-lg: clamp(1.5rem, 3vw, 2.5rem);
    --gw-space-xl: clamp(2rem, 4vw, 4rem);
    --gw-space-2xl: clamp(3rem, 6vw, 6rem);

    --gw-font-family: "Balsamiq Sans", cursive, system-ui;
    --gw-font-size-sm: clamp(0.875rem, 0.8rem + 0.2vw, 1rem);
    --gw-font-size-base: clamp(1rem, 0.9rem + 0.3vw, 1.125rem);
    --gw-font-size-lg: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
    --gw-font-size-xl: clamp(1.75rem, 1.5rem + 0.8vw, 2.5rem);
    --gw-font-size-2xl: clamp(2.5rem, 2rem + 1.5vw, 4rem);

    --gw-radius-sm: 0.5rem;
    --gw-radius-md: 1rem;
    --gw-radius-lg: 1.5rem;
    --gw-radius-full: 9999px;

    --gw-shadow-sm: 0 2px 8px rgba(0, 51, 255, 0.08);
    --gw-shadow-md: 0 4px 16px rgba(0, 51, 255, 0.12);
    --gw-shadow-lg: 0 8px 32px rgba(0, 51, 255, 0.16);

    --gw-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --gw-transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --gw-transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);

    --gw-container-max: 1320px;
    --gw-container-padding: clamp(1rem, 4vw, 2rem);
  }

  :root[data-theme="dark"] {
    --gw-color-background: #e6e9f0;
    --gw-color-surface: #d1d5e0;
    --gw-color-text: #1a1a2e;
    --gw-color-text-muted: #4a4a5e;
    --gw-color-border: #bcc3d6;
    --gw-color-primary: #0033ff;
    --gw-color-primary-dark: #0028cc;
    --gw-color-primary-light: #3357ff;
    --gw-shadow-sm: 0 2px 8px rgba(0, 51, 255, 0.08);
    --gw-shadow-md: 0 4px 16px rgba(0, 51, 255, 0.12);
    --gw-shadow-lg: 0 8px 32px rgba(0, 51, 255, 0.16);
  }
}