/* ============================================================
   背景氛围层（所有页面通用）
   ============================================================ */
.ambient {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}
.ambient .blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  opacity: .5;
  animation: floatSlow linear infinite;
}
.ambient .b1 {
  width: 420px; height: 420px;
  left: -8%; top: -10%;
  background: radial-gradient(circle, rgba(140, 226, 42, .26), transparent 70%);
  animation-duration: 26s;
}
.ambient .b2 {
  width: 520px; height: 520px;
  right: -12%; top: 22%;
  background: radial-gradient(circle, rgba(47, 126, 230, .20), transparent 70%);
  animation-duration: 34s;
  animation-direction: reverse;
}
.ambient .b3 {
  width: 460px; height: 460px;
  left: 30%; bottom: -16%;
  background: radial-gradient(circle, rgba(140, 226, 42, .15), transparent 72%);
  animation-duration: 42s;
}
@keyframes floatSlow {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  33% { transform: translate3d(40px, -30px, 0) scale(1.06); }
  66% { transform: translate3d(-30px, 26px, 0) scale(.96); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}

.ambient .grid-lines {
  position: absolute;
  inset: -20%;
  background-image:
    linear-gradient(rgba(140, 226, 42, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 226, 42, .05) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(circle at 50% 28%, #000 8%, transparent 76%);
  -webkit-mask-image: radial-gradient(circle at 50% 28%, #000 8%, transparent 76%);
  animation: gridDrift 42s linear infinite;
}
@keyframes gridDrift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-46px, -46px, 0); }
}

.ambient .dust {
  position: absolute;
  width: 3px; height: 3px;
  border-radius: 50%;
  background: #8ce22a;
  box-shadow: 0 0 8px rgba(140, 226, 42, .9);
  opacity: 0;
  animation: dustRise linear infinite;
}
@keyframes dustRise {
  0% { opacity: 0; transform: translateY(0) scale(.6); }
  12% { opacity: .7; }
  80% { opacity: .4; }
  100% { opacity: 0; transform: translateY(-78vh) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .ambient .blob, .ambient .grid-lines, .ambient .dust { animation: none !important; }
  .ambient .dust { display: none; }
}