@font-face {
	src: url('../PlakatoPro-Regular.otf');
	font-family: Plakato;
}
@font-face {
	src: url('../VeryBauble.woff2');
	font-family: "Very Bauble";
}
html {
	--baseColor: silver;
}

body {
	display: grid;
	place-items: center;
	height: 100vh;
	font-family: "Very Bauble";
	font-size: 5.8cqmin;
	line-height: 1.15;
	background: oklch(from var(--baseColor) 21% c h);
	font-variation-settings: "SERF" calc(100 / 60 * var(--min) * 10);
	margin: 0;
}
time {
	width: 80vmin;
	aspect-ratio: 1;
}

span {
	color: oklch(from var(--baseColor) 0% c h);
	transition: color 5s;
	transition-timing-function: cubic-bezier(0,1,.65,.93);
}
span:first-of-type,
span.lit {
	color: oklch(from var(--baseColor) 90% c h);
	transition: color 1s;
}
#om-en-nabij,
#quarter,
#a-little {
	display: inline-block;
}