:root{
  --rundmv-splash-bg: #FF4D2E;
  --rundmv-splash-ink: #0A0A0C;
}

html.rundmv-loading,
html.rundmv-loading body{
  min-height: 100%;
  overflow: hidden;
  background: var(--rundmv-splash-bg);
}

html.rundmv-loading body > :not(#rundmv-splash){
  visibility: hidden !important;
}

.rundmv-splash{
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: grid;
  place-items: center;
  min-width: 320px;
  padding:
    max(24px, env(safe-area-inset-top))
    max(24px, env(safe-area-inset-right))
    max(24px, env(safe-area-inset-bottom))
    max(24px, env(safe-area-inset-left));
  overflow: hidden;
  background: var(--rundmv-splash-bg);
  color: var(--rundmv-splash-ink);
  opacity: 1;
  transition: opacity 360ms cubic-bezier(.22, 1, .36, 1);
}

.rundmv-splash__logo{
  display: inline-flex;
  align-items: baseline;
  font-family: "Space Grotesk", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(2.4rem, 10vw, 5.5rem);
  font-weight: 700;
  line-height: .9;
  letter-spacing: -.075em;
  white-space: nowrap;
  transform: translateX(-.04em);
}

.rundmv-splash__logo-run{
  color: #FFFFFF;
}

.rundmv-splash.is-leaving{
  pointer-events: none;
  opacity: 0;
}

@media (prefers-reduced-motion: reduce){
  .rundmv-splash{ transition: none; }
}
