/*
 * Message list (ConversationComponent).
 * The parent decides the size; this only stacks the bubbles.
 */
.conversation {
  display: flex;
  flex-direction: column;
}

.conversation__messages {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.conversation__empty {
  align-self: center;
  padding: var(--space-6);
  color: var(--color-text-subtle);
  font-size: var(--text-sm);
}