/* Shared by the pre-JavaScript splash and the React navigation loader. */
html[data-admin-entry] #boot-loader { display: none; }
.mf-loading-screen {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 30px;
  background: rgb(var(--background, 250 248 244));
  color: rgb(var(--foreground, 62 49 40));
}
.mf-loading-mark {
  position: relative;
  display: grid;
  place-items: center;
  width: 144px;
  height: 144px;
}
.mf-loading-mark::before,
.mf-loading-mark::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid #b3917540;
  border-radius: 50%;
}
.mf-loading-mark::before {
  border-block-start-color: #987256;
  border-inline-end-color: #b39175;
  animation: mf-loading-orbit 2.8s linear infinite;
}
.mf-loading-mark::after {
  inset: 10px;
  animation: mf-loading-halo 2.2s ease-in-out infinite;
}
.mf-loading-mark img {
  display: block;
  width: 80px;
  height: 80px;
  animation: mf-loading-bloom 2.2s ease-in-out infinite;
}
.mf-loading-mark.is-paused *,
.mf-loading-mark.is-paused::before,
.mf-loading-mark.is-paused::after { animation-play-state: paused; }
.mf-loading-error { max-width: 320px; padding-inline: 24px; text-align: center; font-size: 14px; line-height: 1.8; }
.mf-loading-error button { margin-top: 18px; padding: 10px 24px; border: 1px solid #987256; background: #987256; color: #fffaf3; font: inherit; cursor: pointer; }
@keyframes mf-loading-orbit { to { transform: rotate(360deg); } }
@keyframes mf-loading-bloom {
  0%, 100% { transform: scale(.94) rotate(-6deg); opacity: .75; }
  50% { transform: scale(1.06) rotate(6deg); opacity: 1; }
}
@keyframes mf-loading-halo {
  0%, 100% { transform: scale(.94); opacity: .35; }
  50% { transform: scale(1.08); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .mf-loading-mark img, .mf-loading-mark::before, .mf-loading-mark::after { animation: none; }
}
