.chat-messages {
  display: grid;
  gap: 8px;
  max-height: 420px;
  overflow: auto;
  padding: 8px;
  background: #0b1220;
  border-radius: 8px;
}
.chat-messages article {
  max-width: 82%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.chat-messages article p { margin: 4px 0 0; white-space: pre-wrap; }
.chat-messages small { color: var(--muted); }
.chat-human { justify-self: end; background: var(--brand-soft); }
.chat-agent { justify-self: start; background: var(--panel-soft); }
.chat-message-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.chat-message-action {
  min-height: 28px;
  border: 1px solid #475569;
  border-radius: 7px;
  padding: 4px 9px;
  background: transparent;
  color: #cbd5e1;
  font: 650 11px/1.2 system-ui, sans-serif;
  cursor: pointer;
}
.chat-message-action:hover { border-color: #60a5fa; background: #172554; color: #dbeafe; }
.chat-message-action:focus-visible { outline: 2px solid #60a5fa; outline-offset: 2px; }
.chat-message-action.failed { border-color: #ef4444; color: #fecaca; }
.chat-compose { margin-top: 12px; }

@media (max-width: 640px) {
  .chat-messages article { max-width: 94%; }
  .chat-message-actions { opacity: 1; }
}