.toast-container {
  position:fixed;
  top:var(--s4);
  right:var(--s4);
  z-index:500;
  display:flex;
  flex-direction:column;
  gap:var(--s2);
  width:360px;
  max-width:calc(100vw - var(--s4) * 2);
  box-sizing:border-box;
  pointer-events:none;
}

.toast {
  display:flex;
  align-items:flex-start;
  gap:var(--s3);
  padding:var(--s3) var(--s4);
  border-radius:var(--r2);
  box-shadow:var(--shadow-md);
  font-size:var(--text-sm);
  box-sizing:border-box;
  pointer-events:all;
  background:var(--c-info-bg);
  color:var(--c-info-fg);
  border-left:4px solid var(--c-primary);
}
.toast--success {
  background:var(--c-success-bg);
  color:var(--c-success-fg);
  border-left-color:var(--c-success-fg);
}
.toast--warning {
  background:#fefcbf;
  color:#744210;
  border-left-color:#b7791f;
}
.toast--error {
  background:#fed7d7;
  color:#742a2a;
  border-left-color:var(--c-danger);
}
.toast__text {
  flex:1;
  min-width:0;
  overflow-wrap:anywhere;
}
.toast__close {
  background:none;
  border:none;
  cursor:pointer;
  font-size:1.2rem;
  line-height:1;
  padding:0;
  flex-shrink:0;
  color:inherit;
  opacity:0.6;
}
.toast__close:hover {
  opacity:1;
}