#loading {
  display: flex;
  position: fixed;
  justify-content: center;
  align-items: center;
  height: 100vh;
  width: 100vw;

  background-color: #fafafa;
  color: #000;
}

@media (prefers-color-scheme: dark) {
  #loading {
    background-color: #303030;
    color: #fff;
  }
}

.startup-spinner {
  border-radius: 50%;
  border-top: 8px solid #1565c0;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #1565c0;
  border-left: 8px solid transparent;
  width: 80px;
  height: 80px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

body {
  /* without this, the spinner jumps a bit once the css from Flutter loads */
  margin: 0;
}