/* ──────────────────────────────────────────────────────────────
   Tailwind v4 @theme — generated by designlang
   site: Free screen recorder for Mac and PC | Loom
   2026-06-25T08:28:20.983Z
   Drop this above `@import "tailwindcss";`.
   ────────────────────────────────────────────────────────────── */

@import "tailwindcss";

@theme {
  --color-primary-50: hsl(215 80% 97%);
  --color-primary-100: hsl(215 80% 94%);
  --color-primary-200: hsl(215 80% 86%);
  --color-primary-300: hsl(215 80% 76%);
  --color-primary-400: hsl(215 80% 64%);
  --color-primary-500: hsl(215 80% 50%);
  --color-primary-600: hsl(215 80% 40%);
  --color-primary-700: hsl(215 80% 32%);
  --color-primary-800: hsl(215 80% 24%);
  --color-primary-900: hsl(215 80% 16%);
  --color-primary-950: hsl(215 80% 10%);
  --color-primary: #1868db;
  --color-secondary-50: hsl(40 100% 97%);
  --color-secondary-100: hsl(40 100% 94%);
  --color-secondary-200: hsl(40 100% 86%);
  --color-secondary-300: hsl(40 100% 76%);
  --color-secondary-400: hsl(40 100% 64%);
  --color-secondary-500: hsl(40 100% 50%);
  --color-secondary-600: hsl(40 100% 40%);
  --color-secondary-700: hsl(40 100% 32%);
  --color-secondary-800: hsl(40 100% 24%);
  --color-secondary-900: hsl(40 100% 16%);
  --color-secondary-950: hsl(40 100% 10%);
  --color-secondary: #ffab00;
  --color-accent-50: hsl(214 91% 97%);
  --color-accent-100: hsl(214 91% 94%);
  --color-accent-200: hsl(214 91% 86%);
  --color-accent-300: hsl(214 91% 76%);
  --color-accent-400: hsl(214 91% 64%);
  --color-accent-500: hsl(214 91% 50%);
  --color-accent-600: hsl(214 91% 40%);
  --color-accent-700: hsl(214 91% 32%);
  --color-accent-800: hsl(214 91% 24%);
  --color-accent-900: hsl(214 91% 16%);
  --color-accent-950: hsl(214 91% 10%);
  --color-accent: #e9f2fe;
  --color-neutral-50: #292a2e;
  --color-neutral-100: #000000;
  --color-neutral-200: #ffffff;
  --color-neutral-300: #696969;
  --color-neutral-400: #555555;
  --color-neutral-500: #f8f8f8;
  --color-neutral-600: #7d818a;
  --color-neutral-700: #d8d8d8;
  --color-neutral-800: #bbbbbb;
  --color-background: #ffffff;
  --color-foreground: #000000;
  --font-sans: "Charlie Text", system-ui, sans-serif;
  --spacing-1: 1px;
  --spacing-2: 15px;
  --spacing-3: 23px;
  --spacing-4: 30px;
  --spacing-5: 35px;
  --spacing-6: 40px;
  --spacing-7: 48px;
  --spacing-8: 56px;
  --spacing-9: 64px;
  --spacing-10: 80px;
  --spacing-11: 84px;
  --spacing-12: 103px;
  --radius-sm: 1px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 39px;
  --shadow-sm: rgba(0, 0, 0, 0) 0px 0px 0px 4.34077px;
  --shadow-md: rgba(255, 255, 255, 0.4) 0px 0px 0px 5px, rgba(0, 0, 0, 0.17) 0px 45.612px 86.879px 0px, rgba(0, 0, 0, 0.11) 0px 13.751px 26.192px 0px, rgba(0, 0, 0, 0.09) 0px 5.71104px 10.879px 0px, rgba(0, 0, 0, 0.06) 0px 2.06592px 3.93504px 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.04) 0px 2px 6px 0px, rgba(0, 0, 0, 0.06) 0px 5px 18px 0px, rgba(0, 0, 0, 0.1) 0px 24px 83px 0px;
  --shadow-xl: rgba(0, 0, 0, 0.25) 0px 3.24px 3.24px 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); }
}