.dialogOverlay {
  background-color: rgba(0, 0, 0, 0.48);
  position: fixed;
  inset: 0;
  animation: overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1);
  z-index: var(--theme-zIndices-overlay);
}

.dialogContent {
  animation: contentShow 150ms cubic-bezier(0.16, 1, 0.3, 1);
  z-index: var(--theme-zIndices-modal);
}

.dialogContent:focus {
  outline: none;
}

@keyframes overlayShow {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes contentShow {
  from {
    opacity: 0;
    transform: translate(-50%, -48%) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}
