.bsp-is-transitioning {
  cursor: progress;
}

.bsp-is-fetching {
  cursor: progress;
}

.bsp-is-transitioning a {
  pointer-events: none;
}

.bsp-is-fetching [data-barba="container"] {
  opacity: 0;
  transition: opacity 90ms ease;
}

.bsp-is-fetching main {
  opacity: 0;
  transition: opacity 90ms ease;
}

[data-barba="container"] {
  will-change: opacity;
}

.bsp-is-fetching body::after,
.bsp-is-transitioning body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 999998;
  background: #ffffff;
  pointer-events: none;
}

.bsp-is-fetching body::before,
.bsp-is-transitioning body::before {
  content: "";
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999999;
  width: 2rem;
  height: 2rem;
  margin: -1rem 0 0 -1rem;
  border: 3px solid rgba(37, 99, 235, 0.18);
  border-top-color: #2563eb;
  border-radius: 999px;
  animation: bsp-spin 700ms linear infinite;
}

@keyframes bsp-spin {
  to {
    transform: rotate(360deg);
  }
}