.message-list { max-width: 920px; }
.message-list-row { display: grid; grid-template-columns: 70px minmax(0,1fr) auto; gap: 1rem; align-items: center; padding: 1rem; margin-bottom: .75rem; border: 1px solid #dad6d0; border-radius: 16px; color: inherit; text-decoration: none; background: #fff; }
.message-list-row:hover, .message-list-row:focus-visible { border-color: #8b575d; color: inherit; box-shadow: 0 0 0 2px #eddcde; }
.message-list-row img, .conversation-photo { width: 64px; height: 64px; object-fit: cover; border-radius: 50%; }
.message-list-row small, .message-preview { display: block; color: #565656; }
.message-preview { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 50ch; }
.unread-count { display: block; width: max-content; min-width: 1.7rem; padding: .1rem .4rem; border-radius: 99px; background: #63353e; color: white; text-align: center; margin-top: .4rem; }
.nav-messages-link { display: inline-flex; align-items: center; gap: .35rem; }
.nav-unread-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.35rem; height: 1.35rem; padding: 0 .3rem; border-radius: 99px; background: #fff; color: #63353e; font-size: .72rem; font-weight: 700; line-height: 1; }
.conversation-shell { max-width: 850px; }
.message-thread { list-style: none; padding: 0; display: flex; flex-direction: column; gap: .85rem; }
.message-item { max-width: 82%; padding: .8rem 1rem; background: #f4f1ed; border: 1px solid #dfd9d3; border-radius: 16px; }
.message-item.sent { align-self: flex-end; background: #f4e7e9; }
.message-item.received { align-self: flex-start; }
.message-item p { white-space: pre-wrap; overflow-wrap: anywhere; margin: .45rem 0; }
.message-item time { font-size: .8rem; color: #555; }
.message-compose { display: grid; gap: .6rem; margin-top: 1.5rem; }
.message-compose textarea { width: 100%; padding: .8rem; border: 1px solid #948c88; border-radius: 10px; }
.message-compose button { justify-self: start; }
.message-safety { padding: 1rem; margin-top: 1.5rem; background: #f6f3ed; border-left: 4px solid #9f7763; }
.message-actions { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1rem; }
@media (max-width: 600px) { .message-list-row { grid-template-columns: 48px minmax(0,1fr); } .message-list-row img { width: 44px; height: 44px; } .message-list-row > span:last-child { grid-column: 2; } .message-item { max-width: 95%; } }