.site-toast {
  position: fixed;
  top: 12px;
  left: 50%;
  z-index: 120;
  min-width: min(420px, 100vw - 24px);
  max-width: calc(100vw - 24px);
  padding: 12px 14px;
  border-radius: 10px;
  box-sizing: border-box;
  transform: translateX(-50%) translateY(-8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.24s ease, transform 0.24s ease;
}

.site-toast.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.site-toast-success {
  border: 1px solid #cfe8d4;
  background: #f3fbf4;
  color: #166534;
}

.site-toast-error {
  border: 1px solid #f1d0d0;
  background: #fff5f5;
  color: #b42318;
}

.site-toast-info {
  border: 1px solid #bfd6ff;
  background: #edf4ff;
  color: #1d4ed8;
}