/* Toast. .toast and .route-toast were identical apart from 340px vs 350px width,
   8px vs 7px radius and 12px vs 11px type -- one component now. */

.toast {
  position: fixed;
  z-index: 20;
  right: 22px;
  bottom: 22px;
  max-width: 345px;
  padding: 13px var(--space-4);
  color: var(--white);
  background: var(--green-800);
  border-left: 3px solid var(--yellow);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-md);
  font-size: var(--text-sm);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: all 180ms ease;
}
.toast.show { opacity: 1; transform: translateY(0); }