/* Painel do time de agentes · v2.2 · tokens da LP Black Friday (escuro com tom verde; Jade em ação e sinais) */
@font-face { font-family:"Figtree"; src:url("/estatico/figtree.woff2") format("woff2"); font-weight:400 800; font-display:swap; }
@font-face { font-family:"Geist Mono"; src:url("/estatico/geist-mono.woff2") format("woff2"); font-weight:400 500; font-display:swap; }

:root {
  color-scheme:dark;
  --ink:#0B3B30; --jade:#1DBF85; --mint:#CFF2E0; --warn:#E8B04B; --erro:#F97066; --roxo:#9B87F5;
  --page:#0D100F; --surface:#111614; --card:#161C19; --card-2:#1D2421; --panel-soft:#19211E; --panel-feature:#10291F; --selection:#173329;
  --text:#EDEDED;
  --text-muted:color-mix(in srgb,var(--text) 74%,var(--page));
  --text-faint:color-mix(in srgb,var(--text) 48%,var(--page));
  --line:rgba(207,242,224,.08); --line-2:rgba(207,242,224,.14);
  --line-jade:color-mix(in srgb,var(--jade) 32%,transparent);
  --jade-a12:color-mix(in srgb,var(--jade) 12%,transparent); --jade-a25:color-mix(in srgb,var(--jade) 25%,transparent);
  --warn-bg:color-mix(in srgb,var(--warn) 10%,var(--panel-soft));
  --action:var(--jade); --action-text:#0D100F;
  --sombra:0 20px 40px -20px rgba(0,0,0,.8);
  --f-sans:"Figtree","Avenir Next","Segoe UI",system-ui,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
}
:root[data-theme="light"] {
  color-scheme:light;
  --page:#F4F8F6; --surface:#FFFFFF; --card:#FFFFFF; --card-2:#EEF5F1; --panel-soft:#E9F4EE; --panel-feature:#D9F1E5; --selection:#CFF2E0;
  --text:#0B3B30; --erro:#B42318; --warn:#B7791F;
  --line:rgba(11,59,48,.10); --line-2:rgba(11,59,48,.18);
  --action:#0B3B30; --action-text:#CFF2E0;
  --sombra:0 14px 30px -18px rgba(11,59,48,.35);
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--page); color:var(--text); font-family:var(--f-sans); line-height:1.5; -webkit-font-smoothing:antialiased; }
:root:not([data-theme="light"]) body { background:radial-gradient(1200px 600px at 70% -10%,color-mix(in srgb,var(--jade) 7%,transparent),transparent 60%),var(--page); background-attachment:fixed; }
h1,h2,h3,h4,p { margin:0; }
button,input,textarea,select { font:inherit; color:inherit; }
button { cursor:pointer; -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:2px solid var(--jade); outline-offset:3px; }
::selection { background:var(--jade); color:#0D100F; }
.ponto { color:var(--jade); }
.apoio { color:var(--text-muted); font-size:.92rem; }
.meta { font-size:.8rem; color:var(--text-muted); }
[hidden] { display:none !important; }
.ico { width:1.1em; height:1.1em; flex:none; }
.face { display:block; image-rendering:pixelated; }

/* ---------- botões e campos */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:36px; padding:6px 14px; border-radius:10px;
  border:1px solid var(--line-2); background:var(--card-2); font-weight:600; font-size:.88rem; transition:border-color .2s,background .2s,filter .2s; }
.btn:hover { border-color:var(--line-jade); }
.btn.primario { background:var(--action); color:var(--action-text); border-color:transparent; }
.btn.primario:hover { filter:brightness(1.08); }
.btn.perigo { color:var(--erro); }
.btn.leve { min-height:30px; padding:4px 11px; font-size:.8rem; background:transparent; }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.form { display:grid; gap:16px; }
.form.largo { max-width:640px; }
label { display:grid; gap:6px; font-size:.84rem; font-weight:600; }
input,textarea,select { width:100%; min-height:38px; padding:7px 11px; border:1px solid var(--line-2); border-radius:10px; background:var(--surface); font-weight:400; font-size:.9rem; }
textarea { min-height:84px; resize:vertical; }
input:focus,textarea:focus,select:focus { border-color:var(--jade); outline:none; box-shadow:0 0 0 3px var(--jade-a25); }
input[type="checkbox"] { width:auto; min-height:0; accent-color:var(--jade); }
.dica { font-weight:400; font-size:.78rem; color:var(--text-muted); }
.troca { display:flex; align-items:center; gap:8px; font-weight:500; color:var(--text-muted); font-size:.82rem; }

/* ---------- login */
.tela-login { min-height:100vh; display:grid; place-items:center; padding:24px 16px; }
.login { width:min(400px,100%); display:grid; gap:18px; padding:28px; border-radius:20px; background:var(--card); border:1px solid var(--line-2); box-shadow:var(--sombra); }
.login h1 { font-size:2.4rem; letter-spacing:-.05em; line-height:1.1; font-weight:750; }
.aviso { background:color-mix(in srgb,var(--erro) 12%,var(--card)); color:var(--erro); border:1px solid color-mix(in srgb,var(--erro) 40%,transparent);
  padding:10px 14px; border-radius:10px; font-size:.88rem; font-weight:600; }

/* ---------- topo */
.marca { font-weight:750; font-size:1.2rem; letter-spacing:-.04em; white-space:nowrap; }
.marca small { font-weight:500; letter-spacing:0; font-size:.74rem; color:var(--text-faint); margin-left:2px; }
.topo { position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:16px; padding:10px 20px;
  background:color-mix(in srgb,var(--page) 82%,transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.abas { display:flex; gap:2px; overflow-x:auto; scrollbar-width:none; flex:1; }
.abas button { border:0; background:transparent; padding:7px 13px; border-radius:10px; font-size:.86rem; white-space:nowrap; min-height:38px; color:var(--text-muted); }
.abas button:hover { color:var(--text); background:var(--card-2); }
.abas button[aria-selected="true"] { background:var(--selection); color:var(--text); font-weight:650; box-shadow:inset 0 0 0 1px var(--line-jade); }
.ferramentas { display:flex; align-items:center; gap:8px; }
.ferramentas form { margin:0; }
.vivo { display:inline-flex; align-items:center; gap:7px; font-family:var(--f-mono); font-size:.66rem; text-transform:uppercase; letter-spacing:.1em; color:var(--text-faint); white-space:nowrap; }
.vivo::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--text-faint); }
.vivo.on { color:var(--jade); }
.vivo.on::before { background:var(--jade); animation:pulso 1.6s infinite; }
.tema { width:36px; height:36px; border-radius:50%; border:1px solid var(--line-2); background:transparent; }

