/* ========== NNS · Overlays (modals + toasts) ========== */

/* Toasts */
.toast-stack {
  position: fixed;
  bottom: var(--space-5);
  right: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  z-index: 100;
  max-width: 380px;
}
.toast {
  background: var(--bg-elev-2);
  border: 1px solid var(--border-strong);
  border-left: 3px solid var(--accent);
  padding: 12px 16px;
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-2);
  font-size: 0.88rem;
  animation: toastIn 280ms var(--ease);
}
.toast.error { border-left-color: var(--danger); }
.toast.success { border-left-color: var(--success); }
@keyframes toastIn {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: none; }
}

/* Modal */
.modal-root {
  position: fixed; inset: 0;
  background: rgba(10, 6, 24, 0.6);
  backdrop-filter: blur(6px);
  z-index: 200;
  display: flex; align-items: center; justify-content: center;
  padding: var(--space-4);
}
.modal-root[hidden] { display: none; }
.modal {
  background: var(--bg-elev);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  padding: var(--space-6);
  max-width: 480px; width: 100%;
  box-shadow: var(--shadow-2);
  animation: modalIn 220ms var(--ease);
}
@keyframes modalIn {
  from { opacity: 0; transform: scale(0.97) translateY(8px); }
  to { opacity: 1; transform: none; }
}
.modal h3 { margin: 0 0 var(--space-3); }
.modal-actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-5); }
.modal p { color: var(--text-dim); margin: 0 0 var(--space-3); }