:root {
	--pico-font-family: "Atkinson Hyperlegible", sans-serif;
}

body {
	max-width: 600px;
	margin: 0 auto;
}

button {
	width: 100%;
}

.hidden {
	display: none;
}

.success {
	background-color: hsl(120, 100%, 85.1%);
	padding: 2rem;
	margin: 1rem;
	font-size: 1.2rem;
	color: hsl(120, 100%, 7.1%);
}

header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#theme-toggle {
	width: auto;
	background: none;
	border: none;
}

#theme-toggle::before {
	content: "☀️";
}

#theme-toggle[dark]::before {
	content: "🌙";
}