:root {
	--bg: #F4EEE0;
	--tb: #FFEEE0;
	--text: #141414;
	--link: #1E4B8A;
	--angle: 45deg;
}

@media (prefers-color-scheme: dark) {
	:root {
		--bg: #141414;
		--tb: #222;
		--text: #F4EEE0;
		--link: #D4AF37;
	}
}

body {
	font-size: 140%;
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: Verdana, sans-serif;
}

a {
	text-decoration: none;
	color: var(--link);
	cursor: pointer;
}

main {
	margin: 150px auto;
	transition: margin-top 1s ease;
	width: 500px;
	max-width: 90vw;
	height: fit-content;
}

@media (max-width: 800px) {
	main {
		margin: 30px auto;
	}
}

table {
	z-index: 1;
	width: 100%;
	background: var(--tb);
	border-collapse: collapse;
	border: 1px solid var(--text);
}

th, td {
	border: 1px solid var(--text);
	padding: 5px 10px;
}

th {
	background: var(--bg);
	font-weight: normal;
}

h1 {
	font-size: 160%;
}

a:hover {
	text-decoration: underline;
}