html,
body {
  margin: 0;
  min-height: 100%;
  background: #0c1222;
  color: #f3ead8;
  font-family: "IBM Plex Sans JP", ui-sans-serif, system-ui, sans-serif;
}
#boot {
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.25rem;
}
#boot .boot-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin: 0;
  font-size: 0.875rem;
  color: #c5cbe0;
  opacity: 0;
  animation: boot-cue-in 0s linear 0.3s forwards;
}
#boot .boot-spinner {
  width: 1rem;
  height: 1rem;
  animation: boot-spin 0.7s linear infinite;
}
@keyframes boot-cue-in {
  to { opacity: 1; }
}
@keyframes boot-spin {
  to { transform: rotate(360deg); }
}
#root[hidden] {
  display: none !important;
}
