/* A toast is positioned above the navigation. Moving it by its own height is
   insufficient to hide it, so visibility is explicitly controlled as well. */
.toast {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform .2s, opacity .2s, visibility 0s linear .2s;
}

.toast.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}