/**
 * 全站背景纹理（21st.dev Magic UI Dot Pattern 风格）
 * @author Telegram @okgeceo
 */

body {
  isolation: isolate;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    radial-gradient(
      ellipse 88% 52% at 50% -18%,
      var(--bg-texture-glow),
      transparent 58%
    ),
    radial-gradient(circle, var(--bg-texture-dot) 1px, transparent 1px);
  background-size:
    100% 100%,
    var(--bg-texture-dot-size) var(--bg-texture-dot-size);
  background-position: center top, 0 0;
  -webkit-mask-image: radial-gradient(
    ellipse 115% 78% at 50% 0%,
    black 0%,
    transparent 72%
  );
  mask-image: radial-gradient(
    ellipse 115% 78% at 50% 0%,
    black 0%,
    transparent 72%
  );
}

@media (max-width: 767px) {
  body::before {
    -webkit-mask-image: radial-gradient(
      ellipse 130% 70% at 50% 0%,
      black 0%,
      transparent 78%
    );
    mask-image: radial-gradient(
      ellipse 130% 70% at 50% 0%,
      black 0%,
      transparent 78%
    );
  }
}

@media (prefers-reduced-motion: reduce) {
  body::before {
    background-image:
      radial-gradient(circle, var(--bg-texture-dot) 1px, transparent 1px);
    background-size: var(--bg-texture-dot-size) var(--bg-texture-dot-size);
  }
}