*, *::before, *::after {
	padding: 0;
	margin: 0 auto;
	box-sizing: border-box;
}

body {
	background-color: #000;
	color: #fff;
	min-height: 100vh;
	display: grid;
	place-items: center;
	font-size: 24px;
	perspective: 32em;
}
body *:not(:empty) {
	transform-style: preserve-3d;
}

.scene {
	position: relative;
	-webkit-animation: rotate 117s infinite linear;
	animation: rotate 117s infinite linear;
}
@-webkit-keyframes rotate {
	to {
		transform: rotateY(360deg);
	}
}
@keyframes rotate {
	to {
		transform: rotateY(360deg);
	}
}

.extraRotate {
	-webkit-animation: extraRotate 12s infinite ease-in-out;
	animation: extraRotate 12s infinite ease-in-out;
}
@-webkit-keyframes extraRotate {
	0%, 35% {
		transform: rotateY(0deg);
	}
	50%, 85% {
		transform: rotateY(180deg);
	}
	100% {
		transform: rotateY(360deg);
	}
}
@keyframes extraRotate {
	0%, 35% {
		transform: rotateY(0deg);
	}
	50%, 85% {
		transform: rotateY(180deg);
	}
	100% {
		transform: rotateY(360deg);
	}
}

.floor {
	position: absolute;
	inset: -32em;
	background-color: #111;
	transform: rotateX(-90deg) translateZ(8em);
	background-image: radial-gradient(#0000, #000 32em), repeating-linear-gradient(90deg, #fff 0 2px, #fff0 0 2em), repeating-linear-gradient(#fff 0 2px, #fff0 0 2em);
}

.is {
	position: absolute;
	transform: translateY(8em);
}

i {
	position: absolute;
	transform: rotateX(90deg);
	transform-style: preserve-3d;
}
i::before {
	content: "";
	position: absolute;
	inset: -2em;
	background-image: radial-gradient(#000, #0000 2em);
	-webkit-animation: explodeBefore 6s infinite cubic-bezier(0.25, 0, 0.65, 1.25), opacity 6s infinite linear;
	animation: explodeBefore 6s infinite cubic-bezier(0.25, 0, 0.65, 1.25), opacity 6s infinite linear;
}
@-webkit-keyframes explodeBefore {
	0%, 40%, 100% {
		transform: translate(0, 0);
		-webkit-animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
		animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
	}
	90% {
		transform: translate(var(--tx, 0), var(--ty, 0));
	}
}
@keyframes explodeBefore {
	0%, 40%, 100% {
		transform: translate(0, 0);
		-webkit-animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
		animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
	}
	90% {
		transform: translate(var(--tx, 0), var(--ty, 0));
	}
}
@-webkit-keyframes opacity {
	0%, 40%, 100% {
		opacity: 0.1;
	}
	60%, 90% {
		opacity: 1;
	}
}
@keyframes opacity {
	0%, 40%, 100% {
		opacity: 0.1;
	}
	60%, 90% {
		opacity: 1;
	}
}
i::after {
	content: "";
	position: absolute;
	inset: -1em;
	box-shadow: 0 0 1em #000 inset;
	-webkit-animation: explodeAfter 6s infinite cubic-bezier(0.25, 0, 0.65, 1.25), color 6s infinite linear;
	animation: explodeAfter 6s infinite cubic-bezier(0.25, 0, 0.65, 1.25), color 6s infinite linear;
}
@-webkit-keyframes explodeAfter {
	0%, 40%, 100% {
		transform: translate3d(0, 0, var(--init-tz, 0));
		-webkit-animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
		animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
	}
	90% {
		transform: translate3d(var(--tx, 0), var(--ty, 0), var(--tz, 0)) rotate3d(1, 1, 1, var(--r3d, 0));
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}
}
@keyframes explodeAfter {
	0%, 40%, 100% {
		transform: translate3d(0, 0, var(--init-tz, 0));
		-webkit-animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
		animation-timing-function: cubic-bezier(0.25, -0.25, 0, 1);
	}
	90% {
		transform: translate3d(var(--tx, 0), var(--ty, 0), var(--tz, 0)) rotate3d(1, 1, 1, var(--r3d, 0));
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}
}
@-webkit-keyframes color {
	0%, 40% {
		background-color: #fff;
	}
	50%, 100% {
		background-color: hsl(var(--hue), 75%, 75%);
	}
}
@keyframes color {
	0%, 40% {
		background-color: #fff;
	}
	50%, 100% {
		background-color: hsl(var(--hue), 75%, 75%);
	}
}
i:nth-child(1) {
	--init-tz: 0px;
	--tx: 42.02em;
	--ty: 41.81em;
	--tz: 13.66em;
	--rx: 0.51;
	--r3d: 337deg;
	--hue: 98;
}
i:nth-child(2) {
	--init-tz: 1px;
	--tx: -9.39em;
	--ty: 10.64em;
	--tz: 21.91em;
	--rx: 0.241;
	--r3d: 184deg;
	--hue: 140;
}
i:nth-child(3) {
	--init-tz: 2px;
	--tx: 42.17em;
	--ty: -20.31em;
	--tz: 19.94em;
	--rx: 0.396;
	--r3d: 34deg;
	--hue: 30;
}
i:nth-child(4) {
	--init-tz: 3px;
	--tx: -39.93em;
	--ty: -37.72em;
	--tz: 17.97em;
	--rx: 0.611;
	--r3d: 176deg;
	--hue: 266;
}
i:nth-child(5) {
	--init-tz: 4px;
	--tx: 38.49em;
	--ty: -5.1em;
	--tz: 18.36em;
	--rx: 0.614;
	--r3d: 71deg;
	--hue: 20;
}
i:nth-child(6) {
	--init-tz: 5px;
	--tx: -8.52em;
	--ty: 18.7em;
	--tz: 16.11em;
	--rx: 0.103;
	--r3d: 205deg;
	--hue: 318;
}
i:nth-child(7) {
	--init-tz: 6px;
	--tx: 22.71em;
	--ty: 31.19em;
	--tz: 9.94em;
	--rx: 0.139;
	--r3d: 121deg;
	--hue: 160;
}
i:nth-child(8) {
	--init-tz: 7px;
	--tx: -39.83em;
	--ty: -12.1em;
	--tz: 3.82em;
	--rx: 0.206;
	--r3d: 159deg;
	--hue: 193;
}
i:nth-child(9) {
	--init-tz: 8px;
	--tx: -0.84em;
	--ty: -27.89em;
	--tz: 13.44em;
	--rx: 0.724;
	--r3d: 32deg;
	--hue: 203;
}
i:nth-child(10) {
	--init-tz: 9px;
	--tx: 14.67em;
	--ty: 4.56em;
	--tz: 4.88em;
	--rx: 0.832;
	--r3d: 177deg;
	--hue: 101;
}
i:nth-child(11) {
	--init-tz: 10px;
	--tx: -21.43em;
	--ty: -5.27em;
	--tz: 10.9em;
	--rx: 0.261;
	--r3d: 328deg;
	--hue: 164;
}
i:nth-child(12) {
	--init-tz: 11px;
	--tx: 44.65em;
	--ty: -7.91em;
	--tz: 15.88em;
	--rx: 0.678;
	--r3d: 48deg;
	--hue: 183;
}
i:nth-child(13) {
	--init-tz: 12px;
	--tx: 8.35em;
	--ty: -19.28em;
	--tz: 20.95em;
	--rx: 0.316;
	--r3d: 338deg;
	--hue: 228;
}
i:nth-child(14) {
	--init-tz: 13px;
	--tx: -12.89em;
	--ty: 12.64em;
	--tz: 4.45em;
	--rx: 0.328;
	--r3d: 33deg;
	--hue: 314;
}
i:nth-child(15) {
	--init-tz: 14px;
	--tx: 44.42em;
	--ty: -28.37em;
	--tz: 18.71em;
	--rx: 0.075;
	--r3d: 180deg;
	--hue: 329;
}
i:nth-child(16) {
	--init-tz: 15px;
	--tx: -4.22em;
	--ty: 36.41em;
	--tz: 7.66em;
	--rx: 0.444;
	--r3d: 166deg;
	--hue: 93;
}
i:nth-child(17) {
	--init-tz: 16px;
	--tx: 39.2em;
	--ty: 22.57em;
	--tz: 23.7em;
	--rx: 0.84;
	--r3d: 212deg;
	--hue: 185;
}
i:nth-child(18) {
	--init-tz: 17px;
	--tx: 15.67em;
	--ty: -21.65em;
	--tz: 21.09em;
	--rx: 0.185;
	--r3d: 30deg;
	--hue: 319;
}
i:nth-child(19) {
	--init-tz: 18px;
	--tx: -20.98em;
	--ty: -28.05em;
	--tz: 16.59em;
	--rx: 0.055;
	--r3d: 149deg;
	--hue: 251;
}
i:nth-child(20) {
	--init-tz: 19px;
	--tx: 15.64em;
	--ty: -30.82em;
	--tz: 4.7em;
	--rx: 0.812;
	--r3d: 326deg;
	--hue: 336;
}
i:nth-child(21) {
	--init-tz: 20px;
	--tx: -39.6em;
	--ty: -3.98em;
	--tz: 19.69em;
	--rx: 0.99;
	--r3d: 205deg;
	--hue: 240;
}
i:nth-child(22) {
	--init-tz: 21px;
	--tx: -18.5em;
	--ty: -38.03em;
	--tz: 16.27em;
	--rx: 0.523;
	--r3d: 275deg;
	--hue: 68;
}
i:nth-child(23) {
	--init-tz: 22px;
	--tx: -30.08em;
	--ty: 42.46em;
	--tz: 12.44em;
	--rx: 0.69;
	--r3d: 212deg;
	--hue: 216;
}
i:nth-child(24) {
	--init-tz: 23px;
	--tx: 11.12em;
	--ty: -20.27em;
	--tz: 22.48em;
	--rx: 0.761;
	--r3d: 322deg;
	--hue: 298;
}
i:nth-child(25) {
	--init-tz: 24px;
	--tx: -17.41em;
	--ty: -27.24em;
	--tz: 2.68em;
	--rx: 0.277;
	--r3d: 80deg;
	--hue: 229;
}
i:nth-child(26) {
	--init-tz: 25px;
	--tx: 3.96em;
	--ty: -5.27em;
	--tz: 9.24em;
	--rx: 0.94;
	--r3d: 69deg;
	--hue: 301;
}
i:nth-child(27) {
	--init-tz: 26px;
	--tx: 26.11em;
	--ty: 2.5em;
	--tz: 11.01em;
	--rx: 0.314;
	--r3d: 158deg;
	--hue: 356;
}
i:nth-child(28) {
	--init-tz: 27px;
	--tx: 28.72em;
	--ty: 43.61em;
	--tz: 6.98em;
	--rx: 0.841;
	--r3d: 146deg;
	--hue: 51;
}
i:nth-child(29) {
	--init-tz: 28px;
	--tx: 23.58em;
	--ty: 0.3em;
	--tz: 19.78em;
	--rx: 0.855;
	--r3d: 117deg;
	--hue: 99;
}
i:nth-child(30) {
	--init-tz: 29px;
	--tx: -18.04em;
	--ty: 8.5em;
	--tz: 2.97em;
	--rx: 0.98;
	--r3d: 96deg;
	--hue: 198;
}
i:nth-child(31) {
	--init-tz: 30px;
	--tx: 26.66em;
	--ty: -15.98em;
	--tz: 8.39em;
	--rx: 0.43;
	--r3d: 277deg;
	--hue: 47;
}
i:nth-child(32) {
	--init-tz: 31px;
	--tx: -25.35em;
	--ty: 24.38em;
	--tz: 20.29em;
	--rx: 0.025;
	--r3d: 324deg;
	--hue: 36;
}
i:nth-child(33) {
	--init-tz: 32px;
	--tx: 30.92em;
	--ty: -43.65em;
	--tz: 20.59em;
	--rx: 0.524;
	--r3d: 1deg;
	--hue: 219;
}
i:nth-child(34) {
	--init-tz: 33px;
	--tx: -37.41em;
	--ty: 14.49em;
	--tz: 2.87em;
	--rx: 0.641;
	--r3d: 343deg;
	--hue: 186;
}
i:nth-child(35) {
	--init-tz: 34px;
	--tx: -39.63em;
	--ty: 17.37em;
	--tz: 18.52em;
	--rx: 0.207;
	--r3d: 319deg;
	--hue: 11;
}
i:nth-child(36) {
	--init-tz: 35px;
	--tx: -1.9em;
	--ty: 29.1em;
	--tz: 7.02em;
	--rx: 0.813;
	--r3d: 146deg;
	--hue: 329;
}
i:nth-child(37) {
	--init-tz: 36px;
	--tx: 20.68em;
	--ty: -28.23em;
	--tz: 10.32em;
	--rx: 0.994;
	--r3d: 207deg;
	--hue: 297;
}
i:nth-child(38) {
	--init-tz: 37px;
	--tx: -19em;
	--ty: -24.12em;
	--tz: 1.61em;
	--rx: 0.449;
	--r3d: 106deg;
	--hue: 240;
}
i:nth-child(39) {
	--init-tz: 38px;
	--tx: 35.4em;
	--ty: 44.89em;
	--tz: 2.38em;
	--rx: 0.705;
	--r3d: 104deg;
	--hue: 341;
}
i:nth-child(40) {
	--init-tz: 39px;
	--tx: 33.88em;
	--ty: -47.35em;
	--tz: 15.21em;
	--rx: 0.267;
	--r3d: 126deg;
	--hue: 79;
}
i:nth-child(41) {
	--init-tz: 40px;
	--tx: 36.81em;
	--ty: -23.39em;
	--tz: 10.19em;
	--rx: 0.841;
	--r3d: 317deg;
	--hue: 192;
}
i:nth-child(42) {
	--init-tz: 41px;
	--tx: 25.27em;
	--ty: -6.43em;
	--tz: 12.16em;
	--rx: 0.177;
	--r3d: 336deg;
	--hue: 351;
}
i:nth-child(43) {
	--init-tz: 42px;
	--tx: -41.1em;
	--ty: -44.83em;
	--tz: 16.69em;
	--rx: 0.764;
	--r3d: 174deg;
	--hue: 359;
}
i:nth-child(44) {
	--init-tz: 43px;
	--tx: 42.38em;
	--ty: -36.28em;
	--tz: 18.9em;
	--rx: 0.889;
	--r3d: 41deg;
	--hue: 143;
}
i:nth-child(45) {
	--init-tz: 44px;
	--tx: -2.78em;
	--ty: -21.25em;
	--tz: 15.35em;
	--rx: 0.876;
	--r3d: 328deg;
	--hue: 274;
}
i:nth-child(46) {
	--init-tz: 45px;
	--tx: -9.82em;
	--ty: 30.11em;
	--tz: 5.16em;
	--rx: 0.265;
	--r3d: 192deg;
	--hue: 109;
}
i:nth-child(47) {
	--init-tz: 46px;
	--tx: 27.47em;
	--ty: 41.69em;
	--tz: 1.24em;
	--rx: 0.511;
	--r3d: 34deg;
	--hue: 2;
}
i:nth-child(48) {
	--init-tz: 47px;
	--tx: 44.39em;
	--ty: -46em;
	--tz: 4.8em;
	--rx: 0.576;
	--r3d: 108deg;
	--hue: 105;
}