:root{--emoji-font:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.emoji-glyph{display:inline-block;font-family:var(--emoji-font);font-size:24px;font-style:normal;font-weight:400;line-height:1.15;letter-spacing:0;text-transform:none;font-variant-emoji:emoji}
.message-reactions{gap:7px;margin-top:12px;align-items:center}
.reaction-chip{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:7px 10px;border:1px solid #e5cddb;border-radius:16px;background:#fff9fd;color:#75405e;font-size:13px;line-height:1}
.reaction-count{font:600 12px/1 var(--sans)}
.reaction-chip[aria-pressed=true]{background:#f3d4e5;border-color:#b66690;box-shadow:0 0 0 1px #b6669025}
.reaction-chip:hover{background:#f7e3ee;transform:translateY(-1px)}
.reaction-picker>summary{display:flex;align-items:center;min-height:44px;padding:6px 9px;font-size:11px;font-weight:600;opacity:1;border:1px solid currentColor;border-radius:14px;list-style:none}
.reaction-choices{gap:4px;max-width:100%;margin:7px 0 4px;padding:6px;border-radius:15px;box-shadow:0 7px 18px #5f234014}
.reaction-choices>.reaction-chip{display:inline-flex;min-width:44px;min-height:44px;padding:7px;background:transparent}
.direct-bubble{padding:13px 15px;border-radius:17px 17px 17px 5px;box-shadow:0 2px 6px #633e5507;max-width:min(88%,430px)}
.direct-bubble.mine{background:linear-gradient(135deg,#975477,#824365);border-radius:17px 17px 5px 17px}
.direct-bubble p{font-family:var(--sans),var(--emoji-font);font-size:14px;line-height:1.65}
.direct-bubble>small{font-size:10px;line-height:1.7;opacity:.8;margin-top:8px}
.message-tools{margin:3px 0 -4px;gap:12px}
.message-tools>button{font-size:11px;min-height:40px;text-decoration:none;font-weight:500;opacity:.9}
.direct-bubble.mine .message-tools>button[data-message-action=delete]{color:#ffe1eb}
.messages-dialog[open]{display:flex;flex-direction:column;width:min(1000px,calc(100vw - 32px));height:min(820px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);padding:25px;overflow:hidden}
.messages-dialog>h2{font-size:34px;margin:7px 0 12px;padding-right:40px}
.messages-dialog>.messenger-status{margin:0 0 14px;font-size:12px;line-height:1.65}
.messenger{flex:1;min-height:0;height:auto;border-radius:16px;grid-template-columns:235px minmax(0,1fr)}
.thread-messages{background:linear-gradient(155deg,#fffdfd,#fcf5fa);gap:15px;overscroll-behavior:contain;scrollbar-width:thin}
.thread-heading{min-height:64px;background:#fff;border-bottom-color:#eddfE7}
.thread-search{padding:9px 13px}
.thread-search>input{border-radius:11px}
.chat-composer.direct-form{display:grid;grid-template-columns:44px 44px minmax(0,1fr) 44px;gap:8px;padding:12px;background:#fff;border-top:1px solid #ecdce6;align-items:center}
.chat-composer>textarea{grid-column:1/-1;grid-row:1;display:block;width:100%;min-width:0;min-height:64px;max-height:112px;resize:vertical;margin:0;padding:11px 13px;background:#fdf9fc;color:#71445f;border:1px solid #e8d2df;border-radius:12px;font:15px/1.65 var(--sans),var(--emoji-font)}
.chat-composer>.emoji-picker-button{grid-column:1;grid-row:2}
.chat-composer>.gif-picker-button{grid-column:2;grid-row:2}
.chat-composer>.round-button{grid-column:4;grid-row:2;width:44px;height:44px}
.composer-hint{grid-column:3;grid-row:2;font-size:10px;color:#96738a;padding:0 5px;min-width:0;line-height:1.5}
.emoji-picker-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;border:1px solid #e4c9d9;border-radius:12px;background:#fff7fc;color:#87536e}
.emoji-picker-button[aria-expanded=true]{background:#f0d9e6;border-color:#aa7190}
.emoji-panel{display:flex;flex-direction:column;flex:0 1 auto;min-height:0;max-height:min(300px,38dvh);padding:10px 12px;background:#fff8fc;color:#75465f;border-block:1px solid #e8cddd;overflow:auto}
.emoji-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0}
.emoji-panel-heading>strong{font-size:12px}
.emoji-panel-close{min-height:36px;background:transparent;color:#95627e;font-size:11px}
.emoji-search{display:block;flex-shrink:0;min-height:40px;width:100%;padding:9px 11px;border:1px solid #e5ccdb;border-radius:10px;background:white;color:#75465f;font-size:13px}
.emoji-categories{display:flex;flex-shrink:0;gap:3px;margin:7px 0;overflow:auto;scrollbar-width:none}
.emoji-category{flex-shrink:0;min-height:32px;border-radius:8px;padding:5px 9px;color:#8c5e77;background:transparent;font-size:10px}
.emoji-category[aria-pressed=true]{background:#efdbe7;color:#713a58;font-weight:600}
.emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;min-height:0;overflow:auto;scrollbar-width:thin}
.emoji-option{display:grid;place-items:center;min-width:0;min-height:44px;border-radius:10px;background:transparent}
.emoji-option:hover,.emoji-option:focus-visible{background:#efdae6}
.emoji-option>.emoji-glyph{font-size:26px}
.emoji-status{font-size:10px;line-height:1.5;color:#99778c;margin:5px 0 0;flex-shrink:0}
.reply-quote{display:flex;flex-direction:column;gap:3px;margin:0 0 9px;padding:9px 11px;border-left:3px solid #bf85a6;border-radius:5px 10px 10px 5px;background:#ecdce740;color:inherit;min-width:0}
.reply-quote>strong{font:600 11px/1.5 var(--sans)}
.reply-quote>span{display:block;font-size:12px;line-height:1.6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.reply-draft{display:flex;align-items:center;gap:10px;padding:9px 13px 0;background:#fff;flex-shrink:0}
.reply-draft>.reply-quote{flex:1;margin:0;color:#794961;background:#fbf1f7}
.reply-cancel{background:transparent;color:#915772;font-size:11px;min-height:44px;padding:5px 4px;flex-shrink:0}
@media(max-width:680px){
 .messages-dialog[open]{width:100%;max-width:100%;height:calc(100dvh - 8px);max-height:calc(100dvh - 8px);margin:8px 0 0;padding:19px 12px max(10px,env(safe-area-inset-bottom));border-radius:20px 20px 0 0}
 .messages-dialog>h2{font-size:30px;margin-bottom:9px}
 .messages-dialog>.messenger-status{font-size:11px;margin-bottom:10px}
 .messenger{display:block;height:auto}.thread-main{height:100%}
 .thread-messages{padding:15px 11px}.direct-bubble{max-width:94%}
 .direct-bubble p{font-size:14px}.message-tools>button{min-height:44px}
 .chat-composer.direct-form{padding:9px}.chat-composer>textarea,.emoji-search{font-size:16px}
 .emoji-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
 .emoji-panel{padding-inline:9px}.composer-hint{font-size:10px}
}
@media(max-height:600px){.emoji-panel-heading{display:none}.emoji-panel{max-height:38dvh}.messages-dialog>.messenger-status{display:none}}
@media(prefers-reduced-motion:reduce){.reaction-chip:hover{transform:none}}
