@font-face {
	font-family: JBmono;
	src: url(jbmono/JetBrainsMono-Medium.woff2);
}
@font-face {
	font-family: JBmono;
	src: url(jbmono/JetBrainsMono-MediumItalic.woff2);
	font-style: italic;
}
@font-face {
	font-family: JBmono;
	src: url(jbmono/JetBrainsMono-ExtraBold.woff2);
	font-weight: bold;
}
@font-face {
	font-family: JBmono;
	src: url(jbmono/JetBrainsMono-ExtraBoldItalic.woff2);
	font-weight: bold;
	font-style: italic;
}
:root {
	--black: #0b0a0f;
	--sun: #c26b23;
	--dimsky: #adb8ca;
	--dimgray: #6a6971;
}
* {
	box-sizing: border-box;
	font-size: 100%;
	margin: 0;
	border: 0;
	padding: 0;
}
html {
	background-color: var(--dimsky);
	color: var(--black);
	font: min(calc(15px + 1vmin),21px) JBmono, monospace;
}
body {
	padding: 0 1rem;
	line-height: 1.6;
}
header,main,footer {
	max-width: 720px;
	margin: 0 auto;
}
article {
	margin: 6rem 0;
}
footer {
	margin-top: 50vh;
}
a {
	color: var(--black);
	text-decoration-color: var(--sun);
}
[role=button],h1 a,h2 a,nav a,.footnote-ref,.footnote-backref {
	text-decoration: none;
}
h1 a {
	display: inline-block;
	background-color: var(--dimgray);
	color: silver;
	font-size: 1.25rem;
}
h2,h3,h4,h5,h6,p,blockquote,pre,ul,ol,aside,form {
	margin: 1rem 0;
}
h2 {
	text-transform: uppercase;
}
img {
	max-height: 700px;
	max-width: 100%;
}
h2 a, nav a {
	color: var(--dimgray);
}
nav {
	font-size: 6rem;
}
blockquote {
	border-left: 1rem solid var(--dimgray);
	padding-left: 1rem;
}
ul {
	padding-left: 1rem;
}
ol {
	padding-left: 2rem;
}
*:not(pre) > code {
	background-color: silver;
	border-radius: 2px;
	outline: 1px solid silver;
}
sup,sub {
    vertical-align: baseline;
    position: relative;
    font-size: 0.69rem;
    top: -0.4rem;
}
sub {
    top: 0.4rem;
}
small {
	font-size: 0.8rem;
}
button,[role=button],[type=text],textarea {
	background-color: var(--dimgray);
	color: ghostwhite;
	outline: 2px solid var(--dimgray);
	border-radius: 2px;
	padding: 0 0.25rem;
}
button,[role=button] {
	border: 2px solid var(--dimgray);
    box-shadow: 0 3px var(--black);
}
button:active,[role=button]:active {
    transform: translateY(4px);
    box-shadow: none;
}
address {
	display: inline-block;
}
hr {
	border: 1px dotted var(--black);
}
aside > time {
	color: var(--dimgray);
}
.footnotes {
	border: 1px dashed var(--black) ;
	padding: 0 1rem;
}
.footnotes p {
	margin: 0;
}
.footnote-ref,.footnote-backref {
	color: var(--sun);
}