/* CUBE: block — ink pill, bottom-centre, for reversible-action feedback. */

.toast {
  position: fixed;
  inset-inline: 0;
  inset-block-end: var(--space-l);
  margin-inline: auto;
  inline-size: max-content;
  max-inline-size: calc(100% - var(--space-xl));
  display: flex;
  align-items: center;
  gap: var(--space-s);
  block-size: var(--tap-min);
  padding-inline: var(--space-m) var(--space-xs);
  background: var(--color-fg);
  color: var(--color-surface);
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-toast);
  z-index: var(--z-toast);
  animation: toastin 180ms ease-out;
}
.toast__msg { font-size: var(--fs-sm); font-weight: 500; }
.toast__undo {
  block-size: var(--icon-btn-sm);
  min-block-size: var(--icon-btn-sm);
  padding-inline: var(--space-s);
  background: transparent;
  color: var(--color-toast-undo);
  border: 0;
  border-radius: var(--radius-s);
  box-shadow: none;
  font-size: var(--fs-sm);
  font-weight: 600;
}
.toast__undo:hover:not(:disabled) { background: var(--color-on-dark-hover); }
.toast__dismiss {
  inline-size: var(--icon-btn-sm);
  block-size: var(--icon-btn-sm);
  min-block-size: var(--icon-btn-sm);
  padding: 0;
  background: transparent;
  color: var(--color-on-dark-muted);
  border: 0;
  border-radius: var(--radius-s);
  box-shadow: none;
}
.toast__dismiss:hover:not(:disabled) { background: var(--color-on-dark-hover); color: var(--color-surface); }