:root{
  --bg:#070f1f; --bg2:#0b1a33; --panel:#0f2140; --panel2:#132a50;
  --line:#1e3a63; --text:#e9f0fb; --muted:#8fa6c8;
  --gold:#d9b45a; --gold2:#f2d78b; --green:#2ecc71; --red:#e5544b; --blue:#4a8cff;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;background:radial-gradient(1200px 700px at 15% -10%,#11305c 0%,var(--bg) 55%) no-repeat,var(--bg);
  color:var(--text);font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Noto Sans SC",Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.hidden{display:none !important}
.muted{color:var(--muted)}
.tiny{font-size:12px}
h1,h2,h3{margin:0;font-weight:650}
a{color:var(--gold2);text-decoration:none}

/* ---------- login ---------- */
.login-wrap{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px}
.login-card{
  width:100%;max-width:390px;background:linear-gradient(180deg,var(--panel) 0%,#0c1b34 100%);
  border:1px solid var(--line);border-radius:18px;padding:26px 24px 22px;
  box-shadow:0 30px 60px rgba(0,0,0,.45);
}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.brand h1{font-size:22px;letter-spacing:.5px}
.brand p{margin:2px 0 0;font-size:13px}
.logo{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--gold),#a97f24);color:#0a1526;font-weight:800;font-size:20px;
  box-shadow:0 6px 18px rgba(217,180,90,.28);
}
.brand.small{margin:0 0 20px;padding:0 4px}
.brand.small .logo{width:34px;height:34px;font-size:16px;border-radius:10px}
.brandlogo{width:38px;height:38px;border-radius:11px;flex:none;display:block;filter:drop-shadow(0 6px 14px rgba(217,180,90,.25))}
.brandtxt{line-height:1.25;min-width:0}
.brandtxt b{font-size:15.5px;letter-spacing:.6px}
.brandtxt span{display:inline-block;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 登录卡片顶部：品牌 logo + 魔方机器人 */
.lc-head{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.lc-logo{width:52px;height:52px;border-radius:14px;display:block;flex:none;
  filter:drop-shadow(0 8px 20px rgba(217,180,90,.28))}
.lc-brand{min-width:0;line-height:1.25}
.lc-brand .lc-name{font-size:19px;font-weight:700;letter-spacing:.6px}
.lc-tag{font-size:11.5px;color:var(--muted);letter-spacing:.4px;margin-top:3px}
.lc-avatar{display:none}

/* 顶栏品牌块 */
.brandchip{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border-radius:12px;
  border:1px solid rgba(217,180,90,.35);background:linear-gradient(145deg,rgba(217,180,90,.14),rgba(217,180,90,.03));
  font-size:13.5px;font-weight:650;letter-spacing:.4px;color:var(--gold2);white-space:nowrap}
.brandchip img{width:24px;height:24px;border-radius:7px;display:block}
@media(max-width:900px){.brandchip{order:-1;padding:5px 10px 5px 6px;font-size:12.5px}.brandchip img{width:20px;height:20px}}

/* 复制开通文字 */
.copybox{margin-top:10px;border:1px solid var(--line);border-radius:12px;background:#0a1830;padding:10px 12px}
.copytext{margin:0 0 10px;white-space:pre-wrap;word-break:break-word;font:12.5px/1.6 ui-monospace,Menlo,monospace;
  color:#cfe0f7;background:#08152a;border:1px solid var(--line);border-radius:8px;padding:9px 10px;max-height:190px;overflow:auto}
label{display:block;font-size:12.5px;color:var(--muted);margin:14px 0 6px;letter-spacing:.3px}
input,textarea,select{
  width:100%;background:#0a1830;border:1px solid var(--line);color:var(--text);
  border-radius:10px;padding:11px 12px;font:inherit;outline:none;
}
input:focus,textarea:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,180,90,.12)}
textarea{min-height:90px;resize:vertical}
.pw{position:relative}
.pw input{padding-right:44px}
.eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--muted);font-size:17px;cursor:pointer;padding:6px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  border:1px solid var(--line);background:var(--panel2);color:var(--text);
  padding:10px 14px;border-radius:10px;font:inherit;cursor:pointer;transition:.15s;
}
.btn:hover{filter:brightness(1.12)}
.btn.primary{background:linear-gradient(145deg,var(--gold),#bb8f2e);border:0;color:#08111f;font-weight:700}
.btn.ghost{background:transparent}
.btn.small{padding:6px 10px;font-size:12.5px;border-radius:8px}
.btn.del{padding:9px 16px;font-size:13.5px;border-radius:9px;min-height:36px;display:inline-flex;align-items:center;gap:6px;background:linear-gradient(180deg,#e0575f,#c33f47);border-color:#e0575f;color:#fff;font-weight:600}
.btn.del:hover{filter:brightness(1.1)}
@media (pointer:coarse){.citem .cact{display:flex !important}}
.btn.danger{background:#3a1520;border-color:#5c2331;color:#ff9a9a}
.btn.block{width:100%;margin-top:18px;padding:12px}
.err{color:#ff8d8d;font-size:13px;min-height:18px;margin:10px 0 0}

/* ---------- shell ---------- */
.app{display:flex;min-height:100vh}
.side{
  width:232px;flex:0 0 232px;border-right:1px solid var(--line);
  background:linear-gradient(180deg,#0a172c,#081326);padding:18px 14px;display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;
}
nav{display:flex;flex-direction:column;gap:3px;flex:1;overflow-y:auto;padding-right:2px;scrollbar-width:thin}
/* 菜单分组标题 */
.nav-group{margin-bottom:14px}
.nav-group:last-child{margin-bottom:0}
.nav-group-h{
  font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:#5f7ba4;
  padding:0 8px;margin:0 0 7px;display:flex;align-items:center;gap:8px;font-weight:700;
}
.nav-group-h::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(95,123,164,.35),transparent)}
/* 按钮本体：图标胶囊 + 文字，悬停轻微右移+金色描边 */
#nav .nav-item{gap:10px;padding:7px 10px;border-radius:11px}
#nav .nav-item .nav-txt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.2px}
#nav .nav-item::after{
  content:"";position:absolute;inset:0;border-radius:11px;pointer-events:none;
  background:radial-gradient(120px 40px at 10% 50%,rgba(74,140,255,.16),transparent 70%);opacity:0;transition:opacity .2s;
}
#nav .nav-item:hover::after{opacity:1}
#nav .nav-item:active{transform:scale(.985)}
.nav-item.active .nav-txt{color:#ffe9b6}

nav::-webkit-scrollbar{width:6px}
nav::-webkit-scrollbar-thumb{background:rgba(217,180,90,.22);border-radius:8px}
.nav-item{
  position:relative;display:flex;align-items:center;gap:11px;padding:8px 11px;border-radius:12px;color:var(--muted);
  cursor:pointer;font-size:13.5px;border:1px solid transparent;transition:background .16s,color .16s,transform .16s,border-color .16s;
}
.nav-item .nic{
  width:26px;height:26px;flex:none;display:grid;place-items:center;border-radius:8px;font-size:14px;line-height:1;
  background:rgba(74,140,255,.10);border:1px solid rgba(74,140,255,.14);transition:.16s;
}
.nav-item:hover{background:#0f2340;color:var(--text);transform:translateX(2px);border-color:rgba(74,140,255,.18)}
.nav-item:hover .nic{background:rgba(74,140,255,.18);border-color:rgba(74,140,255,.3)}
.nav-item.active{
  background:linear-gradient(90deg,rgba(217,180,90,.20),rgba(217,180,90,.03) 70%,transparent);
  color:var(--gold2);border-color:rgba(217,180,90,.32);font-weight:650;
  box-shadow:0 6px 18px rgba(217,180,90,.10),inset 0 1px 0 rgba(255,255,255,.03);
}
.nav-item.active::before{
  content:"";position:absolute;left:-1px;top:18%;bottom:18%;width:3px;border-radius:3px;
  background:linear-gradient(180deg,var(--gold2),var(--gold));box-shadow:0 0 10px rgba(217,180,90,.55);
}
.nav-item.active .nic{background:linear-gradient(145deg,var(--gold),#b78d2c);border-color:rgba(217,180,90,.5);
  color:#0a1526;box-shadow:0 4px 12px rgba(217,180,90,.30)}
.nav-item .badge{margin-left:auto;background:linear-gradient(145deg,#e5544b,#b8342c);color:#fff;font-size:10.5px;font-weight:700;
  border-radius:20px;padding:1px 7px;box-shadow:0 3px 10px rgba(229,84,75,.35)}
.side-foot{display:flex;gap:8px;margin-top:10px}
.side .brand.small{position:relative;padding:0 6px 14px;margin-bottom:14px;border-bottom:1px solid rgba(30,58,99,.55)}
.side .brand.small .brandlogo{filter:drop-shadow(0 4px 12px rgba(217,180,90,.35))}
.side .brandtxt b{color:var(--gold2);font-weight:750}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 22px;border-bottom:1px solid var(--line);background:rgba(8,19,38,.7);backdrop-filter:blur(8px);
  position:sticky;top:0;z-index:5;
}
.topbar h2{font-size:17px}
.topbar-right{display:flex;gap:8px;align-items:center}
.tag{border:1px solid var(--line);border-radius:20px;padding:4px 10px;font-size:12px;color:var(--gold2);background:#0b1c35}
.view{padding:20px 22px 60px;flex:1}

/* ---------- cards ---------- */
.grid{display:grid;gap:14px}
.grid.c4{grid-template-columns:repeat(4,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.card{background:linear-gradient(180deg,var(--panel),#0c1c36);border:1px solid var(--line);border-radius:14px;padding:16px}
.card h3{font-size:14px;margin-bottom:10px;color:var(--gold2);letter-spacing:.3px}
.stat{display:flex;flex-direction:column;gap:6px}
.stat .n{font-size:28px;font-weight:750;letter-spacing:-.5px}
.stat .l{font-size:12.5px;color:var(--muted)}
.stat .n.gold{color:var(--gold2)}
.section-title{margin:22px 0 12px;font-size:14px;color:var(--muted);letter-spacing:.4px}

/* ---------- chats ---------- */
.chat-wrap{display:grid;grid-template-columns:320px 1fr;gap:14px;height:calc(100vh - 150px);min-height:460px}
.chat-list{background:linear-gradient(180deg,var(--panel),#0b1a31);border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;overflow:hidden}
.chat-list .head{padding:12px;border-bottom:1px solid var(--line)}
.chat-items{overflow:auto;flex:1}
.citem{padding:11px 12px;border-bottom:1px solid rgba(30,58,99,.5);cursor:pointer;display:flex;justify-content:space-between;gap:8px}
.citem:hover{background:#12294a}
.citem.active{background:linear-gradient(90deg,rgba(217,180,90,.14),transparent);border-left:2px solid var(--gold)}
.citem .nm{font-size:13.5px;font-weight:600;display:flex;gap:6px;align-items:center}
.citem .sub{font-size:11.5px;color:var(--muted);margin-top:2px}
.dot{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block}
.dot.off{background:#5c6b82}
.pill{background:var(--red);color:#fff;font-size:10.5px;border-radius:20px;padding:1px 6px;height:17px;display:inline-flex;align-items:center}
.chat-pane{background:linear-gradient(180deg,var(--panel),#0b1a31);border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;overflow:hidden}
.chat-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);position:relative;z-index:4;flex:none}
.chat-body{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.bubble{max-width:74%;padding:9px 12px;border-radius:12px;font-size:13.8px;white-space:pre-wrap;word-break:break-word}
.bubble.in{background:#12294a;border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.bubble.out{background:linear-gradient(145deg,#2b4d86,#1d3866);align-self:flex-end;border-bottom-right-radius:4px}
.bubble .meta{display:block;font-size:10.5px;color:var(--muted);margin-top:5px}
.chat-input{border-top:1px solid var(--line);padding:10px;display:flex;gap:8px;align-items:flex-end}
.chat-input textarea{min-height:44px;max-height:120px}
.empty{padding:40px 16px;text-align:center;color:var(--muted);font-size:13.5px}

/* ---------- 会话页（电报风格：头像在左，名字在上，内容在名字下面） ---------- */
.chat-list-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.chat-filters{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.citem{align-items:flex-start;justify-content:flex-start}
.citem-main{flex:1;min-width:0}
.citem-main .nm{flex-wrap:wrap}
.citem-main .sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.citem-side{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:0 0 auto}
.citem .mava{margin-top:2px}
.mava{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:0 0 38px;border:1px solid var(--line);background:#12305a}
.mava.sm{width:26px;height:26px;flex:0 0 26px}
.mletter{display:flex;align-items:center;justify-content:center;color:#cfe0ff;font-weight:700;font-size:15px;background:linear-gradient(145deg,#1d3e70,#122a4d)}
.pava{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:0 0 40px;border:1px solid var(--line);background:#12305a}
.chat-head-l{display:flex;align-items:center;gap:10px;min-width:0}
.chat-head-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.chat-info-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 14px;border-bottom:1px solid var(--line);background:rgba(10,24,48,.5)}
.chat-body{gap:14px;background-image:radial-gradient(circle at 1px 1px,rgba(120,160,220,.06) 1px,transparent 0);background-size:22px 22px}
.thread-day{text-align:center;font-size:11.5px;color:var(--muted);margin:2px 0 4px}
.mrow{display:flex;gap:8px;align-items:flex-start}
.mrow.out{justify-content:flex-end}
.mava-col{flex:0 0 auto;padding-top:2px}
.mcol{display:flex;flex-direction:column;gap:4px;max-width:76%;min-width:0}
.mrow.out .mcol{align-items:flex-end}
.mname{font-size:11.5px;color:#a9c0e0;display:flex;gap:6px;align-items:baseline;font-weight:600}
.mrow.out .mname{color:#d9c07a}
.mname .mt{font-weight:400;color:var(--muted);font-size:10.5px}
.mname .medited{color:#8fa6c8}
.mname .mdel{color:var(--red)}
.bubble{max-width:100%;padding:9px 12px;border-radius:14px;font-size:13.8px;white-space:pre-wrap;word-break:break-word;line-height:1.55}
.bubble.in{background:#12294a;border:1px solid var(--line);border-bottom-left-radius:4px}
.bubble.out{background:linear-gradient(145deg,#2b4d86,#1d3866);border-bottom-right-radius:4px}
.bubble:empty{display:none}
.msgimg{display:block;max-width:250px;max-height:250px;border-radius:10px;margin-bottom:6px;border:1px solid rgba(0,0,0,.25);cursor:zoom-in}
.chat-input{position:relative;align-items:flex-end;gap:8px}
.composer-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.imgprevrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.imgprevrow.hidden{display:none}
.composer-img{position:relative;display:inline-block}
.composer-img img{height:56px;border-radius:8px;border:1px solid var(--line)}
.composer-img button{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;border:none;background:var(--red);color:#fff;font-size:11px;cursor:pointer;line-height:1}
.chat-pane.drag-on{outline:2px dashed var(--gold);outline-offset:-6px}
.btn.icon{font-size:16px;padding:8px 10px;line-height:1}
.qr-menu{position:absolute;bottom:calc(100% + 6px);right:12px;width:min(360px,80%);max-height:280px;overflow:auto;background:#0e2342;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.5);padding:6px;z-index:30}
.qr-menu.hidden{display:none}
.qr-item{padding:9px 10px;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.qr-item:hover{background:#16304f}
.tagpill{font-size:10.5px;padding:1px 6px;border-radius:20px;background:rgba(217,180,90,.16);color:#e8cd8a;border:1px solid rgba(217,180,90,.3);font-weight:500}
.tagpill.grey{background:rgba(120,140,170,.16);color:#9fb4d4;border-color:rgba(120,140,170,.3)}

/* ---------- 变量弹窗 ---------- */
.vp-ov{position:fixed;inset:0;background:rgba(4,10,20,.66);backdrop-filter:blur(3px);z-index:9500;display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px 16px}
.vp-ov.hidden{display:none}
.vp-box{width:min(1040px,100%);max-height:88vh;background:linear-gradient(180deg,#0f2545,#0b1a31);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.6);display:flex;flex-direction:column;overflow:hidden}
.vp-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.vp-head b{font-size:15px}
.vp-head .vp-x{margin-left:auto;background:transparent;border:none;color:var(--muted);font-size:16px;cursor:pointer}
.vp-box > .input{margin:12px 16px 0;width:calc(100% - 32px)}
.vp-body{overflow:auto;padding:12px 16px 18px;display:flex;flex-direction:column;gap:14px}
.vp-gh{font-size:12px;color:var(--gold2);letter-spacing:.5px;margin-bottom:8px}
.vp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.vp-chip{display:flex;flex-direction:column;gap:5px;align-items:flex-start;padding:12px 14px;border-radius:11px;border:1px solid var(--line);background:#0d2140;cursor:pointer;text-align:left;color:var(--txt)}
.vp-chip:hover{border-color:rgba(217,180,90,.5);background:#14304f}
.vp-chip b{font-size:15px;font-weight:600}
.vp-chip code{font-size:12.5px;color:var(--muted);font-family:ui-monospace,Menlo,monospace}

/* ---------- 图库 / 页内编辑器 ---------- */
.mediacard{position:relative;display:flex;flex-direction:column;gap:6px}
.mediacard .macts{display:flex;gap:6px;flex-wrap:wrap}
.mediacard .macts .btn{flex:1;justify-content:center}
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.page-head h2{margin:0 0 4px;font-size:19px}
.inline-editor{max-width:920px}
.inline-editor textarea{min-height:120px}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;font-size:13.5px}
th,td{text-align:left;padding:11px 10px;border-bottom:1px solid rgba(30,58,99,.6);vertical-align:middle}
th{color:var(--muted);font-weight:500;font-size:12px;letter-spacing:.3px}
tr:hover td{background:rgba(18,41,74,.5)}
.code{font-family:ui-monospace,Menlo,monospace;background:#0a1830;border:1px solid var(--line);border-radius:6px;padding:2px 6px;font-size:12px}
.switch{position:relative;width:40px;height:22px;background:#22334d;border-radius:20px;cursor:pointer;transition:.18s;border:1px solid var(--line)}
.switch.on{background:rgba(46,204,113,.35);border-color:rgba(46,204,113,.5)}
.switch i{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#8fa6c8;transition:.18s}
.switch.on i{left:20px;background:var(--green)}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;background:rgba(3,8,18,.72);display:flex;align-items:center;justify-content:center;padding:18px;z-index:9000}
.modal-box{width:100%;max-width:620px;background:linear-gradient(180deg,#112647,#0a172c);border:1px solid var(--line);border-radius:16px;padding:20px;max-height:90vh;overflow:auto}
.modal-box h3{margin-bottom:14px;font-size:16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.actions{display:flex;gap:8px;justify-content:flex-end;margin-top:18px}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#12345c;border:1px solid var(--line);color:var(--text);padding:10px 16px;border-radius:10px;z-index:99;font-size:13.5px}
.toast.err{background:#3a1520;border-color:#5c2331}

@media(max-width:900px){
  .app{flex-direction:column}
  .side{width:100%;flex:none;height:auto;position:static;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px}
  .side .brand{display:none}
  nav{flex-direction:row;flex-wrap:wrap;gap:6px;flex:1 1 100%;overflow:visible}
  /* 手机端：分组标题不占位，按钮平铺成可横向滚动的胶囊条 */
  .nav-group{display:contents}
  .nav-group-h{display:none}
  .nav-item{white-space:nowrap;padding:6px 10px 6px 6px;font-size:12.5px;border-radius:20px}
  .nav-item .nic{width:22px;height:22px;font-size:12px;border-radius:50%}
  .nav-item:hover{transform:none}
  .nav-item.active::before{display:none}
  .side-foot{margin:0;flex:0 0 auto;width:100%;justify-content:flex-end}
  .view{padding:14px 12px 60px}
  .grid.c4,.grid.c3,.grid.c2{grid-template-columns:1fr 1fr}
  .chat-wrap{grid-template-columns:1fr;height:auto}
  .chat-list{max-height:220px}
  .chat-pane{height:calc(100vh - 320px);min-height:380px}
  .topbar{padding:12px}
  .bubble{max-width:86%}
  /* 手机端会话头：客户名和操作按钮分两排，别再挤成一团 */
  .chat-head{flex-wrap:wrap;align-items:flex-start;gap:8px;padding:10px 12px}
  .chat-head-l{flex:1 1 100%;min-width:0}
  .chat-head-l > div{min-width:0;overflow:hidden}
  .chat-head-l b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chat-head-l .muted{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chat-head-r{flex-wrap:wrap;white-space:normal;width:100%;justify-content:flex-start;gap:6px}
  .chat-head-r .chat-bot-chip{max-width:100%;overflow:hidden;text-overflow:ellipsis}
  /* 手机没有鼠标悬停，归档 / 删除按钮常显 */
  .citem .cact{display:flex}
  .citem{padding-bottom:2px}
  .citem-side{padding-bottom:16px}
}
@media(max-width:520px){
  .grid.c4{grid-template-columns:1fr 1fr}
  .stat .n{font-size:22px}
}

/* ---------- 富文本编辑器 / 变量 ---------- */
textarea.rich-ta{width:100%;min-height:110px;resize:vertical}
.rich{position:relative;border:1px solid var(--line);border-radius:12px;background:#0a1830;padding:0;overflow:hidden;margin:6px 0 4px}
.rich-bar{display:flex;align-items:center;gap:2px;flex-wrap:wrap;padding:6px 8px;background:#0d2140;border-bottom:1px solid var(--line)}
.rich-b{background:transparent;border:1px solid transparent;color:var(--text);min-width:28px;height:26px;border-radius:7px;cursor:pointer;font:600 13px/1 inherit;padding:0 7px}
.rich-b:hover{background:#17325a;border-color:var(--line)}
.rich-b.vars{color:var(--gold2);border-color:#3a5c8f;background:#122c4f}
.rich-sep{width:1px;height:16px;background:var(--line);margin:0 4px}
.rich textarea{width:100%;border:0;background:transparent;color:var(--text);padding:10px 12px;font:inherit;outline:none;resize:vertical;min-height:110px}
.rich-hint{font-size:11.5px;color:var(--muted);padding:0 12px 8px}
.var-panel{position:absolute;right:8px;top:38px;z-index:20;width:min(420px,92%);max-height:260px;overflow:auto;background:#0e2342;border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:0 18px 40px rgba(0,0,0,.5);display:flex;flex-wrap:wrap;gap:6px}
.var-chip{display:inline-flex;align-items:center;gap:6px;background:#132c50;border:1px solid var(--line);color:var(--text);border-radius:8px;padding:5px 8px;cursor:pointer;font:inherit;font-size:12px}
.var-chip:hover{border-color:var(--gold);color:var(--gold2)}
.var-chip code{color:var(--muted);font-size:11px}
.var-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px 14px;margin-top:8px}
.var-item{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;padding:4px 2px;border-bottom:1px dashed rgba(30,58,99,.6)}
.var-item code{color:var(--gold2);font-size:12px}
.var-item span{color:var(--muted)}

/* ---------- 推送任务弹窗 ---------- */
.modal-box.wide{max-width:980px}
.pb-row{display:grid;grid-template-columns:1fr 130px 1.4fr 40px;gap:8px;margin-bottom:8px;align-items:center}
.pb-row input,.pb-row select{width:100%}
.pick-box{border:1px solid var(--line);border-radius:10px;background:#0a1830;padding:8px 10px;max-height:170px;overflow:auto}
.pick-row{display:flex;align-items:center;gap:8px;padding:4px 0;font-weight:400;margin:0;cursor:pointer}
.pick-row input{width:16px;height:16px;accent-color:var(--gold)}
.adv-box{border:1px solid var(--line);border-radius:12px;background:#0a1830;padding:10px 12px;margin-top:14px}
.adv-box summary{cursor:pointer;color:var(--gold2);font-weight:600}
.adv-box .grid{margin-top:10px}
.pv-box{border:1px solid var(--line);border-radius:12px;padding:10px;margin-top:14px;background:#08152a}
.tg-bubble{background:#132c50;border:1px solid #23456f;border-radius:14px 14px 14px 4px;padding:10px 12px;max-width:520px;word-break:break-word}
.tg-btns{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tg-btn{background:#1b3c66;border:1px solid #2d5488;border-radius:8px;padding:6px 10px;font-size:12.5px}

/* 单行输入框也套上富文本编辑框样式 */
.rich.inp{padding:0}
.rich.inp .rich-bar{padding:4px 6px;gap:1px}
.rich.inp .rich-b{min-width:26px;height:24px;font-size:12px}
.rich.inp input{width:100%;border:0;background:transparent;color:var(--text);padding:10px 12px;font:inherit;outline:none;border-radius:0}
.rich.inp:focus-within{border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,180,90,.12)}
.rich.inp .var-panel{top:34px;max-height:220px}

/* 图片库 · 机器人一键收图 */
.capcard{border:1px solid var(--line);border-radius:14px;padding:14px 14px 10px;margin-top:14px;
  background:linear-gradient(180deg,rgba(217,180,90,.08),rgba(217,180,90,0))}
.capstate{margin-top:10px;font-size:13px;color:var(--gold2,#d9b45a);min-height:18px;font-weight:600}
.capcard select.small{padding:6px 8px;border-radius:8px}

/* ---------- 登录用户卡片 / 群组下拉（v12） ---------- */
.usercard{
  display:flex;gap:10px;align-items:center;margin:-8px 0 14px;padding:10px;border:1px solid var(--line);
  border-radius:12px;background:linear-gradient(180deg,rgba(19,42,80,.85),rgba(10,24,48,.85));
}
.uavatar-wrap{position:relative;width:38px;height:38px;flex:none}
.uavatar{width:38px;height:38px;border-radius:50%;object-fit:cover;border:1.5px solid var(--gold);display:block}
.uinitial{
  position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--gold),#a97f24);color:#0a1526;font-weight:800;
}
.umeta{min-width:0;display:flex;flex-direction:column;line-height:1.3}
.umeta b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.umeta span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chatcard-side{margin:0 0 14px;padding:0 4px}
.chatsel{padding:8px 10px;font-size:13px;border-radius:10px}
.dd.chatsel{padding:0}
.chatseltop{max-width:240px}
.side .chatsel{margin-top:4px}

/* ---------- 自定义下拉（带头像，原生 select 放不进图片） ---------- */
.dd{position:relative;display:inline-block;vertical-align:middle}
.dd .dd-btn{
  display:flex;align-items:center;gap:8px;width:100%;cursor:pointer;
  background:#0a1830;border:1px solid var(--line);color:var(--text);
  border-radius:10px;padding:6px 10px;font:inherit;line-height:1.3;text-align:left;transition:.15s;
}
.dd .dd-btn:hover{border-color:#2c5288}
.dd.open .dd-btn{border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,180,90,.12)}
.dd-txt{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.25}
.dd-label{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dd-sub{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dd-caret{color:var(--muted);font-size:10px;flex:none;opacity:.8}
.dd-avwrap{position:relative;display:inline-flex;flex:none}
.dd-av{
  width:24px;height:24px;border-radius:50%;object-fit:cover;display:grid;place-items:center;
  border:1px solid rgba(217,180,90,.45);background:#0a1830;flex:none;
}
.dd-av-lg{width:32px;height:32px;font-size:14px}
.dd-letter{background:linear-gradient(145deg,var(--panel2),#0a1830);color:var(--gold2);font-weight:700;font-size:12px}
.dd-menu{
  position:absolute;z-index:80;top:calc(100% + 6px);left:0;width:max-content;min-width:100%;
  max-width:min(340px,86vw);background:#0d1f3a;border:1px solid var(--line);border-radius:12px;
  padding:6px;box-shadow:0 18px 44px rgba(0,0,0,.5);max-height:min(340px,60vh);overflow:auto;
}
.dd-item{
  display:flex;align-items:center;gap:9px;width:100%;background:none;border:0;color:var(--text);
  padding:7px 8px;border-radius:9px;font:inherit;cursor:pointer;text-align:left;
}
.dd-item:hover{background:rgba(74,140,255,.16)}
.dd-item.on{background:rgba(217,180,90,.14)}
.dd-tick{color:var(--gold2);font-size:12px;flex:none}
.dd-none{padding:12px 10px;font-size:12.5px;color:var(--muted);text-align:center}
.chatsel{display:block;width:100%}
.chatseltop{max-width:250px}
.chatseltop .dd-menu,.botsel .dd-menu{left:auto;right:0}
.botsel{max-width:210px;flex:none}
.botsel .dd-btn{padding:4px 10px 4px 6px}
.botsel .dd-av{width:28px;height:28px}
@media(max-width:900px){
  .topbar{flex-wrap:wrap;gap:8px;padding:10px 12px}
  .topbar-right{flex-wrap:wrap;gap:6px;width:100%}
  .chatseltop{max-width:none;flex:1 1 150px}
  .botsel{max-width:none;flex:1 1 150px}
  .dd-menu{max-width:min(320px,92vw)}
}

/* ---------- 验证页：机器人同步的群组 / 频道 ---------- */
.chatpanel{
  border:1px dashed var(--line);border-radius:12px;padding:12px;margin:0 0 6px;
  background:rgba(10,24,48,.55);
}
.chatpanel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.chatpick{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:0 0 9px}
.chatpick .dotsep{opacity:.45;margin:0 3px}
.chatpick .pickbtns{display:flex;gap:6px;flex:none}
.chatgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:8px}
.chatcard{
  display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--line);
  border-radius:11px;background:rgba(15,33,64,.9);min-width:0;
}
.chatcard.pickable{cursor:pointer;transition:border-color .16s,background .16s,transform .12s}
.chatcard.pickable:hover{border-color:rgba(217,180,90,.45);background:rgba(19,40,74,.95)}
.chatcard.pickable:active{transform:scale(.995)}
.chatcard.on{border-color:rgba(217,180,90,.62);background:linear-gradient(180deg,rgba(217,180,90,.10),rgba(15,33,64,.9))}
.chatcard.focus{box-shadow:0 0 0 1px rgba(217,180,90,.35) inset}
.chatck{
  width:18px;height:18px;flex:none;border-radius:6px;border:1px solid rgba(95,123,164,.65);
  display:grid;place-items:center;font-size:12px;font-weight:800;color:#0a172c;line-height:1;
  background:rgba(8,19,38,.6);
}
.chatcard.on .chatck{background:linear-gradient(145deg,var(--gold),#bb8f2e);border-color:transparent;color:#08111f}
.cavatar{width:34px;height:34px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--line)}
.cvletter{display:grid;place-items:center;background:linear-gradient(145deg,var(--panel2),#0a1830);color:var(--gold2);font-weight:700}
.cc-body{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.35;word-break:keep-all}
.cc-body b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-body .ell{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.okline{color:#6ee7a8}
.warnline{color:#f0c36a}
.tag.ok{background:rgba(46,204,113,.14);color:#7ff0b0;border-color:rgba(46,204,113,.4)}
.pvitem{padding:9px 0;border-top:1px solid var(--line)}
.pvitem:first-child{border-top:0}

/* ---------- 登录代码 ---------- */
.codebig{
  font:700 30px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:7px;text-align:center;
  padding:14px 10px;border-radius:12px;border:1px dashed var(--gold);
  background:rgba(217,180,90,.08);color:var(--gold2);user-select:all;margin:4px 0 10px;
}
.coderow{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.tgstate{margin:12px 0 0;font-size:12.5px;color:var(--muted)}
.tgstate.ok{color:#6ee7a8}
.tgstate.err{color:#f38b84}

/* ---------- login tabs / auto-login card ---------- */
.ltabs{display:flex;gap:6px;background:#0a1830;border:1px solid var(--line);border-radius:12px;padding:5px;margin-bottom:6px}
.ltab{flex:1;background:none;border:0;color:var(--muted);font:inherit;font-size:13px;padding:9px 6px;border-radius:9px;cursor:pointer;transition:.15s}
.ltab:hover{color:var(--text)}
.ltab.active{background:linear-gradient(145deg,var(--gold),#bb8f2e);color:#08111f;font-weight:700}
.lpane{padding-top:6px}
.autocard{background:rgba(217,180,90,.08);border:1px solid rgba(217,180,90,.32);border-radius:12px;padding:12px 13px;margin:12px 0 4px}
.autocard b{font-size:13.5px}
.autocard code{background:#0a1830;border:1px solid var(--line);border-radius:6px;padding:1px 6px;color:var(--gold);font-size:12.5px}


/* ---------- SaaS 开通 ---------- */
.signuprow{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.signuprow .btn{margin-left:auto}

/* ================= 登录页 v17：白色卡片 + 紫色主色 + 科技风动态背景 ================= */
#bgfx{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none;
  opacity:0;transition:opacity .6s ease;background:
    radial-gradient(900px 620px at 50% 0%, #1a1046 0%, rgba(10,12,30,0) 62%),
    linear-gradient(160deg,#06091a 0%,#0a0f26 45%,#0d0b26 100%)}
body.bg-on #bgfx{opacity:1}
body.bg-on{background:#06091a}

#login.login-wrap{position:relative;z-index:2;min-height:100vh;min-height:100dvh;display:flex;
  align-items:center;justify-content:center;padding:32px 18px}

#login .login-card{
  width:100%;max-width:404px;background:#fff;border:0;border-radius:14px;
  padding:26px 26px 22px;color:#171b2b;
  box-shadow:0 28px 70px rgba(3,6,24,.62), 0 0 0 1px rgba(124,92,255,.10), 0 0 60px rgba(124,92,255,.16);
  animation:lcIn .35s ease-out both;
}
@keyframes lcIn{from{transform:translateY(8px) scale(.99)}to{transform:none}}

#login .lc-head{display:flex;align-items:center;justify-content:center;gap:9px;margin:2px 0 20px}
#login .lc-avatar{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(145deg,#9b7dff,#5b3fd6);color:#fff;font-weight:800;font-size:13px;
  box-shadow:0 5px 14px rgba(124,92,255,.38);overflow:hidden}
#login .lc-avatar img{width:100%;height:100%;object-fit:cover;display:block}
#login .lc-name{font-size:17px;font-weight:700;color:#14182a;letter-spacing:.2px}

#login .lc-title{font-size:19px;font-weight:700;color:#111527;text-align:left;margin:0 0 7px;line-height:1.35}
#login .lc-sub{font-size:12.5px;color:#9aa0b4;text-align:left;margin:0 0 18px;font-weight:400}
#login .lc-sub b{color:#7c5cff;font-weight:600}

/* 页签 */
#login .ltabs{display:flex;align-items:center;justify-content:center;gap:2px;background:none;
  border:0;border-bottom:1px solid #eef0f6;border-radius:0;padding:0;margin:0 0 2px}
#login .ltab{flex:0 0 auto;background:none;border:0;border-radius:0;color:#9aa0b4;
  font:inherit;font-size:13.5px;padding:9px 10px 11px;position:relative;cursor:pointer;transition:color .15s}
#login .ltab:hover{color:#5b6172}
#login .ltab.active{background:none;color:#7c5cff;font-weight:700}
#login .ltab.active:after{content:'';position:absolute;left:10px;right:10px;bottom:-1px;height:2px;
  background:#7c5cff;border-radius:2px}
#login .ltab-arrow{background:none;border:0;color:#c7cbda;font-size:19px;line-height:1;
  padding:0 7px 2px;cursor:pointer;transition:color .15s}
#login .ltab-arrow:hover{color:#7c5cff}

#login .lpane{padding-top:2px}
#login .pane-h{font-size:15px;font-weight:700;color:#14182a;text-align:center;margin:18px 0 7px}
#login .pane-note{font-size:12.5px;color:#9aa0b4;text-align:center;line-height:1.65;margin:0;font-weight:400}
#login .pane-note b{color:#5b6172}

#login label{color:#9aa0b4;text-align:center;margin:16px 0 6px}
#login input[type=text],#login input[type=password],#login input:not([type]){
  background:#f7f8fc;border:1px solid #e6e8f2;color:#14182a;border-radius:9px;
  text-align:center;letter-spacing:3px;font-weight:700;font-size:16px;padding:12px}
#login input::placeholder{letter-spacing:1px;font-weight:500;font-size:13.5px;color:#b3b8c9}
#login input:focus{border-color:#8b6dff;box-shadow:0 0 0 3px rgba(124,92,255,.14);background:#fff}

#login .btn{border-radius:9px}
#login .btn.primary{background:linear-gradient(135deg,#8b6dff 0%,#6a45f0 100%);border:0;color:#fff;
  font-weight:600;box-shadow:0 10px 22px rgba(124,92,255,.34)}
#login .btn.primary:hover{filter:brightness(1.05);box-shadow:0 12px 26px rgba(124,92,255,.42)}
#login .btn.primary:disabled{opacity:.6;box-shadow:none}
#login .btn.block{width:100%;margin-top:16px;padding:12px;font-size:14.5px}
#login .btn.link{background:none;border:0;color:#7c5cff;font-weight:600;font-size:12.5px;padding:0 2px}
#login .btn.link:hover{text-decoration:underline}
#login .btn.small{background:#fff;border:1px solid #e6e8f2;color:#5b6172;border-radius:8px;
  padding:7px 11px;font-size:12.5px}
#login .btn.small:hover{border-color:#c9bfff;color:#6a45f0}

#login .lctip{margin-top:16px;padding:11px 12px;border-radius:9px;background:#f6f4ff;
  border:1px solid #e6dfff;color:#5f6478;font-size:12.5px;line-height:1.7}
#login .lctip b{color:#5b3fd6}
#login .lctip code{background:#fff;border:1px solid #e3dbff;border-radius:5px;padding:1px 6px;
  color:#6a45f0;font-size:11.5px}

#login .tgbox{margin-top:16px}
#login .codebig{font:700 29px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:7px;
  text-align:center;padding:14px 8px;border-radius:10px;border:1px dashed #cfc4ff;
  background:#f7f5ff;color:#5b3fd6;user-select:all;margin:0 0 10px}
#login .coderow{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;justify-content:center}
#login .tgbox p{color:#9aa0b4 !important}
#login .tgstate{margin:12px 0 0;font-size:12.5px;color:#9aa0b4;text-align:center}
#login .tgstate.ok{color:#12a150}
#login .tgstate.err{color:#e5484d}

#login .signuprow{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:18px;
  padding-top:14px;border-top:1px solid #eef0f6;color:#9aa0b4;font-size:12.5px}
#login .signuprow .btn{margin-left:0}
#login .lc-sub2{color:#9aa0b4;font-size:12.5px}
#login #signupTip{margin-top:10px;font-size:11.5px}
#login .err{color:#e5484d;text-align:center;font-size:12.5px;min-height:16px;margin:10px 0 0}

.muted-ok{}
@media (max-width:430px){
  #login.login-wrap{padding:20px 12px}
  #login .login-card{padding:22px 18px 18px;border-radius:12px}
  #login .lc-title{font-size:17.5px}
  #login .ltab{padding:9px 10px 11px;font-size:13px}
  #login .ltab-arrow{padding:0 8px 2px}
  #login .codebig{font-size:25px;letter-spacing:5px}
}
body:not(.bg-on) #bgfx{display:none}

/* ---------- 指令说明表 ---------- */
.guide-tb{width:100%;border-collapse:collapse;font-size:13px}
.guide-tb th{
  text-align:left;font-size:11.5px;letter-spacing:.6px;color:#6f8cb5;font-weight:700;
  padding:8px 10px;border-bottom:1px solid var(--line);text-transform:uppercase;
}
.guide-tb td{padding:9px 10px;border-bottom:1px solid rgba(30,58,99,.45);vertical-align:top;line-height:1.6}
.guide-tb tr:hover td{background:rgba(74,140,255,.05)}
.guide-tb .code{font-size:12px;color:var(--gold2)}
@media(max-width:760px){
  .guide-tb{font-size:12px}
  .guide-tb th:nth-child(2),.guide-tb td:nth-child(2){display:none}
}


/* 变量弹窗（放大版，字大一点好点） */
.vp-ov{align-items:center;padding:4vh 16px}
.vp-head{display:flex;align-items:center;gap:10px;padding:16px 20px 8px;border-bottom:1px solid var(--line)}
.vp-head b{font-size:17px}
.vp-gh{font-size:13px;font-weight:600;color:var(--gold);margin-bottom:8px}
.vp-body{padding:14px 20px 20px}
/* 聊天页顶部机器人标识 */
.chat-bot-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;background:rgba(217,180,90,.12);border:1px solid rgba(217,180,90,.3);font-size:11.5px;color:var(--gold)}
/* 图库删除按钮常显 */
.mediacard .macts{opacity:1}

/* ---- 图片库网格 ---- */
.mediagrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;align-items:start}
.mediacard{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px;transition:border-color .18s,transform .18s}
.mediacard:hover{border-color:rgba(212,175,55,.5);transform:translateY(-2px)}
.mediacard img{width:100%;height:104px;object-fit:cover;border-radius:8px;cursor:pointer;display:block;background:#0d1b33}
.mediacard .mname{font-size:12px;color:var(--muted,#9fb0c9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mediacard .macts{display:flex;gap:6px}
.mediacard .macts .btn{padding:4px 6px;font-size:11px;line-height:1.1}
@media (max-width:520px){.mediagrid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}.mediacard img{height:86px}}


/* ---------- 滚动条统一（深色细条；scrollbar-color 必须给，否则 Chrome 用系统浅灰条） ---------- */
html{scrollbar-width:thin;scrollbar-color:rgba(217,180,90,.42) transparent}
.side,nav,.view,.main,.dd-menu,.modal-box,.chatlist,.msgs,.msglist,textarea,.notebox,.rt{
  scrollbar-width:thin;scrollbar-color:rgba(217,180,90,.34) transparent;
}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(217,180,90,.30);border-radius:9px}
::-webkit-scrollbar-thumb:hover{background:rgba(217,180,90,.55)}
::-webkit-scrollbar-corner{background:transparent}
nav::-webkit-scrollbar{width:6px}
.side{padding-right:10px}
nav{padding-right:4px;scrollbar-gutter:stable}

/* ================= 登录页 v28：改成和系统一致的深蓝 + 金色（原来是白卡紫调，跟系统不搭） ================= */
#login .login-card{
  background:linear-gradient(180deg,#0c1c34 0%,#081426 100%);
  border:1px solid rgba(217,180,90,.20);border-radius:16px;color:#e8eefb;
  box-shadow:0 30px 80px rgba(2,6,18,.72),0 0 0 1px rgba(255,255,255,.02) inset,0 0 80px rgba(217,180,90,.10);
}
#login .lc-head{justify-content:flex-start;gap:12px;margin:0 0 20px;padding-bottom:15px;border-bottom:1px solid rgba(30,58,99,.65)}
#login .lc-logo{width:44px;height:44px;border-radius:12px;background:rgba(217,180,90,.07);
  border:1px solid rgba(217,180,90,.24);padding:4px;filter:drop-shadow(0 6px 16px rgba(217,180,90,.28))}
#login .lc-name{font-size:18px;color:#f4e6c0;letter-spacing:.8px;font-weight:750}
#login .lc-tag{color:#7d93b6;font-size:11.5px;letter-spacing:.5px;margin-top:4px}
#login .lc-title{color:#e8eefb;font-size:18px}
#login .lc-title span{color:var(--gold2)}
#login .lc-sub{color:#7d93b6}
#login .lc-sub b{color:var(--gold)}
#login .ltabs{border-bottom:1px solid rgba(30,58,99,.7)}
#login .ltab{color:#7d93b6}
#login .ltab:hover{color:#cfe0f8}
#login .ltab.active{color:var(--gold2)}
#login .ltab.active:after{background:linear-gradient(90deg,var(--gold),#b78d2c)}
#login .ltab-arrow{color:#4a6084}
#login .ltab-arrow:hover{color:var(--gold)}
#login .pane-h{color:#e8eefb}
#login .pane-note{color:#7d93b6}
#login .pane-note b{color:#cfe0f8}
#login label{color:#7d93b6}
#login input[type=text],#login input[type=password],#login input:not([type]){
  background:#0a1a30;border:1px solid rgba(46,80,128,.75);color:#eaf2ff;
}
#login input::placeholder{color:#5c7396}
#login input:focus{border-color:rgba(217,180,90,.62);box-shadow:0 0 0 3px rgba(217,180,90,.12);background:#0b1d36}
#login .btn.primary{background:linear-gradient(145deg,var(--gold) 0%,#b78d2c 100%);color:#0a172c;
  border:0;font-weight:750;box-shadow:0 10px 24px rgba(217,180,90,.26)}
#login .btn.primary:hover{filter:brightness(1.06);box-shadow:0 12px 28px rgba(217,180,90,.34)}
#login .btn.link{color:var(--gold2)}
#login .btn.small{background:rgba(15,33,64,.92);border:1px solid var(--line);color:#cfe0f8}
#login .btn.small:hover{border-color:rgba(217,180,90,.5);color:var(--gold2)}
#login .lctip{background:rgba(217,180,90,.06);border:1px solid rgba(217,180,90,.22);color:#bccde8}
#login .lctip b{color:var(--gold2)}
#login .lctip code{background:#0a1a30;border:1px solid rgba(46,80,128,.7);color:var(--gold2)}
#login .codebig{background:#0a1a30;border:1px dashed rgba(217,180,90,.45);color:var(--gold2)}
#login .err{color:#ff8d8d}
#login .signuprow{border-top:1px solid rgba(30,58,99,.65)}
#login .lc-sub2{color:#7d93b6}
#login .copybox{background:rgba(15,33,64,.8);border:1px solid var(--line);border-radius:10px}
#login .copytext{background:#0a1a30;border:1px solid rgba(46,80,128,.7);color:#cfe0f8;border-radius:8px}
#login .tgbox .codebig{margin-bottom:8px}

/* ---------- 手机端：两列布局改成单列，别把卡片挤出屏幕（验证设置那页原来会横向溢出） ---------- */
@media(max-width:900px){
  .grid.c2{grid-template-columns:1fr}
  .grid>*{min-width:0}
  .chatgrid{grid-template-columns:1fr}
  .chatpanel{padding:10px}
  .chatpanel-head{gap:8px}
  .chatpick{align-items:flex-start}
}

/* ---------- 手机端：表格横向滚动，别把整页撑宽 ---------- */
@media(max-width:900px){
  table{display:block;width:100%;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  table::-webkit-scrollbar{height:6px}
}

/* ---------- 手机端：菜单改成一条可横向滑动的胶囊条（原来是换行成两大排，很占地方） ---------- */
@media(max-width:900px){
  nav{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding:2px 0 4px;scrollbar-width:none}
  nav::-webkit-scrollbar{height:0;display:none}
  .nav-item{flex:0 0 auto}
  .nav-group{display:contents}
  .nav-group-h{display:none}
}

/* ---------- 验证设置：模式说明条 ---------- */
.gate-mode-hint{margin-top:10px;padding:9px 11px;border-radius:10px;background:rgba(217,180,90,.08);
  border:1px solid rgba(217,180,90,.28);color:var(--text);font-size:12.5px;line-height:1.6}
.gate-mode-hint b{color:var(--gold2)}
.gate-mode-hint.warn{background:rgba(255,138,138,.07);border-color:rgba(255,138,138,.3)}
.gate-mode-hint .tiny{margin-top:4px;color:var(--muted)}

@media(max-width:900px){
  nav{width:100%;max-width:100%;min-width:0}
  .side{max-width:100%}
}


/* ---------- 系统管理登录（/admin） ---------- */
#paneAdmin .pane-h{margin-top:10px}
#paneAdmin input{margin-bottom:0}
#paneAdmin .pane-note a{text-decoration:none;border-bottom:1px dashed currentColor}
#adminEntry a{text-decoration:none}
#adminEntry a:hover{color:var(--gold)}

/* ================= 登录页 v39：手机端重排 =================
   原来登录卡片是「垂直居中」，手机屏放不下时上半截直接被裁掉，看着乱七八糟。
   这里统一改成：内容高于屏幕就从顶部排、可整页滚动；页签去掉两侧箭头改成分段控件；
   开通说明改成三步小卡；按钮和输入框按触摸尺寸放大。桌面端不受影响。 */
#login.login-wrap{align-items:flex-start;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
#login .login-card{margin:0 auto}

/* 开通块：文案 + 按钮 + 三步说明 */
.signupblock{margin-top:14px;padding-top:12px;border-top:1px solid rgba(30,58,99,.65)}
.signupblock .signuprow{margin-top:0;padding-top:0;border-top:0}
.copyact{display:flex;gap:8px;flex-wrap:wrap}
.copyact .btn{flex:1 1 130px}
.signup-steps{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:7px}
.signup-steps li{position:relative;padding-left:26px;font-size:12px;line-height:1.6;color:#7d93b6;text-align:left}
.signup-steps li:before{content:attr(data-n);position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;
  display:grid;place-items:center;font-size:10.5px;font-weight:800;color:#0a172c;
  background:linear-gradient(145deg,var(--gold),#b78d2c);box-shadow:0 3px 8px rgba(217,180,90,.25)}
.signup-steps b{color:#cfe0f8;font-weight:600}

/* 底部「系统管理登录」 */
#login .admin-entry{margin:16px 0 0;padding-top:14px;border-top:1px dashed rgba(46,80,128,.7);
  text-align:center;font-size:12px;color:#7d93b6}
#login .admin-entry a{color:var(--gold2)}
#login .admin-entry a:hover{text-decoration:underline}

@media (max-width:760px){
  #login.login-wrap{
    padding:calc(14px + env(safe-area-inset-top)) 12px calc(18px + env(safe-area-inset-bottom));
  }
  #login .login-card{
    max-width:100%;border-radius:18px;padding:18px 16px 20px;animation:none;
  }
  /* 顶部品牌 */
  #login .lc-head{gap:10px;margin:0 0 14px;padding-bottom:12px}
  #login .lc-logo{width:40px;height:40px;border-radius:11px;padding:4px}
  #login .lc-name{font-size:16.5px;letter-spacing:.5px}
  #login .lc-tag{font-size:10.5px;margin-top:3px;letter-spacing:.2px}
  /* 标题 */
  #login .lc-title{font-size:16.5px;line-height:1.4;margin:0 0 6px}
  #login .lc-sub{font-size:12px;line-height:1.55;margin:0 0 12px}
  /* 页签：两等分分段控件，去掉左右箭头 */
  #login .ltabs{display:flex;gap:6px;padding:4px;margin:0 0 2px;border:1px solid rgba(30,58,99,.85);
    border-radius:12px;background:rgba(8,20,38,.72)}
  #login .ltab{flex:1 1 0;min-width:0;padding:10px 6px;border-radius:9px;font-size:13.5px;text-align:center}
  #login .ltab.active{background:linear-gradient(145deg,rgba(217,180,90,.20),rgba(217,180,90,.05));
    box-shadow:inset 0 0 0 1px rgba(217,180,90,.38);color:var(--gold2)}
  #login .ltab.active:after{display:none}
  #login .ltab-arrow{display:none}
  /* 面板 */
  #login .lpane{padding-top:0}
  #login .pane-h{font-size:14.5px;margin:14px 0 6px}
  #login .pane-note{font-size:12px;line-height:1.6}
  /* 输入框 / 按钮：够大够好点 */
  #login input[type=text],#login input[type=password],#login input:not([type]){
    font-size:16px;padding:12px;min-height:48px;border-radius:10px;letter-spacing:2px}
  #login input::placeholder{font-size:13px;letter-spacing:0}
  #login .btn{border-radius:10px;min-height:44px;display:flex;align-items:center;justify-content:center;gap:6px}
  #login .btn.block{margin-top:12px;padding:12px;font-size:14.5px}
  #login .btn.small{min-height:40px;padding:9px 12px}
  /* 开通块：一行文案 + 整宽按钮 */
  .signupblock{margin-top:14px;padding-top:12px}
  .signupblock .signuprow{flex-direction:column;gap:8px;text-align:center}
  #login .signuprow .btn.link{width:100%;border:1px solid rgba(217,180,90,.45);border-radius:10px;
    padding:11px 10px;font-size:13.5px;background:rgba(217,180,90,.09);min-height:44px}
  #login .signuprow .btn.link:hover{background:rgba(217,180,90,.16);text-decoration:none}
  .signup-steps{gap:6px;margin-top:10px}
  .signup-steps li{font-size:11.5px;line-height:1.55;padding-left:24px}
  .signup-steps li:before{width:17px;height:17px;font-size:10px}
  #login .copybox{padding:9px 10px;border-radius:10px}
  #login .copytext{max-height:110px;font-size:11.5px;line-height:1.55}
  #login .codebig{font-size:23px;letter-spacing:5px;padding:12px 6px}
  #login .lctip{font-size:11.5px;line-height:1.6;padding:10px 11px}
  #login .err{margin:8px 0 0;min-height:14px;font-size:12px}
  #login .admin-entry{margin-top:14px;padding-top:12px}
  #login .admin-entry a{display:inline-flex;align-items:center;justify-content:center;
    width:100%;min-height:42px;border:1px solid rgba(46,80,128,.9);border-radius:10px;
    color:#cfe0f8;font-size:12.5px;background:rgba(15,33,64,.6)}
  #login .admin-entry a:hover{border-color:rgba(217,180,90,.5);color:var(--gold2);text-decoration:none}
}
@media (max-width:370px){
  #login .login-card{padding:16px 13px 18px}
  #login .lc-name{font-size:15.5px}
  #login .lc-title{font-size:15.5px}
  #login .lc-sub{font-size:11.5px}
  .signup-steps li{font-size:11px}
}
/* 横屏手机 / 小高度窗口：别把卡片顶出可视区 */
@media (max-width:900px) and (max-height:560px){
  #login.login-wrap{padding-top:10px;padding-bottom:14px}
  #login .login-card{padding-top:14px}
}

/* toast：长文本不再撑成一整块遮住页面 */
.toast{max-width:min(420px,calc(100vw - 28px));word-break:break-word;line-height:1.5;
  box-shadow:0 14px 34px rgba(2,6,18,.5)}
@media (max-width:760px){
  .toast{bottom:calc(16px + env(safe-area-inset-bottom));left:50%;right:auto;
    padding:9px 14px;font-size:13px;border-radius:10px;max-width:calc(100vw - 28px)}
}

/* ============ 手机端后台：顶部工具条 + 横滑导航（v40） ============ */
@media (max-width:900px){
  /* 侧栏压成两行固定工具条：第一行用户+语言/退出，第二行可横滑的菜单 */
  .side{
    width:100%;flex:none;height:auto;position:sticky;top:0;z-index:40;
    display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;
    gap:6px;padding:calc(8px + env(safe-area-inset-top)) 12px 8px;
    border-right:0;border-bottom:1px solid var(--line);
    background:rgba(8,19,38,.94);backdrop-filter:blur(12px);
    box-shadow:0 8px 22px rgba(2,6,18,.35);
  }
  .side .brand.small{display:none}
  /* 用户卡：一行小卡，和右边的按钮同一行 */
  .usercard{
    order:1;flex:1 1 0;min-width:0;margin:0;padding:3px 8px 3px 4px;gap:8px;
    border-radius:11px;background:rgba(15,32,62,.7);
  }
  .uavatar-wrap,.uavatar,.uinitial{width:28px;height:28px}
  .uinitial{font-size:12px}
  .umeta{line-height:1.25}
  .umeta b{font-size:13px}
  .umeta span{font-size:10.5px}
  .side-foot{order:2;flex:0 0 auto;width:auto;margin:0;gap:6px}
  .side-foot .btn{min-height:30px;padding:5px 9px;font-size:11.5px;border-radius:9px}
  /* 手机端群组选择统一放在顶部标题栏，侧栏这份不重复显示 */
  .chatcard-side{display:none}
  /* 菜单：单行横滑胶囊 */
  nav{
    order:3;flex:1 1 100%;flex-direction:row;flex-wrap:nowrap;gap:6px;overflow-x:auto;overflow-y:hidden;
    padding:0 0 2px;margin:0 -12px;padding-left:12px;padding-right:12px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;
  }
  nav::-webkit-scrollbar{display:none}
  .nav-item{flex:0 0 auto;scroll-snap-align:start;padding:6px 11px 6px 7px;font-size:12.5px;border-radius:20px}
  .nav-item .nic{width:21px;height:21px;font-size:11.5px}
  .nav-item .nav-txt{flex:none}
  /* 标题栏：一行，去掉重复品牌块，右侧下拉收窄 */
  .topbar{
    position:static;flex-wrap:nowrap;gap:8px;align-items:center;
    padding:10px 12px;background:transparent;backdrop-filter:none;border-bottom:0;
  }
  .topbar h2{flex:none;font-size:16px}
  .brandchip{display:none}
  .topbar-right{flex:1 1 auto;min-width:0;flex-wrap:nowrap;gap:6px;justify-content:flex-end;overflow-x:auto;scrollbar-width:none}
  .topbar-right::-webkit-scrollbar{display:none}
  .chatseltop,.botsel{flex:0 1 auto;min-width:0;max-width:none}
  .botsel .dd-btn,.chatseltop .dd-btn{padding:4px 8px 4px 5px;border-radius:9px}
  .botsel .dd-av,.chatseltop .dd-av{width:22px;height:22px;font-size:11px}
  .dd-label{font-size:12px}
  .dd-sub{font-size:10px}
  #refreshBtn{min-height:32px;padding:0 10px;flex:none}
  .view{padding:12px 12px calc(32px + env(safe-area-inset-bottom))}
  /* 卡片 / 表格在手机上更紧凑 */
  .card{padding:14px 13px;border-radius:12px}
  .grid{gap:10px}
  .modal-box{max-height:88vh;overflow:auto}
  /* 聊天页：列表给到半屏，没选客户时右侧空状态不占大块 */
  .chat-wrap{grid-template-columns:1fr;gap:10px}
  .chat-list{max-height:46vh}
  .chat-list .head{padding:10px}
  .chat-pane{height:auto;min-height:420px}
  .chat-pane:has(> .empty){min-height:150px;display:flex;align-items:center;justify-content:center}
  .chat-pane:has(> .empty) .empty{min-height:0}
  /* 顶部两个下拉：第二行小字在窄屏挤掉，只留主标题 */
  .topbar-right .dd-sub{display:none}
  .topbar-right .dd-txt{line-height:1.1}
  .chatseltop{flex:1 1 44%}
  .botsel{flex:1 1 40%}
}
@media (max-width:430px){
  .side{padding-left:10px;padding-right:10px}
  nav{margin:0 -10px;padding-left:10px;padding-right:10px}
  .topbar{padding:10px 10px;gap:6px}
  .topbar h2{font-size:15px}
  .view{padding:10px 10px calc(30px + env(safe-area-inset-bottom))}
  .grid.c4{grid-template-columns:1fr 1fr;gap:9px}
  .grid.c3,.grid.c2{grid-template-columns:1fr}
  .card{padding:12px 11px}
  .stat .n{font-size:20px}
}

/* 手机端表格：字号和列内边距收一点，四列能塞进一屏，实在塞不下仍可横滑 */
@media (max-width:900px){
  .view table{font-size:12.5px}
  .view th,.view td{padding:8px 7px}
  .view th{font-size:11px}
  .view table .code{font-size:11px}
}
@media (max-width:430px){
  .view table{font-size:12px}
  .view th,.view td{padding:7px 5px}
}

/* ================= 2026-11-12 第十三轮：会话增强 / 快捷话术 / 知识库 / 键盘编辑 ================= */

/* 登录卡片：上下左右都居中（原来 align-items:flex-start 会贴到屏幕顶上） */
#login.login-wrap{align-items:center;justify-content:center}
#login .login-card{margin:auto}

/* 右上角那颗「魔方机器人」和左侧品牌重复，统一去掉（机器人选择器保留） */
.brandchip{display:none !important}

/* 会话头：结束会话不再换行掉到第二排 */
.chat-head-r{flex-wrap:nowrap;white-space:nowrap}
.chat-head-r .chat-bot-chip{white-space:nowrap}

/* 会话列表项：鼠标移上去才出现归档 / 删除 */
.citem{position:relative}
.citem .cact{position:absolute;right:8px;bottom:6px;display:none;gap:4px;z-index:3}
.citem:hover .cact{display:flex}
.citem .cact .btn{padding:2px 7px;font-size:11px;line-height:1.5}

/* 消息气泡：自己发出去的消息可以删 */
.mrow .mdel-btn{display:none;margin-left:6px;border:0;background:transparent;color:var(--muted,#7d93b6);
  cursor:pointer;font-size:12px;padding:0 2px}
.mrow:hover .mdel-btn{display:inline-block}
.mrow .mdel-btn:hover{color:#ff7b7b}

/* 表情面板 */
.emoji-panel{position:absolute;bottom:54px;right:12px;width:min(330px,calc(100vw - 32px));max-height:250px;
  overflow-y:auto;background:#101a30;border:1px solid rgba(58,90,138,.9);border-radius:12px;padding:8px;
  display:grid;grid-template-columns:repeat(8,1fr);gap:2px;z-index:40;box-shadow:0 16px 40px rgba(0,0,0,.5)}
.emoji-panel button{border:0;background:transparent;font-size:19px;line-height:1;padding:5px 0;border-radius:7px;cursor:pointer}
.emoji-panel button:hover{background:rgba(90,130,200,.28)}
.chat-input{position:relative}

/* 快捷话术 / 知识库 */
.qb-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.qb-card{background:rgba(14,25,45,.72);border:1px solid rgba(45,74,116,.85);border-radius:12px;padding:12px 13px;display:flex;flex-direction:column;gap:8px}
.qb-card .qb-name{font-weight:700;font-size:13.5px;color:#dce9ff;display:flex;justify-content:space-between;gap:8px;align-items:center}
.qb-card .qb-text{font-size:12.5px;line-height:1.65;color:#a8bcd8;white-space:pre-wrap;word-break:break-word;max-height:120px;overflow:auto}
.qb-card .qb-act{display:flex;gap:6px;flex-wrap:wrap}
.qb-card .qb-act .btn{flex:0 0 auto;padding:4px 9px;font-size:12px}
.faq-kw{display:flex;gap:5px;flex-wrap:wrap}
.faq-kw span{font-size:11px;padding:2px 7px;border-radius:999px;background:rgba(90,130,200,.18);color:#9fbbe4}

/* 键盘布局可视化编辑 */
.kbb{border:1px dashed rgba(56,92,142,.9);border-radius:12px;padding:10px;background:rgba(10,20,38,.5)}
.kbb-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;padding:7px;border-radius:10px;
  background:rgba(20,34,58,.85);border:1px solid rgba(45,74,116,.7);margin-bottom:8px}
.kbb-row .kbb-idx{font-size:11px;color:#7d93b6;min-width:56px;flex:0 0 auto}
.kbb-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:8px;font-size:12px;
  background:rgba(90,130,200,.16);border:1px solid rgba(78,118,180,.9);color:#d6e6ff;cursor:grab;flex:0 0 auto}
.kbb-mv{cursor:pointer;color:#8fa9cc;font-size:14px;line-height:1;padding:0 2px;user-select:none}
.kbb-mv:hover{color:#c8a24a}
.kbcols{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0 14px}
.kbcols button{border:1px solid rgba(45,74,116,.9);background:rgba(10,20,38,.55);color:#a9c1e0;
  padding:7px 14px;border-radius:9px;font-size:12.5px;cursor:pointer}
.kbcols button.on{background:#c8a24a;border-color:#c8a24a;color:#0d182b;font-weight:700}
.kbb-btn b{font-weight:600}
.kbb-btn i{font-style:normal;color:#8fa9cc;font-size:10.5px}
.kbb-btn button{border:0;background:transparent;color:#ff8d8d;cursor:pointer;font-size:12px;padding:0 0 0 2px}
.kbb-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.kbb-menu{max-height:220px;overflow:auto;border:1px solid rgba(45,74,116,.8);border-radius:10px;padding:6px}
.kbb-menu div{padding:6px 9px;border-radius:7px;cursor:pointer;font-size:12.5px}
.kbb-menu div:hover{background:rgba(90,130,200,.22)}

/* 群发：目标筛选 */
.bc-filter{padding:12px;border-radius:12px;background:rgba(12,22,40,.6);
  border:1px solid rgba(45,74,116,.7);margin:10px 0}
.bc-fgrow{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.bc-field{display:flex;flex-direction:column;gap:5px;min-width:110px}
.bc-field>span{font-size:11px;color:var(--muted);letter-spacing:.3px}
.bc-field .input{height:36px;padding:0 10px;border-radius:9px}
.bc-field.bc-grow{flex:1;min-width:180px}
.bc-go{height:36px;padding:0 18px;align-self:flex-end;white-space:nowrap}
.bc-fbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  margin-top:10px;padding-top:10px;border-top:1px dashed rgba(45,74,116,.6)}
.bc-quick{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.bc-chip{border:1px solid rgba(45,74,116,.8);background:transparent;color:var(--text);
  border-radius:999px;padding:4px 11px;font:inherit;font-size:12px;cursor:pointer;transition:.15s}
.bc-chip:hover{border-color:var(--gold);color:var(--gold)}
.bc-chip.active{background:rgba(217,180,90,.16);border-color:var(--gold);color:var(--gold)}
.bc-pickall{display:flex;align-items:center;gap:8px}
.bc-count{font-size:12px;color:var(--gold);font-weight:600;min-width:74px;text-align:right}
.bc-targets{max-height:300px;overflow:auto;border:1px solid rgba(45,74,116,.7);border-radius:12px;
  margin-top:10px;background:rgba(9,18,34,.5)}
.bc-row{display:flex;align-items:center;gap:10px;padding:9px 12px;font-size:13px;cursor:pointer;
  border-bottom:1px solid rgba(38,62,98,.55);transition:.12s}
.bc-row:last-child{border-bottom:0}
.bc-row:hover{background:rgba(90,130,200,.10)}
.bc-row.on{background:rgba(217,180,90,.10);box-shadow:inset 3px 0 0 var(--gold)}
.bc-row .bcpick{width:16px;height:16px;accent-color:#d9b45a;flex:0 0 auto}
.bc-av{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.bc-av.ph{display:grid;place-items:center;font-size:12px;font-weight:600;
  background:rgba(90,130,200,.25);color:#cfe0ff}
.bc-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.bc-main b{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-sub{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.bc-check{width:18px;height:18px;border-radius:50%;border:1px solid rgba(45,74,116,.9);
  display:grid;place-items:center;font-size:11px;color:transparent;flex:0 0 auto}
.bc-row.on .bc-check{background:var(--gold);border-color:var(--gold);color:#0b1830}
.bc-empty{padding:26px 12px;text-align:center;font-size:12.5px;color:var(--muted)}
.bc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;gap:10px}

/* ---------- 推送页顶部（2026-11-12 重排） ---------- */
.push-top{padding:14px}
.push-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:space-between}
.push-search{display:flex;align-items:center;gap:8px;flex:1;min-width:260px;
  background:rgba(9,18,34,.7);border:1px solid rgba(45,74,116,.8);border-radius:11px;padding:4px 6px 4px 12px}
.push-search .push-ico{font-size:13px;opacity:.8}
.push-search input{border:0;background:transparent;color:var(--text);font:inherit;font-size:13px;
  outline:none;flex:1;min-width:110px;height:30px}
.push-search .push-sep{width:1px;height:20px;background:rgba(45,74,116,.8)}
.push-search select.push-st{border:0;background:transparent;color:var(--text);font:inherit;font-size:12.5px;
  outline:none;height:30px;max-width:120px;cursor:pointer}
.push-new{white-space:nowrap;height:40px;padding:0 18px;border-radius:11px}
.push-howto{margin-top:10px;border-top:1px dashed rgba(45,74,116,.55);padding-top:8px}
.push-howto summary{cursor:pointer;font-size:12.5px;color:var(--gold);list-style:none}
.push-howto summary::-webkit-details-marker{display:none}
.push-howto summary::before{content:'▸ ';transition:.15s;display:inline-block}
.push-howto[open] summary::before{transform:rotate(90deg)}
.push-howto p{margin:8px 0 0;line-height:1.75;color:var(--muted);font-size:12px}
.var-fold{padding:14px}
.var-fold>summary{cursor:pointer;font-weight:600;font-size:14px;list-style:none}
.var-fold>summary::-webkit-details-marker{display:none}
.var-fold[open]>summary{margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid rgba(45,74,116,.5)}
@media(max-width:760px){
  .push-tools{flex-direction:column;align-items:stretch}
  .push-search{min-width:0;flex-wrap:wrap;padding:6px 8px}
  .push-search .push-sep{display:none}
  .push-search input{flex:1 1 100%;height:34px}
  .push-search select.push-st{max-width:none;flex:1;padding-left:8px;border:1px solid rgba(45,74,116,.7);border-radius:8px}
  .push-new{width:100%}
  .bc-fgrow{gap:8px}
  .bc-field{flex:1 1 calc(50% - 8px);min-width:0}
  .bc-field.bc-grow{flex:1 1 100%}
  .bc-go{flex:1 1 100%;align-self:stretch}
  .bc-fbar{justify-content:space-between}
  .bc-row{padding:10px 10px;gap:8px}
  .bc-meta{max-width:96px}
}

/* ---------- 会话页客户信息（2026-11-12） ---------- */
.chat-info{border-bottom:1px solid var(--line);background:rgba(10,24,48,.45)}
.ci-head{display:flex;align-items:center;gap:8px;width:100%;padding:8px 14px;background:transparent;
  border:0;color:var(--text);font:inherit;font-size:12.5px;cursor:pointer;text-align:left}
.ci-head:hover{background:rgba(90,130,200,.08)}
.ci-title{color:var(--muted);flex:0 0 auto}
.ci-preview{color:var(--gold);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46%}
.ci-preview i{color:var(--muted);font-style:normal;font-weight:400}
.ci-note-prev{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.ci-arrow{margin-left:auto;color:var(--muted);transition:.2s;flex:0 0 auto}
.ci-head.open .ci-arrow{transform:rotate(180deg)}
.ci-body{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;padding:4px 14px 12px}
.ci-field{display:flex;flex-direction:column;gap:5px;flex:1;min-width:180px}
.ci-field>label{font-size:11px;color:var(--muted)}
.ci-field textarea{width:100%;box-sizing:border-box;background:#0c1c34;border:1px solid rgba(45,74,116,.8);
  border-radius:9px;color:var(--text);font:inherit;font-size:12.5px;padding:8px 10px;resize:vertical;outline:none}
.ci-field textarea:focus{border-color:var(--gold)}
.tag-editor{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:6px 8px;min-height:36px;
  background:#0c1c34;border:1px solid rgba(45,74,116,.8);border-radius:9px}
.tag-editor:focus-within{border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,180,90,.1)}
.tag-editor .tag-in{flex:1;min-width:90px;border:0;background:transparent;color:var(--text);
  font:inherit;font-size:12.5px;outline:none;height:22px}
.ci-tag{display:inline-flex;align-items:center;gap:4px;background:rgba(217,180,90,.16);
  border:1px solid rgba(217,180,90,.45);color:var(--gold);border-radius:999px;padding:2px 4px 2px 9px;
  font-size:12px;line-height:1.5}
.ci-tag i{font-style:normal}
.ci-tag button{border:0;background:transparent;color:var(--gold);cursor:pointer;font-size:13px;
  line-height:1;padding:0 3px;opacity:.75}
.ci-tag button:hover{opacity:1}
/* 会话头部按钮：图标加大、好点 */
.chat-head-r .btn.small{padding:5px 11px}
.chat-head-r .btn.danger{padding:5px 13px;font-weight:600}
@media(max-width:760px){
  .ci-head{flex-wrap:wrap;gap:6px;padding:9px 12px}
  .ci-preview{max-width:70%}
  .ci-note-prev{display:none}
  .ci-body{flex-direction:column;align-items:stretch;gap:10px}
  .ci-field{min-width:0}
  .ci-body .btn{width:100%}
}

/* ---------- 登录页口令三步 ---------- */
.code-steps{list-style:none;margin:12px 0 14px;padding:0;display:flex;flex-direction:column;gap:8px}
.code-steps li{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;line-height:1.6;color:var(--muted)}
.code-steps .cs-n{flex:0 0 auto;width:19px;height:19px;border-radius:50%;display:grid;place-items:center;
  font-size:11px;font-weight:700;background:rgba(217,180,90,.16);color:var(--gold);
  border:1px solid rgba(217,180,90,.45);margin-top:1px}
.code-steps code{background:rgba(90,130,200,.16);color:#cfe0ff;border-radius:5px;padding:1px 6px;font-size:12px}
.code-steps b{color:var(--text);font-weight:600}

/* 客服管理：后台登录说明 */
.agent-login-tip{margin-top:12px;padding:11px 14px;border-radius:10px;font-size:12px;line-height:1.75;
  color:var(--muted);background:rgba(217,180,90,.07);border:1px solid rgba(217,180,90,.22)}
.agent-login-tip b{color:var(--gold)}
.agent-login-tip code{background:rgba(90,130,200,.18);color:#cfe0ff;border-radius:5px;padding:1px 6px}

/* ================= 2026-11-12 第 2 轮：19 项修复 ================= */

/* 顶部「N 个已连接」标记（原来在侧栏，现在挪到群组选择器旁边） */
.conn-badge{display:inline-flex;align-items:center;gap:5px;flex:none;
  padding:5px 10px;border-radius:999px;font-size:12px;line-height:1;
  color:var(--gold2);background:rgba(217,180,90,.12);border:1px solid rgba(217,180,90,.38);
  white-space:nowrap}
.conn-badge.hidden{display:none}

/* 会话列表项：归档 / 删除 浮到右上角，不再压住时间和状态 */
.citem .cact{position:absolute;right:6px;top:6px;bottom:auto;display:none;gap:4px;z-index:3;
  padding:2px;border-radius:9px;background:rgba(8,19,36,.94);box-shadow:0 6px 16px rgba(0,0,0,.45)}
.citem:hover .cact{display:flex}
.citem .cact .btn{padding:2px 7px;font-size:11px;line-height:1.5}
@media (hover:none){.citem .cact{display:flex;top:auto;bottom:6px}}

/* 消息删除按钮：加大、默认可见、点左右都不手抖 */
.mrow .mdel-btn{display:inline-flex;align-items:center;justify-content:center;
  margin-left:6px;border:1px solid rgba(120,150,190,.32);background:rgba(12,26,48,.6);
  color:#a9c1e0;cursor:pointer;font-size:15px;line-height:1;
  min-width:30px;min-height:30px;padding:4px 7px;border-radius:9px;transition:.15s}
.mrow .mdel-btn:hover{color:#ff8a8a;border-color:rgba(255,122,122,.65);background:rgba(120,30,40,.35)}
@media (max-width:700px){
  .mrow .mdel-btn{display:inline-flex;min-width:34px;min-height:34px;font-size:16px}
}

/* 图片预览：设置页里那张欢迎图别再撑满整屏 */
.imgprev{max-width:100%;max-height:180px;width:auto;height:auto;object-fit:contain;
  border-radius:10px;border:1px solid rgba(45,74,116,.8);background:#08152a;padding:4px}
.imgprevrow img{max-height:180px}

/* 下拉框（原生 select）统一深色，避免白底盖住内容 */
select,select.input{background:#0d1f3a;color:var(--text)}
select option,select.input option{background:#0d1f3a;color:var(--text)}
select.push-st{background:#0d1f3a !important}

/* 推送页筛选行：输入框 / 下拉 / 按钮各占各的，不再叠在一起 */
.push-search{flex-wrap:wrap}
.push-search input{flex:1 1 200px;min-width:0}
.push-search select.push-st{flex:0 0 auto;min-width:132px;padding:0 8px}

/* 客户信息（标签 / 备注）区块重排 */
.convinfo{padding:10px 12px}
.convinfo .ci-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-start}
.convinfo .ci-row>div{flex:1 1 240px;min-width:0}
.convinfo label{display:block;margin:0 0 5px;font-size:12px;color:var(--muted)}
.convinfo .ci-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;
  min-height:38px;padding:6px 8px;border:1px solid var(--line);border-radius:10px;background:#0a1830}
.convinfo .ci-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;
  font-size:12px;color:var(--gold2);background:rgba(217,180,90,.14);border:1px solid rgba(217,180,90,.35)}
.convinfo .ci-tag b{cursor:pointer;font-weight:700;opacity:.7}
.convinfo .ci-tag b:hover{opacity:1;color:#ff9c9c}
.convinfo .ci-tags input{border:0;background:transparent;color:var(--text);font:inherit;font-size:13px;
  flex:1 1 120px;min-width:80px;outline:none;height:24px}

/* 单行字段的「＋变量」小胶囊 */
.varfield{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.varfield>input,.varfield>textarea{flex:1 1 200px;min-width:0}
.varfield .varbtn{flex:none;border:1px dashed rgba(217,180,90,.55);background:rgba(217,180,90,.08);
  color:var(--gold2);border-radius:9px;padding:6px 10px;font:inherit;font-size:12px;cursor:pointer}
.varfield .varbtn:hover{background:rgba(217,180,90,.18)}

/* 知识库 / 自动回复 卡片里的配图缩略 */
.qb-thumb{width:100%;max-width:180px;max-height:120px;object-fit:cover;
 border-radius:10px;margin-top:8px;border:1px solid rgba(45,74,116,.6);display:block}
/* 图片预览统一限高,别顶开版面 */
.imgprev{max-height:150px!important;max-width:220px;object-fit:cover;border-radius:10px}
.imgprevrow img{max-height:110px;border-radius:8px}
/* 登录页网址太长要能换行 */
.code-steps code,.code-steps .cl{word-break:break-all;white-space:normal!important}
@media(max-width:640px){
  .convinfo .ci-row>div{flex:1 1 100%}
}

/* 图片字段：小预览盒，别把版面顶宽（设置页那张欢迎图之前会撑到屏外） */
.imgfield{display:flex;flex-direction:column;gap:6px;min-width:0}
.imgrow{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;min-width:0}
.imgrow .imgprev{flex:0 0 auto;width:160px;max-width:42vw;height:100px;min-width:0;
 border:1px solid rgba(45,74,116,.75);border-radius:10px;background:#08152a;overflow:hidden;
 display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px}
.imgrow .imgprev img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:cover;border:0;padding:0;border-radius:0}
.imgbtns{display:flex;gap:8px;flex-wrap:wrap;flex:1 1 180px;min-width:0}
.imgfield>.input{width:100%;min-width:0;max-width:100%}

/* 自建确认弹窗（内置浏览器里 window.confirm 会被吞掉，一律走这个） */
.mb-title{margin:0 0 4px;font-size:16px}
.cf-msg{margin:12px 0 18px;color:#cfe0f5;line-height:1.75;font-size:14px;word-break:break-word}
.cf-row{display:flex;justify-content:flex-end;gap:10px}
.cf-row .btn{min-width:96px;justify-content:center}
.cf-row .btn.danger{background:linear-gradient(180deg,#e0575f,#c33f47);border-color:#e0575f;color:#fff}
/* 消息删除图标再放大一点，别点空 */
.mrow .mdel-btn{min-width:34px;min-height:34px;font-size:16px}

/* ---- 2026-11-12: 图片不许把版面撑变形(超宽/超长图一律按框缩) ---- */
img, video, canvas, svg{max-width:100%}
img{height:auto}
.msgs img{max-width:100%!important;height:auto!important;object-fit:contain}
.msgimg{max-width:min(250px,60vw)!important;max-height:250px;object-fit:cover}
.composer-img img{max-width:140px;height:56px;object-fit:cover}
.imgprevrow{max-width:100%;overflow:hidden}
.imgprevrow img{max-width:100%;height:auto}
.mediacard img,.medialist img{max-width:100%}
.card,.panel,.box,.sec,main{min-width:0}
.mbody img,.bubble img{max-width:min(280px,64vw)!important;height:auto!important}
@media (max-width:520px){.msgimg{max-width:min(220px,68vw)!important}.mbody img,.bubble img{max-width:68vw!important}}

/* ===== 会话标签 / 备注 区块重排（2026-11-12 ad，覆盖旧 .convinfo 规则） ===== */
.convinfo.ci2{
  margin:10px 12px;padding:0;border:1px solid rgba(45,74,116,.85);border-radius:12px;
  background:linear-gradient(180deg,rgba(21,46,86,.55),rgba(9,22,42,.55));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  overflow:hidden;
}
.convinfo.ci2 .ci-head{
  display:flex;align-items:center;gap:8px;width:100%;padding:9px 12px;
  background:transparent;border:0;color:var(--text);font:inherit;font-size:12.5px;
  cursor:pointer;text-align:left;transition:background .15s;
}
.convinfo.ci2 .ci-head:hover{background:rgba(90,130,200,.09)}
.convinfo.ci2 .ci-ic{font-size:13px;line-height:1;opacity:.95}
.convinfo.ci2 .ci-title{color:var(--muted);letter-spacing:.3px;flex:0 0 auto}
.convinfo.ci2 .ci-chips{display:flex;gap:5px;align-items:center;min-width:0;overflow:hidden}
.convinfo.ci2 .ci-mini{font-size:11.5px;line-height:1.5;color:var(--gold2);background:rgba(217,180,90,.14);
  border:1px solid rgba(217,180,90,.32);border-radius:999px;padding:1px 9px;white-space:nowrap}
.convinfo.ci2 .ci-mini.ghost{color:var(--muted);border-color:var(--line);background:transparent}
.convinfo.ci2 .ci-empty{color:var(--muted);font-size:12px;font-style:normal;opacity:.85}
.convinfo.ci2 .ci-note-prev{color:var(--muted);font-size:12px;flex:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  border-left:1px solid rgba(45,74,116,.9);padding-left:9px;margin-left:3px}
.convinfo.ci2 .ci-arrow{margin-left:auto;color:var(--muted);font-size:11px;line-height:1;
  transition:transform .18s;flex:0 0 auto}
.convinfo.ci2 .ci-head.open .ci-arrow{transform:rotate(180deg)}
.convinfo.ci2 .ci-head.open{border-bottom:1px solid rgba(45,74,116,.5)}

.convinfo.ci2 .ci-body{padding:11px 12px 11px;display:block}
.convinfo.ci2 .ci-grid{display:grid;gap:10px 12px;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));align-items:stretch}
.convinfo.ci2 .ci-block{display:flex;flex-direction:column;min-width:0}
.convinfo.ci2 .ci-lab{display:flex;align-items:baseline;gap:7px;margin:0 0 6px;min-width:0}
.convinfo.ci2 .ci-lab b{font-size:12px;font-weight:600;color:#c7d7ee;letter-spacing:.3px;flex:0 0 auto}
.convinfo.ci2 .ci-lab em{font-style:normal;font-size:11px;color:var(--muted);opacity:.8;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.convinfo.ci2 .ci-tags{
  flex:1;display:flex;flex-wrap:wrap;align-content:flex-start;align-items:center;gap:6px;
  min-height:74px;padding:9px 10px;border:1px solid rgba(45,74,116,.9);border-radius:10px;
  background:#09162a;box-shadow:inset 0 1px 3px rgba(0,0,0,.25);transition:border-color .15s,box-shadow .15s;
}
.convinfo.ci2 .ci-tags:focus-within{border-color:rgba(217,180,90,.75);box-shadow:0 0 0 3px rgba(217,180,90,.1)}
.convinfo.ci2 .ci-tag{
  display:inline-flex;align-items:center;gap:2px;height:24px;padding:0 3px 0 10px;
  border-radius:999px;font-size:12px;line-height:1;color:var(--gold2);
  background:linear-gradient(180deg,rgba(217,180,90,.2),rgba(217,180,90,.1));
  border:1px solid rgba(217,180,90,.4);
}
.convinfo.ci2 .ci-tag i{font-style:normal;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.convinfo.ci2 .ci-tag button{
  border:0;background:transparent;color:var(--gold2);cursor:pointer;font-size:13px;line-height:1;
  width:18px;height:18px;border-radius:50%;opacity:.6;padding:0;display:grid;place-items:center;
}
.convinfo.ci2 .ci-tag button:hover{opacity:1;background:rgba(229,84,75,.9);color:#fff}
.convinfo.ci2 .ci-tags .tag-in{
  flex:1 1 110px;min-width:90px;height:24px;border:0;background:transparent;color:var(--text);
  font:inherit;font-size:12.5px;outline:none;padding:0;border-radius:0;
}
.convinfo.ci2 .ci-tags .tag-in::placeholder{color:#6f85a6}
.convinfo.ci2 .ci-block > textarea{
  flex:1;width:100%;min-height:74px;padding:10px 11px;border:1px solid rgba(45,74,116,.9);border-radius:10px;
  background:#09162a;color:var(--text);font:inherit;font-size:12.5px;line-height:1.6;resize:vertical;
  outline:none;box-shadow:inset 0 1px 3px rgba(0,0,0,.25);transition:border-color .15s,box-shadow .15s;
}
.convinfo.ci2 .ci-block > textarea:focus{border-color:rgba(217,180,90,.75);box-shadow:0 0 0 3px rgba(217,180,90,.1)}
.convinfo.ci2 .ci-block > textarea::placeholder{color:#6f85a6}

.convinfo.ci2 .ci-foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:10px;
  padding-top:9px;border-top:1px solid rgba(45,74,116,.55)}
.convinfo.ci2 .ci-tip{min-width:0;font-size:11.5px;color:var(--muted);opacity:.85;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.convinfo.ci2 .ci-save{padding:6px 20px;border-radius:9px;font-weight:600;letter-spacing:.5px;flex:0 0 auto}

@media(max-width:640px){
  .convinfo.ci2 .ci-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
  .convinfo.ci2{margin:8px 10px}
  .convinfo.ci2 .ci-head{flex-wrap:wrap;gap:6px;padding:9px 11px}
  .convinfo.ci2 .ci-note-prev{display:none}
  .convinfo.ci2 .ci-chips{max-width:100%}
  .convinfo.ci2 .ci-body{padding:0 11px 11px}
  .convinfo.ci2 .ci-save{width:100%}
  .convinfo.ci2 .ci-foot{flex-wrap:wrap}
  .convinfo.ci2 .ci-tip{flex:1 1 100%;text-align:center;order:2}
}

.convinfo.ci2 .ci-tip.dirty{color:var(--gold2);opacity:1}
.convinfo.ci2 .ci-tip.dirty::before{content:"● ";font-size:9px;vertical-align:1px}
.convinfo.ci2 .ci-tip.ok{color:var(--green);opacity:1}

@media(max-width:760px){
  .convinfo.ci2 .ci-tip{flex:1 1 100%;text-align:left;order:-1;margin-bottom:2px}
}

/* ---- 群发配图（2026-11-12） ---- */
.bc-img{margin:10px 0 14px}
.bc-img-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.bc-img-title{font-size:13px;font-weight:600;color:var(--gold)}
.bc-img-body{display:block}
.bc-img-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  min-height:88px;border:1px dashed rgba(214,180,90,.45);border-radius:12px;
  background:rgba(214,180,90,.05);cursor:pointer;transition:border-color .18s,background .18s}
.bc-img-add:hover{border-color:var(--gold);background:rgba(214,180,90,.1)}
.bc-img-add b{font-size:13px;font-weight:600;color:var(--gold)}
.bc-img-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bc-img-add.lib{background:rgba(30,58,99,.32);border-style:solid;border-color:rgba(214,180,90,.28)}
.bc-img-add em{font-style:normal}
.bc-lib{margin-top:10px}
.bc-lib-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:7px}
.bc-lib-title{font-size:12.5px;font-weight:600;color:var(--gold)}
.bc-lib-head .bc-lib-more{margin-left:auto}
.bc-lib-strip{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.bc-lib-th{flex:0 0 auto;width:74px;height:52px;padding:0;border-radius:9px;overflow:hidden;cursor:pointer;
  border:1px solid rgba(30,58,99,.9);background:#0b1830;transition:border-color .16s,transform .16s}
.bc-lib-th img{width:100%;height:100%;object-fit:cover;display:block}
.bc-lib-th:hover{border-color:var(--gold);transform:translateY(-1px)}
.bc-lib-th.on{border-color:var(--gold);box-shadow:0 0 0 2px rgba(214,180,90,.28)}
.bc-img-prev{position:relative;display:inline-flex;align-items:flex-end;gap:10px}
.bc-img-prev img{max-width:220px;max-height:132px;border-radius:10px;border:1px solid rgba(30,58,99,.9);
  object-fit:cover;display:block;background:#0b1830}
.bc-img-acts{display:flex;align-items:center;gap:6px;padding-bottom:2px}
.bc-img-x{width:26px;height:26px;border-radius:8px;border:1px solid rgba(214,180,90,.35);
  background:transparent;color:var(--muted);font-size:12px;cursor:pointer;line-height:1}
.bc-img-x:hover{border-color:#e06666;color:#e06666}
.bc-hist-row{display:flex;align-items:center;gap:10px;margin-top:5px}
.bc-hist-img{width:38px;height:38px;border-radius:8px;object-fit:cover;border:1px solid rgba(30,58,99,.9);flex:0 0 auto}
.bc-hist-txt{font-size:13px}
@media(max-width:640px){
  .bc-img-tiles{grid-template-columns:1fr}
  .bc-lib-th{width:64px;height:46px}
  .bc-img-prev{display:flex;flex-direction:column;align-items:flex-start}
  .bc-img-prev img{max-width:100%;max-height:180px}
}

/* 「让机器人收图」按钮在群发配图区（第三个方块） */
.bc-img-add.cap{background:rgba(30,58,99,.32);border-style:solid;border-color:rgba(214,180,90,.28)}
.bc-img-add.cap:disabled{opacity:.55;cursor:default}

/* ---------- 客服台：会话状态 / 排队（2026-11-13） ---------- */
.cs-chip{display:inline-block;font-size:11px;line-height:16px;padding:0 7px;border-radius:9px;margin-left:4px;
  border:1px solid var(--line);color:var(--muted);vertical-align:middle;white-space:nowrap}
.cs-chip.amber{color:#ffcf6b;border-color:rgba(217,180,90,.45);background:rgba(217,180,90,.12)}
.cs-chip.blue{color:#8fb8ff;border-color:rgba(74,140,255,.45);background:rgba(74,140,255,.12)}
.cs-chip.violet{color:#c3a6ff;border-color:rgba(150,110,255,.45);background:rgba(150,110,255,.12)}
.cs-chip.green{color:#7ee2a8;border-color:rgba(46,204,113,.45);background:rgba(46,204,113,.12)}
.cs-chip.grey{color:#9db0cd;border-color:var(--line);background:rgba(143,166,200,.08)}
.cs-waitline{color:#ffb86b !important;font-size:11px !important}
.cs-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;border-bottom:1px solid var(--line);
  background:rgba(15,33,64,.6)}
.cs-lab{font-size:12px;color:var(--muted);white-space:nowrap}
.cs-btns{display:flex;gap:6px;flex-wrap:wrap}
.cs-btn{font-size:12px;padding:3px 10px;border-radius:12px;border:1px solid var(--line);background:transparent;
  color:var(--muted);cursor:pointer;transition:.15s}
.cs-btn:hover{border-color:var(--gold);color:var(--gold2)}
.cs-btn.on{background:rgba(217,180,90,.18);border-color:var(--gold);color:var(--gold2);font-weight:600}
.cs-info{font-size:12px;color:#ffb86b;margin-left:auto;white-space:nowrap}
@media (max-width:640px){
  .cs-info{margin-left:0;width:100%;white-space:normal}
  .cs-btn{font-size:11px;padding:3px 8px}
}
.capin{width:52px;padding:2px 6px;font-size:12px;text-align:center}