#chat-section{max-width:none;background:#fff;border:1px solid var(--line,#ded8ce);border-radius:18px;padding:1rem;box-sizing:border-box}#chat-header{display:flex;gap:.5rem;align-items:center;margin:0;min-height:44px}#chat-header>div:first-of-type{flex:1;min-width:0;font-size:.95rem}#chat-header button{padding:.4rem;min-width:44px;min-height:44px;border:1px solid #d4dfd6;border-radius:10px;background:#fff;color:#176c60}#chat-typing-indicator{font-size:.7rem;min-height:0;margin:0}#chat-typing-indicator:empty{display:none}#chat-matches-list{margin:.5rem 0;max-height:140px}#chat-matches-list[hidden],#chat-section [hidden]{display:none!important}#chat-options{max-height:28vh;overflow:auto}#chat-section #chat-messages{height:auto;min-height:0;border:0;border-radius:0;padding:.5rem 0;margin:0;gap:.4rem;overscroll-behavior:contain}#chat-section .chat-message-wrapper{position:relative;display:flex;flex-direction:row;align-items:flex-start;gap:.35rem;max-width:85%;flex-shrink:0}#chat-section .chat-message-wrapper.me{flex-direction:row-reverse;align-self:flex-end}#chat-section .chat-message-wrapper.them{align-self:flex-start}#chat-section .private-avatar{width:28px;height:28px;min-width:28px;min-height:28px;flex:0 0 28px;padding:0;border:0;border-radius:50%;overflow:hidden;background:transparent}#chat-section .private-avatar img{width:28px;height:28px;object-fit:cover;display:block;margin:0}#chat-section .chat-message-bubble{position:relative;min-width:110px;min-height:32px;max-width:100%;box-sizing:border-box;padding:.35rem .55rem;border:1px solid #ded8ce;border-radius:14px;background:#f6f3ed;box-shadow:none;overflow-wrap:anywhere}#chat-section .me .chat-message-bubble{background:#e0eee7}.private-message-head{display:flex;align-items:center;gap:.5rem}#chat-section .private-author{font-size:.75rem;padding:0;min-height:24px;border:0;background:transparent;color:#176c60;overflow-wrap:anywhere;text-align:left}#chat-section .chat-message-meta{font-size:.65rem;color:#73766f;margin:0;white-space:normal}#chat-section time.chat-message-meta{margin-left:auto;white-space:nowrap}.private-message-text{white-space:pre-wrap;overflow-wrap:anywhere;margin:.2rem 0;padding-right:1rem;line-height:1.35;font-size:.95rem}#chat-section .private-more{position:absolute;bottom:.1rem;right:.1rem;min-width:26px;min-height:24px;padding:0;border:0;background:transparent;color:#176c60;opacity:0}#chat-section .chat-message-wrapper:hover .private-more,#chat-section .private-more:focus-visible,#chat-section .actions-open .private-more{opacity:1}.private-message-actions{display:none;gap:.25rem;flex-wrap:wrap;margin:.35rem 0 1rem}.actions-open .private-message-actions{display:flex}#chat-section .private-message-actions button{min-width:44px;min-height:44px;padding:.4rem .55rem;border:1px solid #d4dfd6;background:white;border-radius:10px;color:#176c60}#chat-section button[aria-pressed=true]{outline:2px solid #176c60;outline-offset:1px}.private-counts{display:flex;gap:.2rem;margin-right:1.3rem}#chat-section .private-reaction-count{padding:.1rem .3rem;font-size:.75rem;min-height:24px;background:white;border:1px solid #d4dfd6;border-radius:10px}.private-empty{font-size:.9rem;padding:.5rem}#chat-section .private-photo{display:block;padding:0;min-height:0;border:0;background:transparent}#chat-section .private-photo img{display:block;width:auto;height:auto;max-width:100%;max-height:300px;border-radius:8px;object-fit:contain}#chat-section .chat-message-bubble audio{width:260px;max-width:100%;height:40px}#chat-section .deleted .private-message-text{font-style:italic;color:#73766f}#chat-section #chat-error:empty{display:none}#chat-section #chat-error{font-size:.8rem;margin:.2rem 0}#chat-section #chat-input-container{position:static;display:grid;grid-template-columns:minmax(0,1fr) 44px 44px 44px;gap:.3rem;padding:.4rem 0 0;margin:0;align-items:center;background:white}#chat-section #chat-input{grid-column:1;grid-row:3;box-sizing:border-box;min-width:0;width:100%;height:44px;max-height:100px;margin:0;padding:.6rem;border-radius:10px;font-size:16px;line-height:1.25;resize:none}#chat-section #chat-send-btn{grid-column:4;grid-row:3;padding:.4rem;min-height:44px;border-radius:10px;background:#176c60;color:white}#chat-section .private-photo-button{grid-column:2;grid-row:3}#chat-section .private-mic{grid-column:3;grid-row:3}#chat-section .private-photo-button,#chat-section .private-mic,#chat-section .private-discard{padding:.4rem;min-height:44px;border:1px solid #d4dfd6;border-radius:10px;color:#176c60;background:#fff}.private-preview{grid-column:1/-1;grid-row:1;display:flex;align-items:center;gap:.5rem;font-size:.8rem}.private-preview img{width:64px;height:64px;object-fit:cover}.private-preview audio{max-width:65%;height:36px}.private-discard{grid-column:1/-1;grid-row:2}.private-recording{grid-column:1/-1;grid-row:1;display:flex;align-items:center;gap:.6rem;min-height:36px;color:#a51e2c;font-size:.85rem;font-weight:600}.private-recording-dot{width:12px;height:12px;flex:0 0 12px;border-radius:50%;background:#dc2638;animation:private-recording-pulse 1s ease-in-out infinite}#chat-section .private-mic.is-recording{color:#a51e2c;border-color:#dc2638;background:#fff0f1}.private-dialog{max-width:95vw;max-height:95dvh;padding:1rem}.private-dialog img{display:block;max-width:85vw;max-height:80dvh;object-fit:contain}.private-dialog::backdrop{background:#000b}@keyframes private-recording-pulse{0%,100%{opacity:1}50%{opacity:.25}}@media(prefers-reduced-motion:reduce){.private-recording-dot{animation:none}}@media(max-width:700px){body.private-chat-active{overflow:hidden}.private-chat-active #chat-section{display:flex!important;flex-direction:column;position:fixed;z-index:90;top:var(--private-top,0px);left:0;right:0;height:var(--private-height,100dvh);width:100%;max-width:none;margin:0;padding:.25rem .4rem max(.4rem,env(safe-area-inset-bottom));border:0;border-radius:0}#chat-section #chat-header{padding-top:env(safe-area-inset-top);flex-shrink:0}#chat-header>div:first-of-type{font-size:.85rem}#chat-section #chat-messages{height:auto;min-height:0;flex:1}#chat-section #chat-input-container{flex-shrink:0}#chat-section .chat-message-wrapper{max-width:92%}#chat-section .private-more{opacity:1}#chat-matches-list{flex-shrink:0;max-height:24vh}#chat-section #date-planner{margin:.2rem 0;font-size:.85rem}#chat-section #chat-options{max-height:30vh;flex-shrink:0}#chat-section .chat-message-bubble{padding:.3rem .45rem}}
/* Reserve space for the message menu, including beside native audio controls. */
#chat-section .private-message-text{padding-right:1.75rem}#chat-section .chat-message-bubble:has(audio),#chat-section .chat-message-bubble:has(.private-photo){padding-bottom:1.6rem}
/* Shared Perle messenger density and a compact contact/options shelf. */
#chat-section .private-author{display:none}#chat-section .grouped .chat-message-bubble{border-top-left-radius:8px;border-top-right-radius:8px}#chat-section .grouped{margin-top:-.2rem}#chat-section .private-message-head{float:right;margin-left:.5rem}#chat-section .private-message-text{margin:0;padding-right:.5rem}#chat-section .chat-message-bubble{min-width:70px}#chat-section .private-counts:empty{display:none}#chat-section .private-quote{margin:.1rem 0 .3rem;padding:.2rem .45rem;border-left:2px solid #20786f;font-size:.75rem;line-height:1.3;max-width:28rem;white-space:pre-wrap;overflow-wrap:anywhere}#chat-section .private-draft{grid-column:1/-1;grid-row:1;display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:.8rem;border-left:2px solid #20786f;padding:.2rem .5rem}#chat-section .private-draft button{padding:.3rem .5rem;min-height:32px;border:0;color:#176c60;background:transparent}
#chat-section #chat-matches-list{display:flex;gap:.4rem;flex-wrap:wrap;overflow:auto;padding:.35rem;background:#f6f3ed;border-radius:12px}#chat-section .chat-match{width:auto;max-width:100%;min-height:40px;margin:0;padding:.45rem .8rem;border:1px solid #d4dfd6;border-radius:20px;background:white;color:#176c60;overflow-wrap:anywhere}#chat-section .chat-match.active{background:#176c60;color:white}#chat-section #chat-partner-actions{display:flex;gap:.4rem;flex-wrap:wrap;margin:.25rem 0}#chat-section #chat-partner-actions button,#chat-section #chat-partner-actions>details>summary,#chat-section #date-planner>summary{padding:.45rem .7rem;border:1px solid #d4dfd6;border-radius:10px;background:#f6f3ed;color:#176c60;font-size:.82rem;min-height:36px;box-sizing:border-box;cursor:pointer}#chat-section #chat-options{padding:0 .3rem}#chat-section #chat-partner-actions form{display:grid;gap:.4rem;padding:.4rem;max-width:100%}#chat-section #chat-partner-actions input{max-width:100%;box-sizing:border-box}#chat-section #chat-header #chat-partner-name{overflow-wrap:anywhere;font-weight:700}#chat-section #chat-load-older{align-self:center;font-size:.75rem;padding:.2rem .6rem;border:0;background:transparent;color:#176c60}
@media(hover:hover) and (pointer:fine){#chat-section .chat-message-wrapper:hover .private-message-actions,#chat-section .chat-message-wrapper:focus-within .private-message-actions{display:flex}#chat-section .private-message-actions button{min-width:30px;min-height:30px;padding:.2rem .4rem;font-size:.8rem}}
@media(max-width:700px){#chat-section .chat-message-wrapper{max-width:94%}#chat-section .private-message-actions{margin:.25rem 0}#chat-section #chat-options{border-bottom:1px solid #ded8ce;padding-bottom:.4rem}}

#chat-section #chat-partner-actions .social-actions{display:flex;gap:.4rem;flex-wrap:wrap;margin:0}#chat-section #chat-options button{box-shadow:none}
#chat-section .chat-message-bubble{display:flex;flex-direction:column}#chat-section .private-message-head{float:none;order:3;align-self:flex-end;margin:0;padding-right:1.4rem;line-height:1.1}#chat-section .deleted .private-message-head{padding-right:0}#chat-section .private-message-text{padding-right:0;word-break:normal}#chat-section .private-message-actions{order:5}#chat-section .private-counts{order:4}#chat-section .chat-message-bubble:has(audio) .private-message-text,#chat-section .chat-message-bubble:has(.private-photo) .private-message-text{display:none}#chat-section .chat-message-bubble:has(audio),#chat-section .chat-message-bubble:has(.private-photo){padding-bottom:.4rem}
/* Existing messenger, now with a persistent conversation list. */
.chat-split{display:grid;grid-template-columns:minmax(220px,30%) minmax(0,1fr);gap:16px;min-height:0}.chat-sidebar{min-width:0;display:flex;flex-direction:column;gap:8px;border-right:1px solid #ded8ce;padding-right:12px}.chat-sidebar h2{font-size:1.1rem;margin:.4rem}.chat-sidebar input,.chat-sidebar select{width:100%;box-sizing:border-box;min-height:40px}.chat-conversation{min-width:0;display:flex;flex-direction:column}#chat-section .chat-sidebar #chat-matches-list{display:flex;flex-direction:column;flex-wrap:nowrap;max-height:65dvh;background:transparent;margin:0;padding:0;gap:3px}#chat-section .chat-match{display:flex;align-items:center;gap:8px;width:100%;border-radius:12px;text-align:left;flex-shrink:0;padding:10px;border:0}#chat-section .chat-match img{width:38px;height:38px;border-radius:50%;object-fit:cover;margin:0}.thread-copy{display:flex;flex-direction:column;min-width:0;flex:1;gap:3px}.thread-preview{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-size:.78rem;opacity:.8}.chat-match time{font-size:.65rem}.chat-date-divider{align-self:center;font-size:.7rem;color:#69756d;padding:.6rem}.chat-conversation #chat-messages{flex:1}.chat-sidebar .chat-unread-dot{flex-shrink:0}
@media(max-width:700px){.chat-split{display:flex;flex:1;min-height:0;overflow:hidden}.chat-sidebar{width:100%;border:0;padding:4px}.chat-conversation{display:none;flex:1;min-height:0}.has-conversation .chat-sidebar{display:none}.has-conversation .chat-conversation{display:flex}#chat-section .chat-sidebar #chat-matches-list{max-height:none;flex:1;overflow:auto}.chat-sidebar h2{padding-top:env(safe-area-inset-top)}}
.message-sticker{width:5rem;height:5rem;object-fit:contain;display:block}.sticker-grid{display:flex;flex-wrap:wrap;gap:8px}.sticker-picker{max-width:min(90vw,480px)}#chat-section .sticker-message .chat-message-bubble{background:transparent;border:0}.sticker-message .private-message-text,.sticker-message .community-text{display:none}.community-row.sticker-message{background:transparent}
#chat-section .chat-new-messages{align-self:center;border-radius:18px;background:#176c60;color:white;padding:.4rem .8rem;font-size:.8rem;min-height:36px}
#chat-section .chat-list-back{border:1px solid #d4dfd6;border-radius:10px;background:#f6f3ed;color:#176c60;padding:.5rem;min-height:40px}
.chat-date-card{flex:none;max-height:26dvh;overflow:auto;padding:.6rem .8rem;border-radius:.8rem;background:#e4f3eb;color:#17483f;margin:.4rem}.chat-date-card p{margin:.25rem 0;font-size:.85rem}.chat-date-card button{margin:.2rem;padding:.4rem .65rem;border:0;border-radius:.6rem;background:#176c60;color:white}
/* Media actions stay next to the composer, including on touch devices. */
#chat-section #chat-input-container{grid-template-columns:minmax(0,1fr) repeat(4,44px)}#chat-section .private-stickers{grid-column:3;grid-row:3;min-width:44px;min-height:44px;padding:.4rem;border:1px solid #d4dfd6;border-radius:10px;background:#fff;color:#176c60}#chat-section .private-mic{grid-column:4}#chat-section #chat-send-btn{grid-column:5}
@media(max-width:480px){#chat-section #chat-input{grid-column:1/5;grid-row:3}#chat-section .private-photo-button{grid-column:1;grid-row:4;justify-self:start;width:44px}#chat-section .private-stickers{grid-column:2;grid-row:4}#chat-section .private-mic{grid-column:3;grid-row:4}}
@media(max-width:480px){#chat-section #chat-input-container{grid-template-columns:repeat(3,44px) minmax(0,1fr) 44px}}
/* One anchored, non-modal picker shared by every composer. */
.sticker-picker{box-sizing:border-box;position:fixed;inset:auto;margin:0;padding:8px;width:400px;max-width:calc(100vw - 16px);max-height:46dvh;border:1px solid #cbded5;border-radius:14px;background:#fffaf1;color:#493c30;box-shadow:0 8px 28px #203b3633;overflow:hidden;flex-direction:column;gap:6px;z-index:300}.sticker-picker:popover-open{display:flex}.sticker-picker::backdrop{background:transparent;pointer-events:none}.sticker-picker-head{display:flex;gap:4px;align-items:center}.sticker-picker-head input{min-width:0;flex:1;margin:0;height:36px;padding:6px 9px;font-size:14px}.sticker-picker-head button{width:36px;min-width:36px;min-height:36px;padding:0;font-size:24px;background:transparent;border:0}.sticker-tabs{display:flex;gap:4px;overflow-x:auto;flex-shrink:0;padding-bottom:3px}.sticker-tabs button{flex-shrink:0;min-height:32px;padding:4px 8px;font-size:12px;border:0;background:transparent;white-space:nowrap}.sticker-tabs button[aria-pressed=true]{background:#d9eee6;color:#155c50}.sticker-picker .sticker-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:88px;align-content:start;gap:6px;overflow-y:auto;overflow-x:hidden;min-height:0;overscroll-behavior:contain}.sticker-picker .sticker-grid button{display:grid;place-items:center;box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;padding:4px;background:transparent;border:0;border-radius:8px;overflow:hidden;aspect-ratio:auto}.sticker-picker .sticker-grid img{display:block;position:static;box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;object-position:center;background:transparent;margin:0;transform:none}.sticker-grid>p{grid-column:1/-1;font-size:13px}.sticker-error:empty{display:none}.sticker-error{font-size:12px;margin:0}.sticker-picker button:focus-visible{outline:2px solid #176c60;outline-offset:-2px}@media(hover:hover){.sticker-picker .sticker-grid button:hover{background:#e6f1eb}}
#chat-section .sticker-message .message-sticker,.community-message.sticker-message>.message-sticker,#encounter-content .sticker-message .message-sticker{width:160px;height:160px;max-width:100%;object-fit:contain;background:transparent;border:0;border-radius:0}
#chat-section .sticker-only .chat-message-bubble,.community-message.sticker-only,#encounter-content .sticker-message{background:transparent!important;border:0!important;box-shadow:none!important}
.sticker-message:not(.sticker-only) .private-message-text,.sticker-message:not(.sticker-only) .community-text{display:block}
@media(max-width:640px){#chat-section .sticker-message .message-sticker,.community-message.sticker-message>.message-sticker,#encounter-content .sticker-message .message-sticker{width:140px;height:140px}}

@media(max-width:480px){.sticker-picker .sticker-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:84px}}