/* ===== 客服工作台 Pro · 全新视觉 ===== */
:root{
  --bg:#f2f5fb; --panel:#ffffff; --panel-2:#f8fafd; --line:#e8edf6;
  --text:#0f172a; --text-2:#5b6b86; --text-3:#95a3ba;
  --brand:#4f46e5; --brand-2:#0ea5e9; --brand-soft:#eef1ff;
  --ok:#16a34a; --warn:#f59e0b; --danger:#e11d48;
  --bubble-in:#ffffff; --bubble-out:linear-gradient(135deg,#4f46e5,#6366f1);
  --shadow:0 8px 28px rgba(24,39,75,.08); --shadow-sm:0 2px 8px rgba(24,39,75,.06);
  --radius:14px;
}
body.dark{
  --bg:#0e1420; --panel:#151d2c; --panel-2:#111827; --line:#243044;
  --text:#e6edf9; --text-2:#9fb0c9; --text-3:#6b7c96;
  --brand:#6366f1; --brand-soft:#1e2540;
  --bubble-in:#1e293b; --bubble-out:linear-gradient(135deg,#4f46e5,#7c3aed);
  --shadow:0 8px 28px rgba(0,0,0,.45); --shadow-sm:0 2px 8px rgba(0,0,0,.3);
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;transition:background .25s,color .25s;
}
button,input,select,textarea{font-family:inherit;font-size:14px;color:inherit;}
button{cursor:pointer;}
[hidden]{display:none !important;}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-thumb{background:rgba(130,150,180,.32);border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:rgba(130,150,180,.55);}
::-webkit-scrollbar-track{background:transparent;}

