:root {
	--color-bg: #16181c;
	--color-fg: #b0bac5;
	--color-section-bg: #26292f;

	--content-width: 30%;
	--content-max-width: 300px;
	--content-padding: 1.5rem;
	--edge-rounding: 1rem;
}

html,
body {
	height: 100%;
	overflow: hidden;
}

body {
	color: var(--color-fg);
	background-color: var(--color-bg);
	display: flex;
	justify-content: center;
	align-items: center;
	font-family:
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		'Segoe UI',
		Helvetica Neue,
		Helvetica,
		Oxygen,
		Ubuntu,
		Roboto,
		Cantarell,
		Fira Sans,
		Droid Sans,
		'Apple Color Emoji',
		'Segoe UI Emoji',
		Arial,
		sans-serif;
}

.content {
	background-color: var(--color-section-bg);
	width: var(--content-width);
	max-width: var(--content-max-width);
	border-radius: var(--edge-rounding);
	padding: var(--content-padding);
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}

.content h2 {
	margin-bottom: 0;
}

.logo {
	display: block;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 2rem;
	border-radius: 1.5rem;
}

a {
	color: #4f9cff;
	text-decoration: underline;
}

a:visited {
	color: #4f9cff;
}

img {
	image-rendering: pixelated;
}
