:root {
	--color-bg: #0a0a1f;
	--color-dark: #0f1b40;
	--color-light: #15204a;
	--color-white: #f3f5ff;
	--color-text-secondary: #f3f5ffb3;
	--color-gray-light: #eee;
	--color-accent: #28b0ff;
	--color-blue-accent-dark: #28b0ff4d;
	--color-accent-hover: #1a8bbf;
	--color-rating-high: #23b862;
	--color-rating-middle: #f39c12;
	--color-rating-low: #e74c3c;
	--color-purple-light: #646176;
	--color-purple-border: #82799c;
	--color-purple-placeholder: #3c364c;
	--color-purple-dark: #2c2638;
	--color-purple-super-dark: #201c29;
	--color-purple-accent: #8127cf;
	--color-error: #db0732;
	--color-icons: #1e2a5e;
	--color-shadow-hover: rgb(0 245 255 / 50%);
	--color-shadow-focus: #00f5ff4d;
	--color-gradient-film: linear-gradient(to right, #141428, #0d0d1a);
	--shadow: 0 0 1rem #28b0ff4d;
	--font-size-3xl: 3rem;
	--font-size-2xl: 2rem;
	--font-size-xl: 1.25rem;
	--font-size-lg: 1.125rem;
	--font-size-base: 1rem;
	--font-size-sm: 0.875rem;
	--font-size-xs: 0.75rem;
	--border-radius-3xl: 1.5rem;
	--border-radius-2xl: 1rem;
	--border-radius-xl: 0.75rem;
	--border-radius-lg: 0.5rem;
	--border-radius-md: 0.375rem;
	--border-radius-sm: 0.25rem;
	--border-radius-xs: 0.125rem;
}