:root{--bg: #f3f5f9;--surface: #ffffff;--surface-2: #f5f7fa;--surface-3: #eaeef3;--border: rgba(15, 23, 42, .09);--border-strong: rgba(15, 23, 42, .16);--text: #1c2330;--muted: #5b6675;--faint: #8a93a1;--accent: #4f7cff;--accent-grad: linear-gradient(135deg, #5b8bff 0%, #6366f1 100%);--bot-grad: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);--green: #16a34a;--red: #dc2626;--amber: #d97706;--fb: #1877f2;--ig: #e1306c;--wa: #25d366;--r: 12px;--r-lg: 16px;--r-sm: 8px;--shadow: 0 8px 28px rgba(15, 23, 42, .12);--shadow-sm: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px rgba(15, 23, 42, .04)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;color:var(--text);background:var(--bg);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#cfd6df;border-radius:8px;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:#b8c1cd;background-clip:content-box}button{font:inherit;cursor:pointer;border-radius:var(--r-sm);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);padding:8px 12px;display:inline-flex;align-items:center;gap:6px;transition:all .15s ease;font-weight:500}button:hover{background:var(--surface-2);border-color:var(--accent)}button:active{transform:translateY(1px)}button.primary{background:var(--accent-grad);border:none;color:#fff;box-shadow:var(--shadow-sm)}button.primary:hover{filter:brightness(1.05)}button.ghost{background:transparent;border-color:transparent;color:var(--muted);padding:7px 9px}button.ghost:hover{background:var(--surface-3);color:var(--text)}button.icon{padding:8px;border-radius:10px}button:disabled{opacity:.5;cursor:not-allowed;transform:none}input,textarea,select{font:inherit;background:var(--surface);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--r-sm);padding:9px 11px;width:100%;outline:none;transition:border-color .15s}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px #4f7cff26}input::placeholder,textarea::placeholder{color:var(--faint)}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.login-wrap{display:grid;place-items:center;height:100vh;background:radial-gradient(1200px 600px at 30% -10%,rgba(99,102,241,.12),transparent),radial-gradient(900px 500px at 100% 100%,rgba(91,139,255,.1),transparent),var(--bg)}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:32px;width:360px;box-shadow:var(--shadow)}.login-logo{width:48px;height:48px;border-radius:14px;background:var(--accent-grad);display:grid;place-items:center;color:#fff;font-size:22px;margin-bottom:18px;box-shadow:var(--shadow-sm)}.login-card h1{font-size:20px;margin:0 0 4px;font-weight:650}.login-card .sub{color:var(--muted);font-size:13px;margin-bottom:22px}.field{margin-bottom:14px}.field label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px;font-weight:500}.input-icon{position:relative}.input-icon svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--faint)}.input-icon input{padding-left:36px}.err{color:var(--red);font-size:13px;margin-top:10px;display:flex;align-items:center;gap:6px}.btn-full{width:100%;justify-content:center;padding:11px;margin-top:4px}.app{display:flex;flex-direction:column;height:100vh}.topbar{display:flex;align-items:center;gap:14px;padding:0 16px;height:56px;background:var(--surface);border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm);z-index:2}.topbar .logo{width:30px;height:30px;border-radius:9px;background:var(--accent-grad);display:grid;place-items:center;color:#fff;font-size:15px}.topbar .brand{font-weight:650;font-size:15px;letter-spacing:-.01em}.topbar .nav{display:flex;gap:4px;margin-left:12px}.topbar .tab{background:transparent;border:none;color:var(--muted);padding:7px 12px;border-radius:8px}.topbar .tab:hover,.topbar .tab.active{background:var(--surface-3);color:var(--text)}.topbar .spacer{flex:1}.userchip{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:13px}.main{flex:1;display:flex;min-height:0}.avatar{position:relative;flex-shrink:0;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:600}.avatar .plat{position:absolute;right:-2px;bottom:-2px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--surface);font-size:9px;color:#fff}.plat.fb{background:var(--fb)}.plat.ig{background:var(--ig)}.plat.wa{background:var(--wa)}.pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:3px 9px;border-radius:20px;font-weight:600;letter-spacing:.01em}.pill .dot{width:6px;height:6px;border-radius:50%}.pill.bot{background:#7c3aed1f;color:#7c3aed}.pill.bot .dot{background:#7c3aed}.pill.agent{background:#4f7cff1f;color:#2563eb}.pill.agent .dot{background:#2563eb}.pill.closed{background:#64748b21;color:#475569}.pill.closed .dot{background:#64748b}.pill.on{background:#16a34a21;color:#15803d}.pill.on .dot{background:var(--green)}.pill.off{background:#dc26261f;color:#b91c1c}.pill.off .dot{background:var(--red)}.pane-list{width:340px;border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0;background:var(--surface)}.list-head{padding:12px;border-bottom:1px solid var(--border);display:grid;gap:8px}.search{position:relative}.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--faint)}.search input{padding-left:34px;background:var(--surface-2)}.filters{display:flex;gap:6px}.filters select{background:var(--surface-2);font-size:13px;padding:7px 9px}.conv-list{overflow-y:auto;flex:1}.conv{padding:11px 12px;cursor:pointer;display:flex;gap:11px;border-left:3px solid transparent}.conv:hover{background:var(--surface-2)}.conv.active{background:#eef3ff;border-left-color:var(--accent)}.conv .body{flex:1;min-width:0}.conv .row1{display:flex;align-items:center;gap:6px}.conv .name{font-weight:600;font-size:14px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv .time{font-size:11px;color:var(--faint);flex-shrink:0}.conv .row2{display:flex;align-items:center;gap:6px;margin-top:3px}.conv .preview{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.pane-thread{flex:1;display:flex;flex-direction:column;min-height:0;background:var(--bg)}.thread-head{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--surface)}.thread-head .title{font-weight:650;font-size:15px}.thread-head .spacer{flex:1}.thread-body{flex:1;overflow-y:auto;padding:20px 22px;display:flex;flex-direction:column;gap:3px}.empty{margin:auto;color:var(--faint);display:flex;flex-direction:column;align-items:center;gap:10px;font-size:14px}.empty svg{opacity:.45}.msg-row{display:flex;margin-top:9px}.msg-row.out{justify-content:flex-end}.bubble{max-width:64%;padding:9px 13px;border-radius:16px;font-size:14px;line-height:1.45;box-shadow:var(--shadow-sm);word-wrap:break-word}.bubble.in{background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:5px}.bubble.out{background:var(--accent-grad);color:#fff;border-bottom-right-radius:5px}.bubble.bot{background:var(--bot-grad);color:#fff}.bubble.failed{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.bubble .meta{font-size:10.5px;margin-top:5px;display:flex;align-items:center;gap:5px;opacity:.85}.bubble.in .meta{color:var(--faint)}.bubble img{max-width:240px;border-radius:10px;display:block;margin-bottom:5px}.bubble .filechip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;background:#00000014;border-radius:8px;margin-bottom:5px}.bubble.out .filechip{background:#ffffff2e}.composer{border-top:1px solid var(--border);padding:12px 16px;display:flex;gap:10px;align-items:flex-end;background:var(--surface)}.composer .inputwrap{flex:1;background:var(--surface-2);border:1px solid var(--border-strong);border-radius:22px;padding:4px 6px 4px 14px;display:flex;align-items:center;transition:border-color .15s}.composer .inputwrap:focus-within{border-color:var(--accent)}.composer textarea{resize:none;height:24px;max-height:120px;border:none;background:transparent;padding:4px 0}.composer textarea:focus{box-shadow:none}.send-btn{width:40px;height:40px;border-radius:50%;padding:0;justify-content:center;background:var(--accent-grad);border:none;color:#fff;flex-shrink:0}.send-btn:hover{filter:brightness(1.08)}.window-warn{font-size:12px;color:#92560a;padding:7px 16px;display:flex;align-items:center;gap:6px;background:#d977061a}.pane-side{width:300px;border-left:1px solid var(--border);padding:18px;overflow-y:auto;background:var(--surface)}.side-section{font-size:11px;color:var(--faint);margin:0 0 12px;text-transform:uppercase;letter-spacing:.08em;font-weight:700}.side-avatar{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:18px}.side-avatar .nm{font-weight:600;font-size:15px}.kv{display:flex;align-items:center;gap:9px;font-size:13px;margin-bottom:11px;color:var(--text)}.kv svg{color:var(--faint);flex-shrink:0}.kv .k{color:var(--muted)}.divider{height:1px;background:var(--border);margin:18px 0}.admin{padding:22px;overflow-y:auto;width:100%;max-width:1000px;margin:0 auto}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px;margin-bottom:18px;box-shadow:var(--shadow-sm)}.card h2{font-size:16px;margin:0 0 14px;font-weight:650;display:flex;align-items:center;gap:9px}.card h3{font-size:13px;color:var(--muted);margin:18px 0 10px;text-transform:uppercase;letter-spacing:.05em}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;padding:8px 10px;border-bottom:1px solid var(--border);color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}td{text-align:left;padding:10px;border-bottom:1px solid var(--border);vertical-align:middle}tr:last-child td{border-bottom:none}.inline{display:flex;gap:8px;align-items:center}.spacer{flex:1}.muted{color:var(--muted)}.subcard{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r);padding:14px;margin-bottom:10px}.toast{position:fixed;bottom:18px;right:18px;background:var(--surface);border:1px solid var(--border-strong);padding:11px 16px;border-radius:var(--r);box-shadow:var(--shadow);display:flex;align-items:center;gap:8px}.toast.error{border-color:var(--red);color:var(--red)}.saved{color:var(--green);font-size:13px;display:inline-flex;align-items:center;gap:5px}