:root {
		--accent: #1e90ff;
		--main: #111;
		--bg: #eee;
		--bg2: #e3e3e3;
		--bg3: #fff;
}

/* Dark mode alt colors */
@media (prefers-color-scheme: dark) {
	:root {
		--main: #ddd;
		--bg: #111;
		--bg2: #131313;
		--bg3: #000;
	}
	
	.dark-invert {filter: invert(1);}
}

/* Layout */
body {color:var(--main);background-color: var(--bg);text-align:justify;font-family:'IBM Plex Serif', serif;font-size: 1.1em;}
main {display:block;max-width:55em;margin:1em auto;background:var(--bg);padding:2em;}
header {background: #000;line-height:2.8rem;padding:0.5em 2em;display:flex;align-items: center;justify-content:space-between;}
footer {margin: 1em;text-align: center;}

nav {display: grid;grid-auto-flow: column;grid-column-gap: 2em}
header a {text-decoration:none;font-family: 'Chakra Petch', sans-serif;}

/* Text elements */
p {line-height: 1.5em;font-weight:300;}
dfn {color:var(--accent);text-decoration: underline dashed var(--main) 1px;}
a {color: var(--accent);}
strong {font-weight: 700}

ul {list-style: none;list-style-position:inside;padding-left:1em}
ul li::before {content: "> ";color:var(--accent);margin:0;}

/* Headers */
h1,h2,h3,h4,h5,h6 {font-family: 'Chakra Petch', sans-serif;}
h1 img {height:1.8em;padding:.3em .3em .3em 0;vertical-align:middle;}
h2::before {content: "> ";color:var(--accent);}
h3::before {content: "# ";color:var(--accent);}

/* Quotes */
blockquote {display: block;font-style:italic;overflow-x: scroll;padding:1em;margin:1em;border-left: 3px solid var(--accent);}

/* Code blocks */
code {font-family: monospace; background: var(--bg3);padding:0.5em 0.5em;}
pre code {display: block;white-space: pre;overflow-x: scroll;padding:1em;margin:1em;border-left: 3px solid var(--accent);}

.boxes {margin:0;padding:0;display:flex;justify-content:space-around;gap:0.5em;}
.boxes > * {padding: 3em 1em;background:var(--accent);flex: 1 1 0;text-align:center;border-radius:0.4em;background-size:cover;text-shadow: 0 0 5px #000000;}

.status-closed {color: #FF441F;}
.status-open {color: #1FFF1F;}