body {
	margin-left: auto;
	margin-right: auto;
	max-width: 800px;
	line-height: 1.6;
	font-family: sans-serif;
	padding: 0 10px;
	margin-bottom: 10rem;
	tab-size: 4;
}

@media only screen and (min-width: 800px) {
	body {
		display: grid;
		grid-template-rows: auto;
		grid-template-columns: 75% 25%;
		grid-template-areas:
			"back feed"
			"header header"
			"main sidebar"
			"footer footer";
	}
}

body h1 {
	grid-area: header;
}

body .index {
	grid-area: sidebar;
}

body .main {
	grid-area: main;
}

body .main-full {
	grid-area: main / main / sidebar / sidebar;
}

body .back {
	grid-area: back;
}

body .rss {
	grid-area: feed;
}

body .comment {
	grid-area: footer;
	margin-top: 4rem;
}

nav a {
	display: block;
}

h1, h2, h3 {
	line-height: 1.2;
	color: #d54e53;
}

ul {
	padding-left: 1.1rem;
}

pre {
	overflow-x: auto;
	padding: 0.4rem;
	color: #eaeaea;
}

blockquote {
	font-style: italic;
}

a:link.anchor {
	text-decoration: none;
}

body {
	background-color: #eaeaea;
	color: #303030;
}

pre, span.pre {
	background-color: #1e202a;
}

a:link {
	color: #00587A;
}

a:visited {
	color: #b47cce;
}

a:hover {
	color: #da3c78;
}

a:active {
	color: #70c0ba;
}

@media (prefers-color-scheme: dark) {
	body {
		background-color: #21232e;
		color: #eaeaea;
	}

	a:link {
		color: #7aa6da;
	}

	a:visited {
		color: #c397d8;
	}
}

.index {
	padding-bottom: 1.5rem;
}

.index .entry {
	padding-bottom: 1.5rem;
}

.index .entry time {
	display: block;
}

.cover-figure {
	margin: 0;
	margin-bottom: 1rem;
}

.cover-figure img {
	height: 10rem;
	border-radius: 5px;
}

code {
	white-space: pre;
}