.hovertext {
	position: relative;
	border-bottom: 1px dashed #aaa;
	cursor: help;
	text-decoration: none;
}

.hovertext[data-tooltip]:hover::after {
	content: attr(data-tooltip);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 125%;
	background: #222;
	color: #fff;
	padding: 4px 8px;
	border-radius: 4px;
	opacity: 1;
	box-shadow: 0 2px 8px rgba(0,0,0,0.2);
	text-align: center;
	white-space: normal;
	max-width: 40vw;
	width: max-content;
}

.hovertext[data-tooltip]::after {
	content: '';
	opacity: 0;
}

html {
	overflow-y: scroll;
}

:root {
	--bgcolor: #050505;
	--fontcolor: #f6f6f6;
	--linkcolor: dodgerblue;
	--visitedcolor: dodgerblue;
	--precolor: #fff;
	--prebgcolor: #383838;
}

body {
	font-family: monospace;
	max-width: 800px;
	margin: 40px auto;
	padding: 0 10px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--fontcolor);
	background: var(--bgcolor);
}

a:link {
	color: var(--linkcolor);
}
a:visited {
	color: var(--visitedcolor);
}
a:active {
	color: var(--visitedcolor);
}

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

p > code {
	color: var(--precolor);
	background: var(--prebgcolor);
	padding: 2px;
}

code {
	color: var(--precolor);
	background: var(--prebgcolor);
	padding: 2px;
}

pre {
	color: var(--precolor);
	background: var(--prebgcolor);
	padding: 24px;
	overflow-x: auto;
}

article {
	padding: 24px 0;
}

.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

figcaption {
	color: #888;
	font-size: 12px;
	line-height: 1.5;
	font-family: monospace;
	text-align: center;
}

figure {
	margin: auto;
}

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

/* Tooltip hover text styling */
.hovertext {
	border-bottom: 1px dashed #aaa;
	cursor: help;
	text-decoration: none;
}

/* Header color classes */
.header-right {
	content: attr(data-tooltip);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 125%;
	background: #222;
	color: #fff;
	padding: 4px 8px;
	border-radius: 4px;
	white-space: normal;
	max-width: 90vw;
	z-index: 100;
	opacity: 1;
	pointer-events: none;
	font-size: 13px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.2);
	text-align: center;
	word-break: break-word;
}

.hovertext[data-tooltip]::after {
	content: '';
	opacity: 0;