.chat-layout {
  --chat-canvas: #edf6f1;
  --chat-line: #cfe2d7;
  --chat-received: #ffffff;
  --chat-sent: #d2eadc;
}
html[data-theme='dark'] .chat-layout {
  --chat-canvas: #142c24;
  --chat-line: #355548;
  --chat-received: #243f33;
  --chat-sent: #355b45;
}
.chat-layout .chat-messages {
  min-height: 240px;
  padding: 1rem;
  background: var(--chat-canvas);
  border: 1px solid var(--chat-line);
  border-radius: 18px;
  scrollbar-color: var(--chat-line) var(--chat-canvas);
}
.chat-layout .chat-message {
  background: var(--chat-received);
  border-color: var(--chat-line);
}
.chat-layout .chat-message.mine {
  background: var(--chat-sent);
}
@media (max-width: 600px) {
  .chat-layout .chat-messages { padding: .75rem; border-radius: 14px; }
}