.message-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-block: var(--space-4); }
.conversation-list, .message-history { list-style: none; padding: 0; }
.conversation-card { display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-4); margin-block: var(--space-3); border: 1px solid var(--color-line); border-radius: var(--radius-card); text-decoration: none; color: var(--color-text); overflow-wrap: anywhere; }
.conversation-card strong, .conversation-card time, .conversation-card .help-text { display: block; }
.conversation-card time, .message-byline { font-size: .875rem; color: var(--color-text-muted); }
.conversation-card:hover { background: var(--color-tint); }
.message-unread { display: inline-block; font-weight: 700; color: var(--color-accent); }
.conversation-layout { display: grid; gap: var(--space-6); grid-template-columns: minmax(0, 1fr); }
.message-bubble { padding: var(--space-4); margin-block: var(--space-4); background: var(--color-tint); border: 1px solid var(--color-line); border-radius: var(--radius-card); overflow-wrap: anywhere; }
.message-bubble--mine { border-inline-start: 4px solid var(--color-accent); margin-inline-start: var(--space-4); }
.message-byline { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); margin-bottom: var(--space-2); }
.conversation-tools { border-top: 1px solid var(--color-line); padding-top: var(--space-4); }
.conversation-tools h2 { font-size: 1.25rem; }
.conversation-tools details { margin-block: var(--space-5); }
.conversation-compose textarea { width: 100%; }
@media (min-width: 900px) { .conversation-layout { grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr); } .conversation-tools { border-top: 0; border-inline-start: 1px solid var(--color-line); padding-inline-start: var(--space-5); } }

.conversation-next-steps { padding: var(--space-4); margin-block: var(--space-4); background: var(--color-surface-raised); border-inline-start: .25rem solid var(--color-accent); border-radius: var(--space-2); }
.conversation-next-steps h2 { margin-top: 0; }
.conversation-next-steps details { margin-top: var(--space-4); }
.conversation-next-steps input[type="checkbox"] { width: auto; }
.message-text { white-space: pre-wrap; overflow-wrap: anywhere; }
[data-send-status], [data-update-status] { min-height: 1.5em; }