/* V1.1.17 — reference-led member UI reconstruction.
   Presentation is centralized here; authentication, group authorization and message transport remain in member.js. */
:root{
  color-scheme:light;
  --ink:#20232b;
  --muted:#9296a1;
  --line:#e9e9ee;
  --canvas:#f5f4fb;
  --panel:#fff;
  --blue:#3478f6;
  --blue-soft:#9ccdf6;
  --rail-width:64px;
  --list-width:305px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);
  background:var(--canvas);
  font-synthesis:none;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
*{box-sizing:border-box}
html,body{width:100%;height:100%;min-width:320px;margin:0;overflow:hidden;background:var(--canvas)}
body{overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
button,input{font:inherit}
button{-webkit-tap-highlight-color:transparent;touch-action:manipulation;cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.58}
.hidden{display:none!important}
.splash{display:grid;place-items:center;width:100%;height:100dvh;background:var(--canvas);color:#8b8d98;font-size:13px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Login: preserve the reference's two-column composition and restrained color field. */
.login-screen{display:grid;place-items:center;width:100%;min-height:100vh;min-height:100dvh;padding:40px;background:radial-gradient(ellipse at 27% 34%,rgba(224,232,255,.48),transparent 37%),linear-gradient(118deg,#f1f2f5 0%,#f3f3f5 54%,#f0f0f3 100%)}
.login-layout{display:grid;grid-template-columns:350px 380px;align-items:center;gap:160px;width:890px;max-width:100%;margin:auto}
.login-copy{max-width:350px;padding:8px 0}
.login-copy .eyebrow{margin-bottom:18px;color:#6389e8;font-size:10px;font-weight:750;letter-spacing:1.2px}
.login-copy h2{margin:0;color:#17191f;font-size:48px;font-weight:760;line-height:1.22;letter-spacing:-1.4px}
.login-copy p{max-width:340px;margin:16px 0 0;color:#969daa;font-size:11px;line-height:1.9}
.login-art{position:relative;width:220px;height:92px;margin-top:25px}
.login-art span{position:absolute;display:block;border-radius:13px;background:#fff;box-shadow:0 10px 26px rgba(57,75,125,.055)}
.login-art span:first-child{left:10px;top:8px;width:128px;height:42px;transform:rotate(-5deg)}
.login-art span:last-child{left:88px;top:37px;width:112px;height:48px;background:#eaf0ff;transform:rotate(5deg)}
.login-art span:first-child:after{position:absolute;left:17px;top:11px;color:#9bb8ff;font-size:13px;letter-spacing:3px;content:"•••"}
.login-art span:last-child:after{position:absolute;left:18px;top:17px;width:43px;height:3px;border-radius:4px;background:#9db8ff;box-shadow:0 9px 0 #9db8ff;content:""}
.login-box{display:block;width:380px;max-width:100%;padding:33px 34px 13px;border:1px solid #ececf1;border-radius:15px;background:#fff;box-shadow:0 14px 38px rgba(43,51,79,.055)}
.login-box h1{margin:0 0 49px;color:#20232b;font-size:24px;font-weight:720;line-height:1.3;letter-spacing:-.3px;text-align:center}
.login-box label{display:block;margin:0;color:#6d7788;font-size:0;font-weight:600}
.login-box label+label{margin-top:16px}
.login-box input{display:block;width:100%;height:50px;margin:0;padding:0 13px;border:1px solid #e7e8ee;border-radius:8px;outline:none;background:#fff;color:#293448;font-size:16px;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.login-box input::placeholder{color:#a4a8b1}
.login-box input:focus{border-color:#a9c5ff;box-shadow:0 0 0 3px rgba(52,120,246,.075)}
.login-box button{width:100%;height:52px;margin:22px 0 0;border:0;border-radius:8px;background:#9bcdf6;color:#fff;font-size:14px;font-weight:750;box-shadow:0 4px 10px rgba(115,177,232,.12);transition:background .16s ease,box-shadow .16s ease,transform .16s ease}
.login-box button:hover{background:#8bc3f3;box-shadow:0 6px 14px rgba(115,177,232,.17)}
.login-box button:active{transform:translateY(1px);box-shadow:0 2px 6px rgba(115,177,232,.12)}
.error{min-height:18px;margin:4px 0 0;color:#c34d5b;font-size:11px;line-height:1.5}
.tiny,.admin-entry{display:none}

/* Desktop application frame. */
#member-app.app{display:grid;grid-template-columns:var(--rail-width) var(--list-width) minmax(0,1fr);width:100%;height:100vh;height:100dvh;min-height:0;overflow:hidden;background:#fff}
.rail{display:flex;flex-direction:column;align-items:center;gap:12px;min-height:0;padding:16px 0 12px;border-right:1px solid #e8e7ed;background:#f6f5fc;color:#8b8d98}
.rail-avatar{display:grid;place-items:center;flex:none;width:40px;height:40px;margin:0 0 12px;padding:0;border:1px solid rgba(111,137,196,.16);border-radius:6px;background:linear-gradient(145deg,#f7f4e8,#e5ecf7);color:#647cae;font-size:16px;font-weight:700;box-shadow:0 1px 3px rgba(30,45,80,.06)}
.rail-avatar span{display:grid;place-items:center;width:100%;height:100%;border-radius:inherit}
.rail-btn{display:flex;flex:none;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:48px;height:48px;padding:4px 2px;border:0;border-radius:10px;background:transparent;color:#858a96;transition:background .16s ease,color .16s ease,transform .16s ease}
.rail-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.rail-btn span{display:block;color:currentColor;font-size:10px;line-height:1.15;white-space:nowrap}
.rail-btn:hover{background:#eeeff5;color:#65728a}
.rail-btn.active{background:#e7efff;color:#3478f6}
.rail-grow{flex:1}
.rail-settings{margin-top:auto;color:#8b94a5}

.list-pane{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;border-right:1px solid #e8e7ed;background:#fff}
.list-top{display:flex;align-items:center;flex:none;height:54px;padding:0 16px 0 20px}
.list-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%}
.list-heading .eyebrow,.list-heading p{display:none}
.list-heading h1{margin:0;color:#24262d;font-size:14px;font-weight:650;line-height:1.35}
.list-mark{display:none}
.search-wrap{position:relative;flex:none;padding:0 12px 8px}
.search-icon{position:absolute;left:22px;top:7px;color:#9296a1;font-size:16px;line-height:1;pointer-events:none}
.search-wrap input{display:block;width:100%;height:30px;padding:0 10px 0 30px;border:0;border-radius:5px;outline:none;background:#f4f4f6;color:#293448;font-size:12px;transition:background .16s ease,box-shadow .16s ease}
.search-wrap input:focus{background:#fff;box-shadow:0 0 0 1px #dce4f5}
.list-tabs{display:none}
.group-list{flex:1;min-height:0;overflow:auto;padding:0 0 10px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#e0e1e8 transparent}
.group-row{display:flex;align-items:center;gap:9px;width:100%;min-width:0;min-height:58px;margin:0;padding:6px 10px;border:0;border-bottom:1px solid #f0f0f2;border-radius:0;background:#fff;color:inherit;text-align:left;transition:background .15s ease}
.group-row:hover,.group-row.chosen{background:#f7f8fb}
.group-icon{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1px;place-items:stretch;flex:none;width:40px;height:40px;overflow:hidden;border-radius:4px;background:#edf0f4;color:transparent;font-size:0}
.group-icon i{position:relative;display:block;min-width:0;min-height:0;overflow:hidden;background:linear-gradient(135deg,#d5e4e7,#9ab4c5)}
.group-icon i:before{position:absolute;left:35%;top:16%;width:30%;height:32%;border-radius:50%;background:rgba(255,255,255,.8);content:""}
.group-icon i:after{position:absolute;left:15%;bottom:-18%;width:70%;height:55%;border-radius:50% 50% 0 0;background:rgba(255,255,255,.72);content:""}
.group-icon i:nth-child(2){background:linear-gradient(135deg,#f2d6c6,#c78e7d)}
.group-icon i:nth-child(3){background:linear-gradient(135deg,#e9e0d3,#9b9b85)}
.group-icon i:nth-child(4){background:linear-gradient(135deg,#d6dff0,#879fc4)}

.group-icon[data-tone="1"] i:nth-child(1){background:linear-gradient(135deg,#d7e9df,#82a895)}
.group-icon[data-tone="2"] i:nth-child(2){background:linear-gradient(135deg,#f1d5c7,#bf8b79)}
.group-icon[data-tone="3"] i:nth-child(3){background:linear-gradient(135deg,#dce4f4,#8499bc)}
.group-icon[data-tone="4"] i:nth-child(4){background:linear-gradient(135deg,#e8d9e8,#a481a3)}
.group-icon[data-tone="5"] i:nth-child(1){background:linear-gradient(135deg,#e9e1c9,#b4a06e)}
.group-icon[data-tone="6"] i:nth-child(2){background:linear-gradient(135deg,#d9e8eb,#86a9b2)}
.group-icon[data-tone="7"] i:nth-child(3){background:linear-gradient(135deg,#dfe8d3,#91a77b)}
.group-info{display:block;flex:1;min-width:0}
.group-info strong,.group-info small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.group-info strong{color:#25272d;font-size:12px;font-weight:600;line-height:1.45}
.group-info small{margin-top:3px;color:#8e929c;font-size:10px;line-height:1.35}
.member-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;min-height:34px;padding:0 12px;border-top:1px solid #f0eff4;background:#fff;color:#8b95a5;font-size:10px}
.member-identity{display:flex;align-items:center;gap:7px;min-width:0}
.member-dot{width:6px;height:6px;border-radius:50%;background:#32bd83}
.member-identity span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.member-foot button{padding:5px 7px;border:0;background:transparent;color:#8592a8;font-size:10px}
.contacts-list-view{display:flex;flex:1 1 auto;flex-direction:column;min-width:0;min-height:0;overflow:hidden;background:#fff}
.contacts-title-row{display:none}
.contacts-search-row{display:flex;flex:none;align-items:center;gap:12px;padding:10px 12px 8px;background:#fff}
.contacts-search{position:relative;display:block;flex:1;min-width:0}
.contacts-search svg{position:absolute;left:12px;top:50%;width:16px;height:16px;transform:translateY(-50%);fill:none;stroke:#9296a1;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.contacts-search input{display:block;width:100%;height:32px;padding:0 12px 0 35px;border:0;border-radius:6px;outline:none;background:#f4f4f6;color:#293448;font-size:12px}
.contacts-search input:focus{background:#fff;box-shadow:0 0 0 1px #dce4f5}
.contacts-search input::placeholder{color:#9296a1}
.contacts-add{display:grid;place-items:center;flex:none;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:transparent;color:#34383f}
.contacts-add svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contacts-add:hover{background:#eeeff5;color:#3478f6}
.contacts-add-mobile{display:none}
.contacts-tabs{display:grid;flex:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:4px 8px 10px;padding:4px;border-radius:9px;background:#f3f2f7}
.contacts-tabs button{min-width:0;height:27px;padding:0 4px;border:0;border-radius:7px;background:transparent;color:#858a96;font-size:12px;white-space:nowrap}
.contacts-tabs button.active{background:#fff;color:#3478f6;box-shadow:0 1px 2px rgba(30,45,80,.035);font-weight:600}
.contacts-results{flex:1 1 auto;min-height:0;overflow:auto;background:#fff;overscroll-behavior:contain}
.contacts-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:180px;padding:24px;text-align:center;color:#a0a4ad}
.contacts-empty-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#f4f6fb;color:#9ca9c3;font-size:22px}
.contacts-empty strong{color:#6e7684;font-size:13px;font-weight:600}
.contacts-empty span:last-child{font-size:11px;line-height:1.6}

.chat-pane{grid-column:3;grid-row:1;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;background:var(--canvas)}
.chat-header{display:flex;align-items:center;gap:9px;flex:none;min-width:0;height:54px;min-height:54px;padding:0 18px;border-bottom:1px solid #e8e7ed;background:#fff}
.chat-avatar{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:#f0f2f7;color:#8792a5;font-size:10px}
.chat-heading{min-width:0}
.chat-heading h2{overflow:hidden;margin:0;color:#25262c;font-size:13px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.chat-heading p{overflow:hidden;margin:2px 0 0;color:#a0a3ac;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.chat-heading .connection-status{display:flex;align-items:center;gap:5px}
.connection-status:before{width:5px;height:5px;flex:none;border-radius:50%;background:#9ca6b6;content:""}
.connection-status.is-connected{color:#23966b!important}.connection-status.is-connected:before{background:#2dbb83}
.connection-status.is-connecting{color:#a8792b!important}.connection-status.is-connecting:before{background:#e6ad4d}
.connection-status.is-fallback{color:#5279c7!important}.connection-status.is-fallback:before{background:#6c91e8}
.connection-status.is-offline{color:#c35e67!important}.connection-status.is-offline:before{background:#d76b74}
.chat-header-spacer{flex:1}
.chat-header-label{display:none}
.chat-header-more{display:grid;place-items:center;flex:none;width:28px;height:28px;color:#777b84}
@media(min-width:761px){.chat-header .chat-avatar,.chat-header .chat-heading p{display:none!important}.chat-header{padding-left:16px}.chat-heading h2{font-size:12px;font-weight:550}}
.chat-header-more svg{width:18px;height:18px;fill:currentColor}
.back{display:none}
.messages{display:flex;flex:1 1 auto;flex-direction:column;align-items:stretch;min-width:0;min-height:0;overflow-x:hidden;overflow-y:auto;padding:12px 28px 18px;background:var(--canvas);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d9d8e3 transparent}
.placeholder{align-self:center;width:100%;max-width:390px;margin:auto;padding:24px;color:#969eae;font-size:12px;line-height:1.8;text-align:center}
.placeholder-icon{display:grid;place-items:center;width:46px;height:46px;margin:0 auto 12px;border:1px solid #e4eafa;border-radius:14px;background:#edf2ff;color:#3478f6;font-size:22px}
.placeholder h3{margin:0 0 6px;color:#424d61;font-size:15px;font-weight:700}
.placeholder p{margin:0;color:#9aa2b0;font-size:11px;line-height:1.8}
.msg-row{display:flex;align-items:flex-start;align-self:stretch;flex:0 0 auto;gap:9px;width:100%;min-width:0;margin:0 0 18px}
.msg-row.mine{justify-content:flex-end}
.msg-avatar{position:relative;display:block;flex:none;width:40px;height:40px;margin-top:2px;overflow:hidden;border:1px solid rgba(35,45,60,.06);border-radius:5px;background:linear-gradient(145deg,#e8d9cf,#9aa8bb)}
.msg-avatar:before{position:absolute;left:34%;top:18%;width:32%;height:32%;border-radius:46% 46% 42% 42%;background:var(--avatar-skin,#efc8ad);box-shadow:0 -4px 0 -1px var(--avatar-hair,#5d514b);content:""}
.msg-avatar:after{position:absolute;left:18%;bottom:-8%;width:64%;height:53%;border-radius:48% 48% 10% 10%;background:var(--avatar-shirt,#e9eef5);content:""}
.msg-avatar[data-tone="1"]{--avatar-skin:#eac2a5;--avatar-hair:#423b39;--avatar-shirt:#e7f0eb;background:linear-gradient(145deg,#d7e5dd,#789e91)}
.msg-avatar[data-tone="2"]{--avatar-skin:#efc7aa;--avatar-hair:#46362f;--avatar-shirt:#dce5ed;background:linear-gradient(145deg,#e9d9c7,#a47c68)}
.msg-avatar[data-tone="3"]{--avatar-skin:#f0c8ae;--avatar-hair:#51483f;--avatar-shirt:#e8e2f0;background:linear-gradient(145deg,#dce5f5,#8399bd)}
.msg-avatar[data-tone="4"]{--avatar-skin:#f1c8b2;--avatar-hair:#51404d;--avatar-shirt:#e7e4f2;background:linear-gradient(145deg,#e8d7e5,#a17d9d)}
.msg-avatar[data-tone="5"]{--avatar-skin:#eac0a0;--avatar-hair:#514039;--avatar-shirt:#f0e8d7;background:linear-gradient(145deg,#dce7c9,#8da06f)}
.msg-avatar[data-tone="6"]{--avatar-skin:#f0c6a6;--avatar-hair:#59473a;--avatar-shirt:#dce8e8;background:linear-gradient(145deg,#e8e1d1,#a99a7b)}
.msg-avatar[data-tone="7"]{--avatar-skin:#efc6a9;--avatar-hair:#443c39;--avatar-shirt:#e8e3ef;background:linear-gradient(145deg,#d7e7ea,#7f9eaa)}
.msg-content{display:flex;flex:0 1 auto;flex-direction:column;align-items:flex-start;min-width:0;max-width:min(72%,520px);gap:4px}
.msg-row.mine .msg-content{align-items:flex-end}
.msg-alias{max-width:100%;padding:0 1px;color:#92959d;font-size:11px;line-height:1.3;overflow-wrap:anywhere}
.msg-alias.mine-meta{color:#92959d;text-align:right}
.msg-bubble{max-width:100%;overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap;padding:8px 11px;border:0;border-radius:5px 12px 12px 12px;background:#fff;color:#262930;font-size:13px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 1px 2px rgba(33,45,76,.035);transition:box-shadow .16s ease}
.msg-row.mine .msg-bubble{border-radius:12px 5px 12px 12px;background:#3478f6;color:#fff;box-shadow:none}
.msg-status{padding:0 1px;color:#a0a3ab;font-size:9px;line-height:1.3}
.msg-status.fail{color:#d14e5b}.msg-status.pending{color:#8795ac}
.chat-notice{align-self:center;flex:0 0 auto;padding:8px 12px;color:#969eae;font-size:10px;text-align:center}
.chat-date{align-self:center;flex:0 0 auto;margin:6px 0 9px;padding:3px 10px;border-radius:10px;background:rgba(235,235,241,.62);color:#a0a2aa;font-size:10px;line-height:1.3}

/* V1.1.19 composer: multiline-safe, keyboard-friendly and reference-aligned. */
.compose{position:relative;display:flex;flex:none;flex-direction:column;min-height:184px;margin:0;padding:15px 16px 12px;border-top:1px solid #e8e7ed;background:#fff;z-index:5}
.compose-tools{display:flex;align-items:center;gap:12px;height:25px;flex:none;color:#777b83}
.compose-tool{display:inline-flex;align-items:center;justify-content:center;width:20px;height:24px;padding:0;border:0;border-radius:5px;background:transparent;color:#777b83;cursor:pointer}
.compose-tool svg{display:block;width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.compose-tool:hover:not(:disabled){background:#f1f3f8;color:#4c5668}
.compose-tool:disabled{opacity:.58;cursor:not-allowed}
.compose-mobile-tool,.compose-mobile-actions{display:none}
.compose-form{display:flex;align-items:stretch;gap:12px;flex:1;width:100%;min-width:0;min-height:112px;margin:0;padding-top:5px}
.compose-form textarea{display:block;flex:1 1 auto;width:0;min-width:0;height:108px;min-height:96px;max-height:112px;overflow-y:auto;resize:none;padding:7px 2px 8px;border:0;border-radius:0;outline:none;background:transparent;color:#293448;font-family:inherit;font-size:13px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:none}
.compose-form textarea:focus{border:0;box-shadow:none}
.compose-form textarea::placeholder{color:#a0a4ac}
.compose-form #send-button{display:flex;align-items:center;justify-content:center;gap:12px;align-self:flex-end;flex:0 0 auto;min-width:78px;height:28px;margin:0 0 1px;padding:0 12px;border:0;border-radius:5px;background:#eaf2ff;color:#7ba3eb;font-size:11px;font-weight:600;transition:background .16s ease,transform .16s ease}
.compose-form #send-button:after{content:"⌄";font-size:12px}
.compose-form #send-button:hover{background:#dfeaff}.compose-form #send-button:active{transform:translateY(1px)}
.compose-hint{display:none}
.compose-panel{position:absolute;left:14px;bottom:calc(100% - 2px);z-index:20;width:min(340px,calc(100% - 28px));max-height:280px;overflow:auto;padding:12px;border:1px solid #e8eaf0;border-radius:12px;background:#fff;box-shadow:0 8px 28px rgba(34,44,70,.14);color:#384255}
.compose-panel[hidden]{display:none!important}
.compose-panel-title{margin:0 0 10px;color:#7b8494;font-size:11px;font-weight:600}
.compose-emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px}
.compose-emoji{display:flex;align-items:center;justify-content:center;min-width:0;height:34px;padding:0;border:0;border-radius:7px;background:transparent;font-size:22px;cursor:pointer}
.compose-emoji:hover{background:#f2f4f8}
.compose-more-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.compose-more-item{display:flex;align-items:center;gap:8px;min-height:38px;padding:7px 9px;border:1px solid #eceef3;border-radius:8px;background:#fafbfc;color:#8a91a0;font-size:12px}
.compose-more-item:before{content:"";width:7px;height:7px;border-radius:50%;background:#c6cbd5;flex:none}
.compose-voice-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:132px;color:#9299a8;font-size:12px}
.compose-voice-icon{display:flex;align-items:center;justify-content:center;width:68px;height:68px;border:4px solid #dce7fa;border-radius:50%;background:#edf3ff;color:#7d9ac8}
.compose-voice-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Own account page. */
.profile-pane{grid-column:3;grid-row:1;display:none;min-width:0;min-height:0;overflow:auto;padding:28px clamp(20px,3vw,46px);background:var(--canvas)}
.profile-pane>*{width:100%;max-width:760px}
.profile-top{padding:0 0 16px}.profile-top .eyebrow{color:#9aa3b3;font-size:9px;font-weight:800;letter-spacing:1.7px}
.profile-top h1{margin:5px 0 4px;color:#252b38;font-size:22px;font-weight:700}.profile-top p{color:#929aaa;font-size:11px}
.profile-card{display:flex;align-items:center;gap:13px;padding:16px;border:1px solid #ecebf1;border-radius:12px;background:#fff;box-shadow:0 2px 8px rgba(39,53,91,.025)}
.profile-avatar{display:grid;place-items:center;flex:none;width:50px;height:50px;border:1px solid #e5ebfb;border-radius:10px;background:#edf2ff;color:#3478f6;font-size:20px;font-weight:750}
.profile-main{display:flex;flex:1;flex-direction:column;gap:4px;min-width:0}.profile-main strong{overflow:hidden;color:#252b38;font-size:14px;text-overflow:ellipsis;white-space:nowrap}.profile-main span{color:#929aaa;font-size:11px}
.profile-status{padding:5px 9px;border-radius:20px;background:#eaf8f1;color:#26966c;font-size:10px}
.profile-section{margin-top:12px;padding:14px 16px;border:1px solid #ecebf1;border-radius:12px;background:#fff}.profile-section-title{margin-bottom:5px;color:#596579;font-size:12px;font-weight:700}
.profile-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #f0eff4;color:#929aaa;font-size:11px}.profile-row:last-child{border-bottom:0}.profile-row strong{max-width:65%;overflow-wrap:anywhere;color:#344056;font-size:11px;font-weight:650;text-align:right}
.status-normal{color:#26966c!important}.profile-tip{margin-top:12px;padding:12px 14px;border:1px solid #e7ecf8;border-radius:10px;background:#f0f4ff;color:#7384a7;font-size:11px;line-height:1.75}
.profile-logout{width:100%;height:43px;margin-top:14px;border:1px solid #f0dfe2;border-radius:10px;background:#fff;color:#d35b63;font-size:12px;font-weight:650}
.profile-quick-settings{display:none}
.profile-menu-card{overflow:hidden;border:1px solid #eeedf3;border-radius:14px;background:#fff}
.profile-menu-row{display:flex;align-items:center;gap:10px;min-height:56px;padding:0 15px;border-bottom:1px solid #ecebf0;color:#252a35;font-size:14px}
.profile-menu-row:last-child{border-bottom:0}
.profile-menu-row strong{margin-left:auto;max-width:58%;overflow:hidden;color:#9297a1;font-size:12px;font-weight:450;text-overflow:ellipsis;white-space:nowrap}
.profile-menu-row svg{width:15px;height:15px;flex:none;fill:none;stroke:#a7aab2;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.mobile-tabs{display:none}

@media(min-width:761px){body.in-profile #member-app .chat-pane{display:none!important}body.in-profile #member-app .profile-pane{display:flex!important;flex-direction:column;min-width:0;min-height:0}}
@media(min-width:761px) and (max-width:1280px){:root{--rail-width:56px;--list-width:270px}.list-top{height:50px;padding-left:16px}.group-row{min-height:54px}.group-icon{width:36px;height:36px}.messages{padding:12px 20px}.compose{min-height:160px}}
@media(max-width:980px) and (min-width:761px){.login-screen{padding:28px}.login-layout{grid-template-columns:minmax(0,1fr) minmax(320px,380px);gap:34px;width:min(820px,100%)}.login-copy h2{font-size:40px}}

/* Mobile page: native-feeling list and full-screen group conversation. */
@media(max-width:760px){
  html,body{width:100%;height:100%;min-height:100%;overflow:hidden;overscroll-behavior:none}
  .login-screen{display:flex;align-items:flex-start;justify-content:center;min-height:100vh;min-height:100dvh;padding:72px 28px calc(24px + env(safe-area-inset-bottom));overflow:auto;background:#f6f5fc}
  .login-layout{display:block;width:min(430px,100%);margin:0 auto}.login-copy{display:none}
  .login-box{width:100%;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
  .login-box h1{margin:0 0 40px;color:#191a1e;font-size:30px;font-weight:750;text-align:center}
  .login-box label+label{margin-top:16px}
  .login-box input{height:50px;padding:0 16px;border:1px solid #e5e5e9;border-radius:12px;background:#fff;font-size:16px}
  .login-box button{height:50px;margin-top:22px;border-radius:12px;background:#9bcdf6;font-size:16px}
  .error{min-height:18px;text-align:center}.tiny,.admin-entry{display:none}
  #member-app.app{display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;min-height:0;max-height:100dvh;overflow:hidden;background:var(--canvas)}
  #member-app .rail{display:none!important}
  #member-app .list-pane{display:flex;flex:1 1 auto;min-height:0;border:0;background:#fff}
  #member-app .list-top{height:52px;min-height:52px;padding:calc(7px + env(safe-area-inset-top)) 16px 5px;background:var(--canvas)}
  #member-app .list-heading{justify-content:center}#member-app .list-heading>div{width:100%;text-align:center}
  #member-app .list-heading h1{margin:0;color:#25252b;font-size:17px;font-weight:600;line-height:1.4;letter-spacing:0}
  #member-app .search-wrap{padding:7px 15px 10px;background:var(--canvas)}
  #member-app .search-icon{left:28px;top:15px}
  #member-app .search-wrap input{height:40px;padding-left:35px;border:0;border-radius:7px;background:#fff;font-size:16px;box-shadow:none}
  #member-app .list-tabs{display:none}
  #member-app .group-list{padding:0 0 8px;background:#fff}
  #member-app .group-row{gap:10px;min-height:72px;padding:9px 15px;border:0;border-bottom:1px solid #f0f0f2;background:#fff}
  #member-app .group-row:hover,#member-app .group-row.chosen{background:#fff}
  #member-app .group-icon{width:48px;height:48px;border-radius:4px}
  #member-app .group-info strong{font-size:15px;font-weight:550;line-height:1.35}
  #member-app .group-info small{margin-top:5px;font-size:12px;color:#8d929c}
  #member-app .member-foot{display:none}
  #member-app .mobile-tabs{display:flex;flex:0 0 auto;align-items:center;justify-content:space-around;height:58px;padding:4px 12px calc(4px + env(safe-area-inset-bottom));border-top:1px solid #e8e7ed;background:#f7f6fc}
  #member-app .mobile-tabs button{display:grid;place-items:center;gap:2px;min-width:70px;padding:4px 12px;border:0;background:transparent;color:#888c96;font-size:11px;transition:color .16s ease,transform .16s ease}
  #member-app .mobile-tabs button.selected{color:#3478f6;font-weight:650}
  #member-app .mobile-tabs svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  #member-app .chat-pane{display:none;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background:var(--canvas)}
  #member-app .profile-pane{display:none;flex:1 1 auto;min-height:0;overflow:auto;padding:0 18px calc(24px + env(safe-area-inset-bottom));background:#f5f4fb;-webkit-overflow-scrolling:touch}
  #member-app .profile-top{display:flex;flex:0 0 64px;align-items:center;justify-content:center;height:64px;padding:calc(16px + env(safe-area-inset-top)) 2px 0;text-align:center}
  #member-app .profile-top .eyebrow,#member-app .profile-top p{display:none}#member-app .profile-top h1{margin:0;color:#20232a;font-size:18px;font-weight:600;line-height:26px}
  #member-app .profile-card{display:flex;flex:0 0 auto;align-items:center;gap:15px;margin:0;padding:19px 4px 16px;border:0;border-radius:0;background:transparent;box-shadow:none}
  #member-app .profile-avatar{width:64px;height:64px;border:0;border-radius:8px;background:#e7eafa;color:#6685c5;font-size:25px}
  #member-app .profile-main{gap:6px}
  #member-app .profile-main strong{color:#25252b;font-size:18px;font-weight:600}
  #member-app .profile-main span{color:#8e929d;font-size:13px}
  #member-app .profile-status{display:none}
  #member-app .profile-section,#member-app .profile-tip{display:none}
  #member-app .profile-quick-settings{display:flex;flex:0 0 auto;flex-direction:column;gap:16px}
  #member-app .profile-menu-card{border:0;border-radius:14px;background:#fff;box-shadow:none}
  #member-app .profile-menu-row{min-height:56px;padding:0 16px;border-bottom:1px solid #e9e8ee;font-size:15px}
  #member-app .profile-menu-row strong{font-size:12px;color:#9296a0}
  #member-app .profile-menu-row svg{width:15px;height:15px}
  #member-app .profile-logout{flex:0 0 48px;height:48px;margin:24px 0 0;border:0;border-radius:13px;background:#fff;color:#d85e68;font-size:15px;font-weight:500}
  body.in-chat{position:relative;width:100%;height:100%;overflow:hidden;background:var(--canvas)}
  body.in-chat #member-app{position:fixed!important;top:var(--chat-vv-top,0px)!important;left:0!important;right:0!important;display:flex!important;flex-direction:column!important;width:100%!important;height:var(--chat-vv-height,100dvh)!important;min-height:0!important;max-height:none!important;margin:0!important;padding:0!important;overflow:hidden!important;z-index:10}
  body.in-chat #member-app .rail,body.in-chat #member-app .list-pane,body.in-chat #member-app .mobile-tabs{display:none!important}
  body.in-chat #member-app .chat-pane{position:relative!important;display:flex!important;flex:1 1 0!important;flex-direction:column!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;max-height:100%!important;overflow:hidden!important}
  body.in-chat #member-app .chat-header{position:relative!important;display:flex!important;flex:0 0 auto!important;justify-content:center!important;gap:0!important;height:60px;min-height:60px;padding:calc(8px + env(safe-area-inset-top)) 48px 8px!important;border-bottom:1px solid #e8e7ed;background:#f8f7fc;box-shadow:none}
  body.in-chat #member-app .chat-header .back{position:absolute;left:8px;top:50%;display:grid;place-items:center;width:36px;height:40px;padding:0;transform:translateY(-50%);border:0;background:transparent;color:#20232b;font-size:29px;line-height:1}
  body.in-chat #member-app .chat-header-spacer,body.in-chat #member-app .chat-header-label{display:none!important}
  body.in-chat #member-app .chat-avatar{display:grid!important;width:18px;height:18px;margin-right:6px;font-size:8px}
  body.in-chat #member-app .chat-heading{display:flex;align-items:center;justify-content:center;gap:0;width:auto}
  body.in-chat #member-app .chat-heading{position:static;width:100%;min-width:0;text-align:center}
  body.in-chat #member-app .chat-heading h2{font-size:17px;font-weight:600;text-align:center}
  body.in-chat #member-app .chat-heading p:not(.connection-status){display:none!important}
  body.in-chat #member-app .chat-heading .connection-status{position:absolute;left:50%;top:100%;display:block;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  body.in-chat #member-app .chat-header-more{position:absolute;right:8px;top:50%;width:36px;height:40px;transform:translateY(-50%)}
  body.in-chat #member-app .chat-header-more svg{width:20px;height:20px}
  body.in-chat #member-app .messages{display:flex;flex:1 1 auto;min-width:0;min-height:0;height:auto;max-height:none;overflow-x:hidden;overflow-y:auto;padding:20px 18px 18px 14px;background:#f5f4fb;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;touch-action:pan-y}
  body.in-chat #member-app .msg-row{gap:8px;margin-bottom:18px}
  body.in-chat #member-app .msg-avatar{width:40px;height:40px;margin-top:1px;border-radius:5px}
  body.in-chat #member-app .msg-content{max-width:min(calc(100% - 52px),240px);gap:10px}
  body.in-chat #member-app .msg-alias{font-size:11px;color:#92959d}
  body.in-chat #member-app .msg-bubble{padding:9px 11px;border-radius:5px 12px 12px 12px;background:#fff;font-size:16px;line-height:1.42;box-shadow:none}
  body.in-chat #member-app .msg-row.mine .msg-bubble{border-radius:12px 5px 12px 12px;background:#3478f6;color:#fff}
  body.in-chat #member-app .msg-status{margin-top:-6px;font-size:9px;color:#9b9da5}
  body.in-chat #member-app .compose{position:relative!important;display:flex!important;flex:0 0 auto!important;flex-direction:row!important;align-items:center!important;grid-row:auto!important;width:100%!important;min-width:0!important;min-height:64px!important;height:auto!important;margin:0!important;padding:7px 14px calc(7px + env(safe-area-inset-bottom))!important;border-top:1px solid #e8e7ed;background:#fbfbfd!important;box-shadow:none;z-index:5}
  body.in-chat #member-app .compose-tools{display:none!important}
  body.in-chat #member-app .compose-form{display:flex!important;align-items:center!important;gap:12px!important;flex:1 1 auto!important;width:100%!important;min-width:0!important;min-height:50px!important;height:auto!important;margin:0!important;padding:0!important}
  body.in-chat #member-app .compose-form #message-text{display:block!important;flex:1 1 auto!important;width:auto!important;max-width:none!important;min-width:0!important;height:40px;min-height:40px!important;max-height:96px!important;overflow-y:auto!important;resize:none!important;padding:9px 11px!important;border:0!important;border-radius:7px!important;outline:none;background:#fff!important;color:#293448!important;font-family:inherit;font-size:16px!important;line-height:1.35!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;-webkit-appearance:none;appearance:none;transform:none;touch-action:manipulation;box-shadow:none}
  body.in-chat #member-app .compose-form #message-text:focus{border:0!important;background:#fff!important;box-shadow:0 0 0 1px #e4e6ed!important}
  body.in-chat #member-app .compose-mobile-tool{display:inline-flex;align-items:center;justify-content:center;flex:0 0 28px;width:28px;height:32px;padding:0;border:0;background:transparent;color:#30343b}
  body.in-chat #member-app .compose-mobile-tool svg{display:block;width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  body.in-chat #member-app .compose-mobile-tool:disabled{opacity:.9;cursor:not-allowed}
  body.in-chat #member-app .compose-mobile-tool .voice{width:28px;height:28px}
  body.in-chat #member-app .compose-mobile-actions{display:flex!important;align-items:center;justify-content:flex-end;gap:13px;flex:0 0 auto;margin-left:auto}
  body.in-chat #member-app .compose-mobile-actions .compose-mobile-tool{flex:0 0 28px}
  body.in-chat #member-app .compose-form #send-button{display:none!important;min-width:52px;height:34px;margin:0;padding:0 10px;border-radius:6px;background:#3478f6;color:#fff;font-size:13px}
  body.in-chat #member-app .compose-form.has-text #send-button{display:flex!important}
  body.in-chat #member-app .compose-form.has-text .compose-more{display:none!important}
  body.in-chat #member-app .compose-panel{left:auto;right:0;bottom:calc(100% + 8px);width:min(340px,calc(100vw - 28px));max-height:min(280px,42vh);padding:12px;border-radius:12px}
  body.in-chat #member-app .compose[data-panel-kind="emoji"],
  body.in-chat #member-app .compose[data-panel-kind="voice"]{flex-direction:column!important;align-items:stretch!important;gap:0!important}
  body.in-chat #member-app .compose-panel[data-kind="emoji"],
  body.in-chat #member-app .compose-panel[data-kind="voice"]{position:static!important;order:2;flex:0 0 auto;width:100%;max-width:none;max-height:min(260px,38vh);margin:7px 0 0;padding:10px 8px calc(8px + env(safe-area-inset-bottom));border:0;border-top:1px solid #eceaf3;border-radius:0;background:#f7f6fc;box-shadow:none}
  body.in-chat #member-app .compose-panel[data-kind="more"]{right:14px;bottom:calc(100% + 8px)}
  body.in-chat #member-app .compose-panel[data-kind="emoji"] .compose-panel-title,
  body.in-chat #member-app .compose-panel[data-kind="voice"] .compose-panel-title{padding:0 5px}
  body.in-chat #member-app .compose-voice-preview{min-height:150px}
  body.in-chat #member-app .compose-emoji-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
  body.in-chat #member-app .compose-emoji{height:36px;font-size:23px}
  body.in-chat #member-app .compose-more-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.keyboard-open #member-app .compose{padding-bottom:7px!important}
  body.keyboard-open #member-app .chat-header{padding-top:8px!important}
  body.in-profile #member-app .list-pane,body.in-profile #member-app .chat-pane{display:none!important}
  body.in-profile #member-app .profile-pane{display:flex!important;flex-direction:column;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch}
  body.in-profile #member-app .mobile-tabs{display:flex!important}
  @supports (-webkit-touch-callout:none){input,textarea,select,#message-text{font-size:16px!important}}
}
@media(max-height:520px) and (max-width:760px){.login-screen{padding-top:32px;padding-bottom:18px}.login-box h1{margin-bottom:24px}.login-box label+label{margin-top:10px}.login-box button{margin-top:14px}}
@media(hover:hover) and (pointer:fine){.rail-btn:hover{transform:translateY(-1px)}.group-row:hover{background:#f7f8fb}.msg-bubble:hover{box-shadow:0 2px 8px rgba(33,45,76,.06)}}
:where(button,input,textarea):focus-visible{outline:2px solid rgba(52,120,246,.5);outline-offset:2px}
@keyframes message-arrive{from{opacity:.75;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
.msg-row{animation:message-arrive .16s ease-out both}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* V1.1.20: reference-aligned chat header, accessible group info popover and desktop tool targets. */
.chat-header{position:relative;z-index:20;overflow:visible}
.chat-heading h2{display:flex;align-items:center;gap:6px;min-width:0}
#group-title{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.group-member-count{flex:none;color:#9297a2;font-size:11px;font-weight:500;letter-spacing:0}
.group-member-count[hidden]{display:none!important}
.chat-header-more{appearance:none;padding:0;border:0;border-radius:9px;background:transparent;color:#4f535d;cursor:pointer;transition:background .16s ease,color .16s ease}
.chat-header-more:hover:not(:disabled){background:#f1f2f6;color:#20232b}
.chat-header-more:active:not(:disabled){background:#e9ebf1}
.chat-header-more:disabled{opacity:.38;cursor:not-allowed}
.chat-header-more[aria-expanded="true"]{background:#f0f1f6;color:#30343d}
.chat-header-more svg{display:block;fill:currentColor}
.chat-info-panel{position:absolute;top:calc(100% + 7px);right:14px;z-index:50;width:min(320px,calc(100vw - 28px));max-height:min(70vh,520px);overflow:auto;padding:15px 16px 13px;border:1px solid #ececf1;border-radius:13px;background:#fff;box-shadow:0 12px 34px rgba(33,39,56,.16);color:#30343d}
.chat-info-panel[hidden]{display:none!important}
.chat-info-panel:not([hidden]){animation:chat-info-pop .14s ease-out both}
.chat-info-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px}
.chat-info-head strong{font-size:14px;font-weight:650;color:#252a34}
.chat-info-head button{display:grid;place-items:center;flex:none;width:28px;height:28px;padding:0;border:0;border-radius:7px;background:transparent;color:#858b97;cursor:pointer}
.chat-info-head button:hover{background:#f2f3f6;color:#30343d}
.chat-info-head button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.chat-info-row{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px;align-items:start;padding:9px 0;border-top:1px solid #f0f1f4;font-size:12px;line-height:1.5}
.chat-info-row>span,.chat-info-announcement>span{color:#9298a4}
.chat-info-row strong{min-width:0;overflow-wrap:anywhere;color:#333946;font-size:12px;font-weight:550;text-align:right}
.chat-info-announcement{padding:10px 0 2px;border-top:1px solid #f0f1f4}
.chat-info-announcement>span{font-size:11px}
.chat-info-announcement p{max-height:120px;overflow:auto;margin:6px 0 0;color:#454c59;font-size:12px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-info-footnote{margin:10px 0 0;padding-top:9px;border-top:1px solid #f0f1f4;color:#a0a5ae;font-size:10px;line-height:1.55}
.compose-tools{gap:8px;height:30px}
.compose-tool{width:28px;height:28px;border-radius:7px}
.compose-tool svg{width:18px;height:18px}
.compose-tool[aria-expanded="true"]{background:#f0f2f7;color:#3f4858}
@media(min-width:761px){
  .chat-header-more{width:32px;height:32px}
  .chat-info-panel{right:12px}
}
@media(max-width:760px){
  body.in-chat #member-app .chat-avatar{display:none!important}
  body.in-chat #member-app .chat-heading{position:static;width:100%;min-width:0;text-align:center}
  body.in-chat #member-app .chat-heading h2{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;max-width:100%;font-size:17px;font-weight:600;text-align:center}
  body.in-chat #member-app #group-title{max-width:calc(100% - 46px)}
  body.in-chat #member-app .group-member-count{font-size:13px;font-weight:500}
  body.in-chat #member-app .chat-header-more{right:8px;top:50%;display:grid;place-items:center;width:36px;height:40px;padding:0;transform:translateY(-50%)}
  body.in-chat #member-app .chat-header-more svg{width:20px;height:20px}
  body.in-chat #member-app .chat-info-panel{top:calc(100% + 6px);right:10px;width:min(300px,calc(100vw - 20px));max-height:min(68vh,500px);padding:14px 15px 12px;border-radius:13px}
  body.in-chat #member-app .chat-info-row{grid-template-columns:88px minmax(0,1fr)}
}

@keyframes chat-info-pop{from{opacity:0;transform:translateY(-4px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}

.compose-tool .compose-at{display:block;color:currentColor;font-size:19px;font-weight:500;line-height:1}


/* V1.1.21: private image messages, upload affordances and authenticated lightbox. */
.msg-bubble.msg-image-bubble,
.msg-row.mine .msg-bubble.msg-image-bubble,
body.in-chat #member-app .msg-bubble.msg-image-bubble,
body.in-chat #member-app .msg-row.mine .msg-bubble.msg-image-bubble{
  display:block;width:fit-content;max-width:min(100%,148px);padding:0!important;border-radius:6px;background:transparent!important;color:inherit!important;box-shadow:none!important;overflow:hidden
}
.msg-image{display:block;width:auto;max-width:min(100%,148px);max-height:240px;border-radius:6px;object-fit:contain;background:#fff;cursor:zoom-in}
.msg-image-unavailable{display:block;padding:9px 12px;border-radius:9px;background:#fff;color:#8c929d;font-size:12px;line-height:1.5}
.msg-row.mine .msg-image-unavailable{background:#fff;color:#8c929d}
.msg-status[role="button"]{cursor:pointer;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px}
.msg-status[role="button"]:focus-visible{outline:2px solid rgba(52,120,246,.45);outline-offset:3px;border-radius:3px}
.compose-more-action{width:100%;font:inherit;text-align:left;color:#4d648d;background:#f4f7ff;border-color:#dfe8fa}
.compose-more-action:before{background:#6c93dc}
.compose-more-action:hover:not(:disabled){background:#eaf1ff;border-color:#cbdcf8}
.compose-more-action:disabled{color:#a2a7b1;background:#fafbfc}
.compose-more-item.is-unavailable{cursor:default;opacity:.7}
.image-lightbox{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:calc(24px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom));background:rgba(13,16,24,.94);backdrop-filter:blur(5px)}
.image-lightbox[hidden]{display:none!important}
.image-lightbox>img{display:block;max-width:min(94vw,1500px);max-height:90dvh;object-fit:contain;border-radius:5px;box-shadow:0 12px 48px rgba(0,0,0,.28)}
.image-lightbox-close{position:absolute;top:calc(14px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(255,255,255,.1);color:#fff}
.image-lightbox-close:hover{background:rgba(255,255,255,.2)}
.image-lightbox-close svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
@media(max-width:760px){
  body.in-chat #member-app .msg-image{max-height:240px;max-width:min(100%,150px)}
  body.in-chat #member-app .msg-content{max-width:min(calc(100% - 52px),240px)}
  body.in-chat #member-app .compose-more-action{min-height:42px}
  .image-lightbox{padding:calc(54px + env(safe-area-inset-top)) 8px calc(20px + env(safe-area-inset-bottom))}
  .image-lightbox>img{max-width:96vw;max-height:86dvh}
  .image-lightbox-close{top:calc(8px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right));width:40px;height:40px}
}


/* V1.1.21.1 — reference-matched contacts navigation and list header. */
@media(min-width:761px){
  body.in-contacts #member-app .chat-pane,
  body.in-contacts #member-app .profile-pane{display:none!important}
  body.in-contacts #member-app.app{background:var(--canvas)}
  #member-app .contacts-list-view{display:flex}
  #member-app .contacts-list-view.hidden{display:none!important}
}
@media(max-width:760px){
  #member-app .contacts-list-view{display:flex;flex:1 1 auto;min-height:0;overflow:hidden;background:#fff}
  #member-app .contacts-list-view.hidden{display:none!important}
  #member-app .contacts-title-row{position:relative;display:flex;flex:none;align-items:center;justify-content:center;height:64px;min-height:64px;padding:calc(12px + env(safe-area-inset-top)) 52px 0;background:var(--canvas)}
  #member-app .contacts-title-row h1{margin:0;color:#25252b;font-size:18px;font-weight:600;line-height:1.35}
  #member-app .contacts-title-row .contacts-add{position:absolute;right:12px;top:calc(10px + env(safe-area-inset-top));width:34px;height:34px}
  #member-app .contacts-title-row .contacts-add svg{width:25px;height:25px}
  #member-app .contacts-search-row{padding:6px 15px 17px;background:var(--canvas)}
  #member-app .contacts-search svg{left:13px;width:17px;height:17px}
  #member-app .contacts-search input{height:40px;padding-left:39px;border-radius:7px;background:#fff;font-size:15px}
  #member-app .contacts-add-desktop{display:none}
  #member-app .contacts-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0 20px 12px;padding:4px;border-radius:9px;background:#eeedf3}
  #member-app .contacts-tabs button{height:31px;border-radius:7px;font-size:14px}
  #member-app .contacts-results{background:#fff}
  #member-app .contacts-empty{min-height:220px}
  body.in-contacts #member-app .chat-pane,
  body.in-contacts #member-app .profile-pane{display:none!important}
  body.in-contacts #member-app .list-pane{display:flex!important;flex:1 1 auto;min-height:0}
  body.in-contacts #member-app .mobile-tabs{display:flex!important}
  body.in-contacts #member-app .contacts-list-view{display:flex!important}
  body.in-contacts #member-app .contacts-list-view.hidden{display:none!important}
  body.in-contacts #member-app .list-top,
  body.in-contacts #member-app .search-wrap,
  body.in-contacts #member-app .list-tabs,
  body.in-contacts #member-app #group-list,
  body.in-contacts #member-app .member-foot{display:none!important}
}


/* V1.1.22: private self-avatar controls. No avatar is rendered in other members' messages. */
#member-app .rail-avatar{position:relative;overflow:hidden}
#member-app .rail-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
#member-app .rail-avatar img[hidden],#member-app .profile-avatar img[hidden]{display:none!important}
#member-app .profile-avatar{position:relative;display:grid;place-items:center;overflow:hidden;border:0;cursor:pointer;padding:0;font:inherit}
#member-app .profile-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
#member-app .profile-avatar .profile-avatar-edit{position:absolute;left:0;right:0;bottom:0;padding:4px 2px;background:rgba(20,26,43,.58);color:#fff;font-size:10px;line-height:1.2;opacity:0;transition:opacity .16s ease}
#member-app .profile-avatar:hover .profile-avatar-edit,#member-app .profile-avatar:focus-visible .profile-avatar-edit{opacity:1}
#member-app .profile-avatar:disabled{cursor:wait;opacity:.75}
@media(hover:none){#member-app .profile-avatar .profile-avatar-edit{opacity:1}}

#member-app .profile-avatar-feedback{margin:-6px 0 10px 64px;color:#6b82a8;font-size:12px;line-height:1.5}
#member-app .profile-avatar-feedback[hidden]{display:none!important}
@media(max-width:760px){#member-app .profile-avatar-feedback{margin:-6px 0 10px 4px}}


/* V1.1.23 polish: remove redundant avatar status, stabilize mobile composer and upgrade overall texture. */
#member-app.app{
  background:
    radial-gradient(1200px 540px at 18% -10%, rgba(123,162,255,.12), transparent 58%),
    radial-gradient(980px 520px at 110% 16%, rgba(214,181,255,.10), transparent 54%),
    linear-gradient(180deg,#fbfbfe 0%,#f4f5fb 100%);
}
#member-app .rail{
  background:linear-gradient(180deg,rgba(248,248,253,.96) 0%,rgba(241,242,249,.96) 100%);
  box-shadow:inset -1px 0 0 rgba(229,229,237,.9);
}
#member-app .rail-avatar,
#member-app .profile-avatar{
  box-shadow:0 10px 24px rgba(76,110,173,.12);
}
#member-app .list-pane,
#member-app .chat-pane,
#member-app .profile-pane{
  background:
    linear-gradient(180deg,rgba(255,255,255,.72) 0%,rgba(251,251,254,.96) 100%);
}
#member-app .list-top,
#member-app .chat-header{
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(140%) blur(16px);
  -webkit-backdrop-filter:saturate(140%) blur(16px);
}
#member-app .group-row,
#member-app .contacts-tabs,
#member-app .contacts-search,
#member-app .profile-card,
#member-app .profile-section,
#member-app .profile-menu-card,
#member-app .msg-bubble,
#member-app .compose,
#member-app .compose-panel,
#member-app .mobile-tabs{
  box-shadow:0 10px 30px rgba(37,52,86,.045);
}
#member-app .group-row{
  border:1px solid rgba(236,237,243,.75);
  border-radius:16px;
  margin:0 10px 8px;
  background:rgba(255,255,255,.76);
}
#member-app .group-row:hover,
#member-app .group-row.chosen{
  background:linear-gradient(180deg,#ffffff 0%,#f7f9ff 100%);
  box-shadow:0 12px 26px rgba(52,120,246,.09);
}
#member-app .contacts-search{
  border:1px solid rgba(231,233,241,.92);
  background:rgba(255,255,255,.94);
}
#member-app .contacts-tabs{
  border:1px solid rgba(232,233,240,.96);
  background:rgba(255,255,255,.68);
}
#member-app .contacts-tab.active,
#member-app .list-tab.active{
  box-shadow:0 8px 20px rgba(61,110,246,.14);
}
#member-app .profile-top h1{
  letter-spacing:.4px;
}
#member-app .profile-card{
  position:relative;
  padding:18px 18px 18px 16px;
  border:1px solid rgba(233,235,242,.9);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,251,255,.95));
  box-shadow:0 16px 40px rgba(43,62,100,.06);
}
#member-app .profile-main strong{
  font-size:15px;
  letter-spacing:.2px;
}
#member-app .profile-main span{
  font-size:12px;
}
#member-app .profile-section{
  border-radius:18px;
  border-color:rgba(234,236,243,.96);
  background:rgba(255,255,255,.94);
}
#member-app .profile-row{
  min-height:48px;
}
#member-app .profile-tip{
  border:1px solid rgba(224,231,247,.9);
  border-radius:14px;
  background:linear-gradient(180deg,#f8fbff,#f1f6ff);
}
#member-app .profile-logout{
  border-radius:16px;
  box-shadow:0 12px 24px rgba(211,91,99,.08);
}
#member-app .msg-bubble{
  border:1px solid rgba(233,236,243,.95);
  border-radius:18px;
  box-shadow:0 10px 26px rgba(39,56,91,.055);
}
#member-app .msg-row.mine .msg-bubble{
  background:linear-gradient(180deg,#e7f0ff 0%,#deebff 100%);
  border-color:rgba(198,217,255,.95);
  box-shadow:0 12px 28px rgba(52,120,246,.12);
}
#member-app .compose{
  border-top:1px solid rgba(231,233,240,.9);
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(145%) blur(14px);
  -webkit-backdrop-filter:saturate(145%) blur(14px);
}
#member-app .compose-form textarea{
  border:1px solid rgba(227,230,238,.98);
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff,#fbfcfe);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 6px 18px rgba(45,62,99,.04);
}
#member-app .compose-form #send-button{
  min-width:84px;
  height:36px;
  border-radius:12px;
  box-shadow:0 10px 24px rgba(52,120,246,.2);
  background:linear-gradient(180deg,#4b8dff 0%,#3478f6 100%);
}
#member-app .compose-form #send-button:hover{
  background:linear-gradient(180deg,#5a97ff 0%,#3f80fa 100%);
}
#member-app .compose-form #send-button:after{
  margin-left:4px;
  opacity:.82;
}
#member-app .profile-avatar-feedback{
  display:none!important;
}
#member-app .profile-avatar .profile-avatar-edit{
  padding:6px 2px;
  background:linear-gradient(180deg,rgba(23,30,47,.08),rgba(23,30,47,.58));
  font-size:11px;
  letter-spacing:.3px;
}
#member-app .mobile-tabs{
  background:rgba(249,249,253,.94);
  backdrop-filter:saturate(150%) blur(18px);
  -webkit-backdrop-filter:saturate(150%) blur(18px);
}
#member-app .contacts-empty{
  margin-top:44px;
}
#member-app .contacts-empty-icon{
  box-shadow:0 12px 28px rgba(79,113,170,.1);
}
@media(max-width:760px){
  #member-app.app{
    background:linear-gradient(180deg,#f5f5fb 0%,#f1f2f8 100%);
  }
  #member-app .list-top,
  #member-app .contacts-top,
  #member-app .chat-header,
  #member-app .profile-pane{
    background:transparent;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  #member-app .contacts-search,
  #member-app .contacts-tabs,
  #member-app .profile-card,
  #member-app .profile-section,
  #member-app .profile-menu-card,
  #member-app .mobile-tabs{
    box-shadow:none;
  }
  #member-app .profile-pane{
    padding:20px 18px 96px;
  }
  #member-app .profile-card{
    border-radius:22px;
    padding:18px 16px;
  }
  #member-app .profile-section,
  #member-app .profile-menu-card{
    border-radius:20px;
  }
  body.in-chat #member-app .compose{
    padding:8px 12px calc(8px + env(safe-area-inset-bottom))!important;
    background:rgba(251,251,253,.96)!important;
  }
  body.in-chat #member-app .compose-form{
    display:grid!important;
    grid-template-columns:32px minmax(0,1fr) auto auto!important;
    align-items:end!important;
    gap:10px!important;
    min-height:0!important;
    padding:0!important;
  }
  body.in-chat #member-app .compose-form #message-text{
    min-height:42px!important;
    max-height:104px!important;
    padding:10px 14px!important;
    line-height:1.45!important;
    border-radius:18px!important;
  }
  body.in-chat #member-app .compose-mobile-tool{
    align-self:end!important;
    margin-bottom:4px!important;
  }
  body.in-chat #member-app .compose-mobile-actions{
    display:flex!important;
    align-items:flex-end!important;
    justify-content:flex-end!important;
    gap:10px!important;
    margin:0!important;
    align-self:end!important;
    padding-bottom:4px!important;
  }
  body.in-chat #member-app .compose-form #send-button{
    display:none!important;
    align-self:end!important;
    min-width:72px!important;
    height:38px!important;
    margin:0 0 3px!important;
    padding:0 14px!important;
    border-radius:12px!important;
    font-weight:700!important;
    font-size:13px!important;
  }
  body.in-chat #member-app .compose-form.has-text #send-button{
    display:flex!important;
  }
}


/* V1.1.25 WeChat-style mobile composer: emoji and plus stay visible; keyboard Enter sends. */
@media (max-width:760px){
  body.in-chat #member-app #send-form{
    display:grid!important;
    grid-template-columns:32px minmax(0,1fr) 72px!important;
    grid-template-areas:"voice input actions"!important;
    align-items:end!important;
    justify-content:stretch!important;
    column-gap:10px!important;
    row-gap:0!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    flex:none!important;
    overflow:visible!important;
  }
  body.in-chat #member-app #send-form > .compose-voice{
    grid-area:voice!important;
    display:inline-flex!important;
    align-self:end!important;
    width:32px!important;
    min-width:32px!important;
    margin:0 0 3px!important;
  }
  body.in-chat #member-app #send-form > #message-text{
    grid-area:input!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    align-self:end!important;
    box-sizing:border-box!important;
  }
  body.in-chat #member-app #send-form > .compose-mobile-actions{
    grid-area:actions!important;
    display:flex!important;
    width:72px!important;
    min-width:72px!important;
    align-self:end!important;
    justify-content:flex-end!important;
    align-items:flex-end!important;
    gap:8px!important;
    margin:0 0 3px!important;
    padding:0!important;
  }
  body.in-chat #member-app #send-form > #send-button{
    display:none!important;
  }
}

@media (max-width:760px){
  body.in-chat #member-app .compose-mobile-actions .compose-mobile-tool,
  body.in-chat #member-app .compose-mobile-actions .compose-more{
    display:inline-flex!important;
    visibility:visible!important;
    opacity:1!important;
  }
  body.in-chat #member-app .compose-form #send-button,
  body.in-chat #member-app .compose-form.has-text #send-button{
    display:none!important;
  }
}

@media (max-width:760px){
  body.in-chat #member-app .compose-form.has-text .compose-mobile-actions .compose-more{
    display:inline-flex!important;
    visibility:visible!important;
    opacity:1!important;
  }
}


/* V1.1.27 — neutral, readable message bubbles on both sides. */
#member-app .msg-bubble:not(.msg-image-bubble){
  border:1px solid rgba(228,232,240,.96);
  border-radius:11px;
  background:#fff;
  color:#282d36;
  box-shadow:0 2px 7px rgba(38,49,75,.045);
}
#member-app .msg-row.mine .msg-bubble:not(.msg-image-bubble),
body.in-chat #member-app .msg-row.mine .msg-bubble:not(.msg-image-bubble){
  border:1px solid rgba(228,232,240,.96)!important;
  border-radius:11px 6px 11px 11px!important;
  background:#fff!important;
  color:#282d36!important;
  box-shadow:0 2px 7px rgba(38,49,75,.045)!important;
  -webkit-text-fill-color:#282d36!important;
}
#member-app .msg-row.mine .msg-alias,
#member-app .msg-row.mine .msg-status{
  color:#9299a6;
}
@media(max-width:760px){
  #member-app .msg-bubble:not(.msg-image-bubble){
    border-radius:12px;
    padding:9px 12px;
    font-size:15px;
    line-height:1.45;
    box-shadow:0 1px 4px rgba(38,49,75,.035);
  }
  #member-app .msg-row.mine .msg-bubble:not(.msg-image-bubble),
  body.in-chat #member-app .msg-row.mine .msg-bubble:not(.msg-image-bubble){
    border-radius:12px 6px 12px 12px!important;
    background:#fff!important;
    color:#282d36!important;
    -webkit-text-fill-color:#282d36!important;
    box-shadow:0 1px 4px rgba(38,49,75,.035)!important;
  }
}


/* V1.1.27 — restore the reference-like light desktop composer and compact mobile field. */
@media(min-width:761px){
  #member-app .compose{
    min-height:184px;
    padding:15px 16px 12px;
    border-top:1px solid #e8e7ed;
    background:#fff;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  #member-app .compose-form{
    align-items:stretch;
    min-height:112px;
    padding-top:5px;
  }
  #member-app .compose-form textarea{
    height:108px;
    min-height:96px;
    max-height:112px;
    padding:7px 2px 8px;
    border:0;
    border-radius:0;
    outline:none;
    background:transparent;
    box-shadow:none;
    font-size:13px;
    line-height:1.55;
  }
  #member-app .compose-form textarea:focus{
    border:0;
    box-shadow:none;
  }
  #member-app .compose-form #send-button{
    min-width:78px;
    height:28px;
    margin:0 0 1px;
    padding:0 12px;
    border:0;
    border-radius:5px;
    background:#eaf2ff;
    color:#7ba3eb;
    box-shadow:none;
    font-size:11px;
  }
  #member-app .compose-form #send-button:hover{
    background:#dfeaff;
  }
}
@media(max-width:760px){
  body.in-chat #member-app .compose-form #message-text{
    border-radius:8px!important;
    background:#fff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 3px rgba(45,62,99,.035)!important;
  }
}


/* V1.1.28: valid text => clear, accessible action state; no layout geometry changes. */
#member-form #member-login-submit{
  background:#b6d6f4;
  color:#f8fbff;
  box-shadow:0 4px 10px rgba(76,132,190,.08);
  transition:background-color .18s ease,box-shadow .18s ease,transform .14s ease;
}
#member-form.is-ready #member-login-submit:not(:disabled){
  background:#3478f6;
  color:#fff;
  box-shadow:0 7px 18px rgba(52,120,246,.24);
}
#member-form.is-ready #member-login-submit:hover:not(:disabled){
  background:#286be3;
  box-shadow:0 9px 21px rgba(52,120,246,.26);
}
#member-form #member-login-submit.is-busy{
  background:#7ca9ed;
  color:#fff;
  opacity:.86;
  cursor:progress;
}
#member-form #member-login-submit:focus-visible,
#member-app #send-button:focus-visible{
  outline:3px solid rgba(65,124,250,.27);
  outline-offset:3px;
}
@media(min-width:761px){
  #member-app .compose-form #send-button:not(:disabled){
    background:#eaf2ff;
    color:#7ba3eb;
    box-shadow:none;
  }
  #member-app .compose-form.can-send #send-button:not(:disabled){
    background:#3478f6;
    color:#fff;
    box-shadow:0 5px 15px rgba(52,120,246,.2);
  }
  #member-app .compose-form.can-send #send-button:hover:not(:disabled){
    background:#286be3;
    box-shadow:0 7px 17px rgba(52,120,246,.24);
  }
  #member-app .compose-form #send-button:disabled{
    background:#eef2f8;
    color:#9eabc0;
    opacity:1;
    cursor:default;
    box-shadow:none;
  }
}
@media(max-width:760px){
  /* The OS-drawn keyboard Enter key cannot be recolored by site CSS. */
  body.in-chat #member-app .compose-form.has-text #message-text{
    box-shadow:0 0 0 1px rgba(79,135,240,.28),0 2px 8px rgba(52,120,246,.05)!important;
  }
  body.in-chat #member-app .compose-form .compose-mobile-actions,
  body.in-chat #member-app .compose-form .compose-mobile-actions .compose-more{
    visibility:visible!important;
  }
}
@media(prefers-reduced-motion:reduce){
  #member-form #member-login-submit,
  #member-app #send-button{transition:none!important;}
}


/* V1.1.29: restore the reference's quiet, continuous list surface (no floating cards). */
#member-app .list-pane{background:#fff}
#member-app .group-list{background:#fff}
#member-app .group-row{
  position:relative;
  width:100%;
  min-height:64px;
  margin:0;
  padding:9px 12px;
  border:0;
  border-bottom:1px solid #f1f1f5;
  border-radius:0;
  background:#fff;
  box-shadow:none;
  transition:background-color .15s ease;
}
#member-app .group-row:hover{background:#f7f8fc;box-shadow:none}
#member-app .group-row.chosen{background:#edf3ff;box-shadow:none}
#member-app .group-row.chosen::before{
  position:absolute;left:0;top:9px;bottom:9px;width:3px;
  border-radius:0 3px 3px 0;background:#4a83ed;content:"";
}
#member-app .group-info strong{font-size:13px;font-weight:600;color:#292d36}
#member-app .group-info small{font-size:11px;color:#9499a4;line-height:1.5}
#member-app .search-wrap input{transition:background-color .15s ease,box-shadow .15s ease}
#member-app .group-row:focus-visible{z-index:1;outline:2px solid rgba(52,120,246,.55);outline-offset:-2px}
#member-app .messages{scrollbar-gutter:stable}
#member-app .msg-row.mine .msg-bubble:not(.msg-image-bubble),
#member-app .msg-row:not(.mine) .msg-bubble:not(.msg-image-bubble){
  color:#282d36;-webkit-text-fill-color:#282d36;
}
#member-app .msg-status.fail[role="button"]{
  color:#bd4d5c;text-decoration:underline;text-decoration-style:dotted;
  text-underline-offset:3px;cursor:pointer;
}
#member-app .msg-status.pending{color:#7d8ba3}
#member-app .compose-tool:not(:disabled):active,
#member-app .compose-mobile-tool:not(:disabled):active{transform:scale(.94)}
#member-app .compose-tool[aria-expanded="true"],
#member-app .compose-mobile-tool[aria-expanded="true"]{color:#3478f6}
@media(max-width:760px){
  #member-app .group-row{
    min-height:73px;
    margin:0;
    padding:10px 15px;
    border-bottom:1px solid #f0f0f3;
    border-radius:0;
    background:#fff;
    box-shadow:none;
  }
  #member-app .group-row:hover{background:#fff;box-shadow:none}
  #member-app .group-row:active,#member-app .group-row.chosen{background:#f5f7fe;box-shadow:none}
  #member-app .group-row.chosen::before{display:none}
  #member-app .group-info strong{font-size:15px;font-weight:550}
  #member-app .group-info small{font-size:12px}
  #member-app .messages{scrollbar-gutter:auto}
  body.in-chat #member-app .compose-mobile-tool{border-radius:50%;transition:color .13s ease,transform .13s ease}
  body.in-chat #member-app .compose-form.has-text .compose-mobile-actions .compose-more{
    display:inline-flex!important;opacity:1!important;visibility:visible!important;
  }
}
@media(prefers-reduced-motion:reduce){
  #member-app .group-row,#member-app .compose-tool,#member-app .compose-mobile-tool{transition:none!important}
}


/* V1.1.30 — mobile keyboard and safe-area stability. No floating composer.
   The app uses --chat-vv-height set by the JS VisualViewport controller. */
@media(max-width:760px){
  body.in-chat #member-app .messages{
    overflow-anchor:auto;
    scrollbar-gutter:auto;
  }
  body.in-chat #member-app .compose{
    flex-shrink:0!important;
  }
  body.keyboard-open.in-chat #member-app .compose{
    padding-bottom:8px!important;
  }
  body.keyboard-open.in-chat #member-app .chat-header{
    padding-top:8px!important;
  }
}
/* Short split-screen and landscape keyboard: keep room for message content. */
@media(max-width:760px) and (max-height:480px){
  body.in-chat #member-app .chat-header{height:50px;min-height:50px}
  body.in-chat #member-app .messages{padding-top:10px;padding-bottom:9px}
  body.in-chat #member-app .compose{min-height:56px!important}
}

/* V1.1.32 — durable server-side unread counters, desktop and touch layouts. */
#member-app .group-row{display:flex;align-items:center;gap:10px}
#member-app .group-info{min-width:0;flex:1}
#member-app .group-trailing{flex:0 0 auto;align-self:stretch;min-width:42px;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-around;gap:4px;white-space:nowrap}
#member-app .group-time{font-size:10px;font-weight:400;color:#a0a4ad;line-height:1.3;font-variant-numeric:tabular-nums}
#member-app .unread-badge{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:18px;height:18px;padding:0 5px;border-radius:10px;background:#f4453f;color:#fff;font-size:11px;font-weight:600;line-height:1;letter-spacing:-.2px;box-shadow:0 1px 2px rgba(174,42,41,.1);font-variant-numeric:tabular-nums}
#member-app .group-row.has-unread .group-info strong{color:#1f2732}
#member-app .group-row .unread-badge:empty{display:none}
#member-app .nav-unread{position:absolute;top:1px;right:2px;display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:#f4453f;color:#fff;font-size:10px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1}
#member-app .nav-unread[hidden]{display:none!important}
#member-app .rail-btn,#member-app .mobile-tabs button{position:relative}
@media(max-width:760px){
  #member-app .group-row{gap:11px}
  #member-app .group-trailing{min-width:50px;justify-content:space-between;padding:5px 0 3px}
  #member-app .group-time{font-size:11px}
  #member-app .unread-badge{min-width:19px;height:19px;font-size:11px}
  #member-app .mobile-tabs .nav-unread{top:3px;right:calc(50% - 29px)}
}

/* V1.1.33: A conversation-free desktop is a real empty state, never a disabled editor. */
#member-app .chat-pane.is-empty .chat-header,
#member-app .chat-pane.is-empty .compose{display:none!important}
#member-app .chat-pane.is-empty .messages{display:flex!important;justify-content:center;align-items:center;padding:40px 25px;background:linear-gradient(145deg,#f7f7fb 0%,#f1f2f8 100%)}
#member-app .chat-pane.is-empty .placeholder{margin:auto;max-width:360px;padding:32px 22px}
#member-app .chat-pane.is-empty .placeholder-icon{width:62px;height:62px;margin-bottom:20px;border-radius:18px;font-size:29px;background:#eef2ff}
#member-app .chat-pane.is-empty .placeholder h3{font-size:17px;font-weight:650;letter-spacing:.1px}
#member-app .chat-pane.is-empty .placeholder p{font-size:12px;line-height:1.95}
#member-app .profile-setting-row,#member-app .chat-info-mute-row{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:57px;padding:12px 15px;border-bottom:1px solid #f1f1f5;color:#353943;font-size:13px;cursor:pointer}
#member-app .profile-setting-row>span,#member-app .chat-info-mute-row>span{display:flex;flex-direction:column;gap:4px;font-weight:550}
#member-app .profile-setting-row small,#member-app .chat-info-mute-row small{font-size:10px;font-weight:400;color:#9197a4}
#member-app .setting-toggle{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:43px;height:25px;margin:0;border:1px solid #d4d8e3;border-radius:20px;background:#d9dce5;cursor:pointer;transition:background .18s,border-color .18s}
#member-app .setting-toggle:before{content:'';position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:white;box-shadow:0 1px 4px #0002;transition:transform .18s}
#member-app .setting-toggle:checked{background:#3478f6;border-color:#3478f6}
#member-app .setting-toggle:checked:before{transform:translateX(18px)}
#member-app .setting-toggle:focus-visible{outline:3px solid #a9c8ff;outline-offset:3px}
#member-app .profile-setting-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 15px 11px;border-bottom:1px solid #f1f1f5}
#member-app #notification-sound-test{flex:none;padding:7px 12px;border:1px solid #dce6fb;border-radius:7px;background:#f1f6ff;color:#3478f6;font-size:11px}
#member-app #notification-sound-test:disabled{opacity:.5}
#member-app #notify-sound-status{color:#9298a2;font-size:10px;line-height:1.5;text-align:right}
#member-app .chat-info-mute-row{min-height:55px;padding:11px 0;margin-top:6px;border-top:1px solid #eef0f5}
#member-app .chat-info-mute-row small{font-size:10px}
@media(max-width:760px){#member-app .chat-pane.is-empty{display:none!important}}
@media(min-width:761px){body.in-profile #member-app .profile-quick-settings{display:flex;flex-direction:column;gap:14px;margin-top:16px}}

/* V1.1.34: quiet, accessible older-history pagination */
.history-load{display:block;margin:12px auto 16px;padding:8px 17px;border:1px solid #e4e2ed;border-radius:18px;background:#fff;color:#77748f;font-size:12px;line-height:1.45;cursor:pointer;max-width:80%;box-shadow:0 1px 5px rgba(40,32,70,.04)}
.history-load:hover:not(:disabled){color:#625b98;border-color:#cec9e5;background:#fdfcff}
.history-load:focus-visible{outline:2px solid #7770c3;outline-offset:2px}
.history-load:disabled{cursor:wait;opacity:.65}

/* V1.1.43 — Responsive in-chat manager, shown to authorized managers only. */
#member-app .chat-info-panel.manager-open{width:min(470px,calc(100vw - 24px));max-height:min(82dvh,760px);overscroll-behavior:contain}
#member-app .chat-manager{border-top:1px solid #e8ebf2;margin-top:12px;padding-top:12px;display:grid;gap:10px}
#member-app .chat-manager[hidden]{display:none!important}
#member-app .chat-manager h3{font-size:15px;display:flex;flex-wrap:wrap;align-items:baseline;gap:9px;margin:0}
#member-app .chat-manager h3 small,#member-app .chat-manager .mgr-hint{font-size:11px;color:#7b8495;font-weight:400;line-height:1.5}
#member-app .chat-manager label{display:grid;gap:5px;color:#525c6d;font-size:12px}
#member-app .chat-manager label small{font-size:11px;color:#8990a1}
#member-app .chat-manager input,#member-app .chat-manager textarea,#member-app .chat-manager select{width:100%;min-width:0;padding:10px 11px;background:#fff;border:1px solid #d9dfe9;border-radius:9px;color:#1e2635;font-size:13px;resize:vertical;outline-offset:2px}
#member-app .chat-manager button{min-height:38px;padding:8px 11px;border:1px solid #d8e0ee;border-radius:9px;background:#f3f6fc;color:#31517b;font-size:12px;font-weight:600;cursor:pointer}
#member-app .chat-manager button:hover{background:#eaf0fa}
#member-app .chat-manager button:disabled{opacity:.5;cursor:not-allowed}
#member-app .chat-manager button.danger{background:#fff1f1;color:#ae3d43;border-color:#f6d7da}
#member-app .chat-manager .mgr-control-row{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
#member-app .chat-manager .mgr-control-row button{flex:1 1 auto}
#member-app .chat-manager .mgr-divider{border-top:1px solid #e9ecf2;margin-top:3px}
#member-app .chat-manager .mgr-member-list{max-height:235px;overflow:auto;display:grid;gap:7px;font-size:12px;color:#68738a;overscroll-behavior:contain}
#member-app .chat-manager .mgr-member{padding:9px;border:1px solid #edf0f5;border-radius:10px;display:grid;gap:7px;overflow-wrap:anywhere}
#member-app .chat-manager .mgr-member .mgr-control-row{justify-content:flex-end}
#member-app #mgr-feedback{margin:0;min-height:16px;color:#25734e;font-size:12px;overflow-wrap:anywhere}
#member-app #mgr-feedback.error{color:#b03540}
@media(max-width:760px){#member-app .chat-info-panel.manager-open{right:8px;width:calc(100vw - 16px);max-height:min(78dvh,720px);padding:12px}#member-app .chat-manager button{min-height:42px}}

/* Pagination status and controls in in-chat admin approval list. */
#member-app #mgr-approval-page{font-size:12px;color:#606b80;white-space:nowrap;text-align:center;min-width:56px}
#member-app #mgr-approval-prev,#member-app #mgr-approval-next{flex:1 1 88px}


/* V1.1.59 — 群管理员操作确认统一使用中央小窗口；不影响消息区与输入框。 */
.chat-operation-mask{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;
  background:rgba(18,27,48,.53);padding:max(14px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
.chat-operation-dialog{width:min(390px,100%);max-height:100%;overflow-y:auto;overscroll-behavior:contain;
  background:#fff;border:1px solid #e3e6ec;border-radius:9px;padding:21px 22px 18px;
  box-shadow:0 18px 50px rgba(16,28,49,.21);overflow-wrap:anywhere}
.chat-operation-dialog h2{margin:0 0 10px;font-size:16px;font-weight:680;color:#25324b}
.chat-operation-dialog.danger h2{color:#b24650}
.chat-operation-dialog p{margin:0 0 17px;white-space:pre-line;font-size:13px;line-height:1.75;color:#677487}
.chat-operation-dialog label{display:block;font-size:12px;font-weight:620;color:#44516a}
.chat-operation-dialog textarea{display:block;width:100%;min-height:88px;max-height:180px;resize:vertical;margin-top:9px;
  padding:10px 12px;border:1px solid #d3dbe8;border-radius:6px;font:inherit;font-size:13px;color:#2b374b;background:white}
.chat-operation-dialog textarea:focus{outline:2px solid #b9cef7;border-color:#5487d8}
.chat-operation-dialog .chat-operation-validation{margin:6px 0 0;font-size:12px;color:#b34452}
.chat-operation-dialog .chat-operation-validation:empty{display:none}
.chat-operation-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.chat-operation-buttons button{border:1px solid #d7dee9;border-radius:5px;padding:9px 18px;min-width:80px;min-height:36px;
  color:#4d5f76;background:#fff;font:inherit;font-size:12px;font-weight:630;cursor:pointer}
.chat-operation-buttons .chat-operation-accept{background:#3974d7;border-color:#3974d7;color:white}
.chat-operation-dialog.danger .chat-operation-accept{background:#ba4756;border-color:#ba4756}
.chat-operation-buttons button:focus-visible{outline:2px solid #86b0f0;outline-offset:2px}
@media(max-width:560px){.chat-operation-dialog{padding:19px 17px 16px}.chat-operation-buttons button{flex:1}}

/* Group voice messages, visually aligned with native chat controls. */
.msg-voice-bubble{display:flex;align-items:center;gap:9px;min-width:150px;max-width:min(300px,80vw);padding:7px 10px!important}
.msg-voice-player{display:block;max-width:220px;width:clamp(145px,26vw,220px);height:32px;min-width:0}
.msg-voice-duration{flex:none;font-size:12px;opacity:.7;white-space:nowrap}
.compose-record-button{display:grid;place-items:center;width:94px;height:94px;min-height:94px;border:5px solid #cbe7ff;border-radius:50%;background:#159df4;color:#fff;cursor:pointer;touch-action:manipulation;box-shadow:0 4px 16px rgba(33,134,221,.13)}
.compose-record-button svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.compose-record-button.recording{background:#e35b5d;border-color:#ffe1e1;animation:voice-record-pulse 1.4s ease-in-out infinite}
.compose-record-button:disabled{opacity:.55;cursor:wait}
.compose-record-status{font-size:12px;color:#586479;text-align:center}
.compose-record-status:empty{display:none}
.compose-record-cancel{border:0;background:transparent;color:#3170de;padding:5px 12px;font-size:12px;cursor:pointer}
@keyframes voice-record-pulse{50%{box-shadow:0 0 0 9px rgba(228,96,96,.11)}}
@media(max-width:760px){.compose-panel[data-kind="voice"]{left:0;right:0;bottom:0;top:auto;width:100%;max-width:none;max-height:310px;border-radius:0;border-left:0;border-right:0;box-shadow:none;background:#f7f6fc;}.compose-panel[data-kind="voice"] .compose-voice-preview{min-height:200px;gap:14px}.msg-voice-player{width:175px}}

/* Group management: a single search row and readable list instead of stacked form cards. */
#member-app .chat-manager .mgr-search-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:5px}
#member-app .chat-manager .mgr-search-heading strong{font-size:13px;color:#283449}
#member-app .chat-manager .mgr-search-heading small,#member-app .chat-manager .mgr-search-summary{color:#8892a3;font-size:11px;margin:0}
#member-app .chat-manager .mgr-member-search-row{display:flex;align-items:stretch;gap:8px;width:100%}
#member-app .chat-manager .mgr-member-search-row #mgr-search{min-width:0;flex:1;border-radius:7px;background:#f6f7fa;border-color:#e8ebf1}
#member-app .chat-manager .mgr-member-search-row #mgr-search-button{flex:0 0 auto;padding:8px 13px;background:#e9f1ff;border-color:#dce7fb;color:#2b65b0}
#member-app .chat-manager .mgr-member-list{gap:0;max-height:270px;border:1px solid #ebedf1;border-radius:8px;background:#fff}
#member-app .chat-manager .mgr-member{border:0;border-bottom:1px solid #edf0f3;border-radius:0;padding:11px 10px}
#member-app .chat-manager .mgr-member:last-child{border-bottom:0}
#member-app .chat-manager .mgr-member>span{color:#364253;font-size:12px;font-weight:500}

/* V1.1.56 — group administration uses compact native disclosure rows, not stacked form cards. */
#member-app .chat-manager{gap:0}
#member-app .chat-manager>h3{padding:0 0 11px}
#member-app .chat-manager .mgr-area{border:1px solid #e8ebef;background:#fff;margin-top:-1px;min-width:0}
#member-app .chat-manager .mgr-area:first-of-type{border-radius:8px 8px 0 0;margin-top:0}
#member-app .chat-manager .mgr-area:last-of-type{border-radius:0 0 8px 8px}
#member-app .chat-manager .mgr-area>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 12px;color:#29364a;font-size:13px;font-weight:600;list-style:none;cursor:pointer}
#member-app .chat-manager .mgr-area>summary::-webkit-details-marker{display:none}
#member-app .chat-manager .mgr-area>summary:focus-visible{outline:2px solid #7da5d4;outline-offset:-3px}
#member-app .chat-manager .mgr-area>summary::after{content:'›';color:#9aa3af;font-size:19px;line-height:1;transform:rotate(0);transition:transform .15s ease}
#member-app .chat-manager .mgr-area[open]>summary::after{transform:rotate(90deg)}
#member-app .chat-manager .mgr-area>summary span{margin-left:auto;color:#98a2ae;font-size:11px;font-weight:400}
#member-app .chat-manager .mgr-area-body{display:grid;gap:10px;padding:12px;border-top:1px solid #edf0f3;min-width:0}
#member-app .chat-manager .mgr-area-body .mgr-inline-create{display:grid;gap:6px;border-top:1px solid #edf0f3;padding-top:10px}
#member-app .chat-manager .mgr-area-body .mgr-member-search-row label{flex:0 0 auto;align-self:center;margin:0}
#member-app .chat-manager .mgr-area-body .mgr-member-search-row select{flex:1;min-width:0;width:auto}
#member-app .chat-manager .mgr-area-body .mgr-member-search-row button{white-space:nowrap}
#member-app .chat-manager .mgr-area-body .mgr-member-list{margin:0}
#member-app .chat-manager .mgr-area-body button{min-height:36px}
@media(max-width:760px){#member-app .chat-manager .mgr-area-body button{min-height:42px}}

/* V1.1.58 授权群组的头像，加载失败回退原有四色占位 */
.group-icon .group-avatar-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;background:#eef2f6;z-index:2}

#active-group-avatar{position:relative;overflow:hidden}#active-group-avatar>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* V1.1.59: attachment bubbles, reuse native media controls for WebView accessibility. */
.msg-video-bubble{max-width:min(70vw,360px);overflow:hidden;padding:5px;border-radius:12px}
.msg-video-player{width:100%;max-height:320px;min-width:160px;display:block;background:#131820;border-radius:8px}
.msg-file-bubble{min-width:200px;max-width:min(76vw,350px);display:flex;align-items:center;gap:10px;padding:10px 13px}
.msg-file-icon{flex-shrink:0;font-size:27px;line-height:1;color:#7586a1}
.msg-file-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.msg-file-name{font-size:13px;font-weight:600;overflow-wrap:anywhere;line-height:1.4}
.msg-file-info small{font-size:11px;opacity:.65}
.msg-file-action{flex-shrink:0;color:#2869c8;font-size:12px;text-decoration:none;font-weight:600}
.msg-file-action:not(a){color:#8190a6;font-weight:400}

/* V1.1.60: 授权群管理员在群聊内编辑本群资料和消息策略；与普通群成员信息严格分离。 */
#member-app .chat-manager .mgr-profile-avatar-row{display:flex;align-items:center;gap:14px;min-width:0}
#member-app .chat-manager .mgr-avatar-preview{width:60px;height:60px;flex:0 0 60px;display:grid;place-items:center;background:#edf1f5;border:1px solid #e2e7ee;border-radius:12px;color:#61728a;font-size:19px;overflow:hidden}
#member-app .chat-manager .mgr-avatar-preview img{display:block;width:100%;height:100%;object-fit:cover}
#member-app .chat-manager .mgr-profile-avatar-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
#member-app .chat-manager .mgr-profile-avatar-actions .mgr-hint{flex-basis:100%}
#member-app .chat-manager .mgr-avatar-upload-label{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:7px 11px;background:#f3f6fc;border:1px solid #d8e0ee;border-radius:9px;color:#31517b;font-size:12px;font-weight:600;cursor:pointer}
#member-app .chat-manager .mgr-avatar-upload-label:hover{background:#eaf0fa}
#member-app .chat-manager input#mgr-avatar-file{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;padding:0;border:0;clip-path:inset(50%)}
#member-app .chat-manager .mgr-profile-avatar-actions:focus-within .mgr-avatar-upload-label{outline:2px solid #7da5d4;outline-offset:2px}
#member-app .chat-manager .mgr-policy-description{margin:0;line-height:1.6;color:#687589;font-size:12px}
#member-app .chat-manager .mgr-policy-options{display:grid;gap:0;border-top:1px solid #edf0f3;border-bottom:1px solid #edf0f3}
#member-app .chat-manager .mgr-policy-options label{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:45px;border-bottom:1px solid #edf0f3;color:#344253;font-size:13px}
#member-app .chat-manager .mgr-policy-options label:last-child{border-bottom:0}
#member-app .chat-manager .mgr-policy-options input[type=checkbox]{width:18px;height:18px;min-width:18px;margin:0;accent-color:#2374bb;cursor:pointer}
#member-app .chat-manager .mgr-policy-limits{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#member-app .chat-manager .mgr-policy-limits label:last-child{grid-column:1/-1}
#member-app .chat-manager #mgr-save-profile,#member-app .chat-manager #mgr-save-policy{background:#ecf3fb;border-color:#d5e2f3;color:#2363a4}
@media(max-width:520px){#member-app .chat-manager .mgr-policy-limits{grid-template-columns:1fr}#member-app .chat-manager .mgr-policy-limits label:last-child{grid-column:auto}#member-app .chat-manager .mgr-profile-avatar-row{align-items:flex-start}#member-app .chat-manager .mgr-avatar-preview{width:54px;height:54px;flex-basis:54px}}

/* V1.1.61：群内按客户标签申请入群，沿用成员管理连续列表，不新增卡片布局。 */
#member-app .chat-manager .mgr-tag-import{display:grid;gap:8px;border-top:1px solid #edf0f3;padding-top:12px;min-width:0}
#member-app .chat-manager .mgr-tag-import>strong{font-size:13px;color:#334155;font-weight:600}
#member-app .chat-manager .mgr-tag-import>label{font-size:12px;color:#566275}
#member-app .chat-manager .mgr-tag-import>select{min-width:0;width:100%;height:38px;border:1px solid #dce2e9;border-radius:7px;background:#fff;color:#344054;padding:0 10px}
#member-app .chat-manager .mgr-tag-import .mgr-tag-row{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 11px;border-bottom:1px solid #eef0f3;color:#354255}
#member-app .chat-manager .mgr-tag-import .mgr-tag-row:last-child{border-bottom:0}
#member-app .chat-manager .mgr-tag-import .mgr-tag-row input{flex:none;accent-color:#397c63;inline-size:16px;block-size:16px}
#member-app .chat-manager .mgr-tag-import .mgr-tag-row span{min-width:0;overflow-wrap:anywhere;flex:1}
#member-app .chat-manager .mgr-tag-import .mgr-tag-row small{font-size:11px;color:#8190a0;flex:none}
#member-app .chat-manager #mgr-tag-submit{background:#27784d;border-color:#27784d;color:#fff}
#member-app .chat-manager #mgr-tag-submit:disabled{background:#eef1f4;color:#91a0af;border-color:#dce2e9;cursor:not-allowed}

/* V1.1.63 — 参考旧版 IM 的群资料页/操作弹窗结构，不再在聊天 header 内画遮罩。 */
#member-app .chat-info-panel,#member-app .chat-info-panel.manager-open{
  position:fixed;inset:0 0 0 auto;z-index:600;display:block;width:350px;max-width:calc(100vw - 20px);
  height:100dvh;max-height:none;padding:0 14px 32px;overflow:auto;border:0;border-left:1px solid #e3e5ed;
  border-radius:0;background:#f5f4f9;box-shadow:-8px 0 30px rgba(17,24,40,.10);color:#272b34;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;animation:none;
}
#member-app .chat-info-panel[hidden],#member-app .native-group-modal[hidden],#member-app .native-group-modal-mask[hidden]{display:none!important}
#member-app .chat-info-head{position:sticky;top:0;z-index:2;display:flex;justify-content:center;align-items:center;min-height:58px;
  margin:0 -14px;padding:10px 48px;background:#f5f4f9;border-bottom:0;box-shadow:none}
#member-app .chat-info-head strong{font-size:16px;font-weight:600;color:#252832}
#member-app .chat-info-head button{position:absolute;right:14px;top:12px;width:34px;height:34px;border:0;background:transparent;color:#58616e}
#member-app .chat-info-head button:hover{background:#e8e9ee}
#member-app .native-group-hero{display:flex;align-items:center;gap:12px;margin:4px 0 14px;padding:18px 9px;min-height:86px}
#member-app .native-group-picture{display:grid;place-items:center;width:56px;height:56px;flex:none;border-radius:9px;background:#e2e7f1;color:#6380ac;font-size:20px;font-weight:650}
#member-app .native-group-hero-text{display:flex;min-width:0;flex:1;flex-direction:column;gap:6px}
#member-app .native-group-hero-text strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;color:#212630}
#member-app .native-group-hero-text small{font-size:11px;color:#9aa1ad}
#member-app .native-group-chevron{font-size:23px;color:#a9aeb8}
#member-app .native-info-card{margin:0 0 14px;border-radius:13px;background:#fff;overflow:hidden}
#member-app .chat-info-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:51px;
  margin:0;padding:11px 15px;border:0;border-bottom:1px solid #f0f0f2;font-size:14px;line-height:1.5;background:#fff}
#member-app .chat-info-row:last-child{border-bottom:0}
#member-app .chat-info-row>span{color:#262a33;font-size:14px;font-weight:500}
#member-app .chat-info-row strong{max-width:59%;font-size:13px;color:#8d939e;font-weight:400;text-align:right;line-height:1.5}
#member-app .native-info-link{cursor:default}
#member-app .chat-info-panel.manager-open .native-info-link{cursor:pointer}
#member-app .chat-info-panel.manager-open .native-info-link:hover{background:#f8f9fc}
#member-app .chat-info-announcement{margin:0 0 14px;padding:14px 15px;border:0;border-radius:13px;background:#fff}
#member-app .chat-info-announcement>span{font-size:14px;color:#232832;font-weight:500}
#member-app .chat-info-announcement p{margin:9px 0 0;color:#929aa6;font-size:13px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
#member-app .chat-info-mute-row{min-height:55px;margin:0 0 14px;padding:8px 15px;border:0;border-radius:13px;background:#fff}
#member-app .chat-info-mute-row>span{color:#272b34;font-size:14px;font-weight:500}
#member-app .chat-info-mute-row small{display:none}
#member-app .chat-manager{display:block;margin:0;padding:0;border:0;background:transparent;box-shadow:none}
#member-app .chat-manager[hidden]{display:none!important}
#member-app .chat-manager h3{margin:0 0 8px;padding-left:3px;color:#8d96a4;font-size:11px;font-weight:500}
#member-app .chat-manager h3 small{display:none}
#member-app .chat-manager .mgr-area{margin:0;border:0;border-bottom:1px solid #f0f0f3;border-radius:0;background:#fff;overflow:visible}
#member-app .chat-manager .mgr-area:first-of-type{border-radius:13px 13px 0 0}
#member-app .chat-manager .mgr-area:nth-last-of-type(1){border-bottom:0;border-radius:0 0 13px 13px}
#member-app .chat-manager .mgr-area>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:52px;padding:10px 16px;list-style:none;color:#272b34;font-size:14px;font-weight:500;cursor:pointer}
#member-app .chat-manager .mgr-area>summary::-webkit-details-marker{display:none}
#member-app .chat-manager .mgr-area>summary span{margin-left:auto;color:#98a0ab;font-size:11px;font-weight:400;text-align:right}
#member-app .chat-manager .mgr-area>summary:after{content:'›';color:#a7adb8;font-size:20px;line-height:1}
#member-app .chat-info-footnote{margin:14px 2px 0;padding:0;border:0;color:#a0a7b2;font-size:11px;line-height:1.7}
#member-app .chat-info-panel #mgr-feedback{margin:8px 2px;font-size:12px;color:#257a53}
#member-app .native-group-modal-mask{position:fixed;inset:0;z-index:1900;background:rgba(38,44,62,.28);backdrop-filter:none}
#member-app .native-group-modal{position:fixed;top:50%;left:50%;z-index:1901;display:flex;flex-direction:column;
  width:min(470px,calc(100vw - 28px));max-height:min(82dvh,740px);transform:translate(-50%,-50%);overflow:hidden;
  padding:0;border:1px solid #edeef2;border-radius:14px;background:#fff;box-shadow:0 20px 54px rgba(19,30,50,.18)}
#member-app .native-group-modal-head{position:relative;display:flex;justify-content:center;align-items:center;flex:none;min-height:55px;
  padding:10px 52px;border-bottom:1px solid #f0f1f4;background:#fff}
#member-app .native-group-modal-head strong{font-size:15px;font-weight:600;color:#202633;text-align:center}
#member-app .native-group-modal-head button{position:absolute;top:8px;right:9px;display:grid;place-items:center;
  width:36px;height:36px;min-height:0;padding:0;border:0;border-radius:8px;background:transparent;color:#525b6a;font-size:24px;font-weight:400}
#member-app .native-group-modal-head button:hover{background:#f4f5f8}
#member-app .native-modal-content{flex:1;min-height:0;overflow-y:auto;padding:16px 18px 20px;overscroll-behavior:contain}
#member-app .native-group-modal .mgr-area-body{display:block;padding:0;border:0;background:transparent}
#member-app .native-group-modal .mgr-member-list{max-height:min(340px,45dvh);gap:0}
#member-app .native-group-modal .mgr-member{padding:12px 0;border:0;border-bottom:1px solid #f0f1f5;border-radius:0;background:#fff}
#member-app .native-group-modal .mgr-member-search-row{display:flex;gap:8px;align-items:center}
#member-app .native-group-modal input,#member-app .native-group-modal textarea,#member-app .native-group-modal select{background:#f7f7f9;border-color:#e8eaf0;border-radius:8px}
#member-app .native-group-modal label{margin:4px 0;color:#3e4756;font-size:12px}
#member-app .native-group-modal button{min-height:36px;border-radius:8px}
#member-app .native-group-modal #mgr-save-profile,#member-app .native-group-modal #mgr-save-announcement,#member-app .native-group-modal #mgr-save-policy{background:#3478f6;color:#fff;border-color:#3478f6}
#member-app .native-group-modal[data-mode="profile"] #mgr-announcement,#member-app .native-group-modal[data-mode="profile"] label[for="mgr-announcement"],#member-app .native-group-modal[data-mode="profile"] #mgr-save-announcement,#member-app .native-group-modal[data-mode="profile"] .mgr-divider{display:none}
#member-app .native-group-modal[data-mode="announcement"] .mgr-profile-avatar-row,#member-app .native-group-modal[data-mode="announcement"] label[for="mgr-group-name"],#member-app .native-group-modal[data-mode="announcement"] #mgr-group-name,#member-app .native-group-modal[data-mode="announcement"] label[for="mgr-group-description"],#member-app .native-group-modal[data-mode="announcement"] #mgr-group-description,#member-app .native-group-modal[data-mode="announcement"] #mgr-save-profile,#member-app .native-group-modal[data-mode="announcement"] .mgr-divider{display:none}
#member-app .native-group-modal .mgr-control-row{display:flex;flex-wrap:wrap;gap:8px}
#member-app .native-group-modal .mgr-control-row button{flex:1 1 auto}
@media(max-width:760px){
  body.chat-info-open{overflow:hidden}
  #member-app .chat-info-panel,#member-app .chat-info-panel.manager-open{inset:0;max-width:none;width:100vw;height:100dvh;max-height:none;border:0;box-shadow:none;padding:0 14px calc(25px + env(safe-area-inset-bottom))}
  #member-app .chat-info-head{min-height:calc(52px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
  #member-app .chat-info-head button{top:calc(9px + env(safe-area-inset-top));left:2px;right:auto}
  #member-app .chat-info-head button svg{transform:rotate(0)}
  #member-app .native-group-modal-mask{background:#f5f4f9}
  #member-app .native-group-modal{inset:0;width:100vw;height:100dvh;max-height:none;transform:none;border:0;border-radius:0;background:#f5f4f9;box-shadow:none}
  #member-app .native-group-modal-head{min-height:calc(54px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);background:#f5f4f9}
  #member-app .native-group-modal-head button{top:calc(8px + env(safe-area-inset-top));left:10px;right:auto}
  #member-app .native-modal-content{padding:16px 16px calc(34px + env(safe-area-inset-bottom));background:#fff}
  #member-app .native-group-modal .mgr-member-list{max-height:55dvh}
}
/* Strengthened mobile selector overrides the original header-anchored popover rules. */
@media(max-width:760px){
  body.in-chat #member-app .chat-info-panel,
  body.in-chat #member-app .chat-info-panel.manager-open{
    position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;max-width:none;
    height:100dvh;max-height:none;padding:0 14px calc(25px + env(safe-area-inset-bottom));
    transform:none;border:0;border-radius:0;background:#f5f4f9;overflow-y:auto;z-index:600;
  }
  body.in-chat #member-app .chat-info-row{display:flex;grid-template-columns:none;}
}
#member-app .native-group-picture img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
#member-app .native-info-back{display:none}
@media(max-width:760px){
  #member-app .chat-info-head .native-info-x{display:none}
  #member-app .chat-info-head .native-info-back{display:block}
}

/* V1.1.64 — reference-aligned member directory, batch removal and simple edit pages. */
#member-app .native-group-modal .native-member-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0 11px;border-bottom:1px solid #eff0f3}
#member-app .native-group-modal .native-member-toolbar>span{font-size:11px;color:#9a9fa9}
#member-app .native-group-modal .native-member-toolbar button{min-height:32px;padding:5px 11px;color:#405a89;background:#fff;border-color:#e4e8f0;font-size:12px}
#member-app .native-group-modal .native-member-toolbar button[aria-pressed="true"]{color:#3478f6;background:#f0f5ff;border-color:#cbdbfa}
#member-app .native-group-modal .mgr-member-list{border:0!important;border-radius:0!important;background:#fff}
#member-app .native-group-modal .mgr-member.native-member-item{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:66px;margin:0;padding:8px 4px!important;border:0;border-bottom:1px solid #f0f1f4;border-radius:0;background:#fff}
#member-app .native-group-modal .mgr-member.native-member-item:last-child{border:0}
#member-app .native-member-identity{display:flex;align-items:center;gap:11px;min-width:0;flex:1}
#member-app .native-member-placeholder{display:grid;place-items:center;width:39px;height:39px;min-width:39px;border-radius:8px;background:#e8edf5;color:#6e819a;font-size:15px;font-weight:650}
#member-app .native-member-label{display:flex;flex-direction:column;gap:3px;min-width:0}
#member-app .native-member-label strong{overflow:hidden;max-width:180px;text-overflow:ellipsis;white-space:nowrap;color:#2c313c;font-size:13px;font-weight:550}
#member-app .native-member-label small{color:#a1a7b2;font-size:11px}
#member-app .native-group-modal .mgr-member.native-member-item .mgr-control-row{flex:none;gap:5px;margin-left:auto}
#member-app .native-group-modal .mgr-member.native-member-item .mgr-control-row button{flex:none;min-height:31px;padding:4px 8px;font-size:11px;font-weight:500}
#member-app .native-group-modal .native-member-choose{cursor:pointer}
#member-app .native-group-modal .native-member-choose.selected{background:#f8fbff}
#member-app .native-member-check{flex:none!important;order:-1;display:block!important;appearance:none;width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;margin:0!important;padding:0!important;border:1px solid #c5cbd4!important;border-radius:50%!important;background:#fff!important;cursor:pointer}
#member-app .native-member-check:checked{border-color:#3478f6!important;background:#3478f6!important;box-shadow:inset 0 0 0 4px #3478f6}
#member-app .native-member-check:checked:after{content:'✓';display:grid;place-items:center;height:100%;color:#fff;font-weight:700;font-size:13px}
#member-app .native-member-check:disabled{border-color:#e1e3e8!important;background:#f5f5f6!important;cursor:not-allowed;opacity:.8}
#member-app .native-group-modal .native-member-select-footer{position:sticky;bottom:0;z-index:1;display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:12px;padding:12px 0 0;border-top:1px solid #edf0f3;background:#fff}
#member-app .native-group-modal .native-member-select-footer[hidden]{display:none!important}
#member-app .native-member-select-footer>span{margin-right:auto;color:#8b93a0;font-size:12px}
#member-app .native-group-modal .native-member-select-footer button{min-width:66px;min-height:34px;padding:5px 13px;border-radius:8px;background:#fff;border:1px solid #e5e7ec;color:#5e6877;font-size:12px}
#member-app .native-group-modal #native-member-remove:not(:disabled){color:#fff;background:#3478f6;border-color:#3478f6}
#member-app .native-group-modal #native-member-remove:disabled{background:#ebedf1;color:#a5abb4;border-color:#ebedf1}
#member-app .native-group-modal[data-mode="name"] .mgr-profile-avatar-row,
#member-app .native-group-modal[data-mode="name"] label[for="mgr-group-description"],
#member-app .native-group-modal[data-mode="name"] #mgr-group-description,
#member-app .native-group-modal[data-mode="name"] #mgr-announcement,
#member-app .native-group-modal[data-mode="name"] label[for="mgr-announcement"],
#member-app .native-group-modal[data-mode="name"] #mgr-save-announcement,
#member-app .native-group-modal[data-mode="name"] .mgr-divider,
#member-app .native-group-modal[data-mode="intro"] .mgr-profile-avatar-row,
#member-app .native-group-modal[data-mode="intro"] label[for="mgr-group-name"],
#member-app .native-group-modal[data-mode="intro"] #mgr-group-name,
#member-app .native-group-modal[data-mode="intro"] #mgr-announcement,
#member-app .native-group-modal[data-mode="intro"] label[for="mgr-announcement"],
#member-app .native-group-modal[data-mode="intro"] #mgr-save-announcement,
#member-app .native-group-modal[data-mode="intro"] .mgr-divider{display:none!important}
#member-app .native-group-modal[data-mode="name"] .native-modal-content,
#member-app .native-group-modal[data-mode="intro"] .native-modal-content,
#member-app .native-group-modal[data-mode="announcement"] .native-modal-content{background:#f7f6fb}
#member-app .native-group-modal[data-mode="name"] #mgr-group-name,
#member-app .native-group-modal[data-mode="intro"] #mgr-group-description,
#member-app .native-group-modal[data-mode="announcement"] #mgr-announcement{width:100%;border:1px solid #e8e8ef;border-radius:9px;background:#fff;box-shadow:none;font-size:15px;color:#242934}
#member-app .native-group-modal[data-mode="name"] #mgr-group-name{min-height:50px}
#member-app .native-group-modal[data-mode="intro"] #mgr-group-description,
#member-app .native-group-modal[data-mode="announcement"] #mgr-announcement{min-height:142px;line-height:1.65;resize:vertical}
#member-app .native-group-modal .native-editor-counter{color:#9ba3af;font-size:12px;text-align:right;margin:6px 2px 10px}
#member-app .native-group-modal #mgr-save-profile:disabled,#member-app .native-group-modal #mgr-save-announcement:disabled{background:#e7e8eb;color:#fff;border-color:#e7e8eb;cursor:not-allowed}
#member-app .native-group-modal[data-mode="name"] #mgr-save-profile,
#member-app .native-group-modal[data-mode="intro"] #mgr-save-profile,
#member-app .native-group-modal[data-mode="announcement"] #mgr-save-announcement{display:flex;justify-content:center;min-width:90px;margin-left:auto}
@media(max-width:760px){
 #member-app .native-group-modal .native-modal-content{background:#f7f6fb;padding:16px 16px calc(24px + env(safe-area-inset-bottom))}
 #member-app .native-group-modal .mgr-member-list{background:transparent}
 #member-app .native-group-modal .native-member-identity{gap:12px}
 #member-app .native-group-modal .mgr-member.native-member-item{min-height:72px;padding:9px 2px!important}
 #member-app .native-member-placeholder{width:44px;height:44px;min-width:44px}
 #member-app .native-member-label strong{font-size:15px}
 #member-app .native-member-label small{font-size:12px}
 #member-app .native-group-modal .native-member-select-footer{position:sticky;bottom:0;padding:14px 0 calc(10px + env(safe-area-inset-bottom));background:#f7f6fb}
 #member-app .native-group-modal .mgr-member.native-member-item .mgr-control-row button{min-height:36px}
}

/* V1.1.64 second pass: separate member query from add/tag forms and move editor save to mobile navigation bar. */
#member-app .native-group-modal[data-mode="members"] .mgr-inline-create,
#member-app .native-group-modal[data-mode="members"] .mgr-tag-import{display:none!important}
#member-app .native-group-modal[data-mode="members"] .mgr-area-body{display:flex;flex-direction:column}
#member-app .native-group-modal[data-mode="members"] .mgr-member-search-row{order:0}
#member-app .native-group-modal[data-mode="members"] .native-member-toolbar{order:1}
#member-app .native-group-modal[data-mode="members"] .mgr-search-summary{order:2}
#member-app .native-group-modal[data-mode="members"] .mgr-member-list{order:3}
#member-app .native-group-modal[data-mode="members"] .mgr-control-row{order:4}
#member-app .native-group-modal[data-mode="members"] .native-member-select-footer{order:5}
#member-app .native-group-modal-head .native-modal-close-back{display:none}
#member-app .native-group-modal-head #native-modal-save{display:none}
#member-app .native-group-modal-head #native-modal-save[hidden]{display:none!important}
@media(max-width:760px){
 #member-app .native-group-modal-head .native-modal-close-x{display:none}
 #member-app .native-group-modal-head .native-modal-close-back{display:inline-block;font-size:33px;line-height:20px;transform:translateY(-2px)}
 #member-app .native-group-modal-head #native-modal-save:not([hidden]){position:absolute;display:grid;place-items:center;right:14px;top:calc(9px + env(safe-area-inset-top));min-width:57px;height:35px;min-height:35px;padding:0 12px;border:0;border-radius:8px;background:#3478f6;color:#fff;font-size:14px;font-weight:600}
 #member-app .native-group-modal-head #native-modal-save:not([hidden]):disabled{background:#e6e6e9;color:#fff}
 #member-app .native-group-modal[data-mode="name"] #mgr-save-profile,
 #member-app .native-group-modal[data-mode="intro"] #mgr-save-profile,
 #member-app .native-group-modal[data-mode="announcement"] #mgr-save-announcement{display:none!important}
 #member-app .native-group-modal[data-mode="members"] .native-member-select-footer{margin-top:12px}
 #member-app .native-group-modal[data-mode="members"] .native-modal-content{background:#fff}
}
@media(max-width:760px){
 #member-app .native-group-modal-head #native-modal-save:not([hidden]){left:auto!important;right:14px!important}
}

/* 业务状态：敏感词拒绝不是网络失败，不提供原内容重试。 */
#member-app .msg-status.blocked,body.in-chat #member-app .msg-status.blocked{color:#bd4655;font-weight:550}

/* V1.1.81 联系人只保留真实可用的群聊分类，旧好友/新的朋友隐藏时不留空列。 */
#member-app .contacts-tabs{grid-template-columns:minmax(0,1fr)}
#member-app .contacts-tabs [hidden]{display:none!important}

/* V1.1.82 manager-only message moderation, compact per-message text action. */
.msg-moderate{display:inline-flex;align-self:flex-start;align-items:center;margin-top:3px;padding:2px 5px;border:0;background:transparent;color:#6b8191;font-size:11px;line-height:1.5;cursor:pointer}
.msg-row.mine .msg-moderate{align-self:flex-end}
.msg-moderate:hover,.msg-moderate:focus-visible{color:#246e63;text-decoration:underline}

/* V1.1.84 · 群成员操作控件：沿用同一蓝灰中性色体系，改善正式运营界面的交互密度。 */
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item{
  min-height:69px;gap:12px;padding:11px 4px!important;
}
#member-app .native-group-modal[data-mode="members"] .native-member-label strong{
  font-weight:600;color:#273244;line-height:1.4;
}
#member-app .native-group-modal[data-mode="members"] .native-member-placeholder{
  background:#e9eef6;color:#6c86aa;font-weight:600;
}
#member-app .native-group-modal[data-mode="members"] .mgr-control-row{gap:7px}
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row button{
  display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;
  min-width:51px;min-height:34px;padding:6px 10px;border:1px solid #dbe5f5;
  border-radius:8px;background:#f5f8fd;color:#3f618e;
  font-size:12px;font-weight:500;line-height:1.25;
  transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s;
}
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row .native-member-message{
  background:#eef4ff;border-color:#d4e2ff;color:#2d66bc;
}
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row .danger{
  background:#fff5f5;border-color:#f2d8d9;color:#bf5259;
}
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row button:hover:not(:disabled){
  background:#e9f1fd;border-color:#b5cdf4;color:#225ca9;
}
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row button.danger:hover:not(:disabled){
  background:#fff0f0;border-color:#edc2c7;color:#ab3947;
}
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row button:focus-visible{
  outline:0;box-shadow:0 0 0 3px rgba(52,120,246,.13);border-color:#8faef3;
}
#member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row button:disabled{
  background:#f4f5f8;border-color:#e9ebf1;color:#9ba5b5;opacity:1;
}
@media(max-width:480px){
  #member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item{gap:6px}
  #member-app .native-group-modal[data-mode="members"] .mgr-control-row{gap:4px}
  #member-app .native-group-modal[data-mode="members"] .mgr-member.native-member-item .mgr-control-row button{
    min-width:43px;min-height:35px;padding:6px 7px;font-size:11px;
  }
  #member-app .native-group-modal[data-mode="members"] .native-member-identity{gap:8px}
  #member-app .native-group-modal[data-mode="members"] .native-member-placeholder{width:37px;height:37px;min-width:37px;font-size:13px}
  #member-app .native-group-modal[data-mode="members"] .native-member-label strong{max-width:76px;font-size:13px}
}

/* V1.1.93 — one shared, pictorial WeChat-style attachment tray for group and DM. */
#member-app .compose-panel[data-kind="more"]{width:min(430px,calc(100% - 24px));padding:16px 14px 14px;border-radius:12px;background:#f5f6fa}
#member-app .compose-panel[data-kind="more"] .compose-panel-title:empty{display:none}
#member-app .compose-panel[data-kind="more"] .compose-more-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 7px}
#member-app .compose-panel[data-kind="more"] .compose-more-item{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;min-height:89px;
  width:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#5e697a;
  font-family:inherit;text-align:center;font-size:12px;font-weight:500;line-height:1.4;cursor:pointer
}
#member-app .compose-panel[data-kind="more"] .compose-more-item:before{display:none!important}
#member-app .compose-panel[data-kind="more"] .compose-more-icon{
  display:grid;place-items:center;width:58px;height:58px;max-width:100%;border:1px solid #e5e8ee;
  border-radius:13px;background:#fff;color:#4b5b71;box-shadow:0 1px 2px rgba(33,45,64,.025);
  transition:background .15s,border-color .15s,transform .15s
}
#member-app .compose-panel[data-kind="more"] .compose-more-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
#member-app .compose-panel[data-kind="more"] .compose-more-item:hover:not(:disabled){background:transparent;color:#336ecb}
#member-app .compose-panel[data-kind="more"] .compose-more-item:hover:not(:disabled) .compose-more-icon{background:#eaf1ff;border-color:#c7d9fc}
#member-app .compose-panel[data-kind="more"] .compose-more-item:active:not(:disabled) .compose-more-icon{transform:scale(.96)}
#member-app .compose-panel[data-kind="more"] .compose-more-item:disabled{background:transparent;opacity:.45;cursor:not-allowed}
#member-app .compose-panel[data-kind="more"] .compose-more-item:focus-visible{outline:2px solid #5185dd;outline-offset:2px;border-radius:8px}
@media(max-width:760px){
  body.in-chat #member-app .compose[data-panel-kind="more"]{flex-direction:column!important;align-items:stretch!important;gap:0!important}
  body.in-chat #member-app .compose-panel[data-kind="more"]{
    position:static!important;order:2;left:auto;right:auto;bottom:auto;width:100%;max-width:100%;
    max-height:min(240px,35dvh);margin:7px 0 0;padding:15px 9px calc(10px + env(safe-area-inset-bottom));
    border:0;border-top:1px solid #e7eaf1;border-radius:0;background:#f5f6fa;box-shadow:none
  }
  body.in-chat #member-app .compose-panel[data-kind="more"] .compose-more-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 3px}
  body.in-chat #member-app .compose-panel[data-kind="more"] .compose-more-item{min-height:82px;gap:7px;font-size:11px}
  body.in-chat #member-app .compose-panel[data-kind="more"] .compose-more-icon{width:54px;height:54px;border-radius:12px}
}

/* V1.1.107: 资料编辑保持简洁的正式版行式布局及深浅主题。 */
#member-app .profile-menu-card>.profile-menu-action{width:100%;border-left:0;border-right:0;border-top:0;background:transparent;text-align:left;cursor:pointer;font-family:inherit}
#member-app .profile-menu-card>.profile-menu-action:last-child{border-bottom:0}
#member-app .profile-menu-card>.profile-menu-action:hover{background:rgba(94,132,196,.055)}
.member-profile-edit .member-profile-edit-input{display:block;width:100%;box-sizing:border-box;min-height:43px;margin:10px 0 0;border:1px solid #dce3ef;border-radius:8px;padding:10px 12px;background:#fff;color:#293c55;font:inherit;font-size:13px;outline:0}
.member-profile-edit textarea.member-profile-edit-input{resize:vertical;min-height:92px;max-height:155px}
.member-profile-edit .member-profile-edit-input:focus{border-color:#5d8ce7;box-shadow:0 0 0 2px #5d8ce722}
.member-profile-edit .member-profile-edit-input::placeholder{color:#9aa6b8}
.member-password-dialog input::placeholder{color:#9aa6b8;font-size:12px}
:root[data-chat-theme="dark"] .member-profile-edit .member-profile-edit-input{background:#293649;color:#f0f4fa;border-color:#46536b}

/* V1.1.108 group roles and mention dialogs use the existing restrained chat palette. */
.msg-role-label{font-weight:650;color:#3a659e}
.msg-role-label[data-role="owner"]{color:#aa7135}
.msg-mentioned .msg-bubble{outline:1px solid #91b5ef;outline-offset:1px}
.group-role-shade{position:fixed;inset:0;z-index:100300;background:rgba(18,29,49,.44);display:flex;align-items:center;justify-content:center;padding:16px}
.group-role-dialog{box-sizing:border-box;width:min(440px,100%);max-height:min(78vh,720px);overflow:auto;background:var(--surface,#fff);color:var(--text,#233148);border-radius:14px;box-shadow:0 12px 50px rgba(17,27,40,.18);padding:18px}
.group-role-head{display:flex;align-items:center;justify-content:space-between;font-size:17px;font-weight:650;margin-bottom:14px}
.group-role-head button{background:transparent;border:0;color:inherit;font-size:26px;cursor:pointer;padding:0 7px}
.group-role-dialog>input{display:block;box-sizing:border-box;width:100%;border:1px solid #dae2ed;border-radius:8px;padding:11px;margin:8px 0 14px;background:var(--surface,#fff);color:inherit}
.group-role-list{display:grid;gap:6px;max-height:55vh;overflow:auto}
.group-role-option{display:block;width:100%;text-align:left;border:0;background:transparent;padding:12px 9px;border-radius:7px;color:inherit;cursor:pointer}
.group-role-option:hover,.group-role-option:focus-visible{background:rgba(72,128,219,.09)}
.group-role-item{padding:11px 2px;border-bottom:1px solid #e8edf4;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.group-role-item small{flex-basis:100%;color:var(--muted,#79879c)}
.group-role-item button{margin-left:auto}
.group-role-permissions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.group-role-permissions label{display:flex;align-items:center;gap:7px;font-size:13px}
.group-role-primary{border:0;border-radius:8px;background:#3478ed;color:white;padding:10px;cursor:pointer}
.group-role-feedback{font-size:13px;color:var(--muted,#697993);margin:8px 0 0}
@media(max-width:520px){.group-role-dialog{max-height:80dvh;padding:16px}.group-role-permissions{grid-template-columns:1fr 1fr}}

.group-role-candidates{display:grid;gap:2px;max-height:150px;overflow:auto;border-radius:8px;background:rgba(90,122,168,.06)}

/* V1.1.110: durable, group-scoped @ reminder without disclosing member identities. */
#member-app .group-mention-preview{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#member-app .group-mention-preview b{color:#cf643e;font-weight:650}
#member-app .group-row.has-mention:not(.chosen) .group-time{color:#bc6742}
#member-app .mention-alert{display:flex;align-items:center;gap:10px;flex:0 0 auto;min-height:41px;padding:5px 16px;border-bottom:1px solid #ecddc4;background:#fff8e9;color:#855b31;font-size:13px;z-index:2}
#member-app .mention-alert[hidden]{display:none!important}
#member-app .mention-alert span{font-weight:650}
#member-app .mention-alert button{border:0;background:transparent;color:#3976c5;font:inherit;font-weight:650;cursor:pointer;padding:5px 3px}
#member-app .mention-alert button:last-child{margin-left:auto;color:#8a8178;font-size:19px;font-weight:400}
#member-app .mention-alert button:focus-visible{outline:2px solid #3976c5;outline-offset:2px}
#member-app .msg-mention-badge{display:inline-flex;align-items:center;margin-left:7px;padding:2px 5px;border-radius:4px;background:#ffecda;color:#ab6436;font-size:10px;font-weight:650;vertical-align:middle}
#member-app .msg-row.mention-jump-focus .msg-bubble{outline:2px solid #e7a64c;outline-offset:3px}
#member-app .msg-avatar.msg-avatar-mention{-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
#member-app .mention-history-gap{align-self:center;margin:10px 0;color:#9b8290;font-size:11px;text-align:center}
:root[data-chat-theme="dark"] #member-app .mention-alert{background:#453a32;border-bottom-color:#65513c;color:#ffe1b9}
:root[data-chat-theme="dark"] #member-app .mention-alert button{color:#9ec9ff}
:root[data-chat-theme="dark"] #member-app .msg-mention-badge{background:#544330;color:#ffd09a}
@media(max-width:760px){
  body.in-chat #member-app .mention-alert{padding:5px 15px;min-height:42px;font-size:13px}
  body.in-chat #member-app .mention-picker-shade .group-role-dialog{max-height:74dvh}
  body.in-chat #member-app .mention-picker-shade .group-role-option{min-height:45px;font-size:15px}
}

/* V1.1.111: files are discoverable on desktop, mobile + remains accessible. */
.compose-tool[data-compose-action="file"]{width:auto;min-width:47px;gap:4px;padding:0 5px}
.compose-file-label{font-size:12px;font-weight:550}
@media(max-width:760px){
  body.in-chat #member-app .compose-form.has-text .compose-more{display:inline-flex!important}
}

/* V1.1.112: group cover must occupy exactly one clipped square; no fallback text overlays. */
#member-app #native-group-hero-avatar.native-group-picture{position:relative!important;display:grid!important;place-items:center!important;
 width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;max-width:56px!important;max-height:56px!important;
 flex:0 0 56px!important;overflow:hidden!important;padding:0!important;border-radius:9px!important;line-height:1!important}
#member-app #native-group-hero-avatar.native-group-picture.has-picture{font-size:0!important;color:transparent!important}
#member-app #native-group-hero-avatar.native-group-picture>img{position:absolute!important;inset:0!important;display:block!important;
 width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important;border-radius:inherit!important;margin:0!important}
#member-app .group-library-entry{display:flex;align-items:center;gap:12px;width:100%;min-height:66px;margin:0 0 14px;padding:12px 15px;
 background:#fff;border:0;border-radius:13px;text-align:left;color:#2c3340;cursor:pointer}
#member-app .group-library-entry[hidden]{display:none!important}
#member-app .group-library-entry-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;background:#edf3ff;color:#4e80c5;font-size:22px}
#member-app .group-library-entry-copy{display:flex;flex:1;flex-direction:column;gap:4px}
#member-app .group-library-entry-copy strong{font-size:14px;font-weight:550}
#member-app .group-library-entry-copy small{font-size:11px;color:#9299a6}
#member-app .group-library-chevron{font-size:24px;color:#adb3be}
#member-app .group-library-panel{position:fixed;z-index:1950;inset:0 0 0 auto;display:flex;flex-direction:column;
 width:min(430px,100vw);height:100dvh;background:#f6f6f9;color:#252b35;border-left:1px solid #e5e8f0;
 box-shadow:-8px 0 34px #17213918;overflow:hidden}
#member-app .group-library-panel[hidden]{display:none!important}
#member-app .group-library-header{height:58px;min-height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;
 background:#fff;border-bottom:1px solid #e9eaf0}
#member-app .group-library-header strong{font-size:17px;font-weight:600}
#member-app .group-library-header button{min-height:38px;border:0;background:transparent;color:#3f75bd;font-size:14px}
#member-app #group-library-back{font-size:30px;color:#343b49;min-width:40px;text-align:left}
#member-app .group-library-body{flex:1;min-height:0;overflow:auto;padding:18px 14px;overscroll-behavior:contain}
#member-app .group-library-intro{margin:0 0 18px;line-height:1.65;font-size:12px;color:#8c94a2}
#member-app .group-library-tabs{display:flex;gap:8px;margin-bottom:12px;border-bottom:1px solid #e5e7ee}
#member-app .group-library-tabs button{min-width:64px;min-height:38px;border:0;border-bottom:2px solid transparent;background:transparent;font-size:14px;color:#8d93a0}
#member-app .group-library-tabs button.selected{border-bottom-color:#427ece;color:#3670b9;font-weight:600}
#member-app .group-library-items{background:#fff;border-radius:12px;overflow:hidden}
#member-app .group-library-item{display:flex;align-items:center;gap:12px;min-height:75px;padding:14px;border-bottom:1px solid #eef0f5}
#member-app .group-library-item[hidden]{display:none!important}
#member-app .group-library-file-icon{flex:0 0 40px;display:grid;place-items:center;width:40px;height:40px;border-radius:9px;background:#f0f3fa;color:#5f7fa8;font-size:23px}
#member-app .group-library-file-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
#member-app .group-library-file-copy strong{font-size:13px;font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#member-app .group-library-file-copy small{font-size:11px;color:#9da3ac}
#member-app .group-library-item-actions{display:flex;align-items:center;gap:9px;flex:none}
@media(max-width:410px){
  #member-app .group-library-item{flex-wrap:wrap;gap:9px 12px}
  #member-app .group-library-file-copy{flex:1 1 calc(100% - 52px)}
  #member-app .group-library-item-actions{margin-left:52px;width:calc(100% - 52px);justify-content:flex-end}
}
#member-app .group-library-download{flex-shrink:0;color:#377aca;font-size:12px;text-decoration:none}
#member-app .group-library-download:not(a){color:#9da4af}
#member-app .group-library-empty{padding:40px 15px;text-align:center;font-size:13px;color:#969caa}
#member-app .group-library-more{display:block;width:100%;min-height:44px;border:0;background:transparent;color:#377aca}
#member-app .group-library-more[hidden]{display:none!important}
#member-app .group-library-footer{padding:11px 15px max(14px,env(safe-area-inset-bottom));border-top:1px solid #e5e8ef;background:#fff}
#member-app .group-library-footer p{min-height:18px;margin:0 0 8px;font-size:12px;color:#677689}
#member-app .group-library-upload-actions{display:flex;gap:10px}
#member-app .group-library-upload-actions button{flex:1;height:43px;border:0;border-radius:9px;background:#397cca;color:#fff;font-size:14px}
#member-app .group-library-upload-actions button:disabled{background:#cdd3dd;color:#fff}
#member-app .group-library-footer small{display:block;margin-top:9px;font-size:11px;color:#a1a7b2;line-height:1.5}
/* Keep a compact icon-only attachment button in the chat composer. */
#member-app .compose-tool[data-compose-action="file"]{width:34px;min-width:34px;gap:0;padding:0}
@media(max-width:760px){#member-app .group-library-panel{width:100vw;border:0;box-shadow:none}}

#member-app .group-library-file-icon{position:relative;overflow:hidden}
#member-app .group-library-file-icon>img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;background:#eff3fa}

/* V1.1.113: independent file removal, scoped to group moderation privilege. */
#member-app .group-library-delete{flex-shrink:0;min-width:42px;min-height:34px;border:1px solid #f0d0d0;border-radius:7px;background:#fff8f8;color:#ad4545;font-size:12px;cursor:pointer}
#member-app .group-library-delete:disabled{opacity:.45;cursor:default}
#member-app #chat-info-panel .chat-info-row[hidden]{display:none!important}

/* V1.1.129 - Operating-grade navigation and centered empty conversation list.
   Keep the same hierarchy on desktop and H5; only the redundant title/footers are removed. */
#member-app .rail-settings svg{width:24px;height:24px;stroke-width:1.8}
#member-app .rail-settings span{display:block;font-size:10px;line-height:1.15;font-weight:inherit}
#member-app #group-list{display:flex;flex-direction:column;align-items:stretch;padding-bottom:0}
#member-app #group-list > .group-row,#member-app #group-list > .dm-inbox-item,#member-app #group-list > .dm-inbox-row,#member-app #group-list > .dm-inbox-load{flex-shrink:0}
#member-app #group-list > .empty:only-child:not([hidden]){
  display:flex;align-items:center;justify-content:center;flex:1 0 auto;
  min-height:0;margin:0;padding:20px 16px;line-height:1.5;
  text-align:center;color:#929baa;font-size:13px;
}
:root[data-chat-theme="dark"] #member-app #group-list > .empty:only-child:not([hidden]){color:#a2afc2}
@media(max-width:760px){
  #member-app .search-wrap{padding-top:calc(10px + env(safe-area-inset-top))}
  #member-app #group-list > .empty:only-child:not([hidden]){font-size:14px}
}

/* V1.1.132 / 编辑资料：与正式运营版全站对话框一致的标题、行式表单和操作栏。 */
#member-app .member-profile-edit{
  padding:0;overflow:hidden;width:min(460px,calc(100vw - 24px));
  border:1px solid var(--ui-border,#e7ebf2);border-radius:14px;
  background:var(--ui-surface,#fff);box-shadow:0 22px 66px rgba(22,36,60,.22);
}
#member-app .member-profile-edit-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:61px;padding:12px 20px;border-bottom:1px solid var(--ui-line,#edf0f5);
}
#member-app .member-profile-edit-head h2{margin:0;font-size:17px;font-weight:650;color:var(--ui-ink,#293448)}
#member-app .member-profile-edit-close{
  border:0;background:transparent;color:#7e8b9e;font-size:24px;line-height:1;
  border-radius:8px;width:34px;height:34px;cursor:pointer;display:grid;place-items:center;
}
#member-app .member-profile-edit-close:hover{background:#f1f4fa;color:#33465f}
#member-app .member-profile-edit-close:focus-visible{outline:2px solid #83aaf2;outline-offset:1px}
#member-app .member-profile-edit form{display:flex;flex-direction:column;gap:0}
#member-app .member-profile-edit-body{padding:21px 22px 17px;display:grid;gap:20px}
#member-app .member-profile-edit-field{display:grid;gap:9px;min-width:0;margin:0}
#member-app .member-profile-edit-field>span{font-size:13px;color:#3b485d;font-weight:600}
#member-app .member-profile-edit .member-profile-edit-input{
  width:100%;min-height:45px;margin:0;padding:11px 13px;
  border-radius:9px;border:1px solid #dce3ed;background:#fafbfd;
  font:inherit;font-size:14px;color:#29384d;transition:border-color .16s,box-shadow .16s,background .16s;
}
#member-app .member-profile-edit textarea.member-profile-edit-input{min-height:112px;resize:vertical;max-height:220px;line-height:1.55}
#member-app .member-profile-edit .member-profile-edit-input:focus{
  outline:0;background:#fff;border-color:#79a3ea;box-shadow:0 0 0 3px rgba(52,120,246,.11)
}
#member-app .member-profile-edit .chat-operation-validation{min-height:0;margin:0;font-size:12px}
#member-app .member-profile-edit .chat-operation-buttons{
  display:flex;gap:10px;justify-content:flex-end;margin:0;padding:15px 22px;
  background:#fafbfd;border-top:1px solid var(--ui-line,#edf0f5);
}
#member-app .member-profile-edit .chat-operation-buttons button{min-width:86px;min-height:39px;border-radius:8px;font-size:13px}
#member-app .member-profile-edit .chat-operation-buttons .chat-operation-accept{background:var(--ui-primary,#3478f6);border-color:var(--ui-primary,#3478f6);color:#fff}
#member-app .member-profile-edit .chat-operation-buttons .chat-operation-accept:disabled{opacity:.48;cursor:not-allowed}
@media(max-width:560px){
  #member-app .member-profile-edit-head{padding:12px 16px;min-height:57px}
  #member-app .member-profile-edit-body{padding:19px 16px 16px;gap:17px}
  #member-app .member-profile-edit .chat-operation-buttons{padding:13px 16px calc(13px + env(safe-area-inset-bottom))}
  #member-app .member-profile-edit .chat-operation-buttons button{flex:1;font-size:14px}
  #member-app .member-profile-edit .member-profile-edit-input{font-size:16px}
}
:root[data-chat-theme="dark"] #member-app .member-profile-edit .member-profile-edit-input{
  background:#283448;color:#f0f4fa;border-color:#46536b;
}
:root[data-chat-theme="dark"] #member-app .member-profile-edit .member-profile-edit-head,
:root[data-chat-theme="dark"] #member-app .member-profile-edit .chat-operation-buttons{
  background:#222b3a;border-color:#46536b;
}
:root[data-chat-theme="dark"] #member-app .member-profile-edit .member-profile-edit-field>span,
:root[data-chat-theme="dark"] #member-app .member-profile-edit-head h2{color:#e9eef8}

/* V1.1.140: the number is a NORMAL row inside the existing group info card.
   Copy is a compact inline action, not an extra floating card or tall boxed control. */
#member-app .group-number-inline{
  display:inline-flex;justify-content:flex-end;align-items:center;gap:10px;
  min-width:0;max-width:calc(100% - 75px);margin-left:auto;
}
#member-app .group-number-inline strong{
  flex:0 1 auto;min-width:0;max-width:none;overflow-wrap:anywhere;
  letter-spacing:.02em;font-variant-numeric:tabular-nums;user-select:text;
}
#member-app .group-number-inline button{
  flex:none;display:inline-flex;align-items:center;justify-content:center;
  min-height:28px;min-width:36px;padding:3px 0 3px 8px;
  border:0;border-radius:6px;background:transparent;color:#3478f6;
  font:inherit;font-size:13px;font-weight:500;cursor:pointer;
}
#member-app .group-number-inline button:hover{color:#2564dc;background:transparent}
#member-app .group-number-inline button:disabled{opacity:.4;cursor:default}
#member-app .group-number-inline button:focus-visible{outline:2px solid #5c92cb;outline-offset:2px}
:root[data-chat-theme="dark"] #member-app .group-number-inline button{color:#85b5ff}

#member-app .group-lookup-shortcut{align-self:center;margin:0 auto 16px;padding:10px 18px;background:#f0f6fd;border:1px solid #d7e4f3;border-radius:9px;color:#41688d;font-size:13px;cursor:pointer}
#member-app .group-lookup-shortcut:focus-visible{outline:2px solid #5c92cb;outline-offset:2px}

/* V1.1.156: 只有一种可用群分类时，删除虚假的单项标签栏；空列表只保留居中找群入口。 */
#member-app .group-list.group-empty-view,
#member-app .contacts-results.group-empty-view{
  display:flex;flex-direction:column;align-items:stretch;justify-content:center;min-height:0;
}
#member-app .group-empty-center{
  flex:1 1 auto;min-height:150px;display:flex;align-items:center;justify-content:center;
  padding:24px 16px max(24px,env(safe-area-inset-bottom));
}
#member-app .group-empty-discover{
  appearance:none;min-height:44px;min-width:144px;max-width:100%;padding:10px 20px;
  border:1px solid #cddff1;border-radius:10px;background:#f7faff;color:#3768a0;
  font-size:14px;font-weight:650;line-height:1.4;cursor:pointer;
  box-shadow:0 3px 10px rgba(58,104,157,.06);
}
#member-app .group-empty-discover:hover{background:#edf5ff;border-color:#9ec3e7;}
#member-app .group-empty-discover:focus-visible{outline:2px solid #4084ce;outline-offset:3px;}
#member-app .contacts-list-view.has-no-groups .contacts-add{visibility:hidden;pointer-events:none;}
@media(max-width:350px){#member-app .group-empty-center{padding-inline:10px;}}