:root {
	 color-scheme: light dark;
}

body {
	 height: 100vh;
	 max-width: 80ch;
	 margin: 0 auto 0;
	 display: grid;
	 grid-template-rows: auto 1fr auto;
		 
	 color: light-dark(#181818, #e8e8e8);
	 background-color: light-dark(#e8e8e8, #181818);
	 font-family: "Berkeley Mono", "JetBrains Mono", monospace;
}

h1 {
    font-weight: bold;
}

h2 {
    font-weight: semibold;
}

nav {
	 display: flex;
	 flex-direction: row;
	 justify-content: space-between;
}

nav > div {
	 display: flex;
	 flex-direction: row;
	 align-content: center;
	 gap: 1.25rem;
	 align-items: center;
}

a {
	 text-decoration: none;
	 color: light-dark(#185799, #ffdd33);
}

a:hover {
	 text-decoration: underline;
}

a:visited {
	 color: light-dark(#185799, #ffdd33);
}

nav > h1 {
	 font-size: 1.75em;
}

footer > div {
    display: flex;
    justify-content: space-between;
    align-content: center;
}