.wcs-drawer{position:fixed;inset:0 0 0 auto;margin:0;width:340px;max-width:calc(100vw - 20px);height:100dvh;max-height:100dvh;padding:0;border:0;border-left:1px solid #dde4d8;background:#f8faf6;color:#34462d;box-shadow:-8px 0 36px #20351916;overflow:hidden;font-family:inherit;box-sizing:border-box}.wcs-drawer[open]{display:flex;flex-direction:column;z-index:1500}.wcs-drawer::backdrop{background:#22311e25}.wcs-header{display:flex;align-items:center;justify-content:space-between;padding:18px 21px;background:#fbfcfa;border-bottom:1px solid #e3e9dd;flex:none}.wcs-header h2{margin:0;font-size:17px;font-weight:600}.wcs-header button{background:none;border:0;color:#8b9b7d;font-size:25px;line-height:1;padding:3px 6px;border-radius:5px;cursor:pointer}.wcs-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding-bottom:20px}.wcs-section{padding:20px 21px;border-bottom:1px solid #e5ebdf}.wcs-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;margin-bottom:17px}.wcs-text{background:transparent;border:0;color:#3d8053;font-size:12px;padding:3px 0;cursor:pointer;flex:none}.wcs-member-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px 9px}.wcs-member{display:flex;align-items:center;flex-direction:column;gap:8px;padding:0;min-width:0;border:0;background:transparent;cursor:pointer}.wcs-avatar{position:relative;width:45px;height:45px;display:grid;place-items:center;background:#e3eddc;color:#62824f;border-radius:7px;font-size:18px;flex:none}.wcs-avatar i{position:absolute;bottom:-3px;right:-3px;padding:1px 3px;font-size:8px;font-weight:600;font-style:normal;background:#f0f7e9;color:#598752;border:1px solid #ccddc0;border-radius:3px}.wcs-member>span:last-child{display:block;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#7f9470}.wcs-person{display:flex;align-items:center;gap:13px;min-width:0}.wcs-person>div{min-width:0;display:flex;flex-direction:column;gap:7px}.wcs-person b{font-size:15px;font-weight:500;overflow-wrap:anywhere}.wcs-person small{font-size:11px;color:#8fa180;overflow-wrap:anywhere}.wcs-section form>label{display:block;margin-bottom:10px;color:#829672;font-size:12px}.wcs-edit{display:flex;align-items:center;gap:10px}.wcs-edit input{width:100%;min-width:0;border:1px solid #dce5d4;border-radius:5px;background:#fff;color:#354a2b;outline:0;font:inherit;font-size:12px;line-height:1.6;padding:8px 9px;box-sizing:border-box}.wcs-edit input:focus{border-color:#99bd83}.wcs-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:39px;width:100%;padding:8px 0;border:0;background:transparent;color:#4a5e3d;font-size:13px;text-align:left;cursor:pointer}.wcs-row>span:last-child:not(:first-child){color:#9bad8d;font-size:19px}.wcs-switch{position:relative;width:32px;height:19px;background:#d8e2d0;border-radius:11px;flex:none}.wcs-switch:after{content:'';position:absolute;left:2px;top:2px;width:15px;height:15px;border-radius:50%;background:white;box-shadow:0 1px 2px #253a181c}.wcs-switch.on{background:#4b9161}.wcs-switch.on:after{left:15px}.wcs-last{border:0;padding-top:13px;padding-bottom:8px}.wcs-hide{color:#987e69}.wcs-note{font-size:11px;line-height:1.7;color:#9eae8e;margin:5px 0 0}.wcs-error{margin:10px 21px;color:#a5624c;font-size:12px;line-height:1.8;overflow-wrap:anywhere}.wcs-error button{margin-left:9px}.wcs-drawer button:disabled,.wcs-context-menu button:disabled{opacity:.45;cursor:default}.wcs-drawer button:focus-visible,.wcs-folders button:focus-visible,.wcs-search-results button:focus-visible{outline:2px solid #85ad71;outline-offset:3px}.wcs-context-menu{position:fixed;z-index:1600;width:220px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:auto;box-sizing:border-box;border:1px solid #dee7d6;border-radius:8px;padding:6px;background:#fbfcfa;box-shadow:0 8px 30px #23391c22;color:#425935}.wcs-context-menu[hidden]{display:none}.wcs-context-menu button{display:block;width:100%;text-align:left;padding:10px 12px;border:0;border-radius:5px;background:transparent;color:inherit;font-family:inherit;font-size:13px;line-height:1.4;cursor:pointer}.wcs-context-menu button:hover,.wcs-context-menu button:focus-visible{background:#eaf3e3;outline:0}.wcs-context-menu button:last-child{border-top:1px solid #e5eddd;margin-top:5px;padding-top:12px;border-top-left-radius:0;border-top-right-radius:0;color:#967f69}.wcs-context-menu button:disabled:hover{background:transparent}.wcs-folders{display:flex;gap:5px;padding:8px 12px 6px;overflow:auto;flex:none;border-bottom:1px solid #e6eadf}.wcs-folders[hidden]{display:none}.wcs-folders button{display:flex;align-items:center;gap:5px;flex:none;background:transparent;border:0;border-radius:5px;color:#8d9c7e;font-size:11px;padding:6px 8px;cursor:pointer}.wcs-folders button[aria-pressed=true]{background:#e6f0df;color:#517842}.wcs-folders small{font-size:10px;opacity:.8}.conversation-row[data-local-pinned]:not(.selected){background:#f0f4eb}.conversation-row[data-local-muted] .conversation-snippet{padding-right:15px}.conversation-row[data-local-muted] .conversation-snippet:after{content:'◌';position:absolute;right:9px;bottom:14px;color:#acb69e;font-size:14px}.wcs-search-match{outline:2px solid #c4dcb3;outline-offset:4px;border-radius:6px}.wcs-search-current{outline-color:#78a75e!important;background:#b4d79012}.wcs-search-results{position:fixed;z-index:1450;right:24px;top:80px;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:9px 12px;border:1px solid #dbe6d0;border-radius:7px;background:#fcfdf9;color:#5f7a4d;box-shadow:0 5px 20px #26451a16;font-size:12px;box-sizing:border-box}.wcs-search-results>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wcs-search-results b{font-weight:400}.wcs-search-results button{padding:2px 4px;border:0;background:transparent;color:#6e8d5b;font-size:16px;cursor:pointer;flex:none}.wcs-search-results button:disabled{opacity:.35;cursor:default}@media(max-width:420px){.wcs-drawer{width:calc(100vw - 26px)}.wcs-header{padding:17px 19px}.wcs-section{padding:19px}.wcs-search-results{right:16px;top:76px;gap:7px}}
[data-theme=dark] .wcs-drawer,[data-theme=dark] .wcs-context-menu{background:#18231a;color:#d1deca;border-color:#34442d}[data-theme=dark] .wcs-header{background:#1a271b;border-color:#34442d}[data-theme=dark] .wcs-section,[data-theme=dark] .wcs-folders{border-color:#34442d}[data-theme=dark] .wcs-edit input{background:#101a11;border-color:#3e5235;color:#d7e7ca}[data-theme=dark] .wcs-row{color:#c4d5b8}[data-theme=dark] .wcs-avatar{background:#30422a;color:#b6d29f}[data-theme=dark] .wcs-person small,[data-theme=dark] .wcs-member>span:last-child,[data-theme=dark] .wcs-note{color:#8a9e7b}[data-theme=dark] .wcs-context-menu button:hover,[data-theme=dark] .wcs-context-menu button:focus-visible{background:#304328}[data-theme=dark] .wcs-context-menu button:last-child{border-color:#34442d}[data-theme=dark] .wcs-folders button[aria-pressed=true],[data-theme=dark] .conversation-row[data-local-pinned]:not(.selected){background:#233220;color:#bdd4ac}[data-theme=dark] .wcs-search-results{background:#20301b;border-color:#435e36;color:#c8e0b8}

/* Group details use the neutral, compact drawer rhythm of desktop chat. */
.wcs-header button img,.wcs-history-header button img{width:18px;height:18px;display:block;transform:rotate(45deg);opacity:.55}
.wcs-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.wcs-avatar .wcs-avatar-default{width:26px;height:26px;opacity:.6;object-fit:contain}
.wcs-drawer{inset:0 0 0 auto;width:320px;height:100dvh;max-height:100dvh;background:var(--panel-surface,#fafafa);color:var(--ink,#252e2a);border-color:var(--line,#e7e7e7);box-shadow:none}
.wcs-drawer .wcs-header{padding:10px 22px;background:transparent;border:0;min-height:40px}
.wcs-drawer .wcs-header h2{font-size:13px;font-weight:500;color:var(--muted,#8a8a8a)}
.wcs-drawer .wcs-section{margin:0 22px;padding:22px 0;border-color:var(--faint,#eeeeee)}
.wcs-drawer .wcs-members-section{padding-top:4px;padding-bottom:18px}
.wcs-member-search{display:flex;gap:8px;align-items:center;padding:0 10px;height:36px;border:1px solid var(--line,#dedede);border-radius:6px;background:var(--field-surface,#fff)}
.wcs-member-search>img{width:16px;height:16px;opacity:.5;flex:none}
.wcs-member-search input{width:100%;min-width:0;border:0;background:transparent;outline:0;padding:0;font:inherit;font-size:13px;box-shadow:none;color:var(--ink)}
.wcs-member-search input:focus{outline:0;box-shadow:none}
.wcs-member-search:focus-within{border-color:var(--focus-ring,#298b6b)}
.wcs-drawer .wcs-member-count{margin:13px 0 15px;color:var(--muted);font-size:11px}
.wcs-drawer .wcs-member-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:17px 12px}
.wcs-drawer .wcs-avatar{width:44px;height:44px;border-radius:6px;background:var(--accent-soft,#e9efeb);color:var(--accent)}
.wcs-drawer .wcs-member>span:last-child{font-size:12px;color:var(--muted);line-height:17px}
.wcs-drawer .wcs-member{gap:7px;border-radius:4px}
.wcs-drawer .wcs-member:hover .wcs-avatar{outline:1px solid var(--strong-line)}
.wcs-drawer .wcs-member-add .wcs-avatar{background:transparent;border:1px dashed var(--strong-line,#cfcfcf)}
.wcs-member-add .wcs-avatar img{width:24px;height:24px;opacity:.4}
.wcs-members-more{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;border:0;background:transparent;font:inherit;font-size:12px;color:var(--muted);padding:14px 0 0;cursor:pointer}
.wcs-members-more img{width:13px;height:13px;transform:none;opacity:.45}
.wcs-members-more[aria-expanded=true] img{transform:rotate(180deg)}
.wcs-member-empty{font-size:13px;color:var(--muted);padding:15px 0;margin:0;text-align:center}
.wcs-drawer .wcs-group-info form+form{margin-top:23px}
.wcs-drawer .wcs-group-info form>label{font-size:14px;line-height:20px;color:var(--ink);margin-bottom:7px}
.wcs-drawer .wcs-value-edit{gap:8px;align-items:center}
.wcs-drawer .wcs-value-edit input{font-size:13px;line-height:22px;border:1px solid transparent;background:transparent;padding:2px 0;border-radius:3px;color:var(--muted)}
.wcs-drawer .wcs-value-edit input:hover{border-bottom-color:var(--line)}
.wcs-drawer .wcs-value-edit input:focus{border-color:var(--strong-line);padding-inline:6px;color:var(--ink);background:var(--field-surface)}
.wcs-drawer .wcs-group-info>.wcs-row:first-of-type{margin-top:15px}
.wcs-drawer .wcs-row{font-size:14px;line-height:21px;min-height:48px;padding:10px 0;color:var(--ink)}
.wcs-drawer .wcs-row:hover{background:transparent;color:var(--accent)}
.wcs-drawer .wcs-record-entry{padding:13px 0}
.wcs-drawer .wcs-record-entry .wcs-row{min-height:40px}
.wcs-chevron{width:16px;height:16px;transform:rotate(-90deg);opacity:.35;flex:none}
.wcs-drawer .wcs-preferences{padding:12px 0}
.wcs-drawer .wcs-switch{background:var(--line,#e6e6e6);width:36px;height:21px}
.wcs-drawer .wcs-switch:after{width:17px;height:17px}
.wcs-drawer .wcs-switch.on{background:#07c160}
.wcs-drawer .wcs-switch.on:after{left:17px}
.wcs-drawer .wcs-last{border:0;padding-top:14px}
.wcs-drawer .wcs-hide{color:var(--muted)}
.wcs-drawer .wcs-note{color:var(--muted)}
.wcs-drawer .wcs-text{color:var(--accent)}
@media(min-width:761px){body.wcs-group-open .chat-pane{width:calc(100% - 320px)!important;min-width:0}body.wcs-group-open>.frame:not(:has(.chat-pane))>.right{margin-right:320px}}
@media(max-width:760px){.wcs-drawer{inset:0 0 0 auto;width:320px;height:100dvh;max-height:100dvh;box-shadow:-8px 0 30px #00000012}.wcs-drawer .wcs-header{padding-top:17px;padding-bottom:17px}.wcs-drawer::backdrop{background:#00000026}}
.wcs-history{position:fixed;inset:56px 20px 20px auto;margin:0;width:650px;max-width:calc(100vw - 32px);height:min(760px,calc(100dvh - 76px));max-height:calc(100dvh - 76px);padding:0;border:1px solid var(--line);border-radius:12px;background:var(--panel-surface,#fff);color:var(--ink);font-family:inherit;box-shadow:0 16px 56px #00000020;overflow:hidden;box-sizing:border-box}
.wcs-history[open]{display:flex;flex-direction:column}
.wcs-history::backdrop{background:#00000010}
.wcs-history-header{display:flex;align-items:center;gap:14px;padding:19px 22px;border-bottom:1px solid var(--faint);flex:none}
.wcs-history-header h2{flex:1;min-width:0;margin:0;font-size:16px;font-weight:600;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wcs-history-header button{border:0;background:transparent;padding:4px;cursor:pointer}
.wcs-history-search{margin:20px 22px 12px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:7px;min-height:43px;padding:0 12px;flex:none;background:var(--field-surface)}
.wcs-history-search>img{width:18px;height:18px;opacity:.45}
.wcs-history-search input{font:inherit;font-size:14px;border:0;outline:0;box-shadow:none;padding:0;width:100%;min-width:0;background:transparent;color:var(--ink)}
.wcs-history-search:focus-within{border-color:var(--focus-ring)}
.wcs-history-tabs{display:flex;align-items:center;gap:12px;padding:0 22px;border-bottom:1px solid var(--faint);overflow:auto;flex:none}
.wcs-history-tabs button{font:inherit;font-size:13px;color:var(--text-secondary);border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;padding:12px 4px;white-space:nowrap;cursor:pointer}
.wcs-history-tabs button[aria-pressed=true]{color:var(--accent);border-bottom-color:var(--accent)}
.wcs-history-count{margin:0;padding:12px 22px 0;font-size:11px;color:var(--muted);flex:none}
.wcs-history-list{min-height:0;overflow:auto;overscroll-behavior:contain;padding:5px 22px 16px;flex:1}
.wcs-history-item{border-bottom:1px solid var(--faint);padding:16px 0}
.wcs-history-jump{display:flex;align-items:flex-start;gap:12px;width:100%;border:0;border-radius:6px;background:transparent;text-align:left;padding:4px 0;font:inherit;color:inherit;cursor:pointer}
.wcs-history-jump:hover{background:var(--row-hover)}
.wcs-history-jump>img{width:36px;height:36px;border-radius:6px;background:var(--accent-soft);padding:7px;box-sizing:border-box;opacity:.6;flex:none}
.wcs-history-jump>span{min-width:0;flex:1}
.wcs-history-stamp{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:11px;margin-bottom:7px}
.wcs-history-stamp b{font-weight:400}
.wcs-history-stamp time{font-size:10px;text-align:right}
.wcs-history-text{display:block;font-size:14px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;max-height:116px;overflow:hidden}
.wcs-history-jump .wcs-history-thumbnail{display:block;max-width:250px;max-height:160px;width:auto;height:auto;object-fit:contain;border-radius:6px;padding:0;margin-top:8px;background:transparent;opacity:1}
.wcs-history-link{display:block;margin:7px 0 0 48px;font-size:12px;color:var(--accent);overflow-wrap:anywhere}
.wcs-history-footer{padding:12px 22px;border-top:1px solid var(--faint);font-size:11px;line-height:18px;color:var(--muted);flex:none}
.wcs-history button:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
@media(max-width:760px){.wcs-history{inset:12px;width:calc(100vw - 24px);max-width:calc(100vw - 24px);height:calc(100dvh - 24px);max-height:calc(100dvh - 24px)}.wcs-history-header,.wcs-history-list{padding-inline:17px}.wcs-history-search{margin-inline:17px}.wcs-history-tabs{padding-inline:17px;gap:9px}.wcs-history-stamp{flex-wrap:wrap;gap:2px}}
[data-theme=dark] .wcs-drawer{background:var(--panel-surface);color:var(--ink);border-color:var(--line)}
[data-theme=dark] .wcs-drawer .wcs-header{background:transparent}
[data-theme=dark] .wcs-drawer .wcs-row{color:var(--ink)}
[data-theme=dark] .wcs-drawer img[src^="/honghub/assets/vendor/tabler/"],[data-theme=dark] .wcs-history img[src^="/honghub/assets/vendor/tabler/"]{filter:invert(1)}

.wcs-drawer{border-radius:0!important;box-shadow:none!important}

/* Muting keeps the unread marker and uses the list bell icon. */
.conversation-row[data-local-muted] .conversation-snippet:after{display:none}
.wcs-row[aria-busy="true"] .wcs-switch{opacity:.5}

/* Keep the conversation usable while its settings panel is open on desktop. */
@media(min-width:761px){body.wcs-settings-open .chat-pane{width:calc(100% - 320px)!important;min-width:0}body.wcs-settings-open>.frame[data-chat-view="employee"]>main.right:not([hidden]),body.wcs-settings-open>.frame:not([data-chat-view])>main.right:not([hidden]){margin-right:320px}}
.wcs-drawer .wcs-person{align-items:center;gap:12px}.wcs-drawer .wcs-person b{font-size:14px;font-weight:500;overflow-wrap:anywhere}.wcs-drawer .wcs-person small{font-size:12px;line-height:1.6;color:var(--muted)}
.wcs-drawer .wcs-history-entry{border:0;background:transparent}
.wcs-drawer .wcs-row{color:var(--ink)}

.wcs-avatar{position:relative}.wcs-avatar-initial{position:absolute;inset:0;display:grid;place-items:center;font-size:20px}.wcs-avatar>img[data-wcs-portrait]{position:relative;z-index:1}.wcs-avatar>img[data-wcs-portrait][hidden]{display:none}.wcs-avatar>i{z-index:2}
.wcs-history-item[data-history-target=true]{background:var(--accent-soft);border-radius:7px;padding-inline:10px}.wcs-history-footer button{font:inherit;color:var(--accent);border:0;background:transparent;cursor:pointer;padding:3px 0}.wcs-history-footer button:disabled{opacity:.5;cursor:default}

.wcs-history-context .wcs-history-text{max-height:none;overflow:visible}.wcs-history-text mark{background:var(--accent-soft);color:inherit}

/* 0.6.6 B3: kill dialog UA centering that leaves a top blank strip */
dialog.wcs-drawer{margin:0!important;padding:0!important;max-height:100dvh!important;top:0!important;bottom:0!important;}
.wcs-drawer[open]{display:flex;flex-direction:column;justify-content:flex-start;}
.wcs-scroll{flex:1 1 auto;}