:root{
  --tinta:#10303A; --tinta-2:#1A4652; --tinta-texto:#CFE2DF; --tinta-suave:#8FB0B0;
  --papel:#F1F5F4; --superficie:#FFFFFF; --linha:#D9E2E0; --linha-forte:#BBCAC7;
  --texto:#16262B; --texto-2:#566A70;
  --primaria:#0B7A8A; --primaria-esc:#08616E; --primaria-clara:#DFF1F1;
  --alerta:#C0431E; --alerta-clara:#FBE9E3; --ok:#2C7B55; --ok-clara:#E1F2E9;
  --aviso:#A86B0C; --aviso-clara:#FBF0DA; --pausa:#71858B; --pausa-clara:#E8EEEE;
  --raio:8px; --fonte:"Onest",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:var(--fonte);color:var(--texto);background:var(--papel);font-size:14px;line-height:1.45}
h1,h2,h3{margin:0;font-weight:650;letter-spacing:-.01em}
a{color:var(--primaria)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--primaria);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}

/* ---------- estrutura ---------- */
.app{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.lateral{background:var(--tinta);color:var(--tinta-texto);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding:18px 12px}
.marca{display:block;background:#fff;border-radius:10px;padding:12px 0 8px;margin:0 2px 18px;text-align:center;line-height:0}
.marca img{width:112px;height:auto;max-width:80%}
.lateral nav{flex:1;overflow:auto}
.modulo{margin-bottom:6px}
.modulo-titulo{padding:8px 10px;font-size:12.5px;color:var(--tinta-suave);font-weight:600}
.modulo.desativado{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;color:#6F8F91;font-size:13.5px}
.em-breve{font-size:11px;border:1px solid #2C5A66;border-radius:999px;padding:1px 8px;color:var(--tinta-suave)}
.lateral a.item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:7px;color:var(--tinta-texto);text-decoration:none;font-size:14px}
.lateral a.item:hover{background:var(--tinta-2)}
.lateral a.item.ativo{background:#fff;color:var(--tinta);font-weight:600}
.lateral svg{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.usuario{border-top:1px solid #24505C;padding:12px 10px 2px;font-size:13px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.usuario a{color:var(--tinta-suave)}
main{min-width:0;display:flex;flex-direction:column}
.topo{display:flex;align-items:center;gap:16px;padding:16px 28px;background:var(--superficie);border-bottom:1px solid var(--linha);position:sticky;top:0;z-index:5}
.topo h1{font-size:19px}
.topo .esp{flex:1}
.conteudo{padding:24px 28px 96px}

/* ---------- componentes ---------- */
.modo{font-size:12.5px;padding:5px 12px;border-radius:999px;text-decoration:none;font-weight:550;border:1px solid transparent}
.modo-teste{background:var(--aviso-clara);color:var(--aviso);border-color:#EBD3A0}
.modo-manual{background:var(--primaria-clara);color:var(--primaria-esc);border-color:#B4DADB}
.modo-automatico{background:var(--ok-clara);color:var(--ok);border-color:#B5DCC6}
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--linha-forte);background:var(--superficie);border-radius:7px;padding:7px 14px;cursor:pointer;font-weight:550;text-decoration:none;color:var(--texto)}
.btn:hover{background:#F5F8F8}
.btn.primario{background:var(--primaria);border-color:var(--primaria);color:#fff}
.btn.primario:hover{background:var(--primaria-esc)}
.btn.perigo{color:var(--alerta);border-color:#E6BDB0}
.btn.pequeno{padding:4px 10px;font-size:13px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
input[type=text],input[type=email],input[type=password],input[type=time],input[type=date],input[type=number],input[type=search],select,textarea{border:1px solid var(--linha-forte);border-radius:7px;padding:7px 10px;background:#fff;width:100%}
textarea{resize:vertical;min-height:90px}
label.campo{display:block;font-weight:550;margin-bottom:14px}
label.campo small{display:block;font-weight:400;color:var(--texto-2);margin-top:2px}
label.campo input,label.campo select,label.campo textarea{margin-top:5px;font-weight:400}
.painel{background:var(--superficie);border:1px solid var(--linha);border-radius:10px;padding:20px 22px;margin-bottom:20px}
.painel h2{font-size:16px;margin-bottom:4px}
.painel .sub{color:var(--texto-2);margin:0 0 16px}
.aviso-caixa{padding:10px 14px;border-radius:8px;margin-bottom:16px;border:1px solid}
.aviso-caixa.ok{background:var(--ok-clara);border-color:#B5DCC6;color:#1E5A3D}
.aviso-caixa.erro{background:var(--alerta-clara);border-color:#EBB9A9;color:#8E2E11}
.aviso-caixa.info{background:var(--primaria-clara);border-color:#B4DADB;color:var(--primaria-esc)}
table.tab{width:100%;border-collapse:collapse;background:var(--superficie);border:1px solid var(--linha);border-radius:10px;overflow:hidden}
table.tab th{text-align:left;font-weight:600;font-size:13px;color:var(--texto-2);padding:10px 12px;background:#F7FAF9;border-bottom:1px solid var(--linha)}
table.tab td{padding:9px 12px;border-bottom:1px solid #EAF0EE;vertical-align:middle}
table.tab tr:last-child td{border-bottom:0}
table.tab input,table.tab select{padding:5px 8px}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;border-radius:999px;padding:2px 9px;background:var(--pausa-clara);color:#3F5359;white-space:nowrap}
.chip.alerta{background:var(--alerta-clara);color:var(--alerta)}
.chip.ok{background:var(--ok-clara);color:var(--ok)}
.chip.aviso{background:var(--aviso-clara);color:var(--aviso)}
.chip.prim{background:var(--primaria-clara);color:var(--primaria-esc)}
.vazio{color:var(--texto-2);padding:28px;text-align:center}
.grade-2{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.linha-flex{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.dica{color:var(--texto-2);font-size:13px}

/* ---------- quadro (kanban) ---------- */
.barra-filtros{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.barra-filtros input[type=search]{width:260px}
.barra-filtros select{width:auto}
.tog{display:inline-flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.tog input{width:auto}
.quadro{display:flex;gap:14px;overflow-x:auto;padding-bottom:16px;align-items:flex-start}
.coluna{flex:0 0 292px;width:292px;min-width:0;max-width:292px;background:#E6EDEB;border-radius:10px;display:flex;flex-direction:column;max-height:calc(100vh - 190px)}
.coluna.hoje{background:#D9ECEB}
.coluna.pausadas{background:#E9ECEC}
.coluna.alvo{outline:2px dashed var(--primaria);outline-offset:-2px;background:#D4EAEA}
.col-cab{padding:12px 14px 10px;display:flex;flex-direction:column;gap:2px;border-bottom:1px solid rgba(16,48,58,.08)}
.col-linha{display:flex;align-items:baseline;gap:8px}
.col-titulo{font-size:16px;font-weight:650}
.col-sub{color:var(--texto-2);font-size:13px}
.col-tot{margin-left:auto;text-align:right;font-size:12.5px;color:var(--texto-2)}
.col-tot b{display:block;color:var(--texto);font-size:13.5px}
.col-sel{font-size:12.5px;color:var(--primaria-esc);background:none;border:0;padding:2px 0;cursor:pointer;text-align:left;width:max-content}
.col-corpo{min-width:0;padding:10px;display:flex;flex-direction:column;gap:9px;overflow-y:auto;min-height:80px}
.cartao{min-width:0;background:var(--superficie);border:1px solid var(--linha);border-radius:var(--raio);padding:10px 12px;cursor:grab;position:relative;border-left:4px solid var(--linha-forte)}
.cartao:hover{border-color:var(--linha-forte)}
.cartao.atrasada{border-left-color:var(--alerta)}
.cartao.enviado-hoje{border-left-color:var(--ok)}
.cartao.selecionado{box-shadow:0 0 0 2px var(--primaria);border-color:var(--primaria)}
.cartao.arrastando{opacity:.45}
.cartao .topo-c{display:flex;gap:9px;align-items:flex-start;min-width:0}
.cartao .nome{min-width:0}
.cartao input[type=checkbox]{width:16px;height:16px;margin-top:2px;flex:none;accent-color:var(--primaria)}
.cartao .nome{font-weight:600;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cartao .cnpj{color:var(--texto-2);font-size:12px;margin:2px 0 8px 25px}
.cartao .linha-c{display:flex;flex-wrap:wrap;gap:6px;margin-left:25px}
.cartao .valor{margin-left:25px;margin-top:8px;font-weight:650;font-size:15px}
.cartao .rodape-c{margin:8px 0 0 25px;font-size:12px;color:var(--texto-2);display:flex;justify-content:space-between;gap:8px}
.cartao .nota-int{margin:6px 0 0 25px;font-size:12px;color:var(--aviso);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.col-vazia{color:var(--texto-2);font-size:13px;text-align:center;padding:18px 6px;border:1px dashed var(--linha-forte);border-radius:8px}
.barra-acoes{position:fixed;left:248px;right:0;margin:0 auto;width:max-content;max-width:calc(100vw - 280px);bottom:20px;background:var(--tinta);color:#fff;border-radius:12px;padding:10px 14px;display:none;gap:10px;align-items:center;flex-wrap:wrap;box-shadow:0 8px 28px rgba(16,48,58,.35);z-index:20}
.barra-acoes.visivel{display:flex}
.barra-acoes .btn{background:transparent;border-color:#3C6B78;color:#fff}
.barra-acoes .btn:hover{background:var(--tinta-2)}
.barra-acoes .btn.primario{background:#3DB8A9;border-color:#3DB8A9;color:#083038}
.barra-acoes input,.barra-acoes select{width:auto;padding:5px 8px;background:#fff;color:var(--texto)}
.barra-acoes .sep{width:1px;align-self:stretch;background:#2C5A66}
.toast{position:fixed;left:calc(248px + 24px);bottom:24px;background:#fff;border:1px solid var(--linha-forte);border-left:4px solid var(--primaria);border-radius:8px;padding:10px 14px;max-width:460px;box-shadow:0 6px 24px rgba(16,48,58,.2);z-index:40;display:none;white-space:pre-line}
.toast.erro{border-left-color:var(--alerta)}

/* ---------- gaveta de detalhes ---------- */
dialog.gaveta{border:0;padding:0;margin:0 0 0 auto;height:100vh;max-height:100vh;width:min(560px,100vw);border-radius:0;box-shadow:-12px 0 40px rgba(16,48,58,.25)}
dialog.gaveta::backdrop{background:rgba(16,48,58,.35)}
.gaveta-cab{padding:18px 22px;border-bottom:1px solid var(--linha);display:flex;gap:12px;align-items:flex-start}
.gaveta-cab h2{font-size:17px;line-height:1.3}
.gaveta-cab .fechar{margin-left:auto}
.gaveta-corpo{padding:18px 22px;overflow-y:auto;height:calc(100vh - 78px)}
.gaveta-corpo h3{font-size:14px;margin:20px 0 8px}
.pedido-l{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid #EAF0EE}
.pedido-l:last-child{border:0}
.pedido-l .meta{flex:1;min-width:0}
.pedido-l .int{color:var(--aviso);font-size:12.5px;word-break:break-word}
iframe.previa{width:100%;height:380px;border:1px solid var(--linha);border-radius:8px;background:#fff}

/* ---------- login ---------- */
.login{min-height:100vh;display:grid;place-items:center;background:var(--tinta);padding:20px}
.login .caixa{background:#fff;border-radius:14px;padding:32px 32px 26px;width:min(400px,100%)}
.login-logo{display:block;margin:0 auto 6px;max-width:60%;height:auto}
.login h1{font-size:21px;margin:10px 0 4px;text-align:center}
.login p{text-align:center}
.login p{color:var(--texto-2);margin:0 0 20px}

@media (max-width:900px){
  .app{grid-template-columns:1fr}
  .lateral{position:static;height:auto;flex-direction:row;flex-wrap:wrap;padding:10px}
  .lateral nav{display:flex;flex-wrap:wrap;gap:4px}
  .modulo.desativado,.usuario{display:none}
  .barra-acoes{left:0;max-width:calc(100vw - 24px)}
  .toast{left:16px}
  .grade-2{grid-template-columns:1fr}
  .conteudo,.topo{padding-left:16px;padding-right:16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}