html, body {
  margin: 0;
  min-height: 100%;
  background: #0b0d10;
}

#app-loading {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 14px;
  background: radial-gradient(circle at 50% 42%, #153b34 0, #0b0d10 52%);
  color: #fff5dc;
  font: 600 16px/1.3 Roboto, Arial, sans-serif;
  letter-spacing: .01em;
  transition: opacity .22s ease, visibility .22s ease;
}

#app-loading img {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  animation: app-loading-pulse 1.15s ease-in-out infinite alternate;
}

#app-loading.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@keyframes app-loading-pulse {
  from { transform: scale(.94); opacity: .72; }
  to { transform: scale(1.04); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  #app-loading, #app-loading img { transition: none; animation: none; }
}