canvas {
	border: 2px solid black;
	background-color: black;
}

video {
	display: none;
}

img {
	display: none;
}

#container {
	position: relative;
	display: inline-block;
	line-height: 0;
}

#loader {
	position: absolute;
	inset: 0;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center; gap: 12px;
	background: #111; color: #eee; font-family: sans-serif;
	line-height: normal;
	transition: opacity 0.4s;
	z-index: 10;
}

#loader.hidden { opacity: 0; pointer-events: none; }
.loader-bar {
	width: min(320px, 70vw); height: 12px;
	border: 2px solid #eee; border-radius: 8px; overflow: hidden;
}

#loader-fill {
	width: 0; height: 100%; background: #4ade80;
	transition: width 0.15s ease-out;
}