:root{
  --cs-primary:#07c160;--cs-primary-dark:#06ad56;--cs-accent:#95ec69;
  --cs-link:#576b95;--cs-bg:#ededed;--cs-card:#fff;--cs-text:#191919;
  --cs-muted:#8f959e;--cs-border:#e5e5e5;--cs-danger:#e64340;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--cs-text);background:var(--cs-bg)}
.cs-app{display:flex;flex-direction:column;height:100%;height:100dvh;max-width:480px;margin:0 auto;background:#fff;box-shadow:0 0 0 1px var(--cs-border)}
.cs-hd{padding:12px 14px;background:var(--cs-primary);color:#fff;font-weight:600;display:flex;justify-content:space-between;align-items:center}
@media (max-width:768px){
  .cs-app{max-width:none;box-shadow:none}
  .cs-ft textarea,.cs-ft input[type=text]{font-size:16px}
  .cs-ft{padding-bottom:max(10px,env(safe-area-inset-bottom))}
}
.cs-msgs{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:10px}
.cs-msg{max-width:78%;padding:8px 12px;border-radius:12px;font-size:14px;line-height:1.5;word-break:break-word;position:relative}
.cs-msg-time{font-size:11px;opacity:.55;margin-top:4px}
.cs-msg.visitor .cs-msg-time{text-align:right}
.cs-scroll-bottom{position:absolute;right:16px;bottom:72px;z-index:5;display:none;border:0;background:#fff;color:var(--cs-link);border-radius:20px;padding:6px 12px;box-shadow:0 4px 16px rgba(0,0,0,.12);cursor:pointer;font-size:12px;font-weight:600}
.cs-msg.visitor{align-self:flex-end;background:var(--cs-accent);color:#111;border-bottom-right-radius:4px}
.cs-msg.agent,.cs-msg.bot,.cs-msg.system{align-self:flex-start;background:var(--cs-card);border:1px solid var(--cs-border);border-bottom-left-radius:4px}
.cs-msg.system{color:var(--cs-muted);font-size:12px}
.cs-msg img{max-width:100%;border-radius:8px;display:block}
.cs-product{min-width:160px}
.cs-product a{color:inherit;text-decoration:underline}
.cs-ft{display:flex;gap:8px;padding:10px;border-top:1px solid var(--cs-border);background:var(--cs-card);align-items:flex-end}
.cs-ft input,.cs-ft textarea{flex:1;border:1px solid var(--cs-border);border-radius:8px;padding:8px 10px;font:inherit;resize:none;max-height:120px;min-height:38px}
.cs-ft button{border:0;background:var(--cs-primary);color:#fff;border-radius:8px;padding:0 14px;cursor:pointer;font-weight:600;height:38px;flex-shrink:0}
.cs-shot-btn{background:#fff!important;color:var(--cs-primary)!important;border:1px solid #b7eb8f!important;padding:0 10px!important;font-size:13px!important}
.cs-shot-btn:disabled{opacity:.45;cursor:not-allowed}
.cs-msg.pending{opacity:.72}
.cs-msg.failed{opacity:.85;outline:1px solid #ffccc7}
.cs-msg-fail{font-size:11px;color:#cf1322;margin-top:4px}
.cs-shot-dialog{max-width:min(520px,96vw)}
.cs-shot-preview{max-height:50vh;overflow:auto;background:#f5f7fb;border-radius:8px;margin-bottom:10px;text-align:center}
.cs-shot-preview img{max-width:100%;display:block;margin:0 auto}
.cs-shot-tip{margin:0 0 12px;font-size:12px;color:#8f959e;line-height:1.4}
/* 微信式区域截图 */
.cs-crop{position:fixed;inset:0;z-index:10050;background:#0b0d12;display:flex;flex-direction:column;color:#fff}
.cs-crop-tip{flex-shrink:0;text-align:center;padding:10px 12px;font-size:13px;color:rgba(255,255,255,.85);background:rgba(0,0,0,.35)}
.cs-crop-stage{flex:1;min-height:0;position:relative;overflow:hidden;cursor:crosshair;touch-action:none}
.cs-crop-stage canvas{display:block;position:absolute;left:0;top:0;max-width:none}
.cs-crop-bar{flex-shrink:0;display:flex;gap:10px;justify-content:center;align-items:center;padding:12px 14px max(12px,env(safe-area-inset-bottom));background:rgba(0,0,0,.55);border-top:1px solid rgba(255,255,255,.08)}
.cs-crop-bar button{border:0;border-radius:8px;padding:10px 18px;font-weight:600;cursor:pointer;font-size:14px;min-width:84px}
.cs-crop-bar button.ghost{background:rgba(255,255,255,.12);color:#fff}
.cs-crop-bar #cropOk{background:#07c160;color:#fff}
.cs-crop-bar #cropOk:disabled{opacity:.4;cursor:not-allowed}
.cs-faqs{padding:8px 12px;display:flex;flex-wrap:wrap;gap:6px;background:#fff;border-bottom:1px solid var(--cs-border)}
.cs-faqs button{border:1px solid var(--cs-border);background:#fff;border-radius:999px;padding:4px 10px;font-size:12px;cursor:pointer}
.cs-login{
  max-width:380px;margin:10vh auto;background:#fff;padding:28px 24px;border-radius:12px;
  box-shadow:0 10px 40px rgba(0,0,0,.08);width:calc(100% - 32px);
}
.cs-login h1{margin:0 0 8px;font-size:22px;color:#111;font-weight:700}
.cs-login p{margin:0 0 18px;color:#888;font-size:13px;line-height:1.45}
.cs-login label{display:block;font-size:13px;margin:10px 0 4px;color:#646a73}
.cs-login input{
  width:100%;padding:11px 12px;border:1px solid #e5e5e5;border-radius:8px;font:inherit;
  background:#f7f7f7;
}
.cs-login input:focus{outline:none;background:#fff;box-shadow:inset 0 0 0 1px #07c160;border-color:#07c160}
.cs-login button{
  width:100%;margin-top:18px;padding:12px;border:0;border-radius:8px;
  background:#07c160;color:#fff;font-weight:700;cursor:pointer;font-size:15px;
}
.cs-login button:active{background:#06ad56}
body:has(#login:not([style*="display: none"])){
  background:linear-gradient(180deg,#f0faf4 0%,#ededed 45%,#e8e8e8 100%);
}
/* ===== 坐席工作台：桌面三栏 / 平板两栏 / 手机列表↔会话 ===== */
.admin{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr) minmax(280px,340px);height:100vh;height:100dvh;width:100%;overflow:hidden}
.admin .col{border-right:1px solid var(--cs-border);background:#fff;display:flex;flex-direction:column;min-width:0;min-height:0}
.admin .col-side{border-right:0;border-left:1px solid var(--cs-border)}
.admin .list{overflow:auto;flex:1;-webkit-overflow-scrolling:touch}
.admin .item{padding:12px;border-bottom:1px solid var(--cs-border);cursor:pointer;transition:background .15s}
.admin .item:hover{background:#f7f8fa}
.admin .item.active{background:#e8f8ef}
.admin .item small{color:var(--cs-muted);display:block;margin-top:4px}
.admin .item-main{display:flex;align-items:flex-start;gap:10px}
.admin .item-av{
  width:40px;height:40px;border-radius:4px;flex-shrink:0;background:#5078a8;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;
}
.admin .item-av.wx{background:#07c160}
.admin .item-body{flex:1;min-width:0}
.admin .item-id{
  font-size:11px;color:#576b95;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  user-select:text;-webkit-user-select:text;
}
.admin .item-id:active{color:#07c160}
.admin .item-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.admin .item-row strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admin .badge-unread{flex-shrink:0;min-width:18px;height:18px;padding:0 6px;border-radius:9px;background:#ff4d4f;color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;line-height:1;box-shadow:0 0 0 2px #fff}
.admin .role-tag{display:inline-block;margin-left:4px;padding:1px 6px;border-radius:4px;background:#e8f8ef;color:#07c160;font-size:11px;font-weight:600;vertical-align:middle}
.admin .item.has-unread{background:#fff7f7}
.admin .item.has-unread.active{background:#ffe8e8}
.admin .dot-on{color:#52c41a;font-size:11px}
.tabs button{position:relative}
.tabs .tab-badge{position:absolute;top:2px;right:6px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:#ff4d4f;color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center}
.tabs button.on .tab-badge{background:#fff;color:#ff4d4f}
.visitor-profile{display:flex;flex-direction:column;gap:0;margin-top:8px;border:1px solid var(--cs-border);border-radius:8px;overflow:hidden;background:#fafbfc}
.visitor-profile.biz{margin-top:10px;border-color:#c6ebd5;background:#f0faf4}
.visitor-profile .vp-empty{padding:14px;color:var(--cs-muted);font-size:12px;text-align:center}
.visitor-profile .vp-row{display:flex;gap:10px;padding:8px 10px;border-bottom:1px solid #eef0f3;font-size:12px;line-height:1.45}
.visitor-profile .vp-row:last-child{border-bottom:0}
.visitor-profile .vp-k{flex:0 0 56px;color:#8f959e;font-weight:600}
.visitor-profile .vp-v{flex:1;min-width:0;color:#1f2329;word-break:break-all}
.visitor-profile .vp-v a{color:var(--cs-link);text-decoration:none}
.visitor-profile .vp-v a:hover{text-decoration:underline}
.visitor-profile .vp-v{display:flex;align-items:flex-start;gap:6px}
.visitor-profile .vp-txt{flex:1;min-width:0;user-select:text;-webkit-user-select:text}
.visitor-profile .vp-copy{
  flex-shrink:0;border:0;background:transparent;color:#576b95;font-size:11px;padding:0 2px;cursor:pointer;line-height:1.45;
}
.visitor-profile .vp-copy:active{color:#07c160}
.visitor-profile .vp-sec{padding:6px 10px;background:#f0f2f5;color:#646a73;font-size:11px;font-weight:700;letter-spacing:.02em}
.admin .list-empty{padding:48px 16px;text-align:center;color:#8f959e;font-size:14px;line-height:1.6}
.admin .list-empty span{font-size:12px;color:#c0c4cc}
.admin .col-chat:not(.has-conv) .hd-actions{opacity:.45;pointer-events:none}
.admin.show-chat .col-chat .hd-actions{opacity:1;pointer-events:auto}
.admin .cs-hd{flex-wrap:wrap;gap:6px 8px;padding:10px 12px;min-height:48px}
.admin .hd-actions{display:flex;flex-wrap:wrap;gap:4px;align-items:center;justify-content:flex-end;max-width:100%}
.admin .hd-actions select,.admin .hd-actions button,.admin .hd-actions a{
  border:0;background:rgba(255,255,255,.2);color:#fff;border-radius:6px;padding:5px 8px;font-size:12px;cursor:pointer;text-decoration:none;white-space:nowrap;flex-shrink:0
}
.admin .hd-actions select{color:var(--cs-text);background:#fff;max-width:110px}
.admin .hd-actions .hd-primary{background:#fff;color:var(--cs-primary);font-weight:600}
.admin .hd-actions .hd-off{opacity:.55;text-decoration:line-through}
.admin .btn-back,.admin .side-toggle{display:none}
.admin .side-mask{display:none}
.admin .col-chat .cs-ft{padding-bottom:max(10px,env(safe-area-inset-bottom))}
.tabs{display:flex;gap:4px;padding:8px;border-bottom:1px solid var(--cs-border)}
.tabs button{flex:1;border:0;background:#f2f3f5;padding:8px;border-radius:6px;cursor:pointer;font-size:13px}
.tabs button.on{background:#07c160;color:#fff}
.tabs button.on .tab-badge{background:#fff;color:#07c160}
.admin .item .preview{color:var(--cs-muted);font-size:12px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admin .item-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px}
.admin .item-foot small{margin:0;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admin .item-foot time{flex-shrink:0;font-size:11px;color:#b2b2b2}
/* 右侧侧栏 Tab */
.side-tabs{display:flex;gap:2px;padding:8px 8px 0;border-bottom:1px solid var(--cs-border);background:#fafbfc;overflow-x:auto;-webkit-overflow-scrolling:touch;flex-shrink:0}
.side-tabs button{flex:0 0 auto;border:0;background:transparent;color:#646a73;padding:8px 10px;font-size:12px;font-weight:600;cursor:pointer;border-radius:6px 6px 0 0;white-space:nowrap}
.side-tabs button:hover{color:var(--cs-primary);background:#e8f8ef}
.side-tabs button.on{color:var(--cs-primary);background:#fff;box-shadow:inset 0 -2px 0 var(--cs-primary)}
.side-body{flex:1;min-height:0;min-width:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px;font-size:13px;background:#fff}
.side-panel{display:none;min-width:0;max-width:100%}
.side-panel.on{display:block}

/* 平板：会话列表 + 聊天，资料抽屉 */
@media (max-width:1100px){
  .admin{grid-template-columns:minmax(220px,280px) minmax(0,1fr)}
  .admin .col-side{
    display:none;position:fixed;top:0;right:0;bottom:0;width:min(360px,92vw);z-index:50;
    box-shadow:-8px 0 32px rgba(0,0,0,.18);border-left:0
  }
  .admin.show-side .col-side{display:flex}
  .admin .side-toggle{display:inline-block}
  .admin .side-mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:40}
  .admin.show-side .side-mask{display:block}
}

/* 手机：列表与会话全屏切换 */
@media (max-width:768px){
  .admin{grid-template-columns:1fr}
  .admin .col-list,.admin .col-chat{grid-column:1;grid-row:1;height:100dvh;border-right:0}
  .admin:not(.show-chat) .col-chat{display:none!important}
  .admin.show-chat .col-list{display:none!important}
  .admin .btn-back{display:inline-block}
  .admin .side-toggle{display:inline-block}
  .admin .col-side{
    display:none;position:fixed;top:0;right:0;bottom:0;width:min(100vw,400px);z-index:50;
    box-shadow:-8px 0 32px rgba(0,0,0,.18)
  }
  .admin.show-side .col-side{display:flex}
  .admin .side-mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:40}
  .admin.show-side .side-mask{display:block}
  .admin .list-hd .list-more-btn,.admin .chat-hd .chat-more-btn{display:inline-flex!important}
  .admin .col-list>.list-hd,.admin .col-chat>.chat-hd{position:relative;overflow:visible}
  /* 手机更多：右上角悬浮菜单，不再撑满整行 */
  .admin .list-tools,.admin .col-chat .chat-tools{
    display:none!important;position:absolute;right:8px;top:calc(100% - 2px);z-index:35;
    flex-direction:column;align-items:stretch;gap:0;
    width:min(200px,calc(100vw - 20px));max-width:none!important;
    padding:6px 0!important;background:#fff!important;
    border:1px solid #ebebeb!important;border-radius:10px!important;
    box-shadow:0 8px 28px rgba(0,0,0,.14);
  }
  .admin .list-tools.open,.admin .col-chat .chat-tools.open{display:flex!important}
  .admin .list-tools .tool-act,.admin .col-chat .chat-tools .tool-act{
    width:100%!important;max-width:none!important;justify-content:flex-start!important;
    border-radius:0!important;padding:12px 16px!important;gap:10px!important;
    color:#191919!important;background:transparent!important;
  }
  .admin .list-tools .tool-act .tool-lbl,
  .admin .col-chat .chat-tools .tool-act .tool-lbl{display:inline!important;font-size:15px}
  .admin .col-chat .chat-tools .hd-primary{color:#07c160!important}
  .admin .col-chat .chat-tools .danger{color:#e64340!important}
  .admin .col-chat .chat-tools select{
    width:100%!important;max-width:none!important;border:0!important;border-bottom:1px solid #f0f0f0!important;
    border-radius:0!important;height:44px;padding:0 16px;
  }
  .admin .col-chat .cs-ft #btnFile{min-width:38px;padding:0!important}
  .admin .col-chat .cs-ft{flex-wrap:nowrap}
  .admin .col-chat .cs-ft textarea{min-width:0;flex:1;font-size:16px}
  .admin .col-chat .cs-ft select{font-size:14px}
  .admin .col-chat .cs-msg{max-width:78%!important}
  .admin .toolbar{padding:8px}
  .admin .toolbar input{font-size:16px} /* 避免 iOS 聚焦放大 */
  .cs-login{margin:6vh auto;padding:22px 18px}
  .cs-login input{font-size:16px}
}
.queue-tip{padding:8px 12px;background:#e8f8ef;color:#06ad56;font-size:12px;display:none}
.cs-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}
.cs-dialog{background:#fff;border-radius:12px;padding:18px;width:100%;max-width:360px;box-shadow:0 12px 40px rgba(0,0,0,.18)}
.cs-dialog h3{margin:0 0 12px;font-size:16px}
.cs-dialog textarea,.cs-dialog input{width:100%;margin-bottom:10px;padding:8px 10px;border:1px solid var(--cs-border);border-radius:8px;font:inherit}
.cs-dialog-actions{display:flex;justify-content:flex-end;gap:8px}
.cs-dialog-actions button{border:0;background:var(--cs-primary);color:#fff;border-radius:8px;padding:8px 14px;cursor:pointer;font-weight:600}
.cs-dialog-actions button.ghost{background:#f2f3f5;color:var(--cs-text)}
.cs-stars{display:flex;gap:6px;margin-bottom:12px}
.cs-stars button{border:0;background:transparent;font-size:28px;color:#d9d9d9;cursor:pointer;padding:0;line-height:1}
.cs-stars button.on{color:#faad14}
.cs-offbanner{display:none;padding:8px 12px;background:#fff7e6;color:#ad6800;font-size:12px;border-bottom:1px solid #ffe58f}
.cs-msg img{cursor:zoom-in}
.cs-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.75);display:none;align-items:center;justify-content:center;z-index:2000;padding:16px;cursor:zoom-out}
.cs-lightbox img{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 12px 40px rgba(0,0,0,.4)}
.cs-cfg-row{display:flex;gap:8px;align-items:flex-start;border-bottom:1px solid #e5e6eb;padding:6px 0}
.cs-cfg-row span{flex:1;word-break:break-word}
.cs-cfg-row button{border:0;background:#ff4d4f;color:#fff;border-radius:4px;padding:2px 8px;cursor:pointer;font-size:11px;flex-shrink:0}
.ghost-btn{border:1px solid #d0d3d9!important;background:#fff!important;color:var(--cs-primary)!important;border-radius:6px;padding:4px 10px;cursor:pointer;font-size:12px;font-weight:600}
.sub-tabs{display:flex;gap:4px;margin:0 0 12px;padding:3px;background:#f2f3f5;border-radius:8px}
.sub-tabs button{flex:1;border:0;background:transparent;color:#646a73;padding:7px 6px;font-size:12px;font-weight:600;border-radius:6px;cursor:pointer}
.sub-tabs button.on{background:#fff;color:var(--cs-primary);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.sub-panel{display:none;min-width:0;max-width:100%}
.sub-panel.on{display:block}
.wx-guide-steps{margin:0;padding-left:18px;font-size:12px;line-height:1.55;color:#4e5969;max-width:100%;overflow-wrap:anywhere}
.wx-guide-steps>li{margin-bottom:8px}
.wx-guide-steps code{background:#f5f7fb;border:1px solid #e5e6eb;border-radius:4px;padding:0 4px;font-size:11px}
.wx-guide-tip{margin:10px 0 0;color:#8f959e;font-size:11px;line-height:1.4}
.wx-callback-box{display:flex;gap:6px;align-items:stretch;margin-bottom:12px}
.wx-callback-text{flex:1;font-size:11px;color:#1f2329;word-break:break-all;background:#f5f7fb;border:1px solid #e5e6eb;border-radius:8px;padding:8px;line-height:1.4;display:block}
.wx-label{display:block;font-size:12px;color:#646a73;margin:0 0 4px}
.wx-enable{display:flex;align-items:center;gap:6px;margin:4px 0 10px;font-size:12px}
.wx-enable input{width:auto!important;max-width:none;margin:0!important;padding:0!important;flex-shrink:0}
.btn-row-wx{display:flex;flex-wrap:wrap;gap:6px}
.btn-row-wx .ghost-btn{background:#fff!important}
.wx-check-list{display:flex;flex-direction:column;gap:8px;margin:0 0 12px;padding:10px;background:#fafbfc;border-radius:8px;border:1px solid #e5e6eb;width:100%;box-sizing:border-box}
.wx-check-list label{display:flex;flex-direction:row;align-items:flex-start;gap:8px;width:100%;max-width:100%;box-sizing:border-box;font-size:12px;color:#1f2329;cursor:pointer;line-height:1.45;margin:0}
.wx-check-list label>span{flex:1 1 auto;min-width:0;word-break:break-word;overflow-wrap:anywhere}
.wx-check-list input[type="checkbox"]{width:16px!important;height:16px;max-width:16px;margin:2px 0 0!important;padding:0!important;flex:0 0 16px;border:0;align-self:flex-start}
.wx-status-card{margin:0 0 12px;padding:12px;border-radius:10px;background:#f5f7fb;border:1px solid #e5e6eb}
.wx-status-card.ok{background:#f6ffed;border-color:#b7eb8f}
.wx-status-card.warn{background:#fffbe6;border-color:#ffe58f}
.wx-status-card.bad{background:#fff2f0;border-color:#ffccc7}
.wx-status-title{font-size:13px;font-weight:700;color:#1f2329;margin-bottom:4px}
.wx-status-detail{font-size:12px;color:#646a73;line-height:1.45}
.wx-prog{height:4px;background:rgba(0,0,0,.06);border-radius:2px;margin-top:10px;overflow:hidden}
.wx-prog i{display:block;height:100%;background:var(--cs-primary);border-radius:2px}
.wx-status-card.ok .wx-prog i{background:#52c41a}
.wx-status-card.warn .wx-prog i{background:#faad14}
.wx-status-card.bad .wx-prog i{background:#ff4d4f}
.wx-tip{margin-top:8px;font-size:11px;color:#ad6800;line-height:1.4}
.wx-tip.bad{color:#cf1322}
.wx-token-row{display:flex;gap:6px;margin-bottom:6px;align-items:center}
.wx-token-row input{flex:1;margin-bottom:0!important}
.wx-badge{display:inline-block;font-size:10px;padding:0 5px;border-radius:4px;background:#07c160;color:#fff;margin-left:4px;vertical-align:middle;font-weight:600}
.wx-badge.wecom{background:#2b7de9}

/* 坐席 · 会话列表顶栏 */
.admin .col-list>.list-hd{
  flex-direction:column;align-items:stretch;gap:0;padding:0;
  background:#f7f7f7!important;color:#111!important;border-bottom:1px solid #e5e5e5;min-height:0;
}
.admin .list-hd-bar{
  display:flex;align-items:center;gap:8px;padding:10px;
  min-height:48px;padding-top:max(10px,env(safe-area-inset-top));
}
.admin .list-hd-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:600;color:#111}
.admin .ico-btn{
  border:0!important;background:transparent!important;color:#576b95!important;
  width:36px;height:36px;padding:0!important;border-radius:50%!important;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
}
.admin .ico-btn:active{background:rgba(0,0,0,.06)!important;color:#07c160!important}
.admin .list-hd .list-more-btn{display:none}
.admin .list-tools{
  display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:0 10px 10px;max-width:none!important;
}
.admin .tool-act{
  display:inline-flex!important;align-items:center;justify-content:center;gap:6px;
  background:transparent!important;color:#576b95!important;border:0!important;
  border-radius:8px!important;padding:8px!important;min-width:36px;min-height:36px;
  cursor:pointer;font-size:13px!important;
}
.admin .tool-act:active{background:rgba(0,0,0,.06)!important;color:#07c160!important}
.admin .tool-act .tool-lbl{display:none}
.admin .tool-act.hd-off{opacity:.4}
.admin .tool-act.hd-primary{color:#07c160!important}
.admin .tool-act.danger{color:#e64340!important}
.admin .toolbar .toolbar-ico{
  width:36px;height:36px;background:#07c160!important;color:#fff!important;border-radius:8px!important;
}
.admin .toolbar .toolbar-ico:active{background:#06ad56!important}

/* 坐席工作台 · 中间会话区微信感 */
.admin .col-chat{background:#ededed}
.admin .col-chat>.chat-hd,
.admin .col-chat>.cs-hd.chat-hd{
  flex-direction:column;align-items:stretch;gap:0;padding:0;
  background:#f7f7f7!important;color:#111!important;border-bottom:1px solid #e5e5e5;font-weight:600;
  min-height:0;
}
.admin .chat-hd-bar{
  display:flex;align-items:center;gap:8px;padding:10px 10px;
  min-height:48px;padding-top:max(10px,env(safe-area-inset-top));
}
.admin .chat-hd-title-wrap{flex:1;min-width:0}
.admin .chat-title-row{display:flex;align-items:center;gap:2px;min-width:0;max-width:100%}
.admin .chat-hd-title-wrap #chatTitle,
.admin .chat-id-btn{
  display:block;flex:1;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:16px;font-weight:600;color:#111;border:0;background:transparent;padding:0;margin:0;
  text-align:left;cursor:pointer;user-select:text;-webkit-user-select:text;
}
.admin .chat-id-btn:active{opacity:.65}
.admin .chat-id-sub{
  display:block;margin-top:2px;font-size:11px;color:#888;font-weight:400;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;
}
.admin .chat-copy-ico{
  flex-shrink:0;width:28px;height:28px;padding:0;margin:0;border:0;border-radius:50%;
  background:transparent;color:#8f959e;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;line-height:1;
}
.admin .chat-copy-ico:active{background:rgba(0,0,0,.06);color:#07c160}
.admin .chat-copy-ico[hidden]{display:none!important}
.admin .chat-hd .btn-back{
  border:0!important;background:transparent!important;color:#576b95!important;
  border-radius:50%;width:36px;height:36px;padding:0;font-size:20px;cursor:pointer;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
}
.admin .chat-hd .chat-more-btn{display:none}
.admin .chat-tools{
  display:flex;flex-wrap:wrap;gap:2px;align-items:center;
  padding:0 8px 8px;max-width:none!important;
}
.admin .col-chat .chat-tools select{
  background:#fff!important;color:#111!important;border:1px solid #e5e5e5!important;
  border-radius:8px!important;max-width:120px;height:34px;padding:0 8px;font-size:12px;
}
.admin .col-chat #typingHint{background:#ededed;color:#b2b2b2;padding:6px 14px;font-size:12px}
.admin .col-chat .chat-empty{background:#ededed}
.admin .col-chat .chat-empty-card{border:0;box-shadow:0 2px 12px rgba(0,0,0,.06);border-radius:8px}
.admin .col-chat #chatBody{background:#ededed}
.admin .col-chat .cs-msgs{
  background:#ededed!important;padding:14px 12px;gap:14px;
}
.admin .col-chat .cs-row{display:flex;align-items:flex-start;gap:8px;max-width:100%}
.admin .col-chat .cs-row.agent,
.admin .col-chat .cs-row.bot{flex-direction:row-reverse}
.admin .col-chat .cs-avatar{
  width:36px;height:36px;border-radius:4px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;user-select:none;
}
.admin .col-chat .cs-avatar.visitor{background:#5078a8}
.admin .col-chat .cs-avatar.agent{background:#07c160}
.admin .col-chat .cs-avatar.bot{background:#8c8c8c}
.admin .col-chat .cs-msg{
  max-width:min(72%,420px)!important;padding:9px 12px!important;border-radius:4px!important;
  font-size:15px!important;line-height:1.5;border:0!important;box-shadow:none!important;
}
.admin .col-chat .cs-msg.visitor{align-self:flex-start!important;background:#fff!important;color:#111!important}
.admin .col-chat .cs-msg.agent{align-self:flex-end!important;background:#95ec69!important;color:#111!important}
.admin .col-chat .cs-msg.bot{align-self:flex-start!important;background:#fff!important;color:#111!important}
.admin .col-chat .cs-row .cs-msg{align-self:auto!important}
.admin .col-chat .cs-msg.system{
  align-self:center!important;max-width:90%!important;background:transparent!important;border:0!important;
  color:#b2b2b2!important;font-size:12px!important;padding:2px 8px!important;text-align:center;
}
.admin .col-chat .cs-msg.system .cs-msg-time{display:none}
.admin .col-chat .cs-msg-time{font-size:11px;color:rgba(0,0,0,.35)!important;opacity:1;margin-top:4px}
.admin .col-chat .cs-msg.agent .cs-msg-time{text-align:right}
.admin .col-chat .cs-msg img{max-width:min(200px,62vw);border-radius:2px}
.admin .col-chat .cs-ft{
  background:#f7f7f7!important;border-top:1px solid #e5e5e5;padding:8px 10px;
  padding-bottom:max(8px,env(safe-area-inset-bottom));flex-direction:column;align-items:stretch;gap:8px;
}
.admin .col-chat .composer-row{display:flex;gap:8px;align-items:flex-end;width:100%}
.admin .col-chat .quick-bar{
  display:flex;align-items:center;gap:6px;width:100%;
  background:#fff;border-radius:8px;padding:0 10px;min-height:34px;
  box-shadow:inset 0 0 0 1px #e8e8e8;
}
.admin .col-chat .quick-bar:focus-within{box-shadow:inset 0 0 0 1px #07c160}
.admin .col-chat .quick-ico{
  flex-shrink:0;display:inline-flex;color:#07c160;opacity:.85;
}
.admin .col-chat .quick-bar select{
  flex:1;min-width:0;width:auto!important;max-width:none!important;
  border:0!important;border-radius:0!important;background:transparent!important;
  box-shadow:none!important;padding:7px 0!important;margin:0;font-size:13px;color:#576b95;
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23b2b2b2' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 2px center!important;
  padding-right:18px!important;cursor:pointer;
}
.admin .col-chat .quick-bar select:focus{outline:none}
.admin .col-chat .cs-ft textarea{
  border:0!important;border-radius:6px;background:#fff!important;box-shadow:inset 0 0 0 1px #e5e5e5;
  width:100%;max-width:none!important;order:0!important;
}
.admin .col-chat .cs-ft textarea{flex:1;min-height:38px;font-size:15px}
.admin .col-chat .cs-ft textarea:focus{outline:none;box-shadow:inset 0 0 0 1px #07c160}
.admin .col-chat .cs-ft button{
  background:#07c160!important;color:#fff!important;border-radius:6px!important;font-weight:600;height:38px;
}
.admin .col-chat .cs-ft #btnFile{
  background:#fff!important;color:#181818!important;border:1px solid #e5e5e5!important;
  min-width:38px;width:38px;padding:0!important;border-radius:6px!important;
}
.admin .col-chat .cs-scroll-bottom{color:#576b95;background:rgba(255,255,255,.95)}

/* ========== 访客端 · 微信式会话皮肤 ========== */
body.cs-visitor{
  background:#111;
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;
}
body.cs-visitor .cs-app{
  max-width:480px;margin:0 auto;height:100%;height:100dvh;
  background:#ededed;box-shadow:none;border:0;
}
body.cs-visitor .cs-hd{
  flex-shrink:0;padding:10px 12px;padding-top:max(10px,env(safe-area-inset-top));
  background:#f7f7f7;color:#111;border-bottom:1px solid #e5e5e5;
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-weight:400;min-height:52px;
}
body.cs-visitor .cs-embed-close{
  flex-shrink:0;width:36px;height:36px;margin:0 2px 0 -6px;padding:0;border:0;
  background:transparent;color:#111;font-size:28px;line-height:1;border-radius:50%;
  display:none;align-items:center;justify-content:center;cursor:pointer;font-weight:300;
}
body.cs-visitor.cs-embed .cs-embed-close{display:inline-flex}
body.cs-visitor .cs-embed-close:active{background:rgba(0,0,0,.06)}
body.cs-visitor .cs-hd-main{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
body.cs-visitor .cs-hd-avatar{
  width:40px;height:40px;border-radius:6px;flex-shrink:0;
  background:linear-gradient(145deg,#07c160,#06ad56);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;
  box-shadow:0 1px 2px rgba(0,0,0,.08);
}
body.cs-visitor .cs-hd-meta{min-width:0}
body.cs-visitor .cs-hd-title{font-size:16px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.cs-visitor .cs-hd-sub{font-size:11px;color:#888;margin-top:2px;line-height:1.2}
body.cs-visitor .cs-hd-acts{position:relative;flex-shrink:0}
body.cs-visitor .cs-more-btn{
  border:0;background:transparent;color:#111;font-size:22px;line-height:1;
  width:36px;height:36px;padding:0;cursor:pointer;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
body.cs-visitor .cs-more-btn:active{background:rgba(0,0,0,.06)}
body.cs-visitor .cs-more-menu{
  position:absolute;right:0;top:calc(100% + 4px);z-index:40;
  min-width:132px;padding:6px 0;background:#fff;border-radius:8px;
  box-shadow:0 4px 16px rgba(0,0,0,.12);border:1px solid #ebebeb;
}
body.cs-visitor .cs-more-menu[hidden]{display:none!important}
body.cs-visitor .cs-more-menu button{
  display:block;width:100%;border:0;background:transparent;text-align:left;
  color:#191919;font-size:15px;padding:11px 16px;cursor:pointer;font-weight:400;
}
body.cs-visitor .cs-more-menu button:active{background:#f5f5f5}
body.cs-visitor .cs-offbanner{
  background:#fffbe8;color:#9a7b0a;border-bottom:1px solid #f0e6c8;font-size:12px;padding:8px 14px;
}
body.cs-visitor .queue-tip{
  background:#e8f8ef;color:#06ad56;border-bottom:1px solid #c6ebd5;font-size:12px;padding:8px 14px;
}
body.cs-visitor .cs-faqs{
  background:transparent;border:0;padding:10px 12px 0;gap:8px;
}
body.cs-visitor .cs-faqs button{
  border:0;background:#fff;color:#191919;border-radius:4px;padding:7px 12px;font-size:13px;
  box-shadow:0 1px 1px rgba(0,0,0,.04);cursor:pointer;
}
body.cs-visitor .cs-faqs button:active{background:#f5f5f5}
body.cs-visitor .cs-typing{
  padding:4px 16px 0;font-size:12px;color:#b2b2b2;
}
body.cs-visitor .cs-main{
  position:relative;flex:1;min-height:0;display:flex;flex-direction:column;
}
body.cs-visitor .cs-msgs{
  flex:1;overflow:auto;padding:12px 10px 16px;
  display:flex;flex-direction:column;gap:14px;
  -webkit-overflow-scrolling:touch;background:#ededed;
}
body.cs-visitor .cs-row{
  display:flex;align-items:flex-start;gap:8px;max-width:100%;
}
body.cs-visitor .cs-row.visitor{flex-direction:row-reverse;align-self:stretch}
body.cs-visitor .cs-row.agent,
body.cs-visitor .cs-row.bot{align-self:stretch}
body.cs-visitor .cs-avatar{
  width:36px;height:36px;border-radius:4px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;user-select:none;
}
body.cs-visitor .cs-avatar.agent,
body.cs-visitor .cs-avatar.bot{background:#07c160}
body.cs-visitor .cs-avatar.visitor{background:#5078a8}
body.cs-visitor .cs-msg{
  max-width:min(72%,300px);padding:10px 12px;border-radius:6px;font-size:16px;line-height:1.45;
  word-break:break-word;position:relative;border:0;box-shadow:none;
}
body.cs-visitor .cs-msg.visitor{
  align-self:auto;background:#95ec69;color:#111;border-radius:4px;
}
body.cs-visitor .cs-msg.agent,
body.cs-visitor .cs-msg.bot{
  align-self:auto;background:#fff;color:#111;border-radius:4px;
}
body.cs-visitor .cs-msg.system{
  align-self:center;max-width:86%;background:transparent;color:#b2b2b2;
  font-size:12px;padding:2px 10px;text-align:center;line-height:1.45;
}
body.cs-visitor .cs-msg.system .cs-msg-time{display:none}
body.cs-visitor .cs-msg-time{
  font-size:11px;color:rgba(0,0,0,.35);margin-top:4px;opacity:1;
}
body.cs-visitor .cs-msg.visitor .cs-msg-time{color:rgba(0,0,0,.35);text-align:right}
body.cs-visitor .cs-msg img{
  max-width:180px;border-radius:2px;display:block;margin:-2px;
}
body.cs-visitor .cs-msg.pending{opacity:.7}
body.cs-visitor .cs-msg.failed{outline:1px solid #e64340}
body.cs-visitor .cs-msg-fail{color:#e64340;font-size:11px}
body.cs-visitor .cs-scroll-bottom{
  right:12px;bottom:12px;background:rgba(255,255,255,.95);color:#576b95;
  box-shadow:0 2px 10px rgba(0,0,0,.12);border-radius:16px;font-weight:500;
}
body.cs-visitor .cs-ft{
  flex-shrink:0;gap:8px;padding:8px 10px;padding-bottom:max(8px,env(safe-area-inset-bottom));
  background:#f7f7f7;border-top:1px solid #e5e5e5;align-items:flex-end;
}
body.cs-visitor .cs-tool-btn{
  width:38px;height:38px;padding:0!important;border:0!important;border-radius:6px!important;
  background:transparent!important;color:#181818!important;display:inline-flex;
  align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
}
body.cs-visitor .cs-tool-btn:active{background:rgba(0,0,0,.06)!important}
body.cs-visitor .cs-ft textarea{
  flex:1;border:0;border-radius:6px;background:#fff;padding:9px 12px;
  min-height:38px;max-height:120px;font-size:15px;line-height:1.4;
  box-shadow:inset 0 0 0 1px #e5e5e5;
}
body.cs-visitor .cs-ft textarea:focus{outline:none;box-shadow:inset 0 0 0 1px #07c160}
body.cs-visitor .cs-send{
  height:38px;min-width:64px;padding:0 14px;border:0;border-radius:6px;
  background:#07c160;color:#fff;font-weight:600;font-size:14px;cursor:pointer;
}
body.cs-visitor .cs-send:active{background:#06ad56}
body.cs-visitor .cs-dialog{border-radius:12px}
body.cs-visitor .cs-dialog-actions button{background:#07c160}
body.cs-visitor .cs-dialog-actions button.ghost{background:#f2f2f2;color:#111}
@media (max-width:768px){
  body.cs-visitor .cs-app{max-width:none}
  body.cs-visitor .cs-ft textarea{font-size:16px}
}
