:root{--bg:#f4f5f7;--panel:#fff;--line:#e3e6ea;--text:#1f2933;--muted:#6b7280;--brand:#2563eb;--brand-soft:#dbeafe;--danger:#dc2626;--ok:#16a34a;--note:#fff7d6;--note-line:#f2d675}*{box-sizing:border-box}body{color:var(--text);background:var(--bg);margin:0;font:14px/1.5 -apple-system,PingFang SC,Segoe UI,Roboto,sans-serif}button{font:inherit;cursor:pointer;border:1px solid var(--line);background:var(--panel);border-radius:6px;padding:6px 12px}button.primary{background:var(--brand);border-color:var(--brand);color:#fff}button.danger{color:var(--danger)}button:disabled{opacity:.5;cursor:default}input,select,textarea{font:inherit;border:1px solid var(--line);border-radius:6px;width:100%;padding:7px 9px}textarea{resize:vertical}.center{justify-content:center;align-items:center;min-height:100vh;display:flex}.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;width:380px;max-width:95vw;padding:24px}.card h1{margin:0 0 16px;font-size:18px}.field{margin-bottom:12px}.field label{color:var(--muted);margin-bottom:4px;font-size:12px;display:block}.error{color:var(--danger);margin:8px 0;font-size:13px}.muted{color:var(--muted);font-size:12px}.ok{color:var(--ok)}.topbar{background:var(--panel);border-bottom:1px solid var(--line);align-items:center;gap:16px;height:48px;padding:0 16px;display:flex}.topbar .brand{font-weight:600}.topbar .spacer{flex:1}.topbar select{width:auto}.layout{grid-template-columns:300px 1fr 300px;height:calc(100vh - 48px);display:grid}.col{background:var(--panel);border-right:1px solid var(--line);flex-direction:column;display:flex;overflow:auto}.col:last-child{border-right:0;border-left:1px solid var(--line)}.tabs{border-bottom:1px solid var(--line);display:flex}.tabs button{color:var(--muted);background:0 0;border:0;border-radius:0;flex:1;padding:10px 0}.tabs button.active{color:var(--brand);box-shadow:inset 0 -2px 0 var(--brand)}.list-item{border-bottom:1px solid var(--line);cursor:pointer;padding:10px 14px}.list-item:hover{background:#f9fafb}.list-item.active{background:var(--brand-soft)}.list-item .row{justify-content:space-between;gap:8px;display:flex}.badge{background:var(--brand);color:#fff;border-radius:10px;padding:0 7px;font-size:11px}.chat{flex-direction:column;height:100%;display:flex}.chat-head{border-bottom:1px solid var(--line);background:var(--panel);align-items:center;gap:12px;padding:10px 16px;display:flex}.messages{flex-direction:column;flex:1;gap:8px;padding:16px;display:flex;overflow:auto}.msg{background:var(--panel);border:1px solid var(--line);border-radius:12px;max-width:70%;padding:8px 12px}.msg.mine{background:var(--brand-soft);border-color:#bfdbfe;align-self:flex-end}.msg.customer{align-self:flex-start}.msg .meta{color:var(--muted);gap:8px;margin-top:4px;font-size:11px;display:flex}.msg.system{color:var(--muted);background:0 0;border:0;align-self:center;font-size:12px}.composer{border-top:1px solid var(--line);background:var(--panel);align-items:flex-end;gap:8px;padding:10px 16px;display:flex}.composer.note{background:var(--note);border-top-color:var(--note-line)}.section{border-bottom:1px solid var(--line);padding:12px 14px}.section h3{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:0 0 8px;font-size:13px}.note-item{background:var(--note);border:1px solid var(--note-line);border-radius:8px;margin-bottom:8px;padding:8px 10px;font-size:13px}.kv{justify-content:space-between;padding:3px 0;font-size:13px;display:flex}.kv span:first-child{color:var(--muted)}.page{max-width:1000px;margin:24px auto;padding:0 16px}.page h2{font-size:16px}table{border-collapse:collapse;background:var(--panel);width:100%}th,td{text-align:left;border-bottom:1px solid var(--line);padding:8px 10px;font-size:13px}th{color:var(--muted);font-weight:500}.inline{align-items:center;gap:8px;display:flex}.inline input,.inline select{width:auto}.pill{color:var(--muted);background:#eef2f7;border-radius:10px;padding:1px 8px;font-size:11px;display:inline-block}.pill.live{color:var(--ok);background:#dcfce7}.callpanel{z-index:20;color:#fff;background:#10131a;border-radius:14px;align-items:center;gap:12px;width:340px;padding:14px 16px;display:flex;position:fixed;top:60px;right:16px;box-shadow:0 12px 32px #00000059}.callpanel.toast{background:var(--panel);color:var(--text);border:1px solid var(--line);box-shadow:0 6px 20px #0000001f}.callpanel .avatar{background:#2e3a59;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:20px;display:flex}.callpanel .who{flex:1;min-width:0}.callpanel .who strong{font-size:15px}.callpanel .muted{color:#b8c0d0}.callpanel .muted.warn{color:#e0a04a}.callpanel .actions{gap:8px;display:flex}.callpanel .actions button{color:#fff;background:#3a4256;border-color:#3a4256;border-radius:20px;padding:8px 12px}.callpanel .actions button.danger{background:#d9433b;border-color:#d9433b}.callpanel .actions button.ok{background:#2fa84f;border-color:#2fa84f}.callpanel.incoming{animation:1.6s ease-in-out infinite callpulse}@keyframes callpulse{0%,to{box-shadow:0 12px 32px #00000059}50%{box-shadow:0 12px 32px #2fa84f8c}}.msg.call{color:var(--muted);background:0 0;border:0;align-self:center;font-size:12px}.msg-image{border-radius:8px;max-width:240px;max-height:240px;display:block}.msg-audio{flex-direction:column;gap:4px;display:flex}.msg-audio audio{width:240px;height:36px}.media-buttons{gap:6px}.recording{color:var(--danger);font-size:12px;animation:1s steps(2,end) infinite blink}@keyframes blink{to{opacity:.4}}.site{background:var(--panel);flex-direction:column;min-height:100vh;display:flex}.site-head{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:14px 24px;display:flex}.site-head .brand{color:var(--text);font-size:18px;font-weight:700;text-decoration:none}.site-main{flex:1;width:100%;max-width:760px;margin:0 auto;padding:48px 24px}.site-main h1{margin:0 0 12px;font-size:32px}.site-main .lead{color:#374151;font-size:17px}.features{gap:12px;margin:28px 0;padding:0;list-style:none;display:grid}.features li{background:var(--bg);border-radius:10px;padding:14px 16px}.features strong{margin-bottom:4px;display:block}.cta{align-items:center;gap:16px;margin:24px 0;display:flex}.doc h2{margin:24px 0 8px;font-size:18px}.doc p,.doc li{line-height:1.7}.doc hr{border:0;border-top:1px solid var(--line);margin:36px 0}.site-foot{border-top:1px solid var(--line);color:var(--muted);flex-wrap:wrap;gap:20px;padding:18px 24px;font-size:12px;display:flex}.site-foot a{color:var(--muted)}
