body {
  background:
    radial-gradient(circle at 15% 20%, #12324a 0%, transparent 45%),
    radial-gradient(circle at 85% 80%, #2a153d 0%, transparent 42%),
    #0b1118;
  background-size: 140% 140%, 160% 160%, 100% 100%;
  background-position: 0% 0%, 100% 100%, 0% 0%;
  animation: gradient-drift 22s ease-in-out infinite alternate;
}

@keyframes gradient-drift {
  0% {
    background-position: 0% 0%, 100% 100%, 0% 0%;
  }
  50% {
    background-position: 30% 25%, 75% 70%, 0% 0%;
  }
  100% {
    background-position: 55% 35%, 50% 40%, 0% 0%;
  }
}

#particle-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

#codeword-layer {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  font-family: "Consolas", "Courier New", monospace;
}

.codeword {
  position: absolute;
  color: rgba(178, 247, 255, 0.38);
  white-space: nowrap;
  user-select: none;
  will-change: transform, opacity;
  text-shadow: 0 0 14px rgba(90, 210, 245, 0.36);
}