body {
	background-image: url(/pineapple-surf.png);
	background-size: cover;
	background-attachment: fixed;
}

footer {
	border-radius: 4px;
	padding: 2px 2px 0 2px;
	background-color: white;
	color: black;
}

#__next {
	min-height: 100vh;

	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
}

#host {
	font-size: small;
}

#board {
	font-family: monospace;
}

.rank {
	text-align: right;
	font-family: monospace;
}

.score {
	text-align: right;
	font-family: monospace;
}

.suffix {
	opacity: 50%;
}

.gold {
	--bhsl-current-hue: 36deg;
	--bhsl-current-saturation: 100%;
	--bhsl-current-lightness: 60%;

	background-color: hsla(36deg 100% 60% / 0.1);

	font-size: xx-large;
}

.silver {
	--bhsl-current-hue: 205deg;
	--bhsl-current-saturation: 20%;
	--bhsl-current-lightness: 83%;

	background-color: hsla(205deg 20% 83% / 0.1);

	font-size: x-large;
}

.bronze {
	--bhsl-current-hue: 24deg;
	--bhsl-current-saturation: 100%;
	--bhsl-current-lightness: 62%;

	background-color: hsla(24deg 100% 62% / 0.1);

	font-size: large;
}