body {
	margin: 0;
	display: flex;
	gap: 1px;
	background: black;
	overflow: hidden;
	//flex-direction: row-reverse;
}
section {
	height: 100vh;
	display: grid;
	grid-template-rows: var(--g);
	gap: 1px;
	min-width: calc((100/48 + (var(--w) * 3)) * 1dvh);
}
section:only-of-type {
	width: 100%;
}
section:not(:only-of-type) {
	flex-grow: var(--w);
}
section:nth-last-of-type(odd) {
	transform: scaleY(-1);
}
div {
	background-image: linear-gradient( hsl( var(--hue), calc(var(--sat) * 1%), 50% ) 0%, hsl( var(--hue), calc(var(--sat) * 1%), 50% ) 100% );
	background-repeat: no-repeat;
}
section:first-of-type div:last-of-type {
	background-image: linear-gradient( hsl( var(--hue), calc(var(--sat) * 1%), 50% ) 0%, hsl( var(--hue), calc(var(--sat) * 1%), 50% ) calc( 100/60 * var(--minute) * 1%), transparent  calc( 100/60 * var(--minute) * 1%) );
}