/* App launch intro. Only ever mounted by mode-intro-v1.js, and only inside the
   MODE! iOS app, so the open web never renders these rules. */
.mtv-intro {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  background: #fff;
  opacity: 1;
  transition: opacity 420ms ease;
}

.mtv-intro__mark {
  width: min(48vw, 190px);
  height: auto;
  animation: mtv-intro-in 780ms cubic-bezier(0.22, 0.9, 0.24, 1) both;
}

.mtv-intro.is-out {
  opacity: 0;
}

@keyframes mtv-intro-in {
  from {
    transform: scale(0.82);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mtv-intro__mark {
    animation: none;
  }
}
