body {
	font-family: system-ui, sans-serif;
	background-color: #2e2e2e;
	color: #fff;
}
footer {
	font-style: italic;
}
code {
	font-family: Monaco, monospace;
}

:link,
:visited {
	color: #fff;
}

[data-sr-only] {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap; /* 1 */
	width: 1px;
}

summary {
	margin-top: 1em;
	padding: 1em 0;
	border-top: 1px solid #888;
}

.url {
	font-size: 1em; /* 20px /16 */
	-ms-word-break: break-all;
	word-break: break-all;
	word-break: break-word;
}
@media (min-width: 37.5em) { /* 600px */
	.url {
		font-size: 1.25em; /* 20px /16 */
	}
}

table {
	border-spacing: 0;
	border-collapse: collapse;
}
th, td {
	margin: 0;
	padding: .25em .5em;
}
th {
	border: 1px solid #555;
	font-weight: normal;
}
tr:first-child th,
th[class^="results-series"] {
	font-weight: bold;
}

abbr {
	text-decoration: none;
}

a[href].external {
	margin-right: 1em;
}
a[href].external,
a[href].external:visited {
	color: #aaa;
}

/* Speedlify specific styles */
.speedlify-hed {
	text-align: center;
	font-size: 3em;
	text-transform: lowercase;
	font-style: italic;
}
.speedlify-subhed {
	padding: 0 2em;
	margin: 0 auto;
	max-width: 40em;
	text-align: center;
}


/* Leaderboard */

.leaderboard {
	width: 100%;
	margin: 5em 0;
}
.leaderboard-data-right {
	text-align: right;
}
@media (max-width: 37.4375em) { /* 599px */
	.leaderboard-hide-sm {
		display: none;
	}
}
@media (max-width: 63.9375em) { /* 1023px */
	.leaderboard-hide-md {
		display: none;
	}
}
@media (min-width: 50em) { /* 800px */
	.leaderboard td {
		font-size: 1.3125em; /* 21px /16 */
	}
}

/* Results table */
.results {
	width: 100%;
}
.results td {
	white-space: nowrap;
}
.results-calc {
	text-align: center;
}
.results-bool {
	width: 1ch;
}
.results-bool + td {
	padding-left: 0;
}
.results-date {
	width: 6.25rem; /* 100px /16 */
}
.count,
.date {
	color: #aaa;
	font-size: 0.8125em; /* 13px /16 */
}

/* Layout */
.tablewrap {
	width: 100%;
	overflow-x: auto;
	margin: 0 0 2em;
}
@media (min-width: 87.5em) { /* 1400px */
	.layout {
		display: grid;
		grid-gap: 1em;
		margin-bottom: 2em;
	}
	.layout {
		grid-template-columns: repeat(auto-fill, 49%);
	}
}

/* Charts */

.ct-chart.ct-chart {
	margin-bottom: 2em;
}
.ct-line.ct-line {
	stroke-width: 3px;
}
.ct-label.ct-label {
	fill: rgba(255, 255, 255, 0.4);
	color: rgba(255, 255, 255, 0.4);
	white-space: nowrap;
}
.ct-grid.ct-grid {
	stroke: rgba(255, 255, 255, 0.2);
}
/* via https://learnui.design/tools/data-color-picker.html */
:root {
	--speedlify-color-1: #374c80;
	--speedlify-color-2: #7a5195;
	--speedlify-color-3: #bc5090;
	--speedlify-color-4: #ef5675;
	--speedlify-color-5: #ff764a;
	--speedlify-color-6: #ffa600;
}
.color--lighthouse {
	--speedlify-color-1: #004e5f;
	--speedlify-color-2: #006a6c;
	--speedlify-color-3: #00845f;
	--speedlify-color-4: #4f9a3e;
	--speedlify-color-5: #a3a704;
	--speedlify-color-6: #ffa600;
}
.color--weight {
	--speedlify-color-1: #5100ff;
	--speedlify-color-2: #de00c3;
	--speedlify-color-3: #ff0085;
	--speedlify-color-4: #ff004f;
	--speedlify-color-5: #ff6c22;
	--speedlify-color-6: #ffa600;
}
.results-series-a {
	background-color: var(--speedlify-color-1);
}
.ct-series-a.ct-series-a .ct-line {
	stroke: var(--speedlify-color-1);
}
.results-series-b {
	background-color: var(--speedlify-color-2);
}
.ct-series-b.ct-series-b .ct-line {
	stroke: var(--speedlify-color-2);
}
.results-series-c {
	background-color: var(--speedlify-color-3);
}
.ct-series-c.ct-series-c .ct-line {
	stroke: var(--speedlify-color-3);
}
.results-series-d {
	background-color: var(--speedlify-color-4);
}
.ct-series-d.ct-series-d .ct-line {
	stroke: var(--speedlify-color-4);
}
.results-series-e {
	background-color: var(--speedlify-color-5);
}
.ct-series-e.ct-series-e .ct-line {
	stroke: var(--speedlify-color-5);
}
.results-series-f {
	background-color: var(--speedlify-color-6);
}
.ct-series-f.ct-series-f .ct-line {
	stroke: var(--speedlify-color-6);
}
