:root {
	/* Brand violet scale (Tailwind violet) */
	--jai-color-brand-50: #f5f3ff;
	--jai-color-brand-100: #ede9fe;
	--jai-color-brand-200: #ddd6fe;
	--jai-color-brand-300: #c4b5fd;
	--jai-color-brand-400: #a78bfa;
	--jai-color-brand-500: #8b5cf6;
	--jai-color-brand-600: #7c3aed;
	--jai-color-brand-700: #6d28d9;
	--jai-color-brand-800: #5b21b6;
	--jai-color-brand-900: #4c1d95;

	/* Accent (fuchsia) */
	--jai-color-accent: #d946ef;
	--jai-color-accent-2: #d946ef;

	/* Light theme surface tokens */
	--jai-color-bg: #ffffff;
	--jai-color-surface: #f8fafc;
	--jai-color-surface-strong: #eef2f7;
	--jai-color-text: #0f172a;
	--jai-color-muted: #475569;
	--jai-color-border: rgba(15, 23, 42, 0.08);
	--jai-color-border-strong: rgba(15, 23, 42, 0.14);
	--jai-color-primary: #0f172a;
	--jai-color-primary-soft: #1e293b;
	--jai-color-success: #0f9f6e;
	--jai-color-white: #ffffff;

	/* Gradients */
	--jai-gradient-brand: linear-gradient(135deg, #7c3aed 0%, #d946ef 100%);
	--jai-gradient-brand-soft: linear-gradient(135deg, rgba(124, 58, 237, 0.14) 0%, rgba(217, 70, 239, 0.14) 100%);
	--jai-gradient-dark: linear-gradient(135deg, #0f172a 0%, #1e1b4b 70%, #581c87 130%);

	/* Typography */
	--jai-font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--jai-font-size-sm: 0.875rem;
	--jai-font-size-base: 1rem;
	--jai-font-size-lg: 1.125rem;
	--jai-line-height: 1.65;
	--jai-line-height-tight: 1.12;

	/* Container widths */
	--jai-container: 1180px;
	--jai-container-wide: 1360px;
	--jai-container-content: 760px;

	/* Spacing scale */
	--jai-space-2xs: 0.25rem;
	--jai-space-xs: 0.5rem;
	--jai-space-sm: 0.75rem;
	--jai-space-md: 1rem;
	--jai-space-lg: 1.5rem;
	--jai-space-xl: 2rem;
	--jai-space-2xl: 3rem;
	--jai-space-3xl: 4.5rem;
	--jai-space-4xl: 6rem;

	/* Radius scale */
	--jai-radius-sm: 0.375rem;
	--jai-radius-md: 0.5rem;
	--jai-radius-lg: 0.75rem;
	--jai-radius-xl: 1rem;
	--jai-radius-2xl: 1.25rem;
	--jai-radius-3xl: 1.75rem;
	--jai-radius-full: 999px;

	/* Shadows */
	--jai-shadow-soft: 0 18px 60px rgba(15, 23, 42, 0.08);
	--jai-shadow-card: 0 12px 35px rgba(15, 23, 42, 0.1);
	--jai-shadow-ring: 0 0 0 1px var(--jai-color-border);
	--jai-shadow-glow: 0 0 30px 10px rgba(124, 58, 237, 0.18);
	--jai-shadow-glow-strong: 0 12px 40px rgba(124, 58, 237, 0.32);

	/* Layers */
	--jai-z-header: 50;
	--jai-z-menu: 60;

	/* Motion */
	--jai-transition: 180ms ease;
	--jai-transition-slow: 320ms ease;
}

html.dark {
	--jai-color-bg: #020617;
	--jai-color-surface: #0f172a;
	--jai-color-surface-strong: #1e293b;
	--jai-color-text: #f1f5f9;
	--jai-color-muted: #94a3b8;
	--jai-color-border: rgba(241, 245, 249, 0.1);
	--jai-color-border-strong: rgba(241, 245, 249, 0.18);
	--jai-color-primary: #f1f5f9;
	--jai-color-primary-soft: #e2e8f0;
	--jai-color-white: #f8fafc;

	--jai-shadow-soft: 0 20px 60px rgba(0, 0, 0, 0.4);
	--jai-shadow-card: 0 16px 45px rgba(0, 0, 0, 0.5);
	--jai-shadow-glow: 0 0 32px 10px rgba(124, 58, 237, 0.28);
	--jai-shadow-glow-strong: 0 12px 40px rgba(124, 58, 237, 0.45);
}