:root {
	color-scheme: light dark;

	--color-dark: #130024;
	--color-light: #ffdff3;
	--color-purple-dark: #570d93;
	--color-purple-light: #be70fe;
	--color-pink-dark: #8f0d66;
	--color-pink-light: #e771c2;
	--color-orange-dark: #ba4f1d;
	--color-orange-light: #e88a5c;

	--color-bg: light-dark(var(--color-light), var(--color-dark));
	--color-text: light-dark(var(--color-dark), var(--color-light));
	--color-purple: light-dark(var(--color-purple-dark), var(--color-purple-light));
	--color-pink: light-dark(var(--color-pink-dark), var(--color-pink-light));
	--color-orange: light-dark(var(--color-orange-dark), var(--color-orange-light));
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	color: var(--color-text);
	background-color: var(--color-bg);
	font-family: Courier, monospace;
	width: 65%;
	margin: 0 auto;
}

@media (max-width: 650px) {
	body {
		width: 92%;
	}
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: Verdana, sans-serif;
	line-height: 2.5;
}