body{background-color: #000; margin: 0; overflow: hidden;}#cube-container{width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center;}#cube{width: 300px; height: 300px; position: relative; transform-style: preserve-3d; transform: translateZ(-500px);}#cube div{width: 300px; height: 300px; position: absolute; background-color: transparent; border: 2px solid transparent; box-sizing: border-box; display: flex; justify-content: center; align-items: center; font-family: Arial, sans-serif; color: #fff; font-size: 30px; text-shadow: 0 0 10px rgba(255, 255, 255, 0.8); transform-style: preserve-3d; user-select: none; animation: colorTransition 10s ease-in-out infinite alternate, glowTransition 10s ease-in-out infinite alternate; animation-delay: 0s; transition: box-shadow 0.5s ease-in-out, color 10s ease-in-out; box-shadow: 0 0 20px white;}#cube .face1{transform: translateZ(150px);}#cube .face2{transform: rotateY(90deg) translateZ(150px);}#cube .face3{transform: rotateY(180deg) translateZ(150px);}#cube .face4{transform: rotateY(-90deg) translateZ(150px);}#cube .face5{transform: rotateX(90deg) translateZ(150px);}#cube .face6{transform: rotateX(-90deg) translateZ(150px); display: flex; flex-direction: column; justify-content: space-between; align-items: center; text-align: center; line-height: 1.2; margin: 0; padding: 20px;}#cube .face6 p{margin: 0;}#cube div.animate-glow{animation: glowTransition 10s ease-in-out infinite alternate; animation-delay: 0s;}