body {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	font-family: sans-serif, system-ui;
}

a {
	text-decoration: none;
	color: darkslateblue;
}

a:hover {
	text-decoration: underline;
}

form {
	display: grid;
	width: fit-content;
	row-gap: 1rem;
}

form input,
form select {
	background: none;
	border: none;
	border-bottom: solid 2px lightgray;
	padding: 0.5rem;
	border-radius: 0.25rem;
	font-size: 1rem;
}

form input:focus,
form select:focus {
	outline: none;
	border-bottom: solid 2px lightblue;
}

form input.invalid {
	border-bottom: solid 2px lightcoral;
}

form button {
	font-size: 1rem;
	color: darkslateblue;
	background: none;
	border: solid 2px darkslateblue;
	border-radius: 0.25rem;
	padding: 0.5rem;
	box-shadow: 0.25rem 0.25rem 0.25rem gray;
}

h1,
h2,
h3,
h4 {
	color: darkslateblue;
	font-variant-caps: small-caps;
}
