/* Fixed globe viewport — set --mw-globe-box-height on the page (see enterprise-new.css) */
.mw-source-import-shell .billing-hero__anim-container[data-mw-network-globe] {
  position: relative;
  overflow: hidden;
  --mw-globe-box-height: 300px;
  --mw-globe-framing: manual;
  height: var(--mw-globe-box-height);
  min-height: var(--mw-globe-box-height);
  max-height: var(--mw-globe-box-height);
  box-sizing: border-box;
}

.mw-network-globe__stage {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}

.mw-network-globe__canvas {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.mw-network-globe--ready .mw-network-globe__canvas {
  opacity: 1;
}

/* Arcs + flags — separate from WebGL canvas; never captures pointer events */
.mw-network-globe__overlay {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  overflow: visible;
}

.mw-network-globe__arcs-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.mw-network-globe__arc {
  stroke: #635bff;
  stroke-width: 2;
  opacity: 0;
}

.mw-network-globe__arc--active {
  stroke-width: 2.25;
  filter: drop-shadow(0 0 4px rgba(99, 91, 255, 0.25));
}

.mw-network-globe__arc--drawn {
  stroke-dasharray: 6 10;
  animation: mw-globe-arc-dash 1.4s linear infinite;
}

@keyframes mw-globe-arc-dash {
  to {
    stroke-dashoffset: -32;
  }
}

.mw-network-globe__flags {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.mw-network-globe__flag {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 7px 3px 5px;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 6px 18px -8px rgba(50, 28, 100, 0.22);
  font-size: 10px;
  line-height: 1;
  color: #0a2540;
  white-space: nowrap;
  will-change: transform, opacity;
}

.mw-network-globe__flag--active {
  box-shadow: 0 10px 28px -6px rgba(99, 91, 255, 0.35);
}

.mw-network-globe__flag-emoji {
  font-size: 13px;
  line-height: 1;
}

.mw-network-globe__flag-code {
  font-weight: 500;
  letter-spacing: 0.02em;
}

@media (max-width: 639px) {
  .mw-network-globe__overlay {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mw-network-globe__arc {
    animation: none;
  }
}

.mw-source-import-shell .billing-hero__anim-container[data-mw-network-globe] .billing-hero__desktop-anim,
.mw-source-import-shell .billing-hero__anim-container[data-mw-network-globe] .billing-hero__mobile-anim {
  display: none !important;
}

/* Wave sits as a sibling after anim-container, not inside it */
.mw-source-import-shell .billing-hero__anim-container[data-mw-network-globe] ~ .billing-hero__wave {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}