:root {
	--color-bg: #f5f6f8;
	--color-surface: #ffffff;
	--color-surface-raised: #ffffff;
	--color-text: #14161a;
	--color-text-muted: #5b6169;
	--color-border: #dfe2e7;
	--color-accent: #2f6fed;
	--color-accent-contrast: #ffffff;
	--color-danger: #d1453b;

	color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
	:root {
		--color-bg: #0f1115;
		--color-surface: #16191f;
		--color-surface-raised: #1e222a;
		--color-text: #e8e8ec;
		--color-text-muted: #9198a3;
		--color-border: #2a2f38;
		--color-accent: #5b8dfd;
		--color-accent-contrast: #0f1115;
		--color-danger: #ff6b60;
	}
}

* {
	box-sizing: border-box;
}

html,
body {
	height: 100%;
}

body {
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family:
		system-ui,
		-apple-system,
		'Segoe UI',
		Roboto,
		sans-serif;
}

a {
	color: var(--color-accent);
}

input,
button {
	font: inherit;
}