<div class="plane"></div>

* {
	box-sizing: border-box;
}

body {
	--black: rgb(4 4 31);
	margin: 0;
	position: relative;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	background: linear-gradient(to top, var(--black), var(--black) 28%, rgb(18 49 255 / 0.4) 50%, transparent 70%), radial-gradient(ellipse at center, rgb(18 49 255), var(--black) 65%, var(--black));
}

body::after {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 100%;
	background: radial-gradient(ellipse at center, transparent 50%, var(--black));
}

.plane {
	--size: 20rem;
	position: relative;
	width: 100vw;
	height: 100vh;
	margin: 0 auto;
	perspective: 40rem;
	perspective-origin: top center;
}

.plane::after {
	--stripe: 5rem;
	--stripeH: 15rem;
	--c: rgb(196 244 255);
	--grad1: transparent -0.3rem, var(--c) 0rem, transparent 0.3rem, transparent calc(var(--stripe) - 0.3rem);
	--grad1a: transparent -2rem, rgb(196 244 255 / 0.3) 0rem, transparent 2rem, transparent calc(var(--stripe) - 2rem);
	--grad2: transparent -0.3rem, var(--c) 0rem, transparent 0.3rem, transparent calc(var(--stripeH) - 0.3rem);
	--grad2a: transparent -1rem, rgb(196 244 255 / 0.3) 0rem, transparent 1rem, transparent calc(var(--stripeH) - 1rem);
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 300%;
	height: 100%;
	margin: 0 auto;
	background: repeating-linear-gradient(to bottom, var(--grad1)), repeating-linear-gradient(to bottom, var(--grad1a)), repeating-linear-gradient(to right, var(--grad2)), repeating-linear-gradient(to right, var(--grad2a));
	background-size: 100% 20rem;
	background-position: 0 0;
	animation: bgMove 2000ms linear infinite;
	border: 0.3rem solid var(--c);
	transform: rotateX(90deg) translate3d(-25%, 0, 0);
	transform-origin: bottom center;
}

@keyframes bgMove {
	to {
		background-position: 0 20rem;
	}
}