:root{
  --bg:#f4f7f5; --sup:#ffffff; --sup2:#f8faf9; --linha:#e1e8e4; --linha2:#cfdad3;
  --txt:#10261a; --txt2:#4a5f53; --txt3:#7b8d82;
  --verde:#13a052; --verde-esc:#0d7f40; --verde-cl:#e7f6ee; --verde-cl2:#d2eedd;
  --badge:#10261a;
  --amarelo:#a86b00; --amarelo-cl:#fff4dc;
  --verm:#c2362b; --verm-cl:#fdecea;
  --azul:#1f63b5; --azul-cl:#e8f0fb;
  --cinza-cl:#eef2ef;
  --raio:14px; --raio-p:10px;
  --sombra:0 1px 2px rgba(16,38,26,.06),0 4px 16px rgba(16,38,26,.05);
  --fh:'Bricolage Grotesque',system-ui,sans-serif;
  --fb:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--txt);font-family:var(--fb);font-size:15px;line-height:1.5;-webkit-text-size-adjust:100%}
body{min-height:100vh}
h1,h2,h3,h4{font-family:var(--fh);margin:0;line-height:1.15;letter-spacing:-.01em}
a{color:var(--verde-esc)}
button,input,select,textarea{font:inherit;color:inherit}
img{max-width:100%}
.oculto{display:none!important}
.carregando{display:flex;align-items:center;justify-content:center;gap:10px;min-height:60vh;color:var(--txt2)}
.spin{width:18px;height:18px;border:2px solid var(--verde-cl2);border-top-color:var(--verde);border-radius:50%;display:inline-block;animation:gira .8s linear infinite;vertical-align:-3px}
@keyframes gira{to{transform:rotate(360deg)}}

/* marca */
.marca{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--txt)}
.marca .selo{background:var(--badge);border-radius:10px;padding:6px 10px;display:flex;align-items:center}
.marca .selo img{height:26px;width:auto;display:block}
.marca b{font-family:var(--fh);font-weight:800;font-size:18px;letter-spacing:-.02em}
.marca b span{color:var(--verde)}

