/* Painel iOral — Etapa 2: quadros e régua de cobrança */
.quadro-topo{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.quadro-topo .busca{flex:1;min-width:200px;max-width:360px;border:1px solid var(--linha);border-radius:10px;padding:9px 12px;background:#fff}
.quadro{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px;align-items:flex-start;min-height:60vh;scroll-snap-type:x proximity}
.coluna{flex:0 0 272px;background:#F3EED8;border:1px solid var(--linha);border-radius:12px;display:flex;flex-direction:column;max-height:calc(100vh - 210px);scroll-snap-align:start}
.coluna.alvo{outline:3px dashed var(--marinho-3);outline-offset:-3px;background:#EDE6C8}
.coluna-cab{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px 8px}
.coluna-cab h3{margin:0;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--marinho)}
.coluna-cab .qtd{font-size:12px;font-weight:800;color:var(--cinza);background:#fff;border-radius:999px;padding:1px 8px}
.coluna-lista{padding:4px 8px 8px;display:grid;gap:8px;overflow-y:auto;min-height:40px}
.coluna-add{margin:0 8px 10px;border:1px dashed #CFC6A0;background:transparent;border-radius:9px;padding:7px;color:var(--cinza);font-weight:700;cursor:pointer}
.coluna-add:hover{background:#fff;color:var(--marinho)}
.cartao{background:#fff;border:1px solid var(--linha);border-radius:10px;padding:10px 11px;cursor:grab;display:grid;gap:4px;box-shadow:0 1px 2px rgba(11,16,64,.05)}
.cartao:hover{border-color:var(--marinho-3)}
.cartao.arrastando{opacity:.45}
.cartao .nome{font-weight:800;color:var(--marinho);overflow-wrap:anywhere}
.cartao .info{font-size:12px;color:var(--cinza);overflow-wrap:anywhere}
.cartao .rodape{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:2px}
.tag{display:inline-block;font-size:11px;font-weight:700;padding:2px 7px;border-radius:999px;background:#F3F1E8;color:var(--neutro);white-space:nowrap}
.tag.urg{background:color-mix(in srgb,var(--risco) 14%,#fff);color:var(--risco)}
.tag.atraso{background:color-mix(in srgb,var(--alerta) 18%,#fff);color:var(--alerta)}
.tag.ok{background:color-mix(in srgb,var(--ok) 14%,#fff);color:var(--ok)}
.tag.info{background:color-mix(in srgb,var(--info) 12%,#fff);color:var(--info)}

/* Modal */
.fundo{position:fixed;inset:0;background:rgba(3,6,31,.55);z-index:40;display:grid;place-items:center;padding:16px}
.modal{background:var(--creme-2);border-radius:14px;width:100%;max-width:640px;max-height:calc(100vh - 32px);overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.modal-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px;border-bottom:1px solid var(--linha);position:sticky;top:0;background:var(--creme-2);z-index:1}
.modal-cab h2{margin:0;font:700 18px var(--f-marca);color:var(--marinho)}
.modal-corpo{padding:16px 18px;display:grid;gap:12px}
.modal-rodape{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;padding:12px 18px 16px;border-top:1px solid var(--linha)}
.fechar{border:0;background:none;font-size:22px;cursor:pointer;color:var(--marinho);line-height:1}
.grade2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.campo textarea{min-height:80px;resize:vertical;border:1px solid #D9D1AE;background:#fff;border-radius:10px;padding:10px 12px;width:100%}
.campo .chk-linha{display:flex;gap:8px;align-items:center;font-weight:600}
.historico{font-size:12px;color:var(--cinza);display:grid;gap:4px;max-height:160px;overflow:auto;background:#fff;border:1px solid var(--linha);border-radius:10px;padding:10px}
.btn.perigo{background:#fff;color:var(--risco);border:1px solid color-mix(in srgb,var(--risco) 35%,#fff)}
.btn.perigo:hover{background:#FBE9E7}
.etapas-lista{display:grid;gap:8px}
.etapa-linha{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:6px;align-items:center}
.etapa-linha input{border:1px solid #D9D1AE;background:#fff;border-radius:9px;padding:8px 10px;width:100%}

/* Régua */
.etapas-resumo{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.etapa-card{background:#fff;border:1px solid var(--linha);border-radius:12px;padding:10px 12px;display:grid;gap:2px}
.etapa-card small{font-size:11px;font-weight:700;color:var(--cinza);text-transform:uppercase;letter-spacing:.05em}
.etapa-card b{font:700 22px var(--f-marca);color:var(--marinho)}
.etapa-card em{font-style:normal;font-size:12px;color:var(--cinza)}
.etapa-card.quente b{color:var(--risco)}
.form-linha{display:grid;grid-template-columns:2fr 1.3fr 1fr 1.1fr .8fr auto;gap:8px;align-items:end}

@media (max-width:900px){
  .coluna{flex-basis:84vw}
  .grade2{grid-template-columns:1fr}
  .etapas-resumo{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-linha{grid-template-columns:1fr 1fr}
}
.campo input.chk{width:18px;height:18px;padding:0}