.toast {
  position: fixed;
  inset: auto auto max(28px, env(safe-area-inset-bottom)) 50%;
  margin: 0;
  border: 0;
  width: max-content;
  max-width: min(90vw, 520px);
  text-align: center;
  transform: translate(-50%, 20px);
  border-radius: 18px;
  z-index: 2147483647;
}

.toast.show {
  transform: translate(-50%, 0);
}