:root {
	--bg: #070a0e;
	--teal: #00e5ff;
	/* 黑金可換 #d6b673 */
	--grid: rgba(0, 229, 255, .10);
	--glowSoft: rgba(0, 229, 255, .12);
}


#bg-tech-clean.theme {
	background: var(--bg);
}


/* 3D 透視地平線 */
#bg-tech-clean .floor {
	position: fixed;
	inset: 0;
	pointer-events: none ;
	z-index: 0;
	top: 30%;
	transform: perspective(800px) rotateX(65deg);
	transform-origin: 50% 0;
	background-image:
		linear-gradient(var(--grid) 1px, transparent 1px),
		linear-gradient(90deg, var(--grid) 1px, transparent 1px);
	background-size: 60px 60px;
	animation: gridSlide 14s linear infinite;
	box-shadow: 0 -120px 160px -120px var(--glowSoft) inset;
}

@keyframes gridSlide {
	from {
		background-position: 0 0, 0 0;
	}

	to {
		background-position: 0 60px, 60px 0;
	}
}

/* 掃描線 */
#bg-tech-clean .scan {
	position: fixed;
	inset: 2;
	z-index: 0;
	pointer-events: none;
	background: linear-gradient(to bottom, transparent 40%, rgba(0, 229, 255, .10) 50%, transparent 60%);
	background-size: 100% 200%;
	mix-blend-mode: screen;
	animation: scanMove 6s linear infinite;
}

@keyframes scanMove {
	from {
		background-position: 0 -100%
	}

	to {
		background-position: 0 100%
	}
}

/* 無障礙 */
@media (prefers-reduced-motion: reduce) {

	#bg-tech-clean .floor,
	#bg-tech-clean .scan {
		animation: none;
	}
}