@import 'monaspace.css';
@import 'vault-alarm.css';
@import 'syntax-hilighting.css';

/* prevent mobile safari from rendering too small */
html {
	-webkit-text-size-adjust: 100%;
}

#container {
	display: flex;
	flex-direction: column;
	
	/* fallback height */
	min-height: 95vh;
	
	/* small viewport height for modern browsers */
	min-height: 95svh;

}

#container > footer {
	margin-top: auto;
}

main {
	position: relative;
	text-align: left;
	max-width: 50em;
	min-width: 30em;
	margin-left: auto;
	margin-right: auto;
}

header {
	text-align: center;
}

body {
	margin: 0;
	padding: 1em;
	font-family: 'Neon';
	font-variation-settings: "wght" 350, "wdth" 100, "slnt" 0;
	font-size: 1em;
	line-height: 1.3;
	color: #ffc;
	height: 100%;
	background-color: #112;
	counter-reset: footnotes;
}

footer {
	text-align: center;
	font-size: 0.8em;
}

b, strong {
	font-variation-settings: "wght" 800;
}

i, em {
	font-family: 'Radon';
	font-variation-settings: "wght" 500, "slnt" -4;
}

a, a:visited {
	text-decoration: none;
	font-variation-settings: "wght" 800;
	color: #da3;
	outline: none;
	padding-bottom: 1px;
	background-color: transparent;
}

a:active {
	color: #ffc;
}

a:hover {
	text-decoration-line: underline;
	text-decoration-style: dotted;
	color: #ffc;
}

h1 {
	font-size: 2em;
	margin: 0.5em 0;
	font-family: 'Radon';
	font-variation-settings: "wght" 300;
}

h2 {
	font-size: 1.5em;
	font-family: 'Radon';
	font-variation-settings: "wght" 300;
}

h3 {
	font-size: 1.25em;
	font-family: 'Radon';
	font-variation-settings: "wght" 500;
}

ol ::marker {
	font-family: 'Radon';
	font-variation-settings: "slnt" -11;
}

abbr {
	font-size: 1.1em;
	font-variant: small-caps;
	border-bottom: none;
	text-decoration: none;
}

img {
	border-style: none;
}

img.blog {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
}

blockquote {
	background: #336;
	border-left: 8px solid #006;
	border-radius: 5px 5px 5px;
	margin: 1.5em 10px;
	padding: 0.5em 10px;
	font-family: 'Radon';
	font-variation-settings: "slnt" -11;
}

blockquote p {
	display: inline;
}

table {
	border-collapse: collapse;
}

th {
	font-size: 1em;
	font-variation-settings: "wght" 800;
}

td, tr {
	padding: 0.5em;
	border-bottom: 0.5px dotted #66c;
	vertical-align: top;
}

.navlinks a:hover, footer a:hover, .tag a:hover {
	text-decoration: none;
	color: #ffc;
	text-shadow:
	  0 0 9px #fff,
	  0 0 18px #fff,
	  0 0 27px #fff,
	  0 0 36px #fd6,
	  0 0 45px #fd6,
	  0 0 54px #fd6,
	  0 0 63px #fb3,
	  0 0 72px #fa1;
}

.navtitle a:hover {
	text-decoration: none;
	color: #ffc;
	text-shadow:
	  0 0 2px #fff,
	  0 0 10px #fd6,
	  0 0 20px #fd6,
	  0 0 30px #fd6,
	  0 0 40px #fb3,
	  0 0 50px #fa1;
}

.navtitle, .navtitle a {
	font-family: 'Vault Alarm';
	font-size: 1.9em;
	padding-bottom: 0.5em;
}

.navlinks {
	font-family: 'Neon';
	font-variation-settings: "wght" 400;
	font-size: 1em;
	padding-bottom: .5em;
}

.posttitle {
	font-family: 'Radon';
	font-variation-settings: "wght" 100, "wdth" 110, "slnt" 0;
}

.footnotes {
	margin: 0;
	padding: 0.75em 1.5em;
	position: relative;
	text-align: left;
	background-color: #223;
	border-radius: 0.3em;
}

[role="doc-noteref"]::after {
	counter-increment: footnotes;
	content: '[' counter(footnotes) ']'
}

.footnotes__ref[role='doc-noteref']::after {
	content: '(' counter(footnotes) ')';
	counter-increment: footnotes;
	vertical-align: super;
	font-size: 0.6em;
	margin-left: 2px;
	text-decoration: none;
}

.footnotes__list-item:not(:last-child) {
	padding-bottom: 1em;
}

.tag {
	font-size: 0.8em;
	color: #ccf;
	background-color: #66f;
	padding: 5px;
	border-radius: 0px 5px 0px 5px;
	border: 1px solid #33c;
	position:relative;
}

.tag a {
	color: #ccf;
}

.postlisttitle {
	font-size: 1.2em;
	font-family: 'Radon';
	font-variation-settings: "wght" 100, "wdth" 110, "slnt" 0;
	padding-bottom: 0.1em;
	border-bottom: 1px solid #66c;
}

.postlistdate {
	text-align: right;
	font-family: 'Radon';
	font-variation-settings: "wght" 500, "slnt" -4;
	padding-top: 0.1em;
	padding-bottom: 1em;
}

.linklisttitle {
	font-size: 1.2em;
	font-family: 'Radon';
	font-variation-settings: "wght" 100, "wdth" 110, "slnt" 0;
	padding-bottom: 0.1em;
	margin-bottom: 0.5em;
	border-bottom: 1px solid #66c;
}

.linklistquote {
	font-family: 'Radon';
	font-variation-settings: "slnt" -11;
}

.linklistquote:before {
	content: open-quote;
	color: #66c;
	font-size: 2em;
	line-height: 0.1em;
	margin-right: 0.25em;
	vertical-align: -0.4em;
}

.linklistquote:after {
	content: close-quote;
	color: #66c;
	font-size: 2em;
	line-height: 0.1em;
	margin-right: 0.25em;
	vertical-align: -0.4em;
}

.linklistcomment {
	margin-top: 1em;
	margin-bottom: 0.5em;
	padding-left: 2em;
	padding-right: 2em;
}

.linklistdate {
	text-align: right;
	font-family: 'Radon';
	font-variation-settings: "wght" 500, "slnt" -4;
	font-size: 80%;
	padding-top: 0.1em;
	padding-bottom: 0.1em;
	margin-bottom: 0.5em;
	border-bottom: 1px solid #66c;
}

small,
.small {
	font-size: 80%;
}

.separator {
	text-align: center;
	--dlig: "dlig" on;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}