/* botoes */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid transparent;border-radius:var(--raio-p);padding:10px 16px;font-weight:600;font-size:14px;cursor:pointer;text-decoration:none;background:var(--verde);color:#fff;transition:background .15s,border-color .15s;white-space:nowrap;min-height:40px}
.btn:hover{background:var(--verde-esc)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn.sec{background:var(--sup);color:var(--txt);border-color:var(--linha2)}
.btn.sec:hover{background:var(--sup2);border-color:var(--txt3)}
.btn.leve{background:transparent;color:var(--verde-esc);border-color:transparent;padding:8px 10px}
.btn.leve:hover{background:var(--verde-cl)}
.btn.perigo{background:var(--verm);color:#fff}
.btn.perigo:hover{background:#a12a20}
.btn.perigo-sec{background:var(--sup);color:var(--verm);border-color:#efc5c1}
.btn.perigo-sec:hover{background:var(--verm-cl)}
.btn.peq{padding:6px 11px;font-size:13px;min-height:32px}
.btn.grande{padding:13px 22px;font-size:15px;min-height:48px}
.btn.cheio{width:100%}
.btn:focus-visible,.campo input:focus-visible,.chip:focus-visible{outline:3px solid var(--verde-cl2);outline-offset:1px}

/* campos */
.campo{display:flex;flex-direction:column;gap:5px;min-width:0}
.campo label,.rotulo{font-size:13px;font-weight:600;color:var(--txt2)}
.campo input,.campo select,.campo textarea{width:100%;border:1px solid var(--linha2);border-radius:var(--raio-p);background:#fff;padding:10px 12px;font-size:15px;min-height:42px;outline:none;transition:border-color .15s,box-shadow .15s}
.campo textarea{min-height:90px;resize:vertical;line-height:1.45}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--verde);box-shadow:0 0 0 3px var(--verde-cl)}
.campo .dica{font-size:12px;color:var(--txt3)}
.campo.erro input,.campo.erro select{border-color:var(--verm)}
.grade{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.span2{grid-column:span 2}
.full{grid-column:1/-1}
.check{display:flex;align-items:flex-start;gap:9px;font-size:14px;color:var(--txt2);cursor:pointer}
.check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--verde);flex:none}
.msg{border-radius:var(--raio-p);padding:11px 14px;font-size:14px}
.msg.erro{background:var(--verm-cl);color:#8f241b}
.msg.ok{background:var(--verde-cl);color:var(--verde-esc)}
.msg.info{background:var(--azul-cl);color:#174c8c}
.msg.aviso{background:var(--amarelo-cl);color:#7a4e00}

/* cartoes */
.card{background:var(--sup);border:1px solid var(--linha);border-radius:var(--raio);box-shadow:var(--sombra)}
.card.pad{padding:20px}
.card h3{font-size:17px}
.sub{color:var(--txt2);font-size:14px}
.mini{font-size:12.5px;color:var(--txt3)}
.forte{font-weight:600}
.linha-flex{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.entre{justify-content:space-between}
.pilha{display:flex;flex-direction:column;gap:16px}
.pilha.p8{gap:8px}
.sep{height:1px;background:var(--linha);margin:16px 0;border:0}

/* selos de status */
.tag{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;background:var(--cinza-cl);color:var(--txt2)}
.tag.verde{background:var(--verde-cl);color:var(--verde-esc)}
.tag.amarelo{background:var(--amarelo-cl);color:var(--amarelo)}
.tag.verm{background:var(--verm-cl);color:var(--verm)}
.tag.azul{background:var(--azul-cl);color:var(--azul)}

/* ===== landing ===== */
.topo-pub{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;max-width:1120px;margin:0 auto}
.lp{max-width:1120px;margin:0 auto;padding:8px 20px 60px}
.lp-hero{padding:28px 0 26px;max-width:720px}
.lp-hero .eyebrow{display:inline-block;background:var(--verde-cl);color:var(--verde-esc);font-weight:600;font-size:13px;padding:5px 11px;border-radius:999px;margin-bottom:14px}
.lp-hero h1{font-size:clamp(30px,5vw,46px);font-weight:800;letter-spacing:-.025em}
.lp-hero h1 em{font-style:normal;color:var(--verde)}
.lp-hero p{color:var(--txt2);font-size:17px;margin:14px 0 0;max-width:600px}
.ciclo-tog{display:inline-flex;background:var(--sup);border:1px solid var(--linha);border-radius:999px;padding:4px;gap:2px;margin:6px 0 18px}
.ciclo-tog button{border:0;background:transparent;padding:8px 16px;border-radius:999px;font-weight:600;font-size:14px;cursor:pointer;color:var(--txt2)}
.ciclo-tog button.on{background:var(--verde);color:#fff}
.ciclo-tog small{font-weight:600;font-size:11px;background:var(--verde-cl);color:var(--verde-esc);border-radius:999px;padding:2px 7px;margin-left:5px}
.ciclo-tog button.on small{background:rgba(255,255,255,.22);color:#fff}
.planos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.plano{position:relative;padding:22px;display:flex;flex-direction:column;gap:14px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.plano:hover{border-color:var(--linha2)}
.plano.sel{border-color:var(--verde);box-shadow:0 0 0 3px var(--verde-cl),var(--sombra)}
.plano .destaque{position:absolute;top:-11px;left:20px;background:var(--verde);color:#fff;font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:999px}
.plano h3{font-size:20px}
.preco{font-family:var(--fh);font-weight:800;font-size:32px;letter-spacing:-.02em}
.preco small{font-family:var(--fb);font-size:14px;font-weight:500;color:var(--txt2);letter-spacing:0}
.plano ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;font-size:14px;color:var(--txt2)}
.plano li{display:flex;gap:8px}
.plano li::before{content:"";width:16px;height:16px;flex:none;margin-top:2px;border-radius:50%;background:var(--verde-cl) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%2313a052' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.plano li.nao{color:var(--txt3)}
.plano li.nao::before{background:var(--cinza-cl) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5 8h6' stroke='%237b8d82' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat}
.plano .btn{margin-top:auto}
.cad-wrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;margin-top:34px;align-items:start}
.cad-form{padding:24px}
.cad-form h2{font-size:24px;margin-bottom:4px}
.resumo{padding:20px;position:sticky;top:16px}
.resumo h3{margin-bottom:10px}
.resumo .lin{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed var(--linha);font-size:14px}
.resumo .lin:last-of-type{border-bottom:0}
.resumo .total{font-family:var(--fh);font-weight:800;font-size:22px}
.passos{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:9px;font-size:13.5px;color:var(--txt2)}
.passos li{display:flex;gap:10px}
.passos b{flex:none;width:22px;height:22px;border-radius:50%;background:var(--verde-cl);color:var(--verde-esc);display:inline-flex;align-items:center;justify-content:center;font-size:12px}
.rodape-pub{text-align:center;color:var(--txt3);font-size:13px;padding:30px 20px 40px}
.rodape-pub a{color:var(--txt2)}

/* login / bloqueado */
.centro{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 16px;gap:22px}
.caixa{width:100%;max-width:420px;padding:28px}
.caixa h1{font-size:26px;margin-bottom:6px}
.sucesso-ico{width:54px;height:54px;border-radius:50%;background:var(--verde-cl);display:flex;align-items:center;justify-content:center;margin-bottom:14px}

/* ===== painel ===== */
.app{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100vh}
.lateral .marca{flex-direction:column;align-items:flex-start;gap:8px}
.lateral{background:var(--sup);border-right:1px solid var(--linha);padding:18px 14px;display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh;overflow-y:auto}
.lateral .marca{padding:2px 4px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:var(--raio-p);text-decoration:none;color:var(--txt2);font-weight:500;font-size:14.5px}
.nav a:hover{background:var(--sup2);color:var(--txt)}
.nav a.on{background:var(--verde-cl);color:var(--verde-esc);font-weight:600}
.nav svg{width:19px;height:19px;flex:none}
.nav .cont{margin-left:auto;background:var(--amarelo-cl);color:var(--amarelo);font-size:11.5px;font-weight:700;padding:1px 7px;border-radius:999px}
.lateral .pe{margin-top:auto;font-size:13px;color:var(--txt2);border-top:1px solid var(--linha);padding-top:14px;display:flex;flex-direction:column;gap:8px}
.principal{min-width:0;display:flex;flex-direction:column}
.barra{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 28px;border-bottom:1px solid var(--linha);background:rgba(244,247,245,.92);backdrop-filter:blur(6px);position:sticky;top:0;z-index:5}
.barra h1{font-size:22px;font-weight:700}
.barra .quem{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--txt2);min-width:0}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--badge);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex:none}
.conteudo{padding:24px 28px 60px;display:flex;flex-direction:column;gap:20px;max-width:1240px;width:100%}
.faixa-suporte{background:var(--amarelo-cl);border-bottom:1px solid #f1d9a6;color:#6d4600;padding:9px 28px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px}
.tabs-movel{display:none}
.tabs-sair{display:none!important}

/* indicadores */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpi{padding:16px 18px;display:flex;flex-direction:column;gap:4px;text-decoration:none;color:inherit}
.kpi:hover{border-color:var(--linha2)}
.kpi .r{font-size:13px;color:var(--txt2);font-weight:500}
.kpi .v{font-family:var(--fh);font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.kpi .d{font-size:12.5px;color:var(--txt3)}
.kpi .d.alerta{color:var(--verm);font-weight:600}
.barra-prog{height:7px;border-radius:999px;background:var(--cinza-cl);overflow:hidden}
.barra-prog i{display:block;height:100%;background:var(--verde);border-radius:999px}
.duas{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:20px;align-items:start}
.duas>*,.kanban>*,.pilha>*{min-width:0}
.lista{display:flex;flex-direction:column}
.lista .it{display:flex;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid var(--linha);min-width:0}
.lista .it:first-child{border-top:0}
.lista .it .cresce{flex:1;min-width:0}
.lista .vazio{padding:22px 18px;color:var(--txt3);font-size:14px;text-align:center}
.card-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 18px;border-bottom:1px solid var(--linha);flex-wrap:wrap}
.card-cab h3{font-size:16px}
.trunc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.log .it{font-size:13.5px;align-items:flex-start}
.log .quando{color:var(--txt3);font-size:12px;white-space:nowrap;min-width:92px}

/* ferramentas */
.ferr{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.ferr .campo{flex:1 1 200px}
.ferr .campo.estreito{flex:0 1 190px}
.busca input{padding-left:36px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237b8d82' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") 11px center/17px no-repeat}
.segm{display:inline-flex;background:var(--sup);border:1px solid var(--linha2);border-radius:var(--raio-p);padding:3px;gap:2px;flex-wrap:wrap}
.segm button{border:0;background:transparent;border-radius:7px;padding:7px 12px;font-size:13.5px;font-weight:600;color:var(--txt2);cursor:pointer}
.segm button.on{background:var(--verde-cl);color:var(--verde-esc)}

/* tabela responsiva */
.tab{width:100%;border-collapse:collapse;font-size:14px}
.tab th{text-align:left;font-size:12px;font-weight:600;color:var(--txt3);text-transform:uppercase;letter-spacing:.04em;padding:11px 14px;border-bottom:1px solid var(--linha);background:var(--sup2)}
.tab td{padding:12px 14px;border-bottom:1px solid var(--linha);vertical-align:middle}
.tab tr:last-child td{border-bottom:0}
.tab .acoes{text-align:right;white-space:nowrap}
.tab-wrap{overflow-x:auto}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--linha2);background:#fff;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:500;cursor:pointer;color:var(--txt2);min-height:34px;text-align:left}
.chip:hover{border-color:var(--txt3)}
.chip .bola{width:16px;height:16px;border-radius:50%;border:2px solid var(--linha2);flex:none;display:inline-flex;align-items:center;justify-content:center}
.chip.on{background:var(--verde-cl);border-color:#a9dcbf;color:var(--verde-esc)}
.chip.on .bola{background:var(--verde);border-color:var(--verde)}
.chip.on .bola::after{content:"";width:7px;height:4px;border:2px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.chip.edit{cursor:default;padding-right:6px;background:var(--sup2)}
.chip.edit button{border:0;background:transparent;cursor:pointer;color:var(--txt3);font-size:16px;line-height:1;padding:0 4px;border-radius:50%}
.chip.edit button:hover{color:var(--verm)}

/* documentos */
.docs-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.doc-card{padding:16px 18px;display:flex;flex-direction:column;gap:11px}
.doc-card.completo{background:linear-gradient(0deg,#fbfefc,#fbfefc),var(--sup)}
.doc-card .cab{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.doc-card h4{font-family:var(--fb);font-size:15px;font-weight:600}

/* painel lateral de formulario */
.painel-form{padding:22px;border-color:var(--verde-cl2);box-shadow:0 0 0 3px var(--verde-cl),var(--sombra)}
.painel-form h3{font-size:18px;margin-bottom:14px}
.confirma{background:var(--amarelo-cl);border:1px solid #f1d9a6;border-radius:var(--raio-p);padding:14px 16px;display:flex;flex-direction:column;gap:10px;font-size:14px;color:#5e3d00}
.confirma.perigo{background:var(--verm-cl);border-color:#efc5c1;color:#7d2018}

/* kanban */
.kanban{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.coluna{background:#eaf0ec;border-radius:var(--raio);padding:12px;display:flex;flex-direction:column;gap:10px;min-height:120px}
.coluna h4{font-family:var(--fb);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--txt2);display:flex;justify-content:space-between;padding:2px 4px}
.tarefa{padding:13px 14px;display:flex;flex-direction:column;gap:8px}
.tarefa .tt{font-weight:600;font-size:14.5px;line-height:1.35}
.tarefa .meta{display:flex;flex-wrap:wrap;gap:6px;font-size:12.5px;color:var(--txt2)}
.tarefa .ac{display:flex;gap:4px;flex-wrap:wrap;border-top:1px solid var(--linha);padding-top:8px;margin-top:2px}

/* superadmin */
.esc-lista{display:flex;flex-direction:column;gap:12px}
.esc-item{padding:16px 18px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) auto;gap:14px;align-items:center}
.esc-item .dl{font-size:13px;color:var(--txt2);display:flex;flex-direction:column;gap:2px}

/* toasts */
#toasts{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:50;width:min(420px,calc(100% - 32px));pointer-events:none}
.toast{background:var(--txt);color:#fff;border-radius:12px;padding:12px 16px;font-size:14px;box-shadow:0 8px 24px rgba(16,38,26,.25);animation:sobe .2s ease-out}
.toast.erro{background:#8f241b}
.toast.ok{background:var(--verde-esc)}
@keyframes sobe{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ===== responsivo ===== */
@media (max-width:1100px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .duas{grid-template-columns:1fr}
  .esc-item{grid-template-columns:repeat(2,minmax(0,1fr))}
  .esc-item>.acoes-esc{grid-column:1/-1}
}
@media (max-width:900px){
  .planos{grid-template-columns:1fr}
  .cad-wrap{grid-template-columns:1fr}
  .resumo{position:static}
  .app{grid-template-columns:1fr}
  .lateral{display:none}
  .barra{padding:12px 16px;position:static}
  .barra h1{font-size:19px}
  .tabs-sair{display:inline-flex!important}
  .tabs-movel{display:flex;gap:4px;overflow-x:auto;padding:8px 12px;background:var(--sup);border-bottom:1px solid var(--linha);position:sticky;top:0;z-index:6;scrollbar-width:none}
  .tabs-movel::-webkit-scrollbar{display:none}
  .tabs-movel a{flex:none;display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;text-decoration:none;color:var(--txt2);font-weight:600;font-size:13.5px;white-space:nowrap}
  .tabs-movel a svg{width:16px;height:16px}
  .tabs-movel a.on{background:var(--verde-cl);color:var(--verde-esc)}
  .conteudo{padding:16px 16px 50px;gap:16px}
  .faixa-suporte{padding:9px 16px}
  .kanban{grid-template-columns:1fr}
  .docs-grade{grid-template-columns:1fr}
}
@media (max-width:640px){
  .g2,.g3,.g4{grid-template-columns:1fr}
  .span2{grid-column:auto}
  .topo-pub{padding:12px 16px}
  .lp{padding:4px 16px 40px}
  .lp-hero{padding:16px 0 18px}
  .lp-hero p{font-size:15.5px}
  .cad-form{padding:18px}
  .caixa{padding:22px}
  .card.pad,.painel-form{padding:16px}
  .kpi .v{font-size:25px}
  .kpi{padding:13px 14px}
  .esc-item{grid-template-columns:1fr}
  .marca b{font-size:16px}
  .marca .selo img{height:21px}
  .barra .quem .nome-u{display:none}
  .barra{flex-wrap:wrap;gap:8px}
  .barra .quem{flex-wrap:wrap;gap:6px}
  .barra .quem .avatar{display:none}
  .barra .quem .btn{padding:7px 11px;font-size:13px;min-height:34px}
  .card-cab{flex-wrap:nowrap}
  .card-cab h3{min-width:0}
  .topo-pub .btn{padding:8px 12px;font-size:13px}
  /* tabela vira lista de cartoes */
  .tab thead{display:none}
  .tab,.tab tbody,.tab tr,.tab td{display:block;width:100%}
  .tab tr{padding:12px 14px;border-bottom:1px solid var(--linha)}
  .tab tr:last-child{border-bottom:0}
  .tab td{padding:2px 0;border:0}
  .tab td[data-r]::before{content:attr(data-r) ": ";color:var(--txt3);font-size:12.5px}
  .tab td.prim{font-size:15px;padding-bottom:4px}
  .tab .acoes{text-align:left;padding-top:8px;white-space:normal}
  .ferr .campo.estreito{flex:1 1 140px}
}