:root {
	--text-xs: 0.75rem;
	/* 12px */
	--text-xs--line-height: calc(1 / 0.75);
	--text-sm: 0.875rem;
	/* 14px */
	--text-sm--line-height: calc(1.25 / 0.875);
	--text-base: 1rem;
	/* 16px */
	--text-base--line-height: calc(1.5 / 1);
	--text-lg: 1.125rem;
	/* 18px */
	--text-lg--line-height: calc(1.75 / 1.125);
	--text-xl: 1.25rem;
	/* 20px */
	--text-xl--line-height: calc(1.75 / 1.25);
	--text-2xl: 1.5rem;
	/* 24px */
	--text-2xl--line-height: calc(2 / 1.5);
	--text-3xl: 1.875rem;
	/* 30px */
	--text-3xl--line-height: calc(2.25 / 1.875);
	--text-4xl: 2.25rem;
	/* 36px */
	--text-4xl--line-height: calc(2.5 / 2.25);
	--text-5xl: 3rem;
	/* 48px */
	--text-5xl--line-height: 1;
	--text-6xl: 3.75rem;
	/* 60px */
	--text-6xl--line-height: 1;
	--text-7xl: 4.5rem;
	/* 72px */
	--text-7xl--line-height: 1;
	--text-8xl: 6rem;
	/* 96px */
	--text-8xl--line-height: 1;
	--text-9xl: 8rem;
	/* 128px */
	--text-9xl--line-height: 1;

	--spacing: 0.25rem;
	/* 4px */

	--radius-xs: 0.125rem;
	/* 2px */
	--radius-sm: 0.25rem;
	/* 4px */
	--radius-md: 0.375rem;
	/* 6px */
	--radius-lg: 0.5rem;
	/* 8px */
	--radius-xl: 0.75rem;
	/* 12px */
	--radius-2xl: 1rem;
	/* 16px */
	--radius-3xl: 1.5rem;
	/* 24px */
	--radius-4xl: 2rem;
	/* 32px */
	--radius-none: 0;
	--radius-full: calc(infinity * 1px);

	/* Semantic Tokens */

	color-scheme: light;
	--background: oklch(0.98 0.008 250);
	--foreground: oklch(0.23 0.04 260);

	--card: oklch(1 0 0);
	--card-foreground: oklch(0.23 0.04 260);

	--popover: oklch(1 0 0);
	--popover-foreground: oklch(0.23 0.04 260);

	--primary: oklch(0.48 0.15 255.37);
	--primary-foreground: oklch(1 0 0);

	--secondary: oklch(0.94 0.02 250);
	--secondary-foreground: oklch(0.27 0.04 260);

	--muted: oklch(0.94 0.02 250);
	--muted-foreground: oklch(0.58 0.04 260);

	--accent: oklch(0.62 0.16 155);
	--accent-foreground: oklch(1 0 0);

	--destructive: oklch(0.62 0.18 20);
	--destructive-foreground: oklch(0.98 0.01 20);

	--border: oklch(0.91 0.025 250);
	--input: oklch(0.91 0.025 250);
	--ring: var(--primary);
}

.dark {
	color-scheme: dark;
	--background: oklch(0.16 0.025 260);
	--foreground: oklch(0.92 0.015 250);
	--card: oklch(0.2 0.028 260);
	--card-foreground: oklch(0.92 0.015 250);
	--popover: oklch(0.2 0.028 260);
	--popover-foreground: oklch(0.92 0.015 250);
	--primary: oklch(0.72 0.14 255.37);
	--primary-foreground: oklch(0.14 0.025 260);
	--secondary: oklch(0.27 0.03 260);
	--secondary-foreground: oklch(0.9 0.015 250);
	--muted: oklch(0.27 0.03 260);
	--muted-foreground: oklch(0.7 0.025 250);
	--accent: oklch(0.72 0.14 155);
	--accent-foreground: oklch(0.14 0.025 155);
	--destructive: oklch(0.68 0.18 20);
	--destructive-foreground: oklch(0.98 0.01 20);
	--border: oklch(0.31 0.03 260);
	--input: oklch(0.35 0.03 260);
	--ring: var(--primary);
}

@media (prefers-color-scheme: dark) {
	:root:not(.light) {
		color-scheme: dark;
		--background: oklch(0.16 0.025 260);
		--foreground: oklch(0.92 0.015 250);
		--card: oklch(0.2 0.028 260);
		--card-foreground: oklch(0.92 0.015 250);
		--popover: oklch(0.2 0.028 260);
		--popover-foreground: oklch(0.92 0.015 250);
		--primary: oklch(0.72 0.14 255.37);
		--primary-foreground: oklch(0.14 0.025 260);
		--secondary: oklch(0.27 0.03 260);
		--secondary-foreground: oklch(0.9 0.015 250);
		--muted: oklch(0.27 0.03 260);
		--muted-foreground: oklch(0.7 0.025 250);
		--accent: oklch(0.72 0.14 155);
		--accent-foreground: oklch(0.14 0.025 155);
		--destructive: oklch(0.68 0.18 20);
		--destructive-foreground: oklch(0.98 0.01 20);
		--border: oklch(0.31 0.03 260);
		--input: oklch(0.35 0.03 260);
		--ring: var(--primary);
	}
}
