/* Restrained motion: content is visible by default and layouts never move sideways. */
@keyframes admoji-hero-arrive{
  from{opacity:0;transform:translateY(var(--hero-arrival-distance,24px)) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes admoji-card-arrive{
  from{opacity:0;translate:0 32px}
  to{opacity:1;translate:0 0}
}
@keyframes admoji-dialog-arrive{
  from{opacity:0;transform:scale(.985)}
  to{opacity:1;transform:scale(1)}
}
@keyframes admoji-backdrop-arrive{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:no-preference){
  .hero-command.motion-arrive{
    animation:admoji-hero-arrive 1000ms cubic-bezier(.22,1,.36,1) 250ms both;
  }
  .hero-command.motion-arrive .command-creative,
  .hero-command.motion-arrive .command-checkout{
    animation:admoji-card-arrive 900ms cubic-bezier(.22,1,.36,1) 500ms both;
  }
  .hero-command.motion-arrive .command-checkout{animation-delay:700ms}
  #access-dialog.screenshot-dialog[open]{
    animation:admoji-dialog-arrive 190ms cubic-bezier(.22,1,.36,1) both;
  }
  #access-dialog.screenshot-dialog[open]::backdrop{
    animation:admoji-backdrop-arrive 170ms ease-out both;
  }
  .button .cta-arrow{
    transition:transform 170ms cubic-bezier(.2,.8,.3,1);
  }
  @media(hover:hover) and (pointer:fine){
    .button:hover .cta-arrow{transform:translateX(3px)}
  }
  .button:active .cta-arrow{transform:translateX(1px)}
  @media(max-width:760px){
    .hero-command.motion-arrive{
      --hero-arrival-distance:16px;animation-duration:850ms;
    }
    #access-dialog.screenshot-dialog[open]{animation-duration:150ms}
  }
}