/* ──────────────────────────────────────────────────────────────
   Tailwind v4 @theme — generated by designlang
   site: Clerk | Authentication and User Management
   2026-06-25T08:26:24.061Z
   Drop this above `@import "tailwindcss";`.
   ────────────────────────────────────────────────────────────── */

@import "tailwindcss";

@theme {
  --color-primary-50: hsl(252 100% 97%);
  --color-primary-100: hsl(252 100% 94%);
  --color-primary-200: hsl(252 100% 86%);
  --color-primary-300: hsl(252 100% 76%);
  --color-primary-400: hsl(252 100% 64%);
  --color-primary-500: hsl(252 100% 50%);
  --color-primary-600: hsl(252 100% 40%);
  --color-primary-700: hsl(252 100% 32%);
  --color-primary-800: hsl(252 100% 24%);
  --color-primary-900: hsl(252 100% 16%);
  --color-primary-950: hsl(252 100% 10%);
  --color-primary: #6c47ff;
  --color-secondary-50: hsl(196 100% 97%);
  --color-secondary-100: hsl(196 100% 94%);
  --color-secondary-200: hsl(196 100% 86%);
  --color-secondary-300: hsl(196 100% 76%);
  --color-secondary-400: hsl(196 100% 64%);
  --color-secondary-500: hsl(196 100% 50%);
  --color-secondary-600: hsl(196 100% 40%);
  --color-secondary-700: hsl(196 100% 32%);
  --color-secondary-800: hsl(196 100% 24%);
  --color-secondary-900: hsl(196 100% 16%);
  --color-secondary-950: hsl(196 100% 10%);
  --color-secondary: #1cc4ff;
  --color-accent-50: hsl(190 100% 97%);
  --color-accent-100: hsl(190 100% 94%);
  --color-accent-200: hsl(190 100% 86%);
  --color-accent-300: hsl(190 100% 76%);
  --color-accent-400: hsl(190 100% 64%);
  --color-accent-500: hsl(190 100% 50%);
  --color-accent-600: hsl(190 100% 40%);
  --color-accent-700: hsl(190 100% 32%);
  --color-accent-800: hsl(190 100% 24%);
  --color-accent-900: hsl(190 100% 16%);
  --color-accent-950: hsl(190 100% 10%);
  --color-accent: #5de3ff;
  --color-neutral-50: #d9d9de;
  --color-neutral-100: #000000;
  --color-neutral-200: #ffffff;
  --color-neutral-300: #131316;
  --color-neutral-400: #747686;
  --color-neutral-500: #5e5f6e;
  --color-neutral-600: #2f3037;
  --color-neutral-700: #9394a1;
  --color-neutral-800: #696a78;
  --color-neutral-900: #eeeef0;
  --color-background: #f7f7f8;
  --color-foreground: #000000;
  --font-sans: "geistNumbers", system-ui, sans-serif;
  --font-mono: "soehneMono", ui-monospace, monospace;
  --spacing-1: 1px;
  --spacing-2: 46px;
  --spacing-3: 56px;
  --spacing-4: 76px;
  --spacing-5: 94px;
  --spacing-6: 128px;
  --spacing-7: 140px;
  --spacing-8: 151px;
  --spacing-9: 158px;
  --spacing-10: 167px;
  --spacing-11: 172px;
  --spacing-12: 192px;
  --radius-sm: 2px;
  --radius-md: 5px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-full: 38px;
  --shadow-sm: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(66, 67, 77) 0px 0px 0px 0.5px, oklab(0.999994 0.0000455678 0.0000200868 / 0.07) 0px 1px 0px 0px inset, oklab(0.249859 0.00254738 -0.00901626 / 0.2) 0px 1px 3px 0px;
  --shadow-md: rgba(255, 255, 255, 0.9) 0px 0px 0px 0.5px inset, rgba(19, 19, 22, 0.15) 0px 0px 0px 0.5px, rgba(0, 0, 0, 0.04) 0px 2px 3px 0px, rgba(34, 42, 53, 0.04) 0px 4px 6px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;
  --shadow-lg: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, oklab(0 0 0 / 0.08) 0px 2px 3px -1px, oklab(0.188081 0.0016512 -0.00579907 / 0.18) 0px 0px 0px 0.5px, oklab(0.999994 0.0000455678 0.0000200868 / 0.1) 0px 1px 0px 0px inset;
  --shadow-xl: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(108, 71, 255) 0px 0px 0px 0.5px, oklab(0.999994 0.0000455678 0.0000200868 / 0.07) 0px 1px 0px 0px inset, oklab(0.249859 0.00254738 -0.00901626 / 0.2) 0px 1px 3px 0px;
  --animate-duration-fast: undefined;
  --animate-duration-base: undefined;
  --animate-duration-slow: undefined;
  --animate-duration-slower: undefined;
}

/* Optional base reset that maps body/heading to the extracted tokens. */
@layer base {
  html { font-family: var(--font-sans); }
  body { background-color: var(--color-background); color: var(--color-foreground, currentColor); }
}