/* FoxLife's directly manipulated ring sphere; artwork never rotates. */
.spherical-orbit { perspective: 800px; touch-action: none; user-select: none; -webkit-user-select: none; cursor: grab; }
.spherical-orbit.is-orbit-dragging { cursor: grabbing; }
.spherical-orbit .orbit-field {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  pointer-events: none;
  transform-style: preserve-3d;
  transform: rotateX(var(--orbit-pitch, 0deg)) rotateY(var(--orbit-yaw, 0deg));
}
.spherical-orbit .orbital-ring {
  --orbit-ink: #2378bd;
  position: absolute;
  border: var(--orbit-weight) solid transparent;
  border-top-color: var(--orbit-ink);
  border-right-color: var(--orbit-ink);
  border-bottom-color: color-mix(in srgb, var(--orbit-ink) 35%, transparent);
  border-radius: 50%;
  transform: var(--orbit-rest);
  opacity: .8;
  pointer-events: none;
}
.spherical-orbit .orbital-ring:nth-child(even) { --orbit-ink: #ffc300; border-left-color: var(--orbit-ink); border-right-color: transparent; }
.spherical-orbit > img { z-index: 1; pointer-events: none; -webkit-user-drag: none; }
.equipment-art.spherical-orbit { aspect-ratio: 1; display: grid; place-items: center; }
.equipment-art.spherical-orbit > img { position: relative; width: 84%; max-height: 100%; }
@media (prefers-reduced-motion: reduce) {
  /* Deliberate interaction remains available, without 3D camera motion. */
  .spherical-orbit .orbit-field { transform: rotateZ(calc(var(--orbit-yaw, 0deg) + var(--orbit-pitch, 0deg))); }
}
