@media (prefers-reduced-motion: no-preference) {
  dialog[open] {
    opacity: 0;
    transform: translateY(8px) scale(.98);
    transition: opacity 180ms cubic-bezier(.22, .61, .36, 1), transform 180ms cubic-bezier(.22, .61, .36, 1);
  }

  dialog[open]::backdrop {
    background-color: rgba(26, 82, 108, 0);
    transition: background-color 180ms ease-out;
  }

  dialog[open].ui-dialog-ready {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  dialog[open].ui-dialog-ready::backdrop {
    background-color: rgba(26, 82, 108, .35);
  }
}