/* AQ PRO HOLO ORB 3D - player center only */
#aqProHoloOrb3D,
#aqProHoloOrb3D * {
  box-sizing: border-box;
}

#aqProHoloOrb3D {
  width: 230px;
  height: 230px;
  margin: 72px auto 36px;
  position: relative;
  z-index: 12;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 900px;
  transform-style: preserve-3d;
  isolation: isolate;
}

#aqProHoloOrb3D .aqorb-stage {
  position: relative;
  width: 178px;
  height: 178px;
  transform-style: preserve-3d;
  animation: aqOrbFloat 4.8s ease-in-out infinite;
}

#aqProHoloOrb3D .aqorb-sphere {
  position: absolute;
  inset: 18px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 28% 24%, rgba(165,255,248,.98) 0 9%, rgba(53,233,255,.9) 10% 22%, transparent 33%),
    radial-gradient(circle at 68% 38%, rgba(255,38,170,.75), transparent 28%),
    radial-gradient(circle at 40% 65%, rgba(95,0,255,.96), transparent 46%),
    radial-gradient(circle at 64% 72%, rgba(5,0,22,1), rgba(5,0,16,1) 58%, #010008 100%);
  box-shadow:
    0 0 28px rgba(0,238,255,.62),
    0 0 70px rgba(113,0,255,.42),
    0 0 105px rgba(255,0,145,.24),
    inset -26px -28px 42px rgba(0,0,0,.72),
    inset 18px 18px 30px rgba(255,255,255,.18);
  filter: saturate(1.25) contrast(1.08);
  transform: translateZ(42px);
  animation: aqOrbPulse 2.2s ease-in-out infinite;
}

#aqProHoloOrb3D .aqorb-sphere::before {
  content: "";
  position: absolute;
  inset: 9%;
  border-radius: 50%;
  background:
    linear-gradient(135deg, rgba(255,255,255,.42), transparent 28%),
    radial-gradient(circle at 24% 18%, rgba(255,255,255,.65), transparent 17%),
    radial-gradient(circle at 74% 78%, rgba(0,238,255,.16), transparent 35%);
  mix-blend-mode: screen;
  opacity: .76;
  animation: aqOrbShine 3.8s ease-in-out infinite;
}

#aqProHoloOrb3D .aqorb-sphere::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 9px,
      rgba(0,238,255,.12) 10px 11px
    );
  opacity: .26;
  mask-image: radial-gradient(circle, #000 45%, transparent 72%);
  animation: aqOrbScan 3s linear infinite;
}

#aqProHoloOrb3D .aqorb-ring {
  position: absolute;
  inset: 18px;
  border-radius: 50%;
  border: 2px solid rgba(0,238,255,.55);
  box-shadow:
    0 0 18px rgba(0,238,255,.55),
    inset 0 0 18px rgba(0,238,255,.16);
  transform-style: preserve-3d;
  pointer-events: none;
}

#aqProHoloOrb3D .aqorb-ring.r1 {
  transform: rotateX(68deg) rotateZ(0deg);
  animation: aqOrbRing1 5s linear infinite;
}

#aqProHoloOrb3D .aqorb-ring.r2 {
  inset: 6px;
  border-color: rgba(255,0,145,.48);
  box-shadow: 0 0 20px rgba(255,0,145,.48);
  transform: rotateX(58deg) rotateY(24deg);
  animation: aqOrbRing2 6.5s linear infinite reverse;
}

#aqProHoloOrb3D .aqorb-ring.r3 {
  inset: 32px;
  border-color: rgba(142,61,255,.5);
  box-shadow: 0 0 18px rgba(142,61,255,.55);
  transform: rotateY(70deg) rotateZ(20deg);
  animation: aqOrbRing3 4.8s linear infinite;
}

#aqProHoloOrb3D .aqorb-glow {
  position: absolute;
  left: 50%;
  bottom: 10px;
  width: 150px;
  height: 26px;
  border-radius: 50%;
  transform: translateX(-50%) rotateX(72deg);
  background: radial-gradient(ellipse, rgba(0,238,255,.38), rgba(255,0,145,.16) 45%, transparent 72%);
  filter: blur(5px);
  animation: aqOrbShadow 2.4s ease-in-out infinite;
}

#aqProHoloOrb3D .aqorb-dot {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #00eaff;
  box-shadow: 0 0 18px rgba(0,238,255,.9);
  top: 26px;
  left: 50%;
  transform-origin: 0 64px;
  animation: aqOrbDot 3.2s linear infinite;
}

#aqProHoloOrb3D .aqorb-dot.d2 {
  background: #ff1b91;
  box-shadow: 0 0 18px rgba(255,0,145,.9);
  animation-duration: 4.2s;
  animation-delay: -1.2s;
}

@keyframes aqOrbFloat {
  0%, 100% { transform: translateY(0) rotateX(0deg) rotateY(-7deg); }
  50% { transform: translateY(-10px) rotateX(7deg) rotateY(8deg); }
}

@keyframes aqOrbPulse {
  0%, 100% { transform: translateZ(42px) scale(.98); filter: saturate(1.18); }
  50% { transform: translateZ(58px) scale(1.04); filter: saturate(1.45); }
}

@keyframes aqOrbShine {
  0%, 100% { opacity: .58; transform: translate(-3px, -3px) scale(.98); }
  50% { opacity: .9; transform: translate(3px, 2px) scale(1.03); }
}

@keyframes aqOrbScan {
  to { background-position: 42px 0; }
}

@keyframes aqOrbRing1 {
  to { transform: rotateX(68deg) rotateZ(360deg); }
}

@keyframes aqOrbRing2 {
  to { transform: rotateX(58deg) rotateY(24deg) rotateZ(360deg); }
}

@keyframes aqOrbRing3 {
  to { transform: rotateY(70deg) rotateZ(380deg); }
}

@keyframes aqOrbDot {
  to { transform: rotate(360deg) translateX(76px) rotate(-360deg); }
}

@keyframes aqOrbShadow {
  0%, 100% { opacity: .48; transform: translateX(-50%) rotateX(72deg) scale(.92); }
  50% { opacity: .78; transform: translateX(-50%) rotateX(72deg) scale(1.08); }
}

@media (max-width: 820px) {
  #aqProHoloOrb3D {
    width: 205px;
    height: 205px;
    margin: 54px auto 28px;
  }

  #aqProHoloOrb3D .aqorb-stage {
    width: 158px;
    height: 158px;
  }
}