:root {
	--color-bg: #000000;
	--color-text: #fafafa;
	--color-text-muted: rgba(250, 250, 250, 0.8);
	--color-primary: #3b82f6;
	--color-border: rgba(255, 255, 255, 0.1);
	--color-surface: rgba(26, 26, 26, 0.6);
	--color-hover: rgba(255, 255, 255, 0.05);
	--color-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
	--font-sans: system-ui, sans-serif;
	--font-mono: ui-monospace, monospace;
	--font-title: "BrokenHorizon", var(--font-sans);
	--space-xs: 0.25rem;
	--space-sm: 0.5rem;
	--space-md: 1rem;
	--space-lg: 1.5rem;
	--space-xl: 2rem;
	--shell-max-width: 74rem;
	--header-bar-max-width: 70rem;
	--header-offset: 5rem;
}

html[data-theme="light"] {
	--color-bg: #fafafa;
	--color-text: #1a1a1a;
	--color-text-muted: rgba(26, 26, 26, 0.75);
	--color-border: rgba(0, 0, 0, 0.1);
	--color-surface: rgba(255, 255, 255, 0.75);
	--color-hover: rgba(0, 0, 0, 0.05);
	--color-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
}