/* ---------------- 登录 ---------------- */
.login-wrap{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:linear-gradient(140deg,#1e1b4b 0%,#312e81 40%,#0369a1 100%);}
.login-wrap[hidden]{display:none !important;}
.login-bg span{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;}
.login-bg span:nth-child(1){width:420px;height:420px;background:#6366f1;top:-120px;left:-80px;animation:float 14s ease-in-out infinite;}
.login-bg span:nth-child(2){width:360px;height:360px;background:#0ea5e9;bottom:-120px;right:-60px;animation:float 18s ease-in-out infinite reverse;}
.login-bg span:nth-child(3){width:280px;height:280px;background:#a855f7;top:40%;right:22%;animation:float 22s ease-in-out infinite;}
@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,-30px)}}
.login-card{position:relative;width:380px;padding:34px 32px 28px;border-radius:22px;
  background:rgba(255,255,255,.96);box-shadow:0 30px 70px rgba(5,10,40,.4);animation:pop .45s cubic-bezier(.2,.9,.3,1.3);}
@keyframes pop{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:24px;}
.brand-logo{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:22px;
  background:linear-gradient(135deg,#4f46e5,#0ea5e9);box-shadow:0 6px 18px rgba(79,70,229,.4);}
.brand-name{font-size:19px;font-weight:700;color:#0f172a;letter-spacing:.3px;}
.brand-name em{font-style:normal;font-size:12px;color:#fff;background:linear-gradient(135deg,#4f46e5,#0ea5e9);
  padding:2px 7px;border-radius:6px;margin-left:4px;vertical-align:2px;}
.brand-sub{font-size:12px;color:#8b97ad;margin-top:2px;}
.field{display:block;margin-bottom:14px;}
.field>span{display:block;font-size:12px;color:#7b879c;margin-bottom:6px;font-weight:600;}
.field input,.field select,.field textarea{width:100%;padding:11px 13px;border:1.5px solid #e3e9f4;border-radius:10px;
  background:#fbfcfe;color:#0f172a;outline:none;transition:.18s;}
.field input:focus,.field select:focus{border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgba(79,70,229,.1);}
.login-error{min-height:18px;color:#e11d48;font-size:12.5px;margin:-4px 0 8px;}
.btn-primary{border:none;border-radius:10px;padding:10px 18px;color:#fff;font-weight:600;
  background:linear-gradient(135deg,#4f46e5,#6366f1);box-shadow:0 4px 14px rgba(79,70,229,.32);transition:.18s;}
.btn-primary:hover{filter:brightness(1.07);transform:translateY(-1px);}
.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none;}
.btn-primary.lg{width:100%;padding:13px;font-size:15px;letter-spacing:2px;}
.btn-ghost.lg{width:100%;padding:13px;font-size:15px;font-weight:600;margin-top:10px;}
.login-tip{text-align:center;color:#94a3b8;font-size:12px;margin-top:14px;}
.login-alt{display:block;text-align:center;margin-top:8px;font-size:12px;color:#6366f1;text-decoration:none;}
.login-alt:hover{text-decoration:underline;}

/* ---------------- 布局 ---------------- */
#app{display:grid;grid-template-columns:66px 320px 1fr 296px;grid-template-rows:minmax(0,1fr);height:100vh;overflow:hidden;}
#app[hidden]{display:none !important;}
@media (max-width:1200px){#app{grid-template-columns:66px 290px 1fr;} .info-pane{display:none;}}

/* 图标导航 */
.rail{background:linear-gradient(180deg,#1e1b4b,#312e81 60%,#1e3a8a);display:flex;flex-direction:column;
  align-items:center;padding:14px 0 16px;gap:6px;}
.rail-logo{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:19px;margin-bottom:12px;
  background:rgba(255,255,255,.14);backdrop-filter:blur(6px);}
.rail-btn{position:relative;width:42px;height:42px;border:none;border-radius:12px;background:transparent;
  color:#fff;display:grid;place-items:center;transition:.18s;}
.rail-btn .ri{font-size:18px;opacity:.82;}
.rail-btn:hover{background:rgba(255,255,255,.13);}
.rail-btn.active{background:rgba(255,255,255,.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);}
.rail-btn.active::before{content:'';position:absolute;left:-13px;top:11px;width:3px;height:20px;border-radius:3px;background:#fff;}
.rail-dot{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:#f43f5e;
  box-shadow:0 0 0 2px rgba(30,27,75,.9);animation:pulse 1.6s infinite;}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.35);opacity:.65}}
.rail-space{flex:1;}

/* 会话列表 */
.list-pane{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0;min-height:0;}
.lp-head{padding:16px 16px 0;border-bottom:1px solid var(--line);}
.lp-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.lp-title h1{font-size:17px;margin:0;font-weight:700;letter-spacing:.2px;}
.online-chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ok);
  background:rgba(22,163,74,.1);padding:3px 9px;border-radius:20px;font-weight:600;}
.online-chip i{width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px rgba(22,163,74,.18);}
.search{position:relative;margin-bottom:12px;}
.search .s-ico{position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:13px;opacity:.5;}
.search input{width:100%;padding:9px 12px 9px 32px;border:1px solid var(--line);border-radius:10px;
  background:var(--panel-2);outline:none;transition:.18s;}
.search input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(79,70,229,.1);}
.tabs{display:flex;gap:2px;}
.tab{flex:1;border:none;background:transparent;padding:9px 4px 11px;color:var(--text-2);font-size:12.5px;
  font-weight:600;border-bottom:2px solid transparent;transition:.18s;white-space:nowrap;}
.tab em{font-style:normal;font-size:10.5px;background:var(--line);color:var(--text-2);
  padding:1px 5px;border-radius:8px;margin-left:3px;}
.tab.active{color:var(--brand);border-bottom-color:var(--brand);}
.tab.active em{background:var(--brand);color:#fff;}
.conv-list{flex:1;overflow-y:auto;padding:8px;min-height:0;}
.conv{display:flex;gap:11px;padding:11px 12px;border-radius:12px;cursor:pointer;transition:.15s;position:relative;}
.conv:hover{background:var(--panel-2);}
.conv.active{background:var(--brand-soft);box-shadow:inset 0 0 0 1px rgba(79,70,229,.18);}
.conv-av{width:40px;height:40px;border-radius:12px;flex:none;display:grid;place-items:center;color:#fff;
  font-weight:700;font-size:15px;box-shadow:var(--shadow-sm);position:relative;}
.conv-av.on::after{content:'';position:absolute;right:-2px;bottom:-2px;width:11px;height:11px;border-radius:50%;
  background:var(--ok);border:2px solid var(--panel);}
.conv-main{flex:1;min-width:0;}
.conv-top{display:flex;align-items:baseline;justify-content:space-between;gap:6px;}
.conv-name{font-weight:650;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.conv-time{font-size:11px;color:var(--text-3);flex:none;}
.conv-msg{font-size:12.5px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;}
.conv-meta{display:flex;align-items:center;gap:6px;margin-top:5px;}
.pill{font-size:10.5px;padding:1px 7px;border-radius:20px;font-weight:600;}
.pill.gray{background:var(--line);color:var(--text-2);}
.pill.blue{background:rgba(14,165,233,.14);color:#0284c7;}
.pill.green{background:rgba(22,163,74,.13);color:#15803d;}
.pill.amber{background:rgba(245,158,11,.16);color:#b45309;}
.unread{position:absolute;right:12px;bottom:12px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;
  background:#f43f5e;color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(244,63,94,.4);}
.lp-foot{display:flex;align-items:center;gap:10px;padding:11px 14px;border-top:1px solid var(--line);background:var(--panel-2);}
.me-avatar{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:#fff;font-weight:700;
  font-size:13px;background:linear-gradient(135deg,#4f46e5,#0ea5e9);}
.me-info{flex:1;min-width:0;line-height:1.3;}
.me-info b{font-size:13px;display:block;}
.me-info small{font-size:11px;color:var(--text-3);}
.conn{color:var(--ok);font-size:11px;}
.conn.off{color:var(--danger);}

/* 聊天区 */
.chat-pane{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--panel-2);position:relative;}
.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-3);text-align:center;padding:24px;}
.empty[hidden]{display:none !important;}
.empty-art{font-size:56px;opacity:.35;margin-bottom:12px;}
.empty h2{font-size:16px;color:var(--text-2);margin:0 0 6px;font-weight:650;}
.empty p{font-size:13px;max-width:320px;margin:0;}
.chat{flex:1;display:flex;flex-direction:column;min-height:0;}
.chat[hidden]{display:none !important;}
.chat-head{display:flex;align-items:center;gap:12px;padding:12px 18px;background:var(--panel);border-bottom:1px solid var(--line);}
.v-avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#fff;font-weight:700;
  background:linear-gradient(135deg,#0ea5e9,#6366f1);flex:none;}
.ch-main{flex:1;min-width:0;}
.ch-title{display:flex;align-items:center;gap:8px;}
.ch-title b{font-size:15px;}
.badge{font-size:11px;padding:2px 8px;border-radius:20px;background:rgba(22,163,74,.13);color:#15803d;font-weight:600;}
.badge.closed{background:var(--line);color:var(--text-2);}
.ch-sub{font-size:12px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ch-actions{display:flex;align-items:center;gap:7px;flex:none;}
.mini-select{padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);max-width:130px;}
.btn-ghost{border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:7px 13px;
  color:var(--text-2);font-size:12.5px;font-weight:600;transition:.16s;}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft);}
.btn-ghost.danger:hover{border-color:var(--danger);color:var(--danger);background:rgba(225,29,72,.07);}

.messages{flex:1;overflow-y:auto;padding:20px 22px 8px;display:flex;flex-direction:column;gap:3px;min-height:0;}
.date-sep{align-self:center;font-size:11px;color:var(--text-3);background:var(--panel);
  padding:3px 12px;border-radius:20px;margin:12px 0 8px;box-shadow:var(--shadow-sm);}
.row{display:flex;gap:9px;align-items:flex-end;margin-bottom:12px;animation:slideIn .26s ease;}
@keyframes slideIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.row.out{flex-direction:row-reverse;}
.row .av{width:30px;height:30px;border-radius:10px;flex:none;display:grid;place-items:center;color:#fff;
  font-size:12px;font-weight:700;}
.stack{max-width:64%;display:flex;flex-direction:column;}
.row.out .stack{align-items:flex-end;}
.sender{font-size:11px;color:var(--text-3);margin:0 4px 3px;}
.bubble{position:relative;padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.62;
  word-break:break-word;white-space:pre-wrap;box-shadow:var(--shadow-sm);}
.row.in .bubble{background:var(--bubble-in);border-bottom-left-radius:4px;color:var(--text);}
.row.out .bubble{background:var(--bubble-out);color:#fff;border-bottom-right-radius:4px;}
.row.in .bubble::after{content:'';position:absolute;left:-5px;bottom:0;width:10px;height:10px;
  background:var(--bubble-in);clip-path:polygon(100% 0,100% 100%,0 100%);border-bottom-left-radius:3px;}
.row.sys{justify-content:center;}
.row.sys .bubble{background:rgba(245,158,11,.13);color:#b45309;font-size:12.5px;box-shadow:none;border-radius:10px;}
.row.note{justify-content:center;margin:6px 0;}
.row.note .note-bubble{background:rgba(99,102,241,.1);border:1px dashed rgba(99,102,241,.45);color:#4338ca;
  font-size:12.5px;box-shadow:none;border-radius:10px;max-width:88%;}
.note-tag{display:inline-block;font-size:10.5px;font-weight:700;color:#4f46e5;margin-right:6px;
  background:rgba(99,102,241,.16);padding:1px 7px;border-radius:8px;}
.meta{font-size:10.5px;color:var(--text-3);margin:4px 4px 0;display:flex;gap:5px;}
.msg-img{max-width:230px;max-height:230px;border-radius:12px;display:block;cursor:zoom-in;box-shadow:var(--shadow-sm);}
.msg-file{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--bubble-in);
  text-decoration:none;color:var(--text);box-shadow:var(--shadow-sm);min-width:190px;}
.row.out .msg-file{background:rgba(255,255,255,.16);color:#fff;}
.msg-file .fi{font-size:22px;}
.msg-file b{display:block;font-size:13px;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.msg-file small{opacity:.7;font-size:11px;}
.typing-bar{padding:0 24px 8px;font-size:12px;color:var(--text-3);display:flex;align-items:center;gap:7px;}
.typing-bar[hidden]{display:none !important;}
.dots{display:inline-flex;gap:3px;}
.dots i{width:5px;height:5px;border-radius:50%;background:var(--brand);animation:bounce 1.2s infinite;}
.dots i:nth-child(2){animation-delay:.16s} .dots i:nth-child(3){animation-delay:.32s}
@keyframes bounce{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}

.composer{background:var(--panel);border-top:1px solid var(--line);padding:9px 16px 13px;position:relative;}
.comp-tools{display:flex;align-items:center;gap:4px;margin-bottom:6px;}
.ct{border:none;background:transparent;font-size:16px;width:32px;height:30px;border-radius:8px;transition:.15s;}
.ct:hover{background:var(--brand-soft);}
.ct.active{background:var(--brand-soft);color:var(--brand);box-shadow:inset 0 0 0 1px rgba(79,70,229,.4);}
.grow{flex:1;}
.hint{font-size:11px;color:var(--text-3);}
.comp-input{display:flex;gap:10px;align-items:flex-end;}
.comp-input textarea{flex:1;border:1.5px solid var(--line);border-radius:12px;padding:10px 13px;resize:none;
  max-height:120px;background:var(--panel-2);outline:none;transition:.18s;line-height:1.6;}
.comp-input textarea:focus{border-color:var(--brand);background:var(--panel);box-shadow:0 0 0 3px rgba(79,70,229,.09);}
.btn-send{width:42px;height:42px;border:none;border-radius:12px;color:#fff;font-size:17px;flex:none;
  background:linear-gradient(135deg,#4f46e5,#6366f1);box-shadow:0 4px 14px rgba(79,70,229,.35);transition:.18s;}
.btn-send:hover{transform:translateY(-2px) scale(1.04);}
.pop{position:absolute;bottom:96px;left:16px;background:var(--panel);border:1px solid var(--line);
  border-radius:14px;box-shadow:var(--shadow);padding:10px;z-index:20;animation:pop .18s ease;}
.pop[hidden]{display:none !important;}
.emoji-pop{width:296px;display:flex;flex-wrap:wrap;gap:2px;}
.emoji-pop button{border:none;background:transparent;font-size:19px;width:34px;height:34px;border-radius:8px;}
.emoji-pop button:hover{background:var(--brand-soft);transform:scale(1.15);}
.quick-pop{width:330px;max-height:270px;overflow-y:auto;}
.quick-pop .qi{padding:8px 11px;border-radius:9px;cursor:pointer;font-size:13px;color:var(--text-2);}
.quick-pop .qi:hover{background:var(--brand-soft);color:var(--brand);}
.quick-pop .qi b{display:block;font-size:11.5px;color:var(--text-3);font-weight:600;}

/* 右侧信息 */
.info-pane{background:var(--panel);border-left:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;min-height:0;}
.ip-hero{padding:22px 18px 16px;text-align:center;background:linear-gradient(160deg,var(--brand-soft),transparent);}
.ip-avatar{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;margin:0 auto 10px;
  color:#fff;font-size:21px;font-weight:700;background:linear-gradient(135deg,#0ea5e9,#6366f1);box-shadow:var(--shadow);}
.ip-hero b{display:block;font-size:15px;}
.ip-hero small{color:var(--text-3);font-size:11px;}
.ip-tabs{display:flex;padding:0 12px;border-bottom:1px solid var(--line);}
.ip-tab{flex:1;border:none;background:transparent;padding:9px 0 10px;font-size:12.5px;font-weight:600;
  color:var(--text-2);border-bottom:2px solid transparent;}
.ip-tab.active{color:var(--brand);border-bottom-color:var(--brand);}
.ip-body{flex:1;overflow-y:auto;padding:14px;min-height:0;}
.ip-sec[hidden]{display:none !important;}
.kv{display:flex;gap:8px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:12.5px;}
.kv span{color:var(--text-3);width:70px;flex:none;}
.kv b{font-weight:600;word-break:break-all;flex:1;}
.trace-item{position:relative;padding:0 0 14px 18px;border-left:2px solid var(--line);}
.trace-item::before{content:'';position:absolute;left:-5px;top:4px;width:8px;height:8px;border-radius:50%;
  background:var(--brand);box-shadow:0 0 0 3px var(--brand-soft);}
.trace-item b{font-size:12.5px;display:block;}
.trace-item small{font-size:11px;color:var(--text-3);word-break:break-all;}
.canned-item{padding:9px 11px;border-radius:10px;background:var(--panel-2);margin-bottom:7px;font-size:12.5px;
  cursor:pointer;border:1px solid transparent;transition:.15s;}
.canned-item:hover{border-color:var(--brand);color:var(--brand);}

/* ---------------- 弹窗 ---------------- */
.modal{position:fixed;inset:0;background:rgba(15,23,42,.5);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;z-index:60;padding:20px;}
.modal[hidden]{display:none !important;}
.modal-card{width:520px;max-width:100%;max-height:88vh;display:flex;flex-direction:column;
  background:var(--panel);border-radius:18px;box-shadow:0 30px 70px rgba(5,10,40,.35);animation:pop .22s ease;}
.modal-card.wide{width:720px;}
.modal-card>header{display:flex;align-items:center;gap:12px;padding:15px 20px;border-bottom:1px solid var(--line);}
.modal-card>header b{font-size:15px;flex:none;}
.modal-card>header>button:last-child{margin-left:auto;border:none;background:transparent;font-size:16px;color:var(--text-3);
  width:30px;height:30px;border-radius:8px;}
.modal-card>header>button:last-child:hover{background:var(--line);color:var(--text);}
.modal-body{padding:18px 20px 20px;overflow-y:auto;}
.rows{margin-bottom:14px;}
.row-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;background:var(--panel-2);margin-bottom:7px;}
.row-item .rt{flex:1;min-width:0;font-size:13px;}
.row-item .rt small{display:block;color:var(--text-3);font-size:11.5px;}
.row-item button{border:none;background:transparent;color:var(--text-3);font-size:13px;padding:3px 7px;border-radius:6px;}
.row-item button:hover{background:rgba(225,29,72,.1);color:var(--danger);}
.inline-form{display:flex;gap:7px;flex-wrap:wrap;}
.inline-form input,.inline-form select{flex:1;min-width:110px;padding:9px 11px;border:1px solid var(--line);
  border-radius:9px;background:var(--panel-2);outline:none;}
.inline-form input:focus{border-color:var(--brand);}
.range{display:flex;gap:4px;margin-left:8px;}
.rg{border:1px solid var(--line);background:transparent;border-radius:8px;padding:4px 10px;font-size:12px;color:var(--text-2);}
.rg.active{background:var(--brand);border-color:var(--brand);color:#fff;}
.stats-body .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px;}
.stat-card{padding:13px;border-radius:12px;background:linear-gradient(150deg,var(--brand-soft),transparent);
  border:1px solid var(--line);}
.stat-card b{display:block;font-size:21px;font-weight:700;}
.stat-card small{color:var(--text-3);font-size:11.5px;}
.stats-body table{width:100%;border-collapse:collapse;font-size:12.5px;}
.stats-body th{text-align:left;color:var(--text-3);font-weight:600;padding:7px 8px;border-bottom:1px solid var(--line);}
.stats-body td{padding:9px 8px;border-bottom:1px solid var(--line);}

/* 通知设置 */
.nt-intro{margin:0 0 14px;font-size:13px;color:var(--text-2);}
.nt-card{border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden;background:var(--panel-2);}
.nt-card-head{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;background:var(--panel);}
.nt-card-head>div{display:flex;align-items:center;gap:8px;}
.nt-ico{font-size:16px;}
.nt-card-head b{font-size:14px;}
.nt-card-head small{color:var(--text-3);font-size:11.5px;}
.nt-card-body{padding:14px 15px;border-top:1px solid var(--line);}
.nt-card-body[hidden]{display:none !important;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.check{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text-2);margin-top:6px;}
.nt-help{margin-top:9px;font-size:12px;color:var(--text-3);background:var(--panel);padding:9px 11px;border-radius:9px;line-height:1.7;}
.nt-presets{font-size:12px;color:var(--text-3);margin-bottom:11px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.chip{border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:3px 11px;font-size:12px;color:var(--text-2);}
.chip:hover{border-color:var(--brand);color:var(--brand);}
.switch{position:relative;width:44px;height:24px;flex:none;}
.switch input{opacity:0;width:0;height:0;}
.switch span{position:absolute;inset:0;background:#cbd5e1;border-radius:24px;transition:.22s;cursor:pointer;}
.switch span::before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;
  border-radius:50%;transition:.22s;box-shadow:0 1px 4px rgba(0,0,0,.25);}
.switch input:checked+span{background:linear-gradient(135deg,#4f46e5,#6366f1);}
.switch input:checked+span::before{transform:translateX(20px);}
.nt-status{padding:10px 13px;border-radius:10px;font-size:12.5px;margin-bottom:12px;line-height:1.6;}
.nt-status[hidden]{display:none !important;}
.nt-status.ok{background:rgba(22,163,74,.1);color:#15803d;}
.nt-status.err{background:rgba(225,29,72,.09);color:#be123c;}
.nt-status.info{background:var(--brand-soft);color:var(--brand);}
.nt-actions{display:flex;align-items:center;gap:8px;}
.chk-line{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-2);cursor:pointer;}
.chk-line input{width:16px;height:16px;cursor:pointer;}
.ar-kw-item{padding:10px 12px;border-radius:10px;background:var(--panel-2);margin-bottom:8px;font-size:12.5px;border:1px solid var(--line);}
.ar-kw-item .kw-head{display:flex;align-items:center;gap:8px;margin-bottom:5px;}
.ar-kw-item .kw-tag{background:var(--brand-soft);color:var(--brand);padding:2px 8px;border-radius:6px;font-weight:600;font-size:12px;}
.ar-kw-item .kw-text{color:var(--text-2);line-height:1.6;white-space:pre-wrap;word-break:break-all;}
.ar-kw-item .kw-img{color:var(--text-3);font-size:11.5px;margin-top:3px;}
.ar-kw-item .kw-del{margin-left:auto;background:none;border:none;color:var(--text-3);cursor:pointer;font-size:14px;padding:2px 6px;border-radius:6px;}
.ar-kw-item .kw-del:hover{color:#ef4444;background:rgba(239,68,68,.08);}
.ar-kw-item .kw-toggle{font-size:11px;color:var(--text-3);cursor:pointer;padding:2px 8px;border-radius:6px;border:1px solid var(--line);background:var(--panel);}
.ar-kw-item .kw-toggle.off{opacity:.5;}
.ar-kw-item.disabled{opacity:.55;}

.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:90;cursor:zoom-out;}
.lightbox[hidden]{display:none !important;}
.lightbox img{max-width:92vw;max-height:92vh;border-radius:10px;}

.toast{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:100;background:#0f172a;color:#fff;
  padding:10px 18px;border-radius:10px;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.3);animation:pop .2s ease;}
.toast.err{background:#be123c;} .toast.ok{background:#15803d;}
