/* Mirrors AppColors tokens used by the in-Flutter startup surface. */
:root {
  --manda-brand-navy: #10182a;
  --manda-brand-gold: #f4d77b;
  --manda-surface-strong: rgba(255, 255, 255, 0.08);
  --manda-glass-border: rgba(255, 255, 255, 0.1647);
}

html,
body {
  background: var(--manda-brand-navy);
  height: 100%;
  height: 100dvh;
  margin: 0;
  overflow: hidden;
  position: fixed;
  width: 100%;
}

.manda-host-loader {
  align-items: center;
  background: var(--manda-brand-navy);
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: center;
  position: fixed;
  z-index: 2147483647;
}

.manda-host-mark {
  height: clamp(124px, 44vmin, 164px);
  position: relative;
  transform: translateX(3.5px);
  width: clamp(124px, 44vmin, 164px);
}

.manda-host-mark span {
  background: var(--manda-brand-gold);
  height: 100%;
  inset: 0;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  position: absolute;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  width: 100%;
}

.manda-host-sun {
  mask-image: url("/releases/d18952321f0b05940bfd/assets/logo/manda-logo-sun-dot.svg");
  -webkit-mask-image: url("/releases/d18952321f0b05940bfd/assets/logo/manda-logo-sun-dot.svg");
}

.manda-host-snake {
  animation: manda-host-turn 1300ms linear infinite;
  mask-image: url("/releases/d18952321f0b05940bfd/assets/logo/manda-logo-snake.svg");
  -webkit-mask-image: url("/releases/d18952321f0b05940bfd/assets/logo/manda-logo-snake.svg");
}

.manda-host-progress {
  background: var(--manda-surface-strong);
  border: 1px solid var(--manda-glass-border);
  border-radius: 999px;
  box-sizing: border-box;
  height: 6px;
  margin-top: 28px;
  max-width: calc(100vw - 48px);
  overflow: hidden;
  width: min(52vw, 280px);
}

.manda-host-progress-fill {
  animation: manda-host-progress 1400ms ease-in-out infinite;
  background: var(--manda-brand-gold);
  display: block;
  height: 100%;
  transform: translateX(-140%);
  width: 42%;
}

.manda-host-timeout {
  color: #fff;
  direction: rtl;
  font-family: system-ui, sans-serif;
  margin: 28px 24px 0;
  max-width: 420px;
  text-align: center;
}

.manda-host-timeout p {
  font-size: 15px;
  line-height: 1.8;
  margin: 0 0 16px;
}

.manda-host-timeout button {
  background: var(--manda-brand-gold);
  border: 0;
  border-radius: 999px;
  color: #061225;
  cursor: pointer;
  font: inherit;
  min-height: 44px;
  padding: 8px 24px;
}

.manda-host-loader.manda-host-stalled .manda-host-mark,
.manda-host-loader.manda-host-stalled .manda-host-progress {
  display: none;
}

@keyframes manda-host-turn {
  to {
    transform: rotate(1turn);
  }
}

@keyframes manda-host-progress {
  0% {
    transform: translateX(-140%);
  }
  55%,
  100% {
    transform: translateX(340%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .manda-host-snake,
  .manda-host-progress-fill {
    animation: none;
  }

  .manda-host-progress-fill {
    transform: translateX(0);
    width: 36%;
  }
}

body {
  inset: 0;
  box-sizing: border-box;
  overscroll-behavior: none;
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
    env(safe-area-inset-bottom) env(safe-area-inset-left);
}

flutter-view,
flt-glass-pane {
  background: var(--manda-brand-navy);
  height: 100dvh;
  min-height: 100dvh;
}
