:root{--navy:#0f2238;--navy2:#162d49;--bg:#eef2f8;--card:#fff;--ink:#17212b;--mut:#6a7686;--line:#dfe5ee;--acc:#e4572e;--acc2:#ff7a52;--grn:#1f9e75;--blu:#2f5fd0;--red:#d9382f;--amb:#c98400;--sel:#e8f1ff}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{margin:0;font:14px/1.45 "Segoe UI",Arial,sans-serif;color:var(--ink);background:#d7dde8}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
#stage{display:flex;justify-content:center;padding:14px}
.app{display:flex;width:100%;max-width:1500px;height:calc(100vh - 92px);min-height:560px;background:var(--bg);border-radius:12px;overflow:hidden;box-shadow:0 10px 40px #0004;position:relative}
.phone .app{max-width:390px;height:780px;border-radius:30px;border:10px solid #111;flex-direction:column}
.rail{width:64px;background:var(--navy);display:flex;flex-direction:column;align-items:center;padding:10px 0;gap:4px;flex:none}
.rail .logo{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--acc),var(--acc2));display:grid;place-items:center;color:#fff;font-weight:800;margin-bottom:10px;font-size:13px}
.rail button{width:46px;height:46px;border:0;background:transparent;border-radius:12px;color:#9fb3cf;font-size:20px;position:relative}
.rail button:hover{background:var(--navy2);color:#fff}.rail button.on{background:var(--navy2);color:#fff;box-shadow:inset 3px 0 0 var(--acc)}
.rail .tip{position:absolute;left:54px;top:12px;background:#000c;color:#fff;font-size:12px;padding:3px 8px;border-radius:6px;white-space:nowrap;display:none;z-index:9}
.rail button:hover .tip{display:block}
.rail .grow{flex:1}.rail .badge{position:absolute;top:4px;right:4px;background:var(--red);color:#fff;border-radius:999px;font-size:10px;padding:0 5px}
.phone .rail{width:100%;height:56px;flex-direction:row;padding:0 6px;order:2;justify-content:space-around}.phone .rail .logo,.phone .rail .grow,.phone .rail .tip{display:none}
.main{flex:1;display:flex;min-width:0;min-height:0}
.screen{display:none;flex:1;min-width:0;min-height:0}.screen.on{display:flex}
.col{display:flex;flex-direction:column;min-height:0}
.pad{padding:22px 26px;overflow:auto;flex:1}
h1{font-size:22px;margin:0 0 4px}h2{font-size:16px;margin:0 0 10px}p.lead{color:var(--mut);margin:0 0 16px}
.btn{border:0;background:var(--acc);color:#fff;padding:9px 15px;border-radius:9px;font-weight:600}
.btn.alt{background:#fff;color:var(--ink);border:1px solid var(--line)}.btn.ghost{background:transparent;color:var(--blu);padding:6px 8px}.btn.sm{padding:6px 11px;font-size:12.5px}.btn.grn{background:var(--grn)}.btn.red{background:var(--red)}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:14px}
input,select,textarea{border:1px solid var(--line);background:#fff;border-radius:9px;padding:9px 11px;width:100%}
label{display:block;font-size:12px;color:var(--mut);margin:10px 0 4px}
.tag{display:inline-block;font-size:11px;border-radius:999px;padding:2px 9px;border:1px solid var(--line);color:var(--mut);background:#fff;white-space:nowrap}
.tag.ok{color:var(--grn);border-color:#a8dcc9;background:#effaf5}.tag.er{color:var(--red);border-color:#f0b4af;background:#fff1f0}.tag.wt{color:var(--amb);border-color:#ecd49a;background:#fff8e8}.tag.bl{color:var(--blu);border-color:#b7c9f2;background:#f0f5ff}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}th{color:var(--mut);font-size:12px;font-weight:600}
.av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;flex:none}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
/* conversas */
.list{width:370px;background:#fff;border-right:1px solid var(--line);flex:none}
.phone .list{width:100%}
.lh{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 4px}.lh h2{margin:0;font-size:20px}
.plus{width:38px;height:38px;border-radius:50%;border:0;background:var(--acc);color:#fff;font-size:22px;line-height:1}
.ls{padding:6px 14px}.ls select{margin-top:6px}
.tabs{display:flex;gap:4px;margin:8px 14px;background:#edf1f7;border-radius:10px;padding:4px}
.tabs button{flex:1;border:0;background:transparent;border-radius:8px;padding:7px 4px;font-size:12.5px;font-weight:600;color:#44546a}.tabs button.on{background:var(--acc);color:#fff}
.items{flex:1;overflow:auto;min-height:0}
.it{display:flex;gap:11px;padding:11px 14px;border-bottom:1px solid #eef1f6;cursor:pointer}.it:hover{background:#f6f9ff}.it.sel{background:var(--sel)}
.it .mid{flex:1;min-width:0}.row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.it b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.it time{font-size:11px;color:var(--mut);flex:none}
.prev{color:var(--mut);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unr{background:var(--grn);color:#fff;border-radius:999px;font-size:11px;font-weight:700;padding:1px 7px}
.nb{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;border-radius:999px;padding:1px 8px;color:#fff;margin-right:4px}
.chat{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;background:#f7f9fd}
.phone .chat{position:absolute;inset:0 0 56px 0;z-index:5;display:none}.phone .app.chat-open .chat{display:flex}
.ch{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#fff;border-bottom:1px solid var(--line);flex-wrap:wrap}
.ch .nm{flex:1;min-width:150px}.ch .nm small{color:var(--mut)}
.msgs{flex:1;overflow:auto;padding:14px 20px;min-height:0;background:#dde5f0}
.day{text-align:center;margin:10px 0}.day span{background:#e6ecf5;color:#5a6b82;font-size:11px;padding:3px 12px;border-radius:999px}
.m{display:flex;margin:5px 0}.m.me{justify-content:flex-end}
.bb{max-width:min(74%,560px);background:#fff;border:1px solid #c5d0e0;padding:8px 11px 5px;border-radius:12px;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 1px 1px #0f22381a}
.m.they .bb{border-bottom-left-radius:3px}.m.me .bb{border-bottom-right-radius:3px}
.m.me .bb{background:#a9e8bd;border-color:#7fcf99;color:#0f2a1b}.bb small{display:block;text-align:right;color:var(--mut);font-size:10.5px;margin-top:2px}
.m.me .bb small{color:#3d6a50}.bb .dl{margin-top:5px;font-size:12.5px}.bb .dl a{color:var(--blu);font-weight:600;text-decoration:none}.bb .dl a:hover{text-decoration:underline}
.bb .abrindo{color:var(--mut);font-size:13.5px}.bb .mer{color:var(--red);font-size:12px;margin-top:4px}.bb .vazio{color:var(--mut)}
.aud{display:flex;align-items:center;gap:8px}.aud i{display:block;width:150px;height:6px;border-radius:9px;background:linear-gradient(90deg,var(--blu) 0 30%,#cbd6e8 30%)}
.img{width:230px;height:140px;border-radius:9px;background:linear-gradient(135deg,#9db8e8,#e7c9a9);display:grid;place-items:center;color:#fff;font-weight:700;margin-bottom:4px}
.comp{background:#fff;border-top:1px solid var(--line);padding:8px 14px 12px;position:relative}
.ct{display:flex;gap:6px;justify-content:flex-end;margin-bottom:6px}.ct button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 13px;font-size:12.5px}.ct button.on{background:var(--acc);border-color:var(--acc);color:#fff}
.comp textarea{height:60px;resize:none}
.tools{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}.tools .gr{flex:1}.tb{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 10px;font-size:12.5px}
.pop{position:absolute;bottom:100%;left:14px;right:14px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 28px #0003;padding:6px;display:none;z-index:6}.pop.on{display:block}
.pop div{padding:8px;border-radius:8px;cursor:pointer}.pop div:hover{background:#f1f5fc}
.empty{margin:auto;text-align:center;color:var(--mut)}.empty b{display:block;font-size:19px;color:var(--ink);margin-top:8px}
.more{position:relative;display:inline-block}.more .box{display:none;position:absolute;right:0;top:110%;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;width:230px;box-shadow:0 8px 28px #0003;z-index:7}.more.on .box{display:block}
.note{background:#fff8e1;border:1px solid #f0dca0;border-radius:8px;padding:6px 9px;margin:4px 0;font-size:12.5px}
/* canais */
.slot{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fff;margin-bottom:10px}
.slot .info{flex:1}.slot.free{border-style:dashed;background:#fafcff}.slot.down{border-color:#f0b4af;background:#fff8f7}
.modal{position:fixed;inset:0;background:#0007;display:none;align-items:center;justify-content:center;z-index:99;padding:16px}.modal.on{display:flex}
.mbox{background:#fff;border-radius:14px;max-width:560px;width:100%;padding:22px;max-height:90vh;overflow:auto}
.code{font:700 34px/1 Consolas,monospace;letter-spacing:6px;background:#f1f5fc;border:2px dashed #aebfdc;border-radius:12px;padding:14px;text-align:center;margin:10px 0}
.steps{counter-reset:s;list-style:none;padding:0;margin:10px 0}.steps li{counter-increment:s;display:flex;gap:10px;margin:9px 0}.steps li::before{content:counter(s);width:26px;height:26px;border-radius:50%;background:var(--blu);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700;flex:none}
/* fluxos */
.board{position:relative;flex:1;background:radial-gradient(#cdd6e5 1px,transparent 1px) 0 0/22px 22px,#f6f8fc;overflow:auto;min-height:480px}
.board svg{position:absolute;inset:0;width:1400px;height:700px;pointer-events:none}
.node{position:absolute;width:230px;background:#fff;border:2px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer;box-shadow:0 3px 10px #0001}.node:hover,.node.on{border-color:var(--blu)}
.node h4{margin:0 0 6px;font-size:13px;display:flex;gap:6px;align-items:center}.node .pv{font-size:12.5px;color:#44546a}.node .opt{margin-top:5px;background:#f0f4fb;border-radius:8px;padding:5px 8px;font-size:12.5px}
.drawer{width:330px;background:#fff;border-left:1px solid var(--line);padding:16px;overflow:auto;flex:none;display:none}.drawer.on{display:block}
.fbar{display:flex;gap:8px;align-items:center;padding:10px 16px;background:#fff;border-bottom:1px solid var(--line);flex-wrap:wrap}
/* extensão */
.ext{width:300px;background:#fff;border-radius:14px;border:1px solid var(--line);box-shadow:0 8px 28px #0002;padding:16px}
.ext .hd{display:flex;align-items:center;gap:8px;font-weight:700;margin-bottom:10px}
.phones{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px}
.bars{display:flex;align-items:flex-end;gap:14px;height:150px;margin-top:10px}.bars div{width:46px;border-radius:8px 8px 0 0;text-align:center;color:#fff;font-size:12px;padding-top:4px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:14px}.kpi strong{display:block;font-size:30px}
.login{margin:auto;width:380px;max-width:94%;background:#fff;border-radius:16px;padding:28px;box-shadow:0 10px 40px #0002}
.stp{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.stp span{padding:5px 11px;border-radius:999px;background:#edf1f7;font-size:12.5px}.stp span.on{background:var(--acc);color:#fff}
.hint{background:#fff8e1;border-left:4px solid var(--amb);padding:9px 12px;border-radius:6px;font-size:12.5px;margin:10px 0}

/* site de verdade: ocupa a tela toda */
#stage{padding:0;display:block}
.app{max-width:none;height:100vh;min-height:520px;border-radius:0;box-shadow:none}
body{background:var(--bg)}
.err{color:var(--red);font-size:13px;margin:8px 0 0;min-height:18px}
.cons{max-width:640px;margin:40px auto;text-align:center}.cons .big{font-size:56px}
.toast{position:fixed;right:20px;bottom:20px;background:#17212b;color:#fff;padding:12px 16px;border-radius:10px;z-index:200;max-width:380px;display:none}.toast.on{display:block}.toast.er{background:var(--red)}
.slot .info small{color:var(--mut)}
.count{color:var(--mut);font-size:12.5px}
.ok-line{color:var(--grn);font-weight:600;margin:8px 0}

.btn:disabled{opacity:.45;cursor:not-allowed}

/* celular: lista e conversa em telas separadas, menu embaixo */
#cvBack{display:none}
@media(max-width:840px){
  .app{flex-direction:column-reverse}
  .rail{width:100%;height:56px;flex-direction:row;padding:0 6px;justify-content:space-around;overflow-x:auto}
  .rail .logo,.rail .grow,.rail .tip{display:none}
  .rail button{flex:none}
  #s-conversas .list{width:100%}
  #s-conversas .chat{display:none}
  #s-conversas.chat-open .list{display:none}
  #s-conversas.chat-open .chat{display:flex}
  #cvBack{display:inline-block}
  .pad{padding:16px}
}
.bb a.btn{text-decoration:none;display:inline-block}
.btn.sm{padding:6px 11px}
/* ---------- contatos (estilo Umbler) ---------- */
.ctcard{padding:16px 18px}
.cttool{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.ctq{width:260px;max-width:100%;border-radius:999px;padding-left:14px}
.ctsel{width:auto;min-width:130px;border-radius:999px;padding:9px 14px}
.cttab th{padding:12px 10px;font-size:12.5px;color:var(--ink);font-weight:700;border-bottom:1px solid var(--line)}
.cttab td{padding:11px 10px;border-bottom:1px solid #eef1f6;font-size:13.5px}
.cttab tbody tr:hover{background:#f7f9fd}
.ctnome{font-weight:600;color:var(--ink);cursor:pointer;text-decoration:none}.ctnome:hover{color:var(--blu);text-decoration:underline}
.ctmais{color:var(--blu);cursor:pointer;font-weight:600}
.ctsel-bar{background:#f0f5ff;border:1px solid #b7c9f2;border-radius:10px;padding:8px 12px;margin-bottom:10px;font-size:13px}
.cttab input[type=checkbox],.prchk input[type=checkbox]{width:auto}
.more .mi{padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13.5px}.more .mi:hover{background:#f1f5fc}
.more .box{min-width:180px}
/* proteção, relatórios, IA */
.prchk{display:flex;gap:8px;align-items:flex-start;color:var(--ink);font-size:13.5px;margin:6px 0;cursor:pointer}.prchk input{margin-top:3px}
.prgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:700px){.prgrid{grid-template-columns:1fr}}
.rbars{display:flex;align-items:flex-end;gap:10px;height:190px;margin-top:10px;padding-top:6px;overflow-x:auto}
.rb{flex:1;min-width:34px;max-width:90px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.rb .rv{font-size:12px;font-weight:700;margin-bottom:3px}.rb .rcol{width:100%;border-radius:7px 7px 0 0;min-height:2px}.rb .rl{font-size:11.5px;color:var(--mut);margin-top:5px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.iateste{background:#dde5f0;border-radius:10px;padding:10px;min-height:120px;max-height:300px;overflow:auto}
/* fluxos (quadro) */
#s-fluxos .list .it{align-items:flex-start}
.flmv{cursor:pointer;color:var(--mut);font-size:11px;padding:0 3px}.flmv:hover{color:var(--blu)}
.board{min-height:0}
.board .canvas{position:relative}
.board .canvas svg{position:absolute;left:0;top:0;width:auto;height:auto;pointer-events:none}
.node{touch-action:none;user-select:none;cursor:grab}
.node:active{cursor:grabbing}
.node.start{border-color:#b7c9f2;background:#f0f5ff}
.node.bad{border-color:var(--red)}
.node.alvo{border-color:var(--grn);box-shadow:0 0 0 4px #1f9e7533}
.node .nx{margin-left:auto;color:var(--mut);cursor:pointer;font-size:12px;padding:0 3px}.node .nx:hover{color:var(--red)}
.node .prow{position:relative;margin-right:2px;padding-right:18px}
.node .prow.yes{background:#effaf5}.node .prow.no{background:#fff1f0}
.port{position:absolute;right:-11px;top:50%;transform:translateY(-50%);width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid #8aa0c4;cursor:crosshair;z-index:3}
.port:hover{border-color:var(--blu);background:#e8f1ff}.port.linked{background:#8aa0c4}
.fitem{display:flex;gap:6px;align-items:flex-start;margin:6px 0;padding:8px;background:#f6f9fd;border:1px solid var(--line);border-radius:9px}
.fitem textarea,.fitem input{background:#fff}
.flx{cursor:pointer;color:var(--mut);padding:2px 6px}.flx:hover{color:var(--red)}
.flalerta{padding:8px 16px;font-size:12.5px;border-top:1px solid var(--line)}.flalerta.er{background:#fff1f0;color:var(--red)}.flalerta.wt{background:#fff8e8;color:var(--amb)}
.drawer{width:340px}
.fbar input#flNome{padding:7px 10px}
@media(max-width:840px){#s-fluxos{flex-direction:column}#s-fluxos .list{width:100%!important;max-height:200px}.drawer{position:fixed;right:0;top:0;bottom:56px;z-index:20;box-shadow:-6px 0 20px #0003}}
/* ================= VERSÃO PARA CELULAR (telas até 840 px) =================
   Não é o desenho do computador espremido: menu embaixo com "Mais", contatos em cartões, fluxos em lista de passos,
   janelas que sobem de baixo, campos e botões grandes para o dedo. */
.maisbtn{display:none}
.sheet{display:none}
@media(max-width:840px){
  html,body{overflow:hidden;-webkit-text-size-adjust:100%}
  .app{height:100vh;height:100dvh;min-height:0;flex-direction:column-reverse}
  .rail{width:100%;height:calc(58px + env(safe-area-inset-bottom));padding:0 4px env(safe-area-inset-bottom);flex-direction:row;justify-content:space-around;align-items:center;overflow:visible;position:relative;z-index:40;gap:0}
  .rail .logo,.rail .grow,.rail .tip,.rail button:hover .tip{display:none!important}
  .rail button{flex:1;width:auto;min-width:0;height:52px;font-size:22px;border-radius:10px}
  .rail button.sec{display:none}
  .rail button.on{box-shadow:inset 0 3px 0 var(--acc);border-radius:0 0 10px 10px}
  .rail .maisbtn{display:block;font-weight:800;font-size:24px}
  .sheet.on{display:flex;flex-direction:column;position:fixed;left:10px;right:10px;bottom:calc(66px + env(safe-area-inset-bottom));background:#fff;border-radius:16px;box-shadow:0 12px 40px #0006;padding:6px;z-index:60}
  .sheet button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:15px 16px;font-size:16px;border-radius:12px}
  .sheet button:active{background:#eef2f8}
  .main{min-height:0}
  .pad{padding:14px 14px 28px}
  h1{font-size:20px}
  input,select,textarea{font-size:16px}
  .btn{min-height:42px}.btn.sm{min-height:38px;padding:8px 12px}
  .tb{min-height:38px}
  /* conversas */
  .ch{padding:8px 10px;gap:8px}.ch .nm{flex:1 1 130px;min-width:0}.ch .btn{padding:8px 10px;font-size:13px}
  .msgs{padding:10px}.bb{max-width:88%}
  .comp{padding:8px 10px}.comp textarea{height:48px}.tools{gap:6px}
  .it{padding:12px 14px}
  .lh,.ls{padding-left:12px;padding-right:12px}.tabs{margin:8px 12px}
  .pop{left:8px;right:8px}
  .more .box{position:fixed;left:12px;right:12px;top:auto;bottom:calc(70px + env(safe-area-inset-bottom));width:auto!important;max-height:60vh;overflow:auto}
  /* janelas sobem de baixo */
  .modal{align-items:flex-end;padding:0}
  .mbox{max-width:none;border-radius:18px 18px 0 0;max-height:92vh;padding:18px 16px calc(18px + env(safe-area-inset-bottom))}
  .code{font-size:28px;letter-spacing:4px}
  .toast{left:12px;right:12px;bottom:calc(72px + env(safe-area-inset-bottom));max-width:none}
  /* canais */
  .slot{flex-wrap:wrap}.slot .info{flex:1 1 180px}.slot .btn{flex:1 1 130px}
  /* contatos em cartões */
  .ctcard{padding:12px 10px}
  .cttool{gap:8px}.ctq{width:100%;flex:1 1 100%}.ctsel{flex:1 1 42%;min-width:120px}#ctAdd{flex:1 1 70%}#ctMais{flex:none}.cttab td.vazio{display:none}
  .cttab,.cttab tbody{display:block}.cttab thead{display:none}
  .cttab tr{display:grid;grid-template-columns:30px 1fr 52px;gap:3px 8px;padding:12px 2px;border-bottom:1px solid var(--line);align-items:center}
  .cttab td{display:block;border:0;padding:0}
  .cttab td:nth-child(1){grid-column:1;grid-row:1/4}.cttab td:nth-child(1) input{width:22px;height:22px}
  .cttab td:nth-child(2){grid-column:2;grid-row:1}
  .cttab td:nth-child(3),.cttab td:nth-child(4),.cttab td:nth-child(6){grid-column:2;font-size:12.5px;color:var(--mut)}
  .cttab td:nth-child(5){display:none}
  .cttab td:nth-child(6)::before{content:'Última atividade: '}
  .cttab td:nth-child(7){grid-column:3;grid-row:1/4;text-align:right}.cttab td:nth-child(7) .btn{min-height:44px;min-width:44px;font-size:18px}
  .cttab td:nth-child(2) .av{display:grid}
  /* relatórios, proteção, IA */
  .kpis{grid-template-columns:1fr 1fr;gap:8px}.kpi strong{font-size:24px}
  .stp{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}.stp span{white-space:nowrap}
  .iateste{max-height:240px}
  /* fluxos: lista de passos (sem quadro) */
  #s-fluxos{flex-direction:column}
  #s-fluxos .list{width:100%!important;max-height:23vh;border-right:0;border-bottom:1px solid var(--line)}#s-fluxos .list .lh{padding-top:8px}#s-fluxos .list>p.count{display:none}#s-fluxos .list .it{padding:8px 14px}#s-fluxos .list .prev{display:none}
  .fbar{padding:8px 10px;gap:6px}.fbar input#flNome{width:100%!important;flex:1 1 100%}
  .flmob{flex:1;overflow:auto;padding:12px;background:#f6f8fc;min-height:0}
  .flcard{background:#fff;border:2px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px}
  .flcard.start{background:#f0f5ff;border-color:#b7c9f2}.flcard.bad{border-color:var(--red)}.flcard.on{border-color:var(--blu)}
  .flcard h4{margin:0 0 6px;font-size:14px;display:flex;gap:6px;align-items:center}.flcard h4 .nx{margin-left:auto;color:var(--mut);padding:6px 8px}
  .flcard .pv{font-size:13.5px;color:#44546a}.flcard .opt{margin-top:5px;background:#f0f4fb;border-radius:8px;padding:6px 9px;font-size:13px}
  .flcard .lk{margin-top:10px}.flcard .lk label{margin:0 0 3px}.flcard .lk.yes label{color:var(--grn)}.flcard .lk.no label{color:var(--red)}
  .flcard .acoes{display:flex;gap:8px;margin-top:10px}.flcard .acoes .btn{flex:1}
  .drawer.on{position:fixed;left:0;right:0;top:0;bottom:calc(58px + env(safe-area-inset-bottom));width:auto;z-index:50;padding:16px 14px;border-left:0}
}
.login .btn.ghost{cursor:pointer}.login h2{font-size:18px}.login .ok-line{color:var(--grn);font-weight:600;margin:8px 0;font-size:13.5px}
#btnConta .tip{left:54px}

/* agente de IA: um por número */
.iaNums{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 12px}
.iaNum{border:2px solid var(--line);background:#fff;border-radius:12px;padding:9px 14px;text-align:left;display:flex;flex-direction:column;gap:1px;min-width:150px;cursor:pointer}
.iaNum span{font-size:12px;color:var(--mut)}.iaNum i{font-style:normal;font-size:12px;color:var(--mut)}.iaNum i.lig{color:var(--grn);font-weight:600}
.iaNum.on{border-color:var(--acc);background:#fff5f1}
.iaCopia{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 12px}.iaCopia select{width:auto;min-width:200px}
@media(max-width:840px){.iaNum{flex:1 1 140px}}

.flsw{cursor:pointer;color:var(--blu);font-size:12px;font-weight:600;margin-left:6px}.flsw:hover{text-decoration:underline}
.vgbad{color:var(--red)}