.messages-shell{max-width:1260px;margin:auto;padding:20px clamp(16px,3vw,36px) 60px;color:var(--text,#edf8f7)}.messages-shell nav{display:flex;justify-content:space-between;gap:15px}.messages-shell a{color:var(--accent,#94e8d7)}.messages-shell h1{font-size:clamp(2rem,4vw,3rem);margin:24px 0 8px}.messenger{display:grid;grid-template-columns:minmax(250px,330px) minmax(0,1fr);gap:18px;align-items:start}.chat-sidebar,.chat-panel{background:var(--surface,#142b34);border:1px solid var(--border,#44616a);border-radius:18px;padding:18px}.chat-sidebar h2{font-size:1.2rem;margin:12px 0}.chat-sidebar section{border-bottom:1px solid var(--border,#44616a);padding-bottom:18px;margin-bottom:18px}.chat-sidebar p{line-height:1.45}.messages-shell label{display:block;margin:10px 0 6px;font-weight:650}.messages-shell input,.messages-shell textarea{width:100%;font:inherit;padding:10px;border-radius:8px;color:var(--text,#edf8f7);background:var(--background,#0b1922);border:1px solid var(--border,#567)}.messages-shell button{font:inherit;border-radius:9px;padding:8px 12px;cursor:pointer;border:1px solid var(--border,#567);color:var(--accent-text,#132b32);background:var(--accent,#9ce6da)}.messages-shell button:disabled{opacity:.55;cursor:wait}.person-row,.chat-row{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--border,#345);flex-wrap:wrap}.person-row strong{margin-right:auto}.person-row button{font-size:.85rem}.chat-row{width:100%;text-align:left;background:transparent!important;color:inherit!important}.chat-row.active{outline:2px solid var(--accent,#9ce6da)}.chat-row span{display:grid;gap:4px;min-width:0}.chat-row small{opacity:.76;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chosen-person{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;margin:4px;border-radius:20px;border:1px solid var(--border,#567)}.chosen-person button{padding:2px 7px}.chat-panel{min-height:550px;display:flex;flex-direction:column}.chat-panel h2{margin:2px 0 6px}.chat-panel #chat-history{min-height:270px;max-height:52vh;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding:12px 2px;flex:1}.chat-message{max-width:min(88%,620px);align-self:flex-start;border-radius:14px;background:var(--background,#0b1922);padding:10px 14px;overflow-wrap:anywhere}.chat-message.mine{align-self:flex-end;border:1px solid var(--accent,#9ce6da)}.chat-message p{margin:5px 0;white-space:pre-wrap}.chat-message small{opacity:.7}.chat-panel #send-form{margin-top:auto}.chat-panel #send-form button{margin-top:8px}@media(max-width:760px){.messenger{grid-template-columns:1fr}.chat-panel{min-height:460px}.chat-panel #chat-history{max-height:55vh}}[hidden]{display:none!important}
.receipt-settings label{display:flex;align-items:center;gap:10px;font-size:14px}.receipt-settings input{width:auto;accent-color:var(--accent,#9ce6da)}.receipt-settings p{font-size:13px;margin:6px 0;color:var(--text,#edf8f7);opacity:.75}.typing-indicator{font-size:14px;color:var(--accent,#9ce6da);margin:9px 2px}.message-receipt{display:block;text-align:right;font-weight:700;padding-top:4px}.chat-unread{margin-left:auto;min-width:28px;border-radius:20px;padding:4px 7px;text-align:center;background:var(--accent,#9ce6da);color:var(--accent-text,#132b32);font-size:13px}
.friend-panel h3{font-size:14px;margin:15px 0 6px}.friend-panel .friend-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--border,#567);padding:8px 0}.friend-panel .friend-row strong{margin-right:auto}.friend-panel .friend-row button{font-size:13px}.friend-panel .friend-empty{font-size:13px;opacity:.72;margin:5px 0 12px}
.receipt-exception{font-size:12px;line-height:1.45}.person-row a,.friend-row a,.chat-message a,#chat-heading a{color:var(--accent,#9ce6d7)}.person-row a,.friend-row a{margin-right:auto;font-weight:750}
.chat-entry{border-bottom:1px solid var(--border,#345);padding:8px 0}.chat-entry>a{display:inline-block;padding:4px 8px;color:var(--accent,#9ce6d7);font-weight:750}.chat-entry .chat-row{border-bottom:0;padding:5px 8px}

/* Make conversations the first scan target and distinguish active, unread, and sent messages. */
.chat-sidebar{display:flex;flex-direction:column;gap:16px}.chat-sidebar section{margin:0;padding:0;border:0}.conversations-section{order:0}.find-people{order:1}.chat-tools{order:2}.privacy-tools{order:3}
.conversations-section>h2{margin:3px 0 10px}.conversations-section #chat-list{display:grid;gap:8px;max-height:370px;overflow:auto}.chat-entry,.conversations-section>.chat-row,.chat-entry .chat-row{border:1px solid var(--border,#456470);border-radius:12px;background:var(--background,#0b1922);padding:10px 12px}.chat-entry{display:grid;gap:4px}.chat-entry>a{padding:0!important;text-decoration:none;font-size:15px}.chat-entry .chat-row{padding:0;border:0;background:transparent!important}.chat-row{min-height:40px}.chat-row span{width:100%}.chat-row small{font-size:13px}.chat-entry.unread,.chat-row.unread{border-color:var(--accent,#9ce6da);background:color-mix(in srgb,var(--accent,#9ce6da) 11%,var(--background,#0b1922))!important}.chat-entry.unread>a,.chat-row.unread strong{font-weight:850}.chat-entry.active,.chat-row.active{outline:0;box-shadow:inset 4px 0 var(--accent,#9ce6da)}.chat-entry:focus-within,.chat-row:focus-visible{outline:2px solid var(--accent,#9ce6da)}
.chat-tools{border:1px solid var(--border,#456470);border-radius:12px;padding:0 13px}.chat-tools>summary{cursor:pointer;list-style:none;padding:14px 2px;font-weight:700}.chat-tools>summary::after{content:'⌄';float:right}.chat-tools[open]>summary::after{content:'⌃'}.chat-tools>section{padding:10px 0 15px;border-top:1px solid var(--border,#456470)}.friend-panel>h2,.group-builder>h2{margin-top:4px}.chat-tools .receipt-settings{font-size:14px}.chat-panel{border-top:4px solid var(--accent,#9ce6da)}.chat-message{border:1px solid var(--border,#456470);background:var(--background,#0b1922)}.chat-message.mine{background:color-mix(in srgb,var(--accent,#9ce6da) 18%,var(--surface,#142b34));border-color:var(--accent,#9ce6da)}
@media(max-width:760px){.conversations-section #chat-list{max-height:260px}.chat-sidebar{gap:12px}}
