* {
	box-sizing: border-box;
}

:root {
	--accent: light-dark(seagreen, hsl(from seagreen h s 50%));
	--bg: light-dark(seashell, hsl(from black h s 10%));
	--fg: light-dark(hsl(from black h s 30%), hsl(from white h s 85%));
	--mono-font: "JetBrains Mono", "Menlo", monospace, monospace;

	color-scheme: light dark;
	background-color: var(--bg);
	color: var(--fg);
	margin: 0;
	border-top: 5px solid var(--fg);
	font-family: "Iosevka Aile", "Fira Sans", "PT Sans", sans-serif;
	font-size: 100%;
	letter-spacing: 1%;
	word-spacing: 3%;
	line-height: 125%;
}

main {
	max-width: 800px;
	padding: 0 20px 20px 20px;
	margin-left: auto;
	margin-right: auto;
}

section {
	padding-block: 0.5em;
}
 
.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.breathe {
	margin-top: 3em;
}

a {
	outline: none;
	color: var(--fg);
}

a:hover {
	text-decoration-color: var(--accent);
}

h1 {
	line-height: 1em;
}

:root {
}

blockquote {
	border-left: 0.25rem solid var(--fg);
	margin-block: 0.5em;
	margin-inline-start: 0em;
	padding-left: 0.5em;
}

.chip, chip {
	/* font-family: var(--mono-font); */
	border: solid 1px;
	border-radius: calc(1rlh / 2);
	color: light-dark(hsl(from white h s 10%), hsl(from white h s 90%));
	font-size: 80%;
	padding-inline: calc(1rlh / 3);
	margin-inline-end: calc(1rlh / 4);

	&.BC {
		background: light-dark(skyblue, hsl(from skyblue h s 15%));
		border-color: light-dark(hsl(from skyblue h s 25%), skyblue);
	}

	&.DB {
		background: light-dark(lightgreen, hsl(from lightgreen h s 15%));
		border-color: light-dark(hsl(from lightgreen h s 25%), lightgreen);
	}

	&.MD {
		background: light-dark(lightcoral, hsl(from lightcoral h s 15%));
		border-color: light-dark(hsl(from lightcoral h s 25%), lightcoral);
	}

	&.ML {
		background: light-dark(gold, hsl(from gold h s 15%));
		border-color: light-dark(hsl(from gold h s 25%), gold);
	}
}


footer {
	width: 100%;
	border-top: solid 1px;
	margin-block: 1em;
}

h1, h2, h3, h4, b, strong {
	font-weight: 550;
}

h2::before {
	color: var(--accent);
	content: "# ";
}

ol {
	padding-inline-start: 1em;
}

table {
	border-collapse: collapse;
	border-bottom: solid 1px;
}

th {
	font-weight: 550;
	text-align: inherit;
	border-bottom: solid 1px;
}

th, td {
	padding-block: 0.5em;
	padding-inline-end: 0.5em;
}

/* Desktop sizes */
@media (min-width: 600px) {
	ol.twocol {
		column-count: 2;
	}

	.row {
		display: flex;
		flex-direction: row;
		padding: 0;
		width: 100%;
	}

	/* Make everything in a row a column */
	.row > * {
		display: block;
		flex: 1 1 auto;
		max-width: 100%;
		width: 100%;
	}

		.row > *:not(:last-child) {
		margin-right: 10px;
	}
}

/* Dark mode overrides (confusingly inverse) */
@media (prefers-color-scheme: dark) {
	*:focus {
		outline: var(--bg);
		box-shadow: 0 0 0 .25em var(--accent);
	}
	.button a {
		color: var(--bg);
	}
}

/* Printing */
@media print {
	.home {
		display: none;
	}
}