:root{--bg: #0b1020;--panel: #141b30;--panel-2: #1b243d;--border: #27314f;--text: #e7ecf7;--muted: #8b96b3;--accent: #4f8cff;--accent-soft: #1e2a4d;--good: #34d399;--warn: #fbbf24;--bad: #f87171;--radius: 14px;--maxw: 1100px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:inherit}.app-shell{min-height:100%;padding-bottom:76px}.container{max-width:var(--maxw);margin:0 auto;padding:16px}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:12px 16px;background:#0b1020d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}.topbar .brand{font-weight:700;letter-spacing:.2px}.topbar .brand small{color:var(--muted);font-weight:500;margin-left:6px}.topbar .spacer{flex:1}.client-switch{background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:8px 10px;font-size:14px;max-width:50vw}.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:30;display:flex;justify-content:space-around;background:#141b30f2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--border);padding:6px 4px env(safe-area-inset-bottom)}.tabbar a{flex:1;text-align:center;color:var(--muted);font-size:11px;padding:6px 2px;border-radius:8px}.tabbar a .ico{display:block;font-size:18px;line-height:1.2}.tabbar a.active{color:var(--accent);background:var(--accent-soft)}@media (min-width: 860px){.tabbar{position:sticky;top:57px;bottom:auto;flex-direction:column;width:200px;height:calc(100vh - 57px);border-top:none;border-right:1px solid var(--border);justify-content:flex-start;gap:4px;padding:12px 8px}.tabbar a{text-align:left;font-size:14px;display:flex;align-items:center;gap:10px}.tabbar a .ico{display:inline;font-size:16px}.with-sidenav{display:flex}.with-sidenav .content{flex:1;min-width:0}}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.card+.card{margin-top:12px}.grid{display:grid;gap:12px}.grid.cols-2,.grid.cols-4{grid-template-columns:repeat(2,1fr)}@media (min-width: 720px){.grid.cols-4{grid-template-columns:repeat(4,1fr)}}.stat{display:flex;flex-direction:column;gap:4px}.stat .value{font-size:26px;font-weight:700}.stat .label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.4px}.stat .sub{color:var(--muted);font-size:12px}.section-title{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:18px 4px 8px}h1{font-size:22px;margin:4px 4px 2px}.page-sub{color:var(--muted);margin:0 4px 12px;font-size:14px}.row{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;border:1px solid transparent}.row:hover{background:var(--panel-2)}.row+.row{border-top:1px solid var(--border);border-radius:0}.row .grow{flex:1;min-width:0}.row .title{font-weight:600}.row .meta{color:var(--muted);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:3px 9px;border-radius:999px;border:1px solid var(--border);background:var(--panel-2);color:var(--muted)}.badge.good{color:var(--good);border-color:#1f5a45;background:#10241d}.badge.warn{color:var(--warn);border-color:#5a4a1f;background:#241e10}.badge.bad{color:var(--bad);border-color:#5a2424;background:#241010}.badge.accent{color:var(--accent);border-color:#2a3c6b;background:var(--accent-soft)}.dot{width:8px;height:8px;border-radius:999px;background:var(--muted)}.dot.live{background:var(--good);box-shadow:0 0 #34d39999;animation:pulse 1.6s infinite}@keyframes pulse{0%{box-shadow:0 0 #34d39980}70%{box-shadow:0 0 0 8px #34d39900}to{box-shadow:0 0 #34d39900}}.btn{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:10px 14px;font-weight:600;cursor:pointer}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.secondary{background:var(--panel-2);color:var(--text);border:1px solid var(--border)}.btn.ghost{background:transparent;color:var(--muted);border:1px solid var(--border)}.btn.small{padding:6px 10px;font-size:13px}.input,textarea.input{width:100%;background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:11px 12px;font-size:15px}textarea.input{min-height:120px;resize:vertical;font-family:inherit;line-height:1.5}label.field{display:block;margin-bottom:12px}label.field span{display:block;color:var(--muted);font-size:13px;margin-bottom:6px}.switch{position:relative;width:46px;height:26px;flex:0 0 auto}.switch input{display:none}.switch .track{position:absolute;top:0;right:0;bottom:0;left:0;background:#3a2330;border:1px solid #5a2430;border-radius:999px;transition:background .15s,border-color .15s}.switch .thumb{position:absolute;top:3px;left:3px;width:18px;height:18px;background:#f87171;border-radius:999px;transition:transform .15s,background .15s}.switch input:checked+.track{background:#103024;border-color:#1f5a45}.switch input:checked+.track+.thumb{transform:translate(20px);background:var(--good)}.switch.disabled{opacity:.5;pointer-events:none}.bubble{max-width:80%;padding:10px 12px;border-radius:14px;margin:6px 0;font-size:14px;line-height:1.45}.bubble.agent{background:var(--accent-soft);border:1px solid #2a3c6b;margin-right:auto;border-bottom-left-radius:4px}.bubble.contact{background:var(--panel-2);border:1px solid var(--border);margin-left:auto;border-bottom-right-radius:4px}.bubble.system,.bubble.human{background:transparent;border:1px dashed var(--border);color:var(--muted);margin:6px auto;text-align:center;font-size:12px}.bubble .who{font-size:11px;color:var(--muted);margin-bottom:3px}.muted{color:var(--muted)}.empty{text-align:center;color:var(--muted);padding:36px 16px}.spinner{width:22px;height:22px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:999px;animation:spin .8s linear infinite;margin:36px auto}@keyframes spin{to{transform:rotate(360deg)}}.banner{border-radius:12px;padding:12px 14px;font-size:14px}.banner.warn{background:#241e10;border:1px solid #5a4a1f;color:var(--warn)}.banner.info{background:var(--accent-soft);border:1px solid #2a3c6b;color:var(--accent)}.center-screen{min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:100%;max-width:380px}.kv{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--border);font-size:14px}.kv:last-child{border-bottom:none}.kv .k{color:var(--muted)}.right{text-align:right}.flex{display:flex;align-items:center;gap:10px}.wrap{flex-wrap:wrap}