main { width:min(1320px,100%); margin:0 auto; padding:22px 20px 64px; }
.aba { display:none; }
.aba.ativa { display:block; animation:chega .35s var(--ease); }
.cabeca { margin-bottom:22px; display:grid; gap:6px; }
.cabeca h1 { font-size:clamp(1.9rem,4.5vw,2.6rem); letter-spacing:-.05em; line-height:1.1; font-weight:750; }
.linha-cabeca { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; }
.acoes { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.sub { font-family:var(--f-mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; color:var(--text-faint); margin:30px 0 10px; font-weight:500;
  display:flex; align-items:center; gap:8px; }
.sub b { color:var(--text-muted); font-weight:500; }
.lado-rotulo { font-family:var(--f-mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint); margin:4px 8px 8px; }

/* ---------- escritório (3 colunas, como na LP) */
.escritorio { display:grid; grid-template-columns:200px minmax(0,1fr) 270px; gap:14px; padding:14px; border-radius:24px;
  background:linear-gradient(160deg,var(--surface),color-mix(in srgb,var(--page) 80%,#000) 70%); border:1px solid var(--line-2);
  box-shadow:0 50px 100px -50px rgba(0,0,0,.9),0 0 90px -50px var(--jade-a25); }
:root[data-theme="light"] .escritorio { background:var(--surface); box-shadow:var(--sombra); }
.lado,.log { border-radius:16px; padding:14px 10px; background:var(--card); border:1px solid var(--line); align-self:start; }
.log { padding:14px; position:sticky; top:76px; max-height:calc(100vh - 100px); overflow:auto; }
.filtros { display:grid; gap:2px; margin-bottom:14px; }
.filtro { display:flex; align-items:center; gap:9px; width:100%; padding:7px 9px; border:0; border-radius:10px; background:none; text-align:left; font-size:.84rem; color:var(--text-muted); }
.filtro:hover { background:var(--card-2); color:var(--text); }
.filtro[aria-pressed="true"] { background:var(--selection); color:var(--text); box-shadow:inset 0 0 0 1px var(--line-jade); }
.filtro .av { width:22px; height:22px; border-radius:6px; }
.filtro .av .face { width:18px; height:18px; }
.filtro .n { margin-left:auto; font-family:var(--f-mono); font-size:.66rem; color:var(--text-faint); }
.legenda { list-style:none; margin:0; padding:0 6px; display:grid; gap:6px; }
.centro { display:grid; gap:12px; align-content:start; min-width:0; }
.centro-topo { display:flex; align-items:center; justify-content:space-between; padding:4px 4px 0; }
.centro-topo h1 { font-size:1.05rem; font-weight:650; letter-spacing:-.02em; }
.ao-vivo { display:flex; align-items:center; gap:8px; font-family:var(--f-mono); font-size:.64rem; text-transform:uppercase; letter-spacing:.1em; color:var(--text-faint); }
.ao-vivo i { width:7px; height:7px; border-radius:50%; background:currentColor; }
.ao-vivo.on { color:var(--jade); }
.ao-vivo.on i { animation:pulso 1.6s infinite; }

.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
.kpi { padding:12px 14px; border-radius:14px; background:linear-gradient(150deg,var(--panel-feature),var(--card) 70%); border:1px solid var(--line-jade); box-shadow:var(--sombra); display:grid; gap:1px; }
.kpi .rotulo { order:-1; font-size:.74rem; color:var(--text-muted); }
.kpi .valor { font-size:1.7rem; font-weight:750; letter-spacing:-.03em; line-height:1.15; font-variant-numeric:tabular-nums; }
.kpi .det { font-size:.72rem; color:var(--text-faint); }
.kpi.alerta { background:linear-gradient(150deg,color-mix(in srgb,var(--warn) 16%,var(--card)),var(--card) 70%); border-color:color-mix(in srgb,var(--warn) 45%,transparent); }
.kpi.alerta .valor { color:var(--warn); }

.mesas { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; }
.mesa { position:relative; display:flex; flex-direction:column; gap:9px; padding:14px; border-radius:14px; background:var(--panel-soft); border:1px solid var(--line);
  min-height:150px; cursor:pointer; transition:border-color .25s,opacity .25s,transform .25s var(--ease); }
.mesa:hover { border-color:var(--line-jade); transform:translateY(-2px); }
.mesa.chefe { background:linear-gradient(160deg,color-mix(in srgb,var(--jade) 9%,var(--panel-soft)),var(--panel-soft) 60%); }
.escritorio.filtrado .mesa { opacity:.35; }
.escritorio.filtrado .mesa.foco { opacity:1; border-color:color-mix(in srgb,var(--jade) 55%,transparent); }
.mesa.espera { border-color:color-mix(in srgb,var(--warn) 45%,transparent); }
.mesa-topo { display:flex; align-items:center; gap:10px; }
.av { width:40px; height:40px; flex:none; border-radius:10px; display:grid; place-items:center; background:var(--ink); box-shadow:0 0 0 1px var(--line-jade); }
.av .face { width:32px; height:32px; }
.mesa.espera .av { box-shadow:0 0 0 1px color-mix(in srgb,var(--warn) 55%,transparent); }
.mesa[data-estado="trabalhando"] .av .face, .mesa[data-estado="usando"] .av .face { animation:pula .9s steps(2) infinite; }
.mesa[data-estado="pensando"] .av .face { animation:pula 1.6s steps(2) infinite; }
.mesa h3 { font-size:.95rem; font-weight:650; line-height:1.2; letter-spacing:-.01em; text-transform:capitalize; }
.papel { font-size:.74rem; color:var(--text-faint); line-height:1.3; }
.st { align-self:flex-start; display:inline-flex; align-items:center; gap:6px; font-family:var(--f-mono); font-size:.6rem; letter-spacing:.08em; text-transform:uppercase;
  padding:3px 8px; border-radius:999px; white-space:nowrap; }
.st::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; }
.st.is-work { color:var(--jade); background:var(--jade-a12); }
.st.is-work::before { animation:pulso 1.2s infinite; }
.st.is-done { color:var(--mint); background:color-mix(in srgb,var(--mint) 8%,transparent); }
:root[data-theme="light"] .st.is-done { color:#0B6B4F; }
.st.is-wait { color:var(--warn); background:var(--warn-bg); }
.st.is-idle { color:var(--text-faint); background:color-mix(in srgb,var(--text) 6%,transparent); }
.st.is-pass { color:var(--roxo); background:color-mix(in srgb,var(--roxo) 12%,transparent); }
.tarefa-atual { font-size:.8rem; color:var(--text-muted); line-height:1.4; min-height:2.8em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; }
.tags { display:flex; flex-wrap:wrap; gap:4px; }
.tag { font-size:.66rem; line-height:1; padding:4px 7px; border-radius:99px; background:color-mix(in srgb,var(--text) 6%,transparent); color:var(--text-muted);
  white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.tag.passagem { color:var(--roxo); } .tag.resposta { color:var(--jade); } .tag.erro { color:var(--erro); } .tag.rotina { color:var(--warn); }
.barra-trab { margin-top:auto; height:3px; border-radius:3px; background:color-mix(in srgb,var(--text) 7%,transparent); overflow:hidden; }
.barra-trab i { display:block; height:100%; width:100%; background:color-mix(in srgb,var(--mint) 35%,transparent); transform-origin:left; transform:scaleX(0); }
.mesa[data-st="work"] .barra-trab i { background:var(--jade); animation:trabalho 3.2s var(--ease) infinite; }
.mesa[data-st="done"] .barra-trab i { transform:scaleX(1); }
.mesa[data-st="wait"] .barra-trab i { background:var(--warn); transform:scaleX(.6); }
.mesa .acoes { gap:6px; }
.mesa .acoes .btn { min-height:30px; padding:4px 10px; font-size:.76rem; background:transparent; }

.log ol { list-style:none; margin:0; padding:0; }
.log li { display:grid; grid-template-columns:42px 1fr; gap:8px; padding:9px 0; border-top:1px solid var(--line); font-size:.78rem; color:var(--text-muted); overflow-wrap:anywhere; }
.log li:first-child { border-top:0; }
.log li.novo { color:var(--text); animation:chega .6s var(--ease); }
.log li[hidden] { display:none; }
.log time { font-family:var(--f-mono); color:var(--jade); font-size:.66rem; padding-top:2px; }
.log .quem { font-weight:650; color:var(--text); text-transform:capitalize; }
.log .seta { color:var(--jade); padding:0 3px; }

/* envelope que viaja entre mesas */
.envelope { position:fixed; z-index:20; width:28px; height:20px; pointer-events:none; transition:transform 1.1s cubic-bezier(.5,0,.2,1),opacity .3s;
  background:var(--jade); border-radius:3px; box-shadow:0 0 0 2px var(--ink),0 8px 18px rgba(0,0,0,.4); }
.av.mini { width:24px; height:24px; border-radius:6px; }
.av.mini .face { width:18px; height:18px; }
.filtro .av { color:var(--jade); }
.acoes.com-espaco { margin-top:8px; }
.tabela td .mesa-topo { gap:8px; text-transform:capitalize; }
.envelope::after { content:""; position:absolute; left:3px; right:3px; top:3px; height:8px; border-left:11px solid transparent; border-right:11px solid transparent; border-top:7px solid var(--ink); opacity:.7; }

/* ---------- linha do tempo (aba Atividade) */
.linha { list-style:none; margin:0; padding:0; border:1px solid var(--line-2); border-radius:16px; overflow:hidden; background:var(--card); }
.linha li { display:grid; grid-template-columns:64px 1fr; gap:12px; padding:11px 16px; border-top:1px solid var(--line); font-size:.86rem; }
.linha li:first-child { border-top:0; }
.linha time { color:var(--jade); font-family:var(--f-mono); font-size:.74rem; padding-top:2px; }
.linha .quem { font-weight:650; text-transform:capitalize; }
.linha .seta { color:var(--jade); padding:0 4px; }
.linha li.passagem { background:color-mix(in srgb,var(--roxo) 6%,transparent); }
.linha li.resposta-li { background:var(--jade-a12); }
.linha li.erro { color:var(--erro); }
.linha .texto { overflow-wrap:anywhere; }
.vazio { padding:18px 14px; color:var(--text-faint); font-size:.86rem; }

/* ---------- caixas genéricas */
.caixa { border:1px solid var(--line-2); border-radius:16px; padding:16px; display:grid; gap:8px; background:var(--card); align-content:start; }
.caixa h3 { font-size:.98rem; letter-spacing:-.01em; display:flex; justify-content:space-between; gap:10px; align-items:center; }
.caixa h3 .nome { display:flex; align-items:center; gap:10px; }
.caixa h3 .ico { width:22px; height:22px; }
.caixa.ok { border-color:var(--line-jade); }
.caixa.atencao { border-color:color-mix(in srgb,var(--erro) 55%,transparent); }
.caixa .acoes { margin-top:4px; }
.grade { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
.status { font-family:var(--f-mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.08em; padding:3px 8px; border-radius:99px; white-space:nowrap; font-weight:500; }
.status.ok { color:var(--jade); background:var(--jade-a12); }
.status.nao { color:var(--text-faint); background:color-mix(in srgb,var(--text) 6%,transparent); }
.status.erro { color:var(--erro); background:color-mix(in srgb,var(--erro) 12%,transparent); }
.status.aviso { color:var(--warn); background:var(--warn-bg); }
.tabela { width:100%; border-collapse:collapse; font-size:.85rem; }
.tabela th { text-align:left; font-weight:500; color:var(--text-faint); font-size:.7rem; font-family:var(--f-mono); text-transform:uppercase; letter-spacing:.08em; }
.tabela td,.tabela th { padding:10px 8px; border-bottom:1px solid var(--line); vertical-align:middle; }
.tabela tbody tr:hover { background:color-mix(in srgb,var(--text) 3%,transparent); }
.rolar { overflow-x:auto; border:1px solid var(--line-2); border-radius:16px; background:var(--card); padding:4px 12px; }
.nota { font-size:.78rem; color:var(--text-faint); margin-top:10px; max-width:80ch; }

/* ---------- rotinas */
.lista { display:grid; gap:10px; }
.rotina { border:1px solid var(--line-2); border-radius:16px; padding:16px 18px; display:grid; gap:12px; background:var(--card); }
.rotina-topo { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.rotina h3 { font-size:1rem; letter-spacing:-.01em; }
.chave { position:relative; width:50px; height:28px; flex:none; border-radius:99px; border:0; background:var(--line-2); transition:background .2s; }
.chave::after { content:""; position:absolute; top:3px; left:3px; width:22px; height:22px; border-radius:50%; background:var(--text); transition:transform .2s; }
.chave[aria-checked="true"] { background:var(--jade); }
.chave[aria-checked="true"]::after { transform:translateX(22px); background:#0D100F; }
.horario { display:flex; gap:8px; flex-wrap:wrap; align-items:end; }
.horario label { flex:1; min-width:180px; }

/* ---------- kanban */
.kanban { display:grid; grid-template-columns:repeat(4,minmax(240px,1fr)); gap:12px; overflow-x:auto; padding-bottom:8px; }
.coluna { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:12px; display:flex; flex-direction:column; gap:10px; min-height:220px; }
.coluna.alvo { outline:2px dashed var(--jade); outline-offset:-4px; }
.coluna h3 { font-size:.66rem; text-transform:uppercase; letter-spacing:.1em; color:var(--text-faint); display:flex; justify-content:space-between; font-family:var(--f-mono); font-weight:500; }
.coluna.voce { border-color:color-mix(in srgb,var(--warn) 35%,transparent); }
.coluna.voce h3 { color:var(--warn); }
.cartao { background:var(--panel-soft); border:1px solid var(--line); border-radius:12px; padding:12px; display:grid; gap:8px; cursor:grab; }
.cartao:active { cursor:grabbing; }
.cartao.recorrente { border-style:dashed; }
.cartao h4 { margin:0; font-size:.9rem; line-height:1.35; overflow-wrap:anywhere; }
.cartao .meta { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.selo { display:inline-flex; align-items:center; gap:5px; font-size:.7rem; padding:2px 8px; border-radius:99px; border:1px solid var(--line-2); color:var(--text-muted); }
.selo.voce { background:var(--warn-bg); color:var(--warn); border-color:transparent; font-weight:650; }
.selo.agente { background:var(--selection); color:var(--text); border-color:transparent; text-transform:capitalize; }
.cartao details summary { cursor:pointer; font-size:.76rem; color:var(--text-muted); }
.cartao .resultado { white-space:pre-wrap; font-size:.8rem; max-height:180px; overflow:auto; margin-top:6px; overflow-wrap:anywhere; }
.cartao select { min-height:34px; padding:4px 8px; font-size:.8rem; }
.nova { border:1px solid var(--line-2); border-radius:16px; padding:16px; margin-bottom:16px; max-width:760px; background:var(--card); }
.entrega { display:flex; align-items:center; gap:8px; font-size:.8rem; font-weight:500; color:var(--text-muted); }
.entrega select { min-height:38px; width:auto; padding:5px 10px; font-size:.84rem; color:var(--text); }

/* ---------- gaveta do chat */
.gaveta { position:fixed; z-index:15; top:0; right:0; bottom:0; width:min(440px,100%); background:var(--surface); border-left:1px solid var(--line-2);
  box-shadow:-20px 0 60px rgba(0,0,0,.45); display:flex; flex-direction:column; }
.gaveta-topo { display:flex; justify-content:space-between; align-items:center; padding:14px 16px; border-bottom:1px solid var(--line); }
.gaveta-topo h2 { font-size:1.2rem; letter-spacing:-.03em; }
.chat-agentes { display:flex; gap:6px; padding:10px 16px; overflow-x:auto; border-bottom:1px solid var(--line); scrollbar-width:none; }
.chat-agentes button { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line-2); background:transparent; border-radius:99px; padding:4px 10px 4px 5px; font-size:.8rem; white-space:nowrap; min-height:34px; color:var(--text-muted); }
.chat-agentes button .av { width:22px; height:22px; border-radius:99px; }
.chat-agentes button .av .face { width:16px; height:16px; }
.chat-agentes button[aria-selected="true"] { background:var(--selection); border-color:var(--line-jade); color:var(--text); font-weight:650; }
.chat-msgs { list-style:none; margin:0; padding:16px; flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:10px; }
.chat-msgs li { max-width:85%; padding:10px 13px; border-radius:14px; font-size:.88rem; white-space:pre-wrap; overflow-wrap:anywhere; }
.chat-msgs li.voce { align-self:flex-end; background:var(--action); color:var(--action-text); border-bottom-right-radius:4px; }
.chat-msgs li.agente { align-self:flex-start; background:var(--card-2); border-bottom-left-radius:4px; }
.chat-msgs li small { display:block; margin-top:4px; font-size:.66rem; opacity:.7; }
.chat-msgs .vazio { align-self:center; max-width:none; background:none; }
.digitando { padding:0 16px 8px; font-size:.78rem; color:var(--jade); font-family:var(--f-mono); }
.chat-form { display:flex; gap:8px; padding:12px 16px; border-top:1px solid var(--line); align-items:flex-end; }
.chat-form textarea { min-height:44px; max-height:160px; }

/* ---------- consumo */
.segmentos { display:flex; gap:4px; padding:4px; border:1px solid var(--line-2); border-radius:12px; background:var(--card); }
.segmentos button { border:0; background:transparent; border-radius:9px; padding:6px 14px; font-size:.8rem; min-height:34px; color:var(--text-muted); }
.segmentos button[aria-pressed="true"] { background:var(--selection); color:var(--text); font-weight:650; }
.barras { display:flex; align-items:flex-end; gap:6px; height:160px; padding:12px 12px 0; border:1px solid var(--line-2); border-radius:16px; background:var(--card); }
.barra { flex:1; min-width:10px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:4px; height:100%; padding-bottom:8px; }
.barra i { display:block; width:100%; max-width:38px; background:var(--jade); border-radius:4px 4px 0 0; min-height:2px; }
.barra span { font-size:.62rem; color:var(--text-faint); font-family:var(--f-mono); }

/* ---------- conexões: modal de QR, token e login */
.fundo-modal { position:fixed; inset:0; z-index:40; background:rgba(0,0,0,.6); backdrop-filter:blur(4px); display:grid; place-items:center; padding:16px; }
.modal { width:min(480px,100%); max-height:calc(100vh - 32px); overflow:auto; background:var(--surface); border:1px solid var(--line-2); border-radius:20px; padding:20px; display:grid; gap:14px; box-shadow:0 40px 80px rgba(0,0,0,.6); animation:chega .3s var(--ease); }
.modal-topo { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.modal-topo h2 { font-size:1.15rem; letter-spacing:-.02em; }
.qr { width:min(300px,100%); aspect-ratio:1; margin:0 auto; background:#fff; border-radius:14px; padding:14px; display:grid; place-items:center; }
.qr svg { width:100%; height:100%; display:block; }
.qr.espera { background:var(--card-2); color:var(--text-faint); font-size:.85rem; text-align:center; }
.passos { margin:0; padding-left:20px; display:grid; gap:4px; font-size:.86rem; color:var(--text-muted); }
.contagem { font-family:var(--f-mono); font-size:.74rem; color:var(--text-faint); text-align:center; }
.sucesso { padding:14px; border-radius:12px; background:var(--jade-a12); border:1px solid var(--line-jade); font-size:.9rem; }
.erro-box { padding:12px 14px; border-radius:12px; background:color-mix(in srgb,var(--erro) 10%,transparent); border:1px solid color-mix(in srgb,var(--erro) 40%,transparent); color:var(--erro); font-size:.86rem; }
.alerta-box { padding:12px 14px; border-radius:12px; background:var(--warn-bg); border:1px solid color-mix(in srgb,var(--warn) 40%,transparent); font-size:.82rem; color:var(--text-muted); }
.alerta-box b { color:var(--warn); }
.link-login { display:block; padding:12px; border-radius:12px; background:var(--card-2); border:1px solid var(--line-2); font-family:var(--f-mono); font-size:.72rem; overflow-wrap:anywhere; color:var(--jade); text-decoration:none; max-height:80px; overflow:hidden; }

/* ---------- CRM */
.crm-topo { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-bottom:6px; }
.crm-grade { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:14px; align-items:start; }
.funil { display:grid; gap:7px; padding:16px; border:1px solid var(--line-2); border-radius:16px; background:var(--card); }
.funil-linha { display:grid; grid-template-columns:96px 1fr 64px; gap:10px; align-items:center; font-size:.82rem; border:0; background:none; padding:2px 0; text-align:left; color:inherit; border-radius:8px; }
.funil-linha:hover .funil-barra i { filter:brightness(1.15); }
.funil-linha[aria-pressed="true"] { background:var(--selection); }
.funil-linha .rot { color:var(--text-muted); padding-left:4px; }
.funil-barra { height:22px; border-radius:6px; background:color-mix(in srgb,var(--text) 5%,transparent); overflow:hidden; }
.funil-barra i { display:block; height:100%; border-radius:6px; background:linear-gradient(90deg,var(--jade),color-mix(in srgb,var(--jade) 60%,var(--mint))); min-width:2px; transition:width .6s var(--ease); }
.funil-linha.ganho .funil-barra i { background:var(--mint); }
.funil-linha.perdido .funil-barra i, .funil-linha.saiu .funil-barra i { background:color-mix(in srgb,var(--text) 22%,transparent); }
.funil-linha .num { font-family:var(--f-mono); font-size:.74rem; text-align:right; color:var(--text-muted); }
.fu-grupos { display:grid; gap:10px; }
.fu { border:1px solid var(--line-2); border-radius:16px; background:var(--card); padding:12px 14px; }
.fu h4 { font-size:.72rem; font-family:var(--f-mono); text-transform:uppercase; letter-spacing:.1em; font-weight:500; color:var(--text-faint); display:flex; justify-content:space-between; margin-bottom:6px; }
.fu.atrasado h4 { color:var(--erro); } .fu.hoje h4 { color:var(--warn); }
.fu ul { list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.fu li { display:flex; align-items:center; gap:10px; padding:7px 0; border-top:1px solid var(--line); font-size:.84rem; }
.fu li:first-child { border-top:0; }
.fu li .quem { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fu li .quando { font-family:var(--f-mono); font-size:.7rem; color:var(--text-faint); white-space:nowrap; }
.fu li .btn { min-height:28px; padding:3px 9px; font-size:.72rem; }
.filtros-crm { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px; }
.filtros-crm input { max-width:280px; min-height:38px; }
.filtros-crm select { width:auto; min-height:38px; }
.etapa { display:inline-flex; font-size:.7rem; padding:2px 8px; border-radius:99px; background:var(--selection); white-space:nowrap; }
.etapa.ganho { background:color-mix(in srgb,var(--mint) 18%,transparent); color:var(--mint); }
:root[data-theme="light"] .etapa.ganho { color:#0B6B4F; }
.etapa.perdido,.etapa.saiu { background:color-mix(in srgb,var(--text) 8%,transparent); color:var(--text-faint); }
.etapa.respondeu,.etapa.interessado,.etapa.proposta { background:var(--jade-a12); color:var(--jade); }
.tabela select.mini, .tabela input.mini { min-height:32px; padding:3px 8px; font-size:.8rem; width:auto; }
.tabela .lead-nome { font-weight:600; }
.tabela .lead-num { font-family:var(--f-mono); font-size:.72rem; color:var(--text-faint); }
.tabela tr.aberta td { background:color-mix(in srgb,var(--jade) 5%,transparent); }
.conversa { display:grid; gap:6px; padding:8px 0 4px; max-height:320px; overflow:auto; }
.conversa .msg { max-width:78%; padding:7px 11px; border-radius:12px; font-size:.82rem; white-space:pre-wrap; overflow-wrap:anywhere; background:var(--card-2); }
.conversa .msg.out { justify-self:end; background:var(--selection); }
.conversa .msg small { display:block; font-size:.64rem; color:var(--text-faint); margin-top:2px; }
.lead-extra { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:6px 0 10px; }
.rasc { display:grid; gap:8px; }
.rasc .pergunta { font-size:.82rem; color:var(--text-muted); border-left:2px solid var(--line-jade); padding-left:10px; }
.rasc textarea { min-height:70px; font-size:.86rem; }

/* ---------- avisos */
.toast { position:fixed; z-index:50; bottom:20px; left:50%; transform:translateX(-50%); background:var(--text); color:var(--page); border-radius:12px; padding:11px 18px; font-size:.86rem; max-width:calc(100% - 32px); }
.notifs { position:fixed; z-index:25; right:16px; bottom:16px; display:flex; flex-direction:column; gap:8px; width:min(340px,calc(100% - 32px)); pointer-events:none; }
.notif { pointer-events:auto; background:var(--surface); border:1px solid var(--line-2); border-left:3px solid var(--jade); border-radius:12px; padding:11px 14px;
  box-shadow:0 16px 40px rgba(0,0,0,.45); display:grid; gap:3px; cursor:pointer; animation:chega .25s var(--ease); }
.notif b { font-size:.84rem; }
.notif span { font-size:.78rem; color:var(--text-muted); overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.notif.voce { border-left-color:var(--warn); }
.notif.rotina { border-left-color:var(--roxo); }
.notif.sai { opacity:0; transform:translateY(8px); transition:opacity .3s,transform .3s; }
.carregando { display:flex; align-items:center; gap:10px; color:var(--text-faint); font-size:.86rem; padding:18px 4px; }
.carregando::before, .btn[aria-busy="true"]::after { content:""; width:15px; height:15px; border-radius:50%; border:2px solid var(--jade-a25); border-top-color:var(--jade); animation:gira .7s linear infinite; flex:none; }
.btn[aria-busy="true"] { pointer-events:none; opacity:.8; }
.btn[aria-busy="true"]::after { width:12px; height:12px; }
.kpis .carregando { grid-column:1/-1; }

@keyframes pulso { 0%,100% { opacity:1 } 50% { opacity:.25 } }
@keyframes trabalho { 0% { transform:scaleX(0) } 70% { transform:scaleX(1) } 100% { transform:scaleX(1); opacity:0 } }
@keyframes pula { 0% { transform:translateY(0) } 100% { transform:translateY(-2px) } }
@keyframes chega { from { opacity:0; transform:translateY(6px) } to { opacity:1; transform:none } }
@keyframes gira { to { transform:rotate(360deg) } }

@media (max-width:1100px) {
  .escritorio { grid-template-columns:180px minmax(0,1fr); }
  .log { grid-column:1/-1; position:static; max-height:360px; }
  .crm-grade { grid-template-columns:1fr; }
}
@media (max-width:720px) {
  .topo { flex-wrap:wrap; padding:8px 16px; gap:8px; }
  .abas { order:3; flex-basis:100%; }
  .ferramentas { margin-left:auto; }
  main { padding:16px 16px 56px; }
  .escritorio { grid-template-columns:1fr; padding:10px; border-radius:18px; }
  .lado { padding:10px; }
  .filtros { display:flex; overflow-x:auto; scrollbar-width:none; margin:0; }
  .filtro { width:auto; white-space:nowrap; }
  .lado .lado-rotulo, .legenda { display:none; }
  .mesas { grid-template-columns:1fr; }
  .kanban { grid-template-columns:repeat(4,minmax(260px,82%)); scroll-snap-type:x mandatory; }
  .coluna { scroll-snap-align:start; }
  .kpi .valor { font-size:1.45rem; }
  .lead-extra { grid-template-columns:1fr; }
  .notifs { right:8px; left:8px; bottom:8px; width:auto; }
  .linha-cabeca .acoes { width:100%; }
}
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; transition:none !important; } }
.sprite { position:absolute; width:0; height:0; overflow:hidden; }
.kpis { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }

/* ===================== v2.2.1: escritório ocupa a tela ===================== */
main:has(#escritorio.ativa) { width:100%; max-width:1920px; padding:16px 20px 24px; }
.escritorio { grid-template-columns:240px minmax(0,1fr) 340px; gap:16px; padding:16px; min-height:calc(100vh - 92px); align-items:stretch; }
.lado { padding:16px 12px; }
.log { align-self:stretch; max-height:calc(100vh - 124px); top:72px; }
.log li { font-size:.84rem; grid-template-columns:46px 1fr; padding:11px 0; }
.log time { font-size:.72rem; }
.filtro { padding:9px 10px; font-size:.92rem; }
.filtro .av { width:28px; height:28px; border-radius:8px; }
.filtro .av .face { width:22px; height:22px; }
.centro { gap:16px; align-content:stretch; grid-template-rows:auto auto 1fr; }
.centro-topo h1 { font-size:1.35rem; }
.kpis { grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; }
.kpi { padding:16px 18px; }
.kpi .rotulo { font-size:.82rem; }
.kpi .valor { font-size:2.3rem; }
.kpi .det { font-size:.78rem; }
.mesas { grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:14px; align-content:start; }
.mesa { padding:20px; gap:12px; min-height:230px; border-radius:18px; }
.mesa-topo { gap:14px; }
.mesa .av { width:60px; height:60px; border-radius:14px; }
.mesa .av .face { width:48px; height:48px; }
.mesa h3 { font-size:1.2rem; }
.papel { font-size:.84rem; }
.st { font-size:.66rem; padding:4px 10px; }
.tarefa-atual { font-size:.92rem; -webkit-line-clamp:3; min-height:4.2em; }
.tag { font-size:.72rem; padding:5px 9px; }
.barra-trab { height:4px; }
.mesa .acoes .btn { min-height:36px; padding:6px 14px; font-size:.84rem; }
@media (min-width:1700px) { .mesas { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:1100px) {
  .escritorio { grid-template-columns:200px minmax(0,1fr); min-height:0; }
  .log { max-height:420px; }
}
@media (max-width:720px) {
  main:has(#escritorio.ativa) { padding:12px 12px 40px; }
  .escritorio { grid-template-columns:1fr; padding:10px; }
  .mesas { grid-template-columns:1fr; }
  .mesa { min-height:0; }
  .kpi .valor { font-size:1.6rem; }
}
@media (min-width:900px) { #kpis { grid-template-columns:repeat(5,minmax(0,1fr)); } #kpis .kpi .valor { font-size:clamp(1.6rem,2.2vw,2.4rem); } }

/* ===================== v2.2.2: cards menores, tags contidas, chat largo, kanban com rolagem, carregamento ===================== */
.mesas { grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:12px; }
.mesa { padding:16px; gap:10px; min-height:196px; border-radius:16px; min-width:0; overflow:hidden; }
.mesa .av { width:48px; height:48px; border-radius:12px; }
.mesa .av .face { width:38px; height:38px; }
.mesa h3 { font-size:1.05rem; }
.papel { font-size:.78rem; }
.mesa-topo > div { min-width:0; }
.mesa-topo h3, .mesa-topo .papel { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tarefa-atual { font-size:.86rem; -webkit-line-clamp:2; min-height:2.8em; }
.tags { min-width:0; max-width:100%; overflow:hidden; max-height:52px; }
.tag { min-width:0; max-width:100%; flex:0 1 auto; font-size:.68rem; padding:4px 8px; }
.mesa .acoes .btn { min-height:32px; padding:5px 12px; font-size:.8rem; }
@media (min-width:1500px) { .mesas { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (min-width:1900px) { .mesas { grid-template-columns:repeat(4,minmax(0,1fr)); } }

.gaveta { width:min(640px,100%); }
.chat-agentes { flex-wrap:wrap; overflow:visible; row-gap:6px; }

.kanban { align-items:start; }
.coluna { max-height:calc(100vh - 210px); overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--line-2) transparent; min-height:220px; }
.coluna h3 { position:sticky; top:-12px; z-index:1; margin:-12px -12px 0; padding:12px 12px 8px; background:var(--card); border-radius:16px 16px 0 0; }
.cartao-rodape { display:flex; gap:6px; align-items:center; }
.cartao-rodape select { flex:1; min-width:0; }
.btn.perigo.armado { background:color-mix(in srgb,var(--erro) 16%,transparent); border-color:color-mix(in srgb,var(--erro) 50%,transparent); }
.cartao.saindo { opacity:.4; pointer-events:none; transition:opacity .2s; }
.cartao.movendo { opacity:.6; position:relative; }
.cartao.movendo::after { content:""; position:absolute; top:10px; right:10px; width:13px; height:13px; border-radius:50%; border:2px solid var(--jade-a25); border-top-color:var(--jade); animation:gira .7s linear infinite; }
.chave[aria-busy="true"] { opacity:.6; }

.carga { position:fixed; z-index:60; top:0; left:0; right:0; height:3px; overflow:hidden; background:var(--jade-a12); }
.carga::after { content:""; position:absolute; top:0; bottom:0; width:35%; background:var(--jade); box-shadow:0 0 12px var(--jade); animation:carga 1s ease-in-out infinite; }
@keyframes carga { from { left:-35%; } to { left:100%; } }
@media (max-width:720px) { .coluna { max-height:none; } }

/* ===================== v2.2.3: escritório com altura da tela; lateral até o fim; mesas rolam no centro ===================== */
@media (min-width:1101px) {
  .escritorio { height:calc(100vh - 92px); min-height:520px; grid-template-rows:minmax(0,1fr); }
  .lado { align-self:stretch; overflow-y:auto; scrollbar-width:thin; }
  .log { align-self:stretch; position:static; max-height:none; overflow-y:auto; }
  .centro { min-height:0; grid-template-rows:auto auto minmax(0,1fr); }
  .mesas { min-height:0; overflow-y:auto; padding:2px 6px 8px 2px; margin-right:-6px; scrollbar-width:thin; scrollbar-color:var(--line-2) transparent; }
  .mesa:hover { transform:none; }
}
@media (min-width:1101px) {
  main:has(#escritorio.ativa) { padding:14px 20px 14px; }
  .escritorio { height:calc(100vh - var(--topo-h, 57px) - 28px); }
  .mesas { grid-auto-rows:max-content; }
  .mesa { min-height:196px; }
}
@media (min-width:1101px) { .escritorio { height:calc(100vh - 59px - 34px); } }

/* ===================== v2.2.4: celular — a fileira de filtros alargava a coluna para 730 px ===================== */
.escritorio > * { min-width:0; }
@media (max-width:1100px) { .escritorio { grid-template-columns:200px minmax(0,1fr); } }
@media (max-width:720px) {
  .escritorio { grid-template-columns:minmax(0,1fr); gap:12px; }
  .filtros { min-width:0; max-width:100%; }
  #kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  #kpis .kpi { padding:12px; }
  #kpis .kpi:last-child:nth-child(odd) { grid-column:1 / -1; }
  #kpis .kpi .valor { font-size:1.6rem; }
  #kpis .kpi .det { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .mesas { grid-template-columns:minmax(0,1fr); }
  .log { max-height:420px; }
  .log li { grid-template-columns:42px minmax(0,1fr); }
}

/* v2.3: hub de apps */
.apps-grade { grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); }
.app-cartao { align-content:stretch; grid-template-rows:auto 1fr auto auto; }
.app-cartao.oficial { border-color:var(--line-jade); background:linear-gradient(160deg,var(--panel-feature),var(--card) 60%); }
.app-cartao.novo { border-style:dashed; background:transparent; }
.app-topo { display:flex; gap:12px; align-items:center; }
.app-icone { flex:none; width:42px; height:42px; border-radius:12px; display:grid; place-items:center; font-weight:700; font-size:1.15rem;
  background:var(--jade-a12); color:var(--jade); border:1px solid var(--line-jade); }
.app-desc { font-size:.86rem; color:var(--text-muted); }
.app-tags { display:flex; gap:6px; flex-wrap:wrap; }
#app-vista { display:grid; gap:10px; }
#app-vista[hidden], #apps-lista[hidden] { display:none; }
.app-barra { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.app-barra b { font-size:1.05rem; }
.app-perms { font-size:.74rem; color:var(--text-faint); font-family:var(--f-mono); }
.app-espaco { flex:1; }
#app-frame { width:100%; height:calc(100dvh - 190px); min-height:420px; border:1px solid var(--line-2); border-radius:16px; background:var(--page); }
.voltar-apps { margin-bottom:10px; }
@media (max-width:720px) { #app-frame { height:calc(100dvh - 150px); border-radius:12px; } .app-espaco, .app-perms { display:none; } .app-barra .btn.leve { min-height:32px; padding:4px 10px; } }
/* v2.3.1: compartilhar app só leitura */
.sub-modal { font-size:.85rem; margin-top:14px; color:var(--text-muted); }
.links-lista { display:grid; gap:6px; }
.link-linha { display:flex; gap:10px; align-items:center; justify-content:space-between; padding:8px 10px; border:1px solid var(--line); border-radius:10px; }
.link-linha.inativo { opacity:.6; }
.link-novo { display:flex; gap:8px; margin-top:6px; }
.link-novo input { font-family:var(--f-mono); font-size:.78rem; }
.troca select { width:auto; min-height:38px; }
.link-linha .meta { font-size:.78rem; }
/* v2.4: time e conta */
.perms { display:grid; gap:6px; }
.troca.perm { align-items:flex-start; font-weight:400; color:var(--text); }
.troca.perm input { width:auto; min-height:auto; margin-top:3px; }
.caixa.inativo { opacity:.6; }
.btn.conta { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:720px) { .btn.conta { max-width:110px; } }
.canais { display:grid; gap:10px; }
.caixa.canal { padding:12px 14px; }
.caixa.canal .passos { margin:4px 0 0; font-size:.84rem; }
.contas { list-style:none; margin:2px 0 0; padding:0; display:grid; gap:6px; }
.contas li { display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:.82rem; color:var(--text-muted); }
/* v2.6: modelo da conversa e fila do Claude */
.chat-modelo { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; padding:8px 16px; border-bottom:1px solid var(--line); font-size:.82rem; color:var(--text-muted); }
.chat-modelo[hidden] { display:none; }
.chat-modelo select { max-width:100%; min-width:0; flex:1 1 180px; }
.chat-modelo .nota { flex-basis:100%; margin:0; font-size:.74rem; }
.contas.fila li { display:flex; }
.contas.fila li::before { content:counter(list-item) "."; color:var(--text-muted); font-family:var(--mono, monospace); min-width:1.4em; }
.contas.fila li > span:first-child { flex:1; }
.contas .ordem { display:inline-flex; gap:4px; }
.contas .ordem .btn { padding:2px 8px; min-height:0; line-height:1.3; }
.chat-modelo select { min-height:32px; padding:3px 8px; font-size:.8rem; width:auto; }
/* v2.7: revisão de formulários (botão afastado do campo, alturas menores), Minha conta larga, tarefa para pessoa */
#modal-corpo { display:grid; gap:12px; }
#modal-corpo > .sub-modal { margin-top:6px; }
:is(label, .form-linha, .link-novo, .perms, .troca, textarea, input, select) + .acoes { margin-top:8px; }
.form-linha { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:12px; align-items:end; }
.modal.largo { width:min(880px,100%); }
.conta-grade { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:14px; }
.conta-bloco { display:grid; gap:10px; align-content:start; border:1px solid var(--line); border-radius:14px; padding:14px; background:var(--card); }
.conta-bloco .sub-modal { margin:0; }
.conta-bloco .form-linha { grid-template-columns:1fr 1fr; }
.modal.largo .canais { display:flex; flex-wrap:wrap; align-items:flex-start; gap:10px; }
.modal.largo .canais > .caixa { flex:1 1 260px; min-width:0; }
.link-novo .btn { white-space:nowrap; flex-shrink:0; }
.modal.largo .canais > :not(.caixa) { flex:1 1 100%; }
.caixa.canal .acoes, .caixa.canal .link-novo { margin-top:8px; }
@media (max-width:720px) {
  .form-linha, .conta-grade, .conta-bloco .form-linha { grid-template-columns:1fr; }
}
.modo-wpp { display:grid; gap:6px; margin-top:4px; } .modo-wpp select { width:auto; max-width:100%; } .modo-wpp .nota { margin-top:0; }

/* v2.11: código do login do ChatGPT */
.codigo-login { display:flex; align-items:center; justify-content:center; gap:12px; margin:12px 0; }
.codigo-login span { font-family:var(--f-mono); font-size:1.6rem; font-weight:600; letter-spacing:.12em; padding:8px 14px; border:1px dashed currentColor; border-radius:8px; }

/* v2.12: ordem padrão do time */
.padrao-ordem { margin-bottom:14px; }
.padrao-campos { display:flex; flex-wrap:wrap; gap:12px; margin:8px 0; }
.padrao-campos label { display:flex; flex-direction:column; gap:4px; min-width:220px; }
.padrao-ordem .fila li { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.ordem-ag { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }

/* v2.13: Gerenciamento de Filas */
.filas { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:12px; margin-bottom:8px; }
.bloco-fila h3 { justify-content:space-between; }
.bloco-fila .pos { display:inline-grid; place-items:center; width:22px; height:22px; border-radius:99px; font-size:.75rem; font-weight:700;
  background:color-mix(in srgb,var(--text) 10%,transparent); margin-right:6px; }
.bloco-fila .linha-modelo { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:8px 0; }
.bloco-fila .fila li { display:flex; align-items:center; gap:10px; }
.bloco-fila .fila li .quem { flex:1; }
.caminho { font-size:.85rem; color:var(--text-muted); }

/* v2.14: quem pode falar */
.acesso-canal { margin-top:8px; padding-top:8px; border-top:1px dashed color-mix(in srgb,var(--text) 15%,transparent); }
