body {
	font-family: 'Fira Code', 'Nanum Gothic Coding', monospace;
	max-width: 50rem;
	margin: 3em auto;
	padding: 0 1em;
	line-height: 1.5;

	/* iOS Safari font-size fix */
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
}
header > h1 {
	font-size: 3em;
	text-align: center;
	font-weight: 200;
	margin-bottom: 0;

	/* iOS does not support text-decoration short-hand */
	text-decoration-line: underline;
	text-decoration-color: darkgoldenrod;
	text-decoration-thickness: 3px;
	text-underline-offset: 4px;
}
header > h2 {
	text-align: center;
	font-weight: 200;
	margin-top: 0;
}

header > h1:before { content: unset; }
header > h2:before { content: unset; }

h1:before { content: "# "; }
h2:before { content: "## "; }
h3:before { content: "# "; }
h4:before { content: "## "; }

article > h1 { font-size: 1.75em; }
article > h2 { font-size: 1.5em; }
article > h3 { font-size: 1.25em; }

a { color: rgb(30, 30, 100); }
a:visited { color: rgb(110, 60, 140); }

ol { list-style-type: decimal; }
ul { list-style-type: '— '; }

p { margin-bottom: 2em; }

img {
	width: 100%;
	border-radius: 10px;
}
pre {
	overflow-x: auto;
	padding: 0.5em;
	border-radius: 3px;
}
footer {
	border-top: 2px solid #000;
	padding-top: 1em;
}
@media only screen and (max-width: 45rem) {
	body > article { font-size: 0.9em; }
	header > h1 { font-size: 2em; }
	header > h2 { font-size: 1.1em; }
	article > h1 { font-size: 1.5em; }
	article > h2 { font-size: 1.25em; }
	article > h3 { font-size: 1.1em; }
	footer { font-size: 0.9em; }
}
@media (prefers-color-scheme: dark) {
	body {
		color: lightgrey;
		background-color: #1A1A1AFF;
	}
	a { color: rgb(160, 140, 160); }
	a:visited { color: rgb(180, 120, 180); }
	footer { border-top: 2px solid lightgrey; }
}