:root{--bg: #0e1116;--bg-elev: #161b22;--bg-soft: #1c232d;--line: #2a3340;--text: #e8edf4;--muted: #8b97a8;--accent: #3d8bfd;--accent-2: #22c55e;--warn: #f59e0b;--danger: #ef4444;--purple: #a78bfa;--shadow: 0 12px 40px rgba(0, 0, 0, .35);--radius: 14px}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{min-height:100%}body{font-family:DM Sans,system-ui,sans-serif;background:radial-gradient(1200px 600px at 10% -10%,rgba(61,139,253,.18),transparent 50%),radial-gradient(900px 500px at 100% 0%,rgba(167,139,250,.12),transparent 45%),var(--bg);color:var(--text)}button,input,textarea,select{font:inherit;color:inherit}.app{display:grid;grid-template-columns:260px 1fr 340px;min-height:100vh}.sidebar{border-right:1px solid var(--line);background:#0e1116b8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:22px 16px;display:flex;flex-direction:column;gap:22px}.brand{display:flex;align-items:center;gap:12px;padding:0 8px}.logo{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),#7c5cff);font-weight:700;letter-spacing:-.04em}.brand h1{font-size:16px;font-weight:700}.brand p{color:var(--muted);font-size:12px}.nav{display:flex;flex-direction:column;gap:6px}.nav button{text-align:left;background:transparent;border:0;padding:10px 12px;border-radius:10px;color:var(--muted);cursor:pointer}.nav button.active,.nav button:hover{background:var(--bg-soft);color:var(--text)}.stats{display:grid;gap:8px}.stat{background:var(--bg-elev);border:1px solid var(--line);border-radius:12px;padding:12px}.stat span{display:block;color:var(--muted);font-size:12px}.stat strong{font-size:22px}.main{display:grid;grid-template-rows:auto 1fr;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border-bottom:1px solid var(--line)}.search{flex:1;max-width:420px;background:var(--bg-elev);border:1px solid var(--line);border-radius:999px;padding:10px 16px}.filters{display:flex;gap:8px}.chip{border:1px solid var(--line);background:var(--bg-elev);border-radius:999px;padding:8px 12px;cursor:pointer;color:var(--muted)}.chip.active{color:var(--text);border-color:var(--accent);background:#3d8bfd1f}.workspace{display:grid;grid-template-columns:320px 1fr;min-height:0}.queue{border-right:1px solid var(--line);overflow:auto}.ticket{width:100%;text-align:left;background:transparent;border:0;border-bottom:1px solid var(--line);padding:16px 18px;cursor:pointer}.ticket:hover,.ticket.active{background:var(--bg-elev)}.ticket-head{display:flex;justify-content:space-between;gap:8px;margin-bottom:6px}.ticket h3{font-size:14px}.badge{font-size:11px;border-radius:999px;padding:3px 8px;font-family:IBM Plex Mono,monospace}.badge.open{background:#3d8bfd29;color:#8ec0ff}.badge.pending{background:#f59e0b29;color:#fbbf24}.badge.resolved{background:#22c55e29;color:#4ade80}.ticket p,.meta{color:var(--muted);font-size:12px}.chat{display:grid;grid-template-rows:auto 1fr auto;min-width:0}.chat-head{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px}.messages{overflow:auto;padding:22px;display:flex;flex-direction:column;gap:12px}.bubble{max-width:72%;padding:12px 14px;border-radius:16px;line-height:1.45;font-size:14px}.bubble.client{background:var(--bg-soft);border:1px solid var(--line);align-self:flex-start}.bubble.agent{background:linear-gradient(180deg,#2b6de8,#2563eb);align-self:flex-end}.composer{display:grid;grid-template-columns:1fr auto;gap:10px;padding:16px 22px 22px}textarea{resize:none;min-height:72px;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;outline:none}.composer button,.primary{background:var(--accent);border:0;border-radius:12px;padding:0 18px;cursor:pointer;font-weight:600}.panel{border-left:1px solid var(--line);background:#161b2280;padding:22px 18px;display:flex;flex-direction:column;gap:18px}.card{background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}.card h2{font-size:13px;color:var(--muted);margin-bottom:10px;text-transform:uppercase;letter-spacing:.08em}.row{display:flex;justify-content:space-between;gap:8px;font-size:13px;padding:6px 0}.macros{display:flex;flex-wrap:wrap;gap:8px}.macros button{background:var(--bg-soft);border:1px solid var(--line);border-radius:999px;padding:7px 10px;cursor:pointer;font-size:12px}.empty{padding:48px 24px;color:var(--muted);text-align:center}@media(max-width:1100px){.app{grid-template-columns:1fr}.sidebar,.panel{display:none}.workspace{grid-template-columns:1fr}}
