/* The loading screen, replaced when the app mounts. Neutral until boot.js has confirmed this is a Yaxxa address. */
.yx-boot {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  background: #fff;
}
html.dark .yx-boot {
  background: #12101a;
}
.yx-boot-gem {
  width: 3.5rem;
  height: 4rem;
  object-fit: contain;
  opacity: 0;
  transition: opacity 0.2s ease-out;
}
.yx-boot-gem.yx-on {
  opacity: 1;
}
.yx-boot-spin {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  border: 3px solid #d4d0dc;
  border-top-color: #6b6678;
  animation: yx-spin 0.9s linear infinite;
}
html.dark .yx-boot-spin {
  border-color: #3a3648;
  border-top-color: #a9a4b8;
}
.yx-boot.yx-yaxxa .yx-boot-spin {
  border-color: #e9d5e1;
  border-top-color: #c21b83;
}
html.dark .yx-boot.yx-yaxxa .yx-boot-spin {
  border-color: #3a2a35;
  border-top-color: #de3ca0;
}
@keyframes yx-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .yx-boot-spin {
    animation: none;
  }
  .yx-boot-gem {
    transition: none;
  }
}