.toast-stack {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 80;
  display: grid;
  gap: 10px;
  width: min(380px, calc(100vw - 24px));
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: start;
  background: #0f172a;
  color: #fff;
  border: 1px solid rgba(201,164,91,.45);
  border-left: 4px solid #c9a45b;
  border-radius: 16px;
  padding: 14px 14px 14px 16px;
  box-shadow: 0 22px 50px rgba(15, 23, 42, .28);
  animation: toast-in .28s ease;
}
.toast p { margin: 4px 0 0; color: #dbe3ef; font-size: 14px; line-height: 1.4; }
.toast strong { font-size: 14px; letter-spacing: .02em; }
.toast-icon { width: 28px; height: 28px; display: grid; place-items: center; color: #c9a45b; font-size: 18px; }
.toast-success { border-left-color: #c9a45b; }
.toast-error { border-left-color: #ef4444; }
.toast-error .toast-icon { color: #f87171; }
.toast-warning { border-left-color: #f59e0b; }
.toast-close {
  border: 0; background: transparent; color: #94a3b8; font-size: 22px; line-height: 1;
  cursor: pointer; padding: 0 2px;
}
.toast-close:hover { color: #fff; }
.toast.is-out { animation: toast-out .24s ease forwards; }
@keyframes toast-in {
  from { opacity: 0; transform: translateY(-10px) translateX(12px); }
  to { opacity: 1; transform: none; }
}
@keyframes toast-out {
  to { opacity: 0; transform: translateY(-8px) translateX(12px); }
}
@media (max-width: 700px) {
  .toast-stack { top: 12px; right: 12px; left: 12px; width: auto; }
}