.empty-state {
  background: var(--color-surface);
  border: 1px dashed var(--slate-300);
  border-radius: 8px;
  padding: 3.5rem 2rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .6rem;
}

.empty-state-icon {
  color: var(--slate-300);
  margin-bottom: .4rem;
}

.empty-state-heading {
  font-size: var(--text-md);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
}

.empty-state-body {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  max-width: 380px;
  line-height: var(--leading-relaxed);
  margin-bottom: .4rem;
}

.section-empty {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  padding: .5rem 0;
}