.group-create{padding:18px;margin-bottom:18px}.group-create summary{cursor:pointer;font-weight:700}.group-create form{display:grid;gap:14px;margin-top:16px}.group-create input:not([type=checkbox]){display:block;width:100%;margin-top:8px}.group-members{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));max-height:220px;overflow:auto;gap:10px}.group-members label{display:flex;align-items:center;gap:8px}.group-members input{width:auto}.read-receipt{display:block;text-align:right;color:#a2a0b0;font-size:13px;margin-top:4px}.read-receipt.is-read{color:#a990ff}.chat>h3{padding:12px 0;margin:0}.messenger aside a b{overflow-wrap:anywhere}.message-error{color:#ff8294}
.messenger [hidden]{display:none!important}
.messenger .messenger-sidebar{padding:0;display:flex;flex-direction:column;overflow:hidden;max-height:650px}
.chat-list-heading{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;gap:12px;border-bottom:1px solid #302b3d;flex-shrink:0}
.chat-list-heading button{padding:0;width:32px;height:32px;border-radius:9px;background:#302339;color:#fff;font-size:23px;line-height:1;flex-shrink:0}
[data-chat-contacts]{overflow-y:auto;min-height:0;flex:1;padding:8px;scrollbar-gutter:stable}
.messenger aside a.contact-link{grid-template-columns:36px minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;align-items:center;min-height:58px;box-sizing:border-box}
.contact-list-avatar{grid-column:1;grid-row:1/3;width:36px;height:36px;border-radius:50%;object-fit:cover;image-rendering:pixelated;background:#251d31;color:#fff}
.contact-list-avatar.group-avatar{display:grid;place-items:center;background:linear-gradient(135deg,#7146a8,#382b49);font-size:14px;font-weight:850}
.messenger aside a.contact-link>b,.messenger aside a.contact-link>.contact-status{grid-column:2;min-width:0}
.messenger aside a.contact-link>b{grid-row:1;align-self:end;line-height:1.25}
.messenger aside a.contact-link>.contact-status{grid-row:2;align-self:start;line-height:1.3}
.chat-create-panel{display:flex;flex-direction:column;gap:12px;min-height:0;padding:0 12px 14px;flex:1}
.chat-create-panel>label{display:grid;gap:8px}.chat-create-panel input:not([type=checkbox]){width:100%;min-width:0}
.chat-create-panel .group-members{display:flex;flex-direction:column;gap:2px;flex:1;min-height:80px;max-height:none;overflow:auto}
.group-members label{padding:10px 4px;cursor:pointer;border-radius:8px}.group-members label:hover{background:#27222f}
.group-members label>span:nth-child(2){flex:1;min-width:0;overflow-wrap:anywhere}.group-members label input{margin-left:auto}
.chat-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;border-radius:50%;background:linear-gradient(135deg,#a64bda,#613a9f);color:#fff;font-weight:800;object-fit:cover;image-rendering:pixelated}
.chat small{display:block;color:#a39ab2;margin-top:3px}.group-members small{display:block;color:#a39ab2;font-size:11px;margin-top:4px}
.chat-group-heading{position:sticky;top:-16px;z-index:2;display:flex;align-items:center;gap:12px;text-align:left;padding:12px;background:#1b1823;width:100%;border-radius:10px;margin-bottom:14px;color:#f6f2ff;flex-shrink:0}
.chat{position:relative}
.chat-member-panel{position:sticky;top:48px;z-index:3;background:#1b1823;border:1px solid #40334d;border-radius:12px;max-height:70%;overflow:auto;flex-shrink:0;margin-bottom:12px}
.chat-member{display:flex;align-items:center;gap:12px;padding:12px 16px;overflow-wrap:anywhere}
.chat-member b{display:block}
@media(max-width:650px){.messenger .messenger-sidebar{max-height:360px}.chat-create-panel .group-members{max-height:170px}}
.bubble>.reply-button{position:absolute;right:7px;top:-12px;opacity:0;pointer-events:none;transition:opacity .12s;background:#302b39;border-radius:12px;padding:4px 9px;z-index:2}
.bubble:hover>.reply-button,.bubble:focus-within>.reply-button{opacity:1;pointer-events:auto}
.bubble{position:relative;margin-top:8px;padding-top:10px}
.bubble>b{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bubble .read-receipt{display:inline-flex;text-align:left;margin:0;font-size:12px;white-space:nowrap}
.member-kick{background:#542431;color:#ffc3cf}
.member-kick{margin-left:auto;padding:7px 10px;font-size:11px;flex-shrink:0}
@media(hover:none){.bubble>.reply-button{opacity:1;pointer-events:auto}}
.group-action-menu{position:relative;margin-left:auto}
.group-action-menu>summary{list-style:none;display:grid;place-items:center;width:32px;height:32px;border-radius:9px;cursor:pointer;background:transparent;color:#c8bfd5;font-size:25px;line-height:1}
.group-action-menu>summary::-webkit-details-marker{display:none}
.group-action-menu[open]>summary,.group-action-menu>summary:hover{background:#302739;color:#fff}
.group-action-dropdown{position:absolute;right:0;top:39px;width:255px;max-width:calc(100vw - 65px);padding:6px;border:1px solid #45394f;border-radius:12px;background:#241e2d;box-shadow:0 14px 40px #0008;z-index:8}
.chat-list-heading .group-action-dropdown button{display:flex;align-items:center;gap:12px;width:100%;height:auto;min-height:42px;padding:11px 12px;text-align:left;background:transparent;color:#e5dfee;font-size:13px;font-weight:600;border-radius:7px}
.chat-list-heading .group-action-dropdown button:hover{background:#342b40}
.chat-list-heading .group-action-dropdown button>span{width:20px;text-align:center;font-size:20px;color:#bba8ce}
.chat-list-heading .group-action-dropdown .danger-action,.chat-list-heading .group-action-dropdown .danger-action>span{color:#ff8596}
.group-action-dialog{box-sizing:border-box;width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;margin:auto;padding:24px;border:1px solid #46364f;border-radius:18px;background:#1c1724;color:#f6f1fb;box-shadow:0 26px 100px #0009;font:inherit}
.group-action-dialog::backdrop{background:#08060dcc;backdrop-filter:blur(4px)}
.group-action-dialog form{display:grid;gap:18px}
.group-action-dialog header{display:flex;align-items:center;justify-content:space-between;gap:14px}
.group-action-dialog h2{margin:0;font-size:20px;line-height:1.3}
.group-action-dialog p{margin:0;line-height:1.6;color:#aaa0b9;font-size:14px;overflow-wrap:anywhere}
.group-action-dialog .message-error{color:#ff8a9e}
.group-action-dialog input{box-sizing:border-box;width:100%;min-width:0;padding:13px 14px;border:1px solid #594367;border-radius:10px;background:#100d17;color:#f5effb;font:inherit}
.group-action-dialog input:focus{outline:2px solid #aa70e0;outline-offset:2px}
.group-action-dialog footer{display:flex;justify-content:flex-end;gap:10px}
.group-action-dialog button{font:inherit;border:0;border-radius:10px;padding:11px 16px;cursor:pointer;font-size:13px;font-weight:700;color:#f6efff}
.group-action-dialog .group-dialog-close{padding:0;width:32px;height:32px;background:#302639;font-size:24px;flex-shrink:0}
.group-action-dialog .group-dialog-cancel{background:#30283a;color:#d4cadf}
.group-action-dialog .group-dialog-save{background:#7944b1}
.group-action-dialog .group-dialog-delete{background:#a93048}
.group-action-dialog button:disabled{opacity:.5;cursor:wait}
.group-action-dialog button:focus-visible,.group-action-menu summary:focus-visible,.group-action-dropdown button:focus-visible{outline:2px solid #c08afa;outline-offset:2px}
.bubble>time{display:none}
@media(hover:none){.bubble>time{display:block;font-size:10px;opacity:.65}}
/* Preserve content height in the scrolling flex column, including quotes and reactions. */
.chat>.bubble,.chat>.message-form{flex:0 0 auto}
.chat .bubble,.chat .bubble.mine{align-self:stretch;width:100%;max-width:100%;box-sizing:border-box;background:transparent;border-radius:10px;margin:0;padding:12px 90px 12px 54px;min-height:64px;overflow-wrap:anywhere;transition:background .12s}
.chat .bubble:hover,.chat .bubble:focus-within{background:#ffffff07}
.chat .bubble>b{color:#b99be5;font-size:13px;margin:0 0 4px;gap:8px}
.chat .bubble>p{font-size:14px;line-height:1.5;margin:0}
.chat .bubble>.message-avatar{position:absolute;left:10px;top:12px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#665085,#362b46);font-size:14px;color:#eee4fa;object-fit:cover;image-rendering:pixelated}
.chat .bubble>time{display:block;position:absolute;right:13px;top:12px;margin:0;font-size:10px;color:#8d829e}
.chat .bubble>.reply-button{right:41px;top:29px;padding:2px 8px;font-size:18px;line-height:22px;background:#302938}
.reaction-picker{position:absolute;right:11px;top:29px;z-index:5;opacity:0;pointer-events:none}
.bubble:hover .reaction-picker,.bubble:focus-within .reaction-picker,.reaction-picker[open]{opacity:1;pointer-events:auto}
.reaction-picker>summary{display:grid;place-items:center;list-style:none;width:28px;height:26px;border-radius:12px;background:#302938;color:#c8bdd5;cursor:pointer}
.reaction-picker>summary::-webkit-details-marker{display:none}
.reaction-choices{position:absolute;right:0;top:29px;display:flex;gap:3px;padding:6px;background:#28212f;border:1px solid #46374f;border-radius:22px;box-shadow:0 6px 20px #0007;white-space:nowrap}
.reaction-choices button{padding:5px;width:32px;height:32px;border-radius:50%;background:transparent;font-size:21px;line-height:1}
.reaction-choices button:hover{background:#4b365f}
.message-reactions{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.message-reactions:empty{display:none}
.chat-floating{position:fixed;inset:auto;margin:0;box-sizing:border-box;max-width:calc(100vw - 16px);color:#eee5f6;border:1px solid #46374f;background:#28212f;box-shadow:0 6px 20px #0007}
.chat-floating::backdrop{background:transparent}
.reaction-choices.chat-floating{display:flex;gap:3px;padding:6px;border-radius:22px}
.reaction-picker>button{display:grid;place-items:center;width:28px;height:26px;padding:0;border:0;border-radius:12px;background:#302938;color:#c8bdd5;cursor:pointer}
.contact-row{position:relative}
.messenger .contact-row>a{padding-right:42px}
.contact-more{position:absolute;right:9px;top:14px;padding:0;width:28px;height:26px;border:0;border-radius:8px;color:#c8bdd5;background:#302938;opacity:0;cursor:pointer;font-size:20px}
.contact-row:hover .contact-more,.contact-row:focus-within .contact-more{opacity:1}
.contact-actions{padding:6px;border-radius:10px}
.contact-actions button{display:block;width:100%;text-align:left}
.contact-actions button{border:0;border-radius:6px;padding:10px 14px;background:transparent;color:#ff8896;cursor:pointer;font:inherit}
.contact-actions button:hover{background:#49303e}
@media(hover:none){.contact-more{opacity:1}}
.chat .message-form{z-index:8;align-items:center}
.chat-composer{position:relative;display:flex;align-items:center;flex:1;min-width:140px;border:1px solid #312e3b;border-radius:12px;background:#17151d}
.chat .chat-composer input[name="body"]{min-width:0;border:0;background:transparent;padding-right:44px}
.composer-emoji{position:absolute;right:8px;bottom:7px}
.composer-emoji>summary{list-style:none;cursor:pointer;color:#a99eb4;font-size:27px;line-height:30px;width:30px;text-align:center}
.composer-emoji>summary::-webkit-details-marker{display:none}
.composer-emoji-panel{position:absolute;bottom:38px;right:0;width:min(300px,calc(100vw - 85px));box-sizing:border-box;max-height:310px;overflow:auto;padding:12px;border:1px solid #45384e;border-radius:14px;background:#24202b;box-shadow:0 8px 32px #0009}
.composer-emoji-panel p{margin:6px 0 10px;color:#aaa0b7;font-size:12px}
.composer-emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;margin-bottom:10px}
.composer-emoji-grid button{padding:0;min-width:0;width:100%;height:30px;background:transparent;border:0;border-radius:6px;font-size:22px}
.composer-emoji-grid button:hover,.composer-emoji-grid button:focus-visible{background:#493956;outline:1px solid #9069b4}
.message-reactions button{padding:3px 9px;border-radius:14px;background:#2f273b;color:#bfb2d0;border:1px solid transparent;font-size:12px}
.message-reactions button.mine{background:#6d47a1;color:#fff;border-color:#9874c5}
@media(hover:none){.reaction-picker{opacity:1;pointer-events:auto}}
@media(max-width:480px){.chat .bubble,.chat .bubble.mine{padding-left:42px;padding-right:72px}.chat .bubble>.message-avatar{left:4px;width:28px;height:28px}.reaction-choices{gap:0;padding:4px}.reaction-choices button{width:29px}}
.bubble .edit-message,.bubble .report-message{border:0;border-radius:9px;color:#cbb9dc;cursor:pointer}.typing-indicator:not([hidden]){display:block;animation:typingPulse 1.3s ease-in-out infinite}@keyframes typingPulse{50%{opacity:.45}}