:root {
	color-scheme: light dark;

	--bg: #ffffff;
	--fg: #222222;
	--muted: #777777;
	--link: #777777;
	--border: #dddddd;
	--code-bg: #eeeeee;
}

@media (prefers-color-scheme: dark) {
	:root {
		--bg: #0b0b0f;
		--fg: #dddddd;
		--muted: #999999;
		--link: #aaaaaa;
		--border: #333333;
		--code-bg: #1d1d24;
	}
}

html {
	background: var(--bg);
	color: var(--fg);
}

body {
	background: var(--bg);
	color: var(--fg);
	font-family: sans-serif;
}

a, font {
	color: var(--link);
}

hr {
	border: 0;
	border-top: 1px solid var(--border);
}

code {
	background: var(--code-bg);
	color: var(--fg);
	padding: 0.1em 0.25em;
	border-radius: 0.25em;
}

img {
	max-width: 100%;
	height: auto;
}

marquee {
	color: var(--fg);
}

::selection {
	background: #666666;
	color: #ffffff;
}

body.illegal {
	max-width: 56rem;
	margin: 2rem auto;
	padding: 0 1.25rem;
	line-height: 1.6;
}