:root{--bg:#0c0f0e;--sup:#141a18;--sup2:#1a2220;--borda:#26322e;--txt:#e9eeeb;--mudo:#93a19b;--verde:#34c98f;--verde2:#1d6b52;--coral:#f2704e;--amarelo:#e6bd4f;--vermelho:#ff5f57;--r:12px}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--txt);font:14px/1.45 "Segoe UI",system-ui,sans-serif}
a{color:var(--verde)}h1,h2,h3{margin:0 0 10px}h3{font-size:13px;letter-spacing:.4px;text-transform:uppercase;color:var(--mudo)}
input,textarea,select{width:100%;background:#0a0d0c;color:var(--txt);border:1px solid var(--borda);border-radius:9px;padding:9px 11px;font:inherit}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--verde2)}
.b{background:var(--sup2);color:var(--txt);border:1px solid var(--borda);border-radius:9px;padding:8px 14px;cursor:pointer;font:inherit}
.b:hover{border-color:var(--verde)}.b.ok{background:var(--verde);border-color:var(--verde);color:#06130e;font-weight:700}
.b.nao{background:transparent;color:var(--vermelho)}.b.peq{padding:4px 9px;font-size:12px}.b:disabled{opacity:.45;cursor:not-allowed}
.card{background:var(--sup);border:1px solid var(--borda);border-radius:var(--r);padding:14px}
.topo{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--borda)}
.topo .marca{font-weight:800}.topo .dir{margin-left:auto;display:flex;gap:8px;align-items:center}
.tag{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--sup2);color:var(--mudo);font-size:12px}
.tag.verde{color:var(--verde)}.tag.amarelo{color:var(--amarelo)}.tag.vermelho{color:var(--vermelho)}
.ajuda{color:var(--mudo);font-size:12px}
.chat{display:flex;flex-direction:column;gap:8px;overflow:auto}
.msg{padding:8px 11px;border-radius:12px;max-width:88%;white-space:pre-wrap}
.msg.cliente{align-self:flex-end;background:var(--verde2)}.msg.ia{background:var(--sup2)}.msg.atendente{background:#2b2550}.msg.sistema{align-self:center;color:var(--mudo);font-size:12px}
.autoriza{border:2px solid var(--amarelo);border-radius:var(--r);padding:12px;background:#231e0d}
.autoriza.vermelho{border-color:var(--vermelho);background:#2a1110}
.tela{position:relative;background:#000;border-radius:var(--r);overflow:hidden;aspect-ratio:16/9}
.tela video{width:100%;height:100%;object-fit:contain;display:block}
.tela .vazio{position:absolute;inset:0;display:grid;place-items:center;color:var(--mudo);text-align:center;padding:20px}
.grade{display:grid;gap:14px}
@media (max-width:900px){.lado{grid-template-columns:1fr!important}}