.toast-root {
  display: grid;
  gap: var(--space-2);
  max-width: min(22rem, calc(100vw - var(--space-6)));
  position: fixed;
  right: var(--space-4);
  top: var(--space-4);
  z-index: var(--z-toast);
}

.toast {
  background: var(--color-panel-strong);
  border: 1px solid var(--color-border);
  border-left: 0.35rem solid var(--color-accent);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-panel);
  color: var(--color-text);
  padding: var(--space-3);
}

.toast[data-variant="success"] {
  border-left-color: var(--color-success);
}

.toast[data-variant="warning"] {
  border-left-color: var(--color-warning);
}

.toast[data-variant="danger"] {
  border-left-color: var(--color-danger);
}