/* Funil e tarefas ocupam a tela; cada coluna tem sua propria rolagem. */
.casco:has(.vista-quadro){height:100dvh;min-height:0;overflow:hidden}
.casco:has(.vista-quadro) .painel{min-height:0;overflow:hidden}
.casco:has(.vista-quadro) .topo{flex-shrink:0}
.casco:has(.vista-quadro) .conteudo{display:flex;min-height:0;max-width:none;padding:16px 20px;overflow:hidden}
.casco:has(.vista-quadro) .lateral{height:100dvh;min-height:0;overflow:hidden}
.casco:has(.vista-quadro) .lateral-marca,
.casco:has(.vista-quadro) .lateral-fim{flex-shrink:0}
.casco:has(.vista-quadro) #nav-principal{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.vista-quadro{display:flex;flex-direction:column;gap:12px;min-width:0;min-height:0;width:100%;flex:1}
.quadro-filtros{flex-shrink:0;margin:0;padding:10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sombra-1)}
.quadro-filtros input{flex:1;min-width:140px}
.quadro-filtros select{min-width:140px;max-width:220px;flex:1}
.quadro-resumo{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;min-height:30px;font-size:12px;color:var(--ink-2)}
.quadro-resumo strong{color:var(--ink);font-weight:750}
.quadro-separador{margin:0 8px;color:var(--ink-4)}
.quadro-navegacao{display:flex;align-items:center;gap:6px;flex-shrink:0}
.quadro-dica{font-size:11px;color:var(--ink-3);margin-right:5px}
.funil-etapas{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;flex-shrink:0}
.funil-etapa-mobile{display:none;flex-shrink:0}
.funil-etapa{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;min-height:47px;padding:7px 9px;border:1px solid var(--line);border-top:3px solid var(--cor);border-radius:8px;background:var(--surface);color:var(--ink-2);text-align:left;font-size:11px;line-height:1.3;transition:background var(--transicao)}
.funil-etapa span{overflow-wrap:anywhere}
.funil-etapa b{font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink)}
.funil-etapa:hover,.funil-etapa.visivel{background:color-mix(in srgb,var(--cor) 10%,var(--surface));border-bottom-color:var(--cor)}
.vista-quadro .kanban,.vista-quadro .quadro-tarefas{flex:1;min-height:0;min-width:0;align-items:stretch;gap:12px;overflow-x:auto;overflow-y:hidden;padding:0 0 4px;overscroll-behavior-x:contain;scroll-snap-type:x proximity}
.vista-quadro .kanban{grid-auto-columns:calc((100% - 36px)/4)}
.vista-quadro .quadro-tarefas{grid-template-columns:repeat(3,minmax(0,1fr))}
.vista-quadro .coluna,.vista-quadro .coluna-tarefas{display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden;padding:0;border-radius:12px;border-top:3px solid var(--cor,var(--line));scroll-snap-align:start}
.vista-quadro .col-cab,.vista-quadro .coluna-tarefas .cab{padding:13px 12px 5px;margin:0;flex-shrink:0}
.vista-quadro .col-nome,.vista-quadro .coluna-tarefas .cab .n{font-size:12px;text-transform:none;letter-spacing:0;font-weight:750;color:var(--ink)}
.vista-quadro .col-qtd,.vista-quadro .coluna-tarefas .cab .q{color:var(--ink-2);background:var(--surface);border:1px solid var(--line-soft);min-width:24px;text-align:center}
.vista-quadro .col-val{padding:0 12px 10px;margin:0;font-size:11px;flex-shrink:0}
.vista-quadro .coluna-tarefas .cab{min-height:51px;padding-bottom:12px;flex-wrap:wrap}
.vista-quadro .coluna-tarefas .cab .n::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cor);margin-right:7px}
.coluna-lista{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding:3px 6px 8px 10px;border-top:1px solid var(--line-soft)}
.coluna-lista:focus-visible{outline-offset:-2px}
.vista-quadro .cartao-conta{padding:10px;margin-bottom:8px;border-left-width:2px}
.vista-quadro .cartao-conta .nome{font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.vista-quadro .cartao-conta .linha{gap:5px;margin-top:7px}
.vista-quadro .cartao-conta .tag{font-size:10px;padding:1px 5px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vista-quadro .cartao-conta .val{margin-top:7px;font-size:13px}
.vista-quadro .cartao-conta .acao{margin-top:7px;padding-top:7px;font-size:11px}
.vista-quadro .cartao-conta .acao > span{min-width:0}
.vista-quadro .item-tarefa{padding:11px;gap:8px;border-radius:9px;box-shadow:var(--sombra-1)}
.vista-quadro .item-tarefa .tt{font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.vista-quadro .item-tarefa .tt,.vista-quadro .cartao-conta .nome{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.vista-quadro .item-tarefa .meta{gap:5px;font-size:11px}
.vista-quadro .item-tarefa .meta .tag{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px}
.vista-quadro .item-tarefa.atrasada{background:var(--surface);border-color:color-mix(in srgb,#DC2626 28%,var(--line))}
.vista-quadro .item-tarefa.atrasada .tag.perigo{background:color-mix(in srgb,#DC2626 8%,var(--surface));color:#C13737}
.vista-quadro .coluna-tarefas .cab .tag.perigo{background:color-mix(in srgb,#DC2626 8%,var(--surface));color:#C13737}
html[data-tema="escuro"] .vista-quadro .item-tarefa.atrasada .tag.perigo{color:#FF9797}
html[data-tema="escuro"] .vista-quadro .coluna-tarefas .cab .tag.perigo{color:#FF9797}
.vista-quadro .item-tarefa.feita{opacity:.72}
.quadro-vazio{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center;padding:32px 12px;color:var(--ink-3);font-size:11.5px;min-height:150px}
.quadro-vazio > .ic{width:25px;height:25px;color:var(--ink-4);margin-bottom:3px}
.quadro-vazio strong{font-size:12px;font-weight:650;color:var(--ink-2)}
.quadro-resumo .segmentado{flex-shrink:0}
.quadro-atalhos{display:flex;align-items:center;gap:3px;padding:3px;background:var(--surface-3);border:1px solid var(--line);border-radius:9px}
.quadro-atalho{display:flex;align-items:center;gap:7px;padding:5px 9px;border-radius:6px;font-size:12px;font-weight:650;color:var(--ink-2);white-space:nowrap}
.quadro-atalho span{font-size:10px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.quadro-atalho:hover{background:var(--surface-2)}
.quadro-atalho.ativo{background:var(--surface);color:var(--brand);box-shadow:var(--sombra-1)}
.quadro-atalho.ativo span{color:var(--brand)}
.quadro-acao{margin-left:auto}
.tarefas-etapas{display:none;flex-shrink:0;gap:6px}
.tarefa-etapa{flex:1;display:flex;justify-content:space-between;align-items:center;gap:5px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:11px;font-weight:650;min-width:0}
.tarefa-etapa:hover,.tarefa-etapa.ativo{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}
.tarefa-etapa span,.tarefa-etapa b{font-size:10px;font-variant-numeric:tabular-nums}
@media(max-width:1279px){
  .vista-quadro .kanban{grid-auto-columns:calc((100% - 24px)/3)}
  .quadro-filtros select{max-width:190px}
  .funil-etapa{padding:6px;font-size:10px;gap:4px}
}
@media(max-width:760px){
  .casco:has(.vista-quadro) .conteudo{padding:12px}
  .quadro-filtros{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:8px}
  .quadro-filtros input,.quadro-filtros select{min-width:0;max-width:none;width:100%;font-size:12px}
  .quadro-filtros .btn{margin-left:0 !important}
  .vista-quadro .kanban{grid-auto-columns:calc((100% - 12px)/2)}
  .vista-quadro .quadro-tarefas{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:85%}
  .tarefas-etapas{display:flex}
  .funil-etapas{display:none}
  .funil-etapa-mobile{display:block;height:36px;font-size:12px}
  .funil-etapa{flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:61px;font-size:9px;padding:5px}
  .quadro-resumo{font-size:11px;gap:6px;flex-wrap:wrap}
  .quadro-dica{display:none}
  .quadro-separador{margin:0 4px}
}
@media(max-width:480px){
  .vista-quadro{gap:9px}
  .vista-quadro .kanban{grid-auto-columns:88%}
  .quadro-resumo .segmentado button{padding:5px 8px;font-size:11px}
  .quadro-atalho{padding:5px 7px;font-size:11px;gap:5px}
}
@media(max-height:560px){
  .casco:has(.vista-quadro) .conteudo{overflow-y:auto}
  .vista-quadro{min-height:380px}
}
@media(max-width:1000px){
  .casco:has(.vista-quadro):has(.barra-mobile) .conteudo{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){
  .vista-quadro *{scroll-behavior:auto !important}
}
