:root {
  --fundo: #f3f5f7;
  --painel: #ffffff;
  --texto: #1d2733;
  --suave: #5d6b7a;
  --linha: #e1e6eb;
  --marca: #0f4c5c;
  --marca-2: #16687c;
  --destaque: #f4b942;
  --entrada: #1f8a5b;
  --saida: #c2412d;
  --alerta: #b7791f;
  --info: #2b6cb0;
  --raio: 10px;
  --sombra: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  color: var(--texto);
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fundo); }
a { color: var(--marca-2); }
h1 { font-size: 20px; margin: 0; font-weight: 650; }
h2 { font-size: 16px; margin: 0 0 10px; font-weight: 650; }
h3 { font-size: 14px; margin: 16px 0 8px; font-weight: 650; color: var(--suave); text-transform: uppercase; letter-spacing: .04em; }

/* ---------- estrutura (v0.50): barra superior, barra de módulos (ícones), painel do módulo e área de trabalho */
.app { display: grid; grid-template-columns: 64px 264px 1fr; grid-template-rows: 54px 1fr; min-height: 100vh; }
.app.recolhido { grid-template-columns: 64px 0 1fr; }
.app.recolhido .lateral { display: none; }
.topo { grid-column: 1 / -1; display: flex; align-items: center; gap: 16px; padding: 0 18px 0 0; background: var(--painel);
  border-bottom: 1px solid var(--linha); position: sticky; top: 0; z-index: 20; height: 54px; }
.topo-esq { display: flex; align-items: center; gap: 6px; min-width: 0; }
.topo .logo { display: flex; align-items: center; gap: 10px; padding: 0 14px; height: 54px; color: var(--marca); font-weight: 750; letter-spacing: .06em; text-decoration: none; }
.topo .logo small { display: block; font-weight: 400; letter-spacing: 0; color: var(--suave); font-size: 10px; }
.logo { display: flex; align-items: center; gap: 10px; padding: 4px 10px 18px; color: #fff; font-weight: 700; letter-spacing: .06em; }
.logo i { width: 30px; height: 30px; border-radius: 8px; background: var(--destaque); color: var(--marca); display: grid; place-items: center; font-style: normal; font-weight: 800; }
.logo small { display: block; font-weight: 400; letter-spacing: 0; color: #a9c7ce; font-size: 11px; }
.busca-func-env { position: relative; margin-left: auto; width: min(360px, 40vw); }
.busca-func-lupa { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); font-size: 13px; opacity: .6; pointer-events: none; }
.busca-func { width: 100%; padding: 8px 12px 8px 34px; border-radius: 999px; border: 1px solid #cdd5dd; background: #fff; }
.busca-func-lista { display: none; position: absolute; top: calc(100% + 6px); left: 0; right: 0; background: var(--painel); border: 1px solid var(--linha);
  border-radius: 10px; box-shadow: 0 8px 24px rgba(16, 24, 40, .14); padding: 6px; z-index: 30; max-height: 70vh; overflow-y: auto; }
.busca-func-lista.aberta { display: block; }
.busca-func-lista a { display: flex; flex-direction: column; padding: 7px 10px; border-radius: 7px; text-decoration: none; color: var(--texto); }
.busca-func-lista a span { font-size: 11px; color: var(--suave); }
.busca-func-lista a:hover, .busca-func-lista a.primeiro { background: #eef4f6; }
.topo .usuario { color: var(--suave); display: flex; gap: 10px; align-items: center; }
.iniciais { width: 32px; height: 32px; border-radius: 50%; background: var(--marca); color: #fff; display: grid; place-items: center; font-size: 12px; font-weight: 700; }
.usuario-nome { font-size: 12px; }
.trilho { grid-row: 2; background: var(--marca); display: flex; flex-direction: column; align-items: stretch; padding: 8px 0; gap: 2px;
  position: sticky; top: 54px; height: calc(100vh - 54px); overflow-y: auto; }
.trilho button { position: relative; background: none; border: 0; color: #c6dde2; padding: 10px 0 8px; cursor: pointer; display: flex; flex-direction: column;
  align-items: center; gap: 3px; font: inherit; }
.trilho button svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.trilho button span { font-size: 9px; line-height: 1.15; text-align: center; padding: 0 3px; max-width: 62px; }
.trilho button:hover { color: #fff; background: rgba(255, 255, 255, .07); }
.trilho button.ativo { color: #fff; background: rgba(255, 255, 255, .14); }
.trilho button.ativo::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 3px; border-radius: 0 3px 3px 0; background: var(--destaque); }
.trilho button.da-tela:not(.ativo)::after { content: ""; position: absolute; right: 8px; top: 8px; width: 6px; height: 6px; border-radius: 50%; background: var(--destaque); }
.trilho button:focus-visible { outline: 2px solid var(--destaque); outline-offset: -2px; }
.lateral { grid-row: 2; background: var(--painel); border-right: 1px solid var(--linha); position: sticky; top: 54px; height: calc(100vh - 54px);
  overflow-y: auto; padding: 0 0 20px; }
.painel-cab { display: flex; align-items: center; gap: 4px; padding: 14px 10px 10px 16px; border-bottom: 1px solid var(--linha); position: sticky; top: 0; background: var(--painel); z-index: 1; }
.painel-cab h2 { flex: 1; margin: 0; font-size: 15px; font-weight: 700; color: var(--texto); }
.painel-bt { background: none; border: 1px solid transparent; border-radius: 6px; color: var(--suave); cursor: pointer; font-size: 15px; width: 28px; height: 28px; }
.painel-bt:hover { border-color: var(--linha); color: var(--marca); }
.painel-itens { padding: 8px 8px 0; }
.grupo { display: flex; align-items: center; gap: 8px; width: 100%; margin: 2px 0; padding: 8px 8px; font: inherit; font-size: 13px; font-weight: 650;
  color: var(--texto); background: none; border: 0; border-radius: 7px; cursor: pointer; text-align: left; }
.grupo::before { content: "▸"; color: var(--destaque); font-size: 11px; width: 10px; transition: transform .15s; }
.grupo.aberto::before { transform: rotate(90deg); }
.grupo:hover { background: #f2f6f8; }
.grupo:focus-visible { outline: 2px solid var(--marca-2); outline-offset: 1px; }
.itens { margin: 0 0 4px 13px; padding-left: 8px; border-left: 1px solid var(--linha); }
.itens.fechado { display: none; }
.lateral a { display: block; padding: 7px 10px; margin: 1px 0; border-radius: 7px; color: var(--texto); text-decoration: none; font-size: 13px; }
.painel-itens > a { font-weight: 600; }
.lateral a:hover { background: #f2f6f8; }
.lateral a.ativo { background: #e3ecef; color: var(--marca); font-weight: 650; }
.area-trabalho { grid-row: 2; min-width: 0; padding: 22px 28px 60px; }
.titulo-tela { font-size: 22px; font-weight: 400; letter-spacing: .02em; text-transform: uppercase; color: var(--texto); margin: 2px 0 18px; }
.conteudo { max-width: 1500px; }
.principal { min-width: 0; }
.menu-movel { display: none; }

/* ---------- blocos */
.cartao { background: var(--painel); border: 1px solid var(--linha); border-radius: var(--raio); box-shadow: var(--sombra); padding: 16px 18px; margin-bottom: 16px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-bottom: 16px; }
.kpi { background: var(--painel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px 16px; box-shadow: var(--sombra); }
.kpi .rot { color: var(--suave); font-size: 12px; }
.kpi .val { font-size: 22px; font-weight: 650; margin-top: 4px; font-variant-numeric: tabular-nums; }
.kpi .det { font-size: 12px; color: var(--suave); margin-top: 4px; }
.kpi.clicavel { cursor: pointer; }
.kpi.clicavel:hover { border-color: var(--marca-2); }
.duas { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.barra-acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin-bottom: 12px; }
.barra-acoes .esp { flex: 1; }
.abas { display: flex; gap: 2px; border-bottom: 1px solid var(--linha); margin-bottom: 14px; flex-wrap: wrap; }
.abas button { background: none; border: 0; padding: 9px 14px; cursor: pointer; color: var(--suave); border-bottom: 2px solid transparent; font: inherit; }
.abas button.ativo { color: var(--marca); border-bottom-color: var(--marca); font-weight: 600; }
.vazio { color: var(--suave); padding: 18px 4px; text-align: center; }
.dica { color: var(--suave); font-size: 12px; }
.pares { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 18px; margin-bottom: 8px; }
.pares div span { display: block; color: var(--suave); font-size: 12px; }
.pares div b { font-weight: 600; }

/* ---------- tabelas */
.tabela-env { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 8px 10px; border-bottom: 1px solid var(--linha); text-align: left; white-space: nowrap; }
th { font-size: 12px; color: var(--suave); font-weight: 600; background: #f8fafb; position: sticky; top: 0; cursor: default; }
th.ord { cursor: pointer; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
td.quebra { white-space: normal; min-width: 220px; }
tbody tr.clicavel { cursor: pointer; }
tbody tr.clicavel:hover { background: #f2f8f9; }
tfoot td { font-weight: 650; background: #f8fafb; }
.pos { color: var(--entrada); }
.neg { color: var(--saida); }

/* ---------- etiquetas */
.et { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; background: #eef2f5; color: var(--suave); }
.et.verde { background: #e3f4ec; color: var(--entrada); }
.et.vermelha { background: #fbe9e6; color: var(--saida); }
.et.amarela { background: #fdf3df; color: var(--alerta); }
.et.azul { background: #e6f0fa; color: var(--info); }

/* ---------- formulários */
label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--suave); }
input, select, textarea { font: inherit; color: var(--texto); padding: 7px 9px; border: 1px solid #cdd5dd; border-radius: 7px; background: #fff; min-width: 0; }
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(22, 104, 124, .25); border-color: var(--marca-2); }
textarea { min-height: 90px; resize: vertical; }
.form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px 14px; }
.form .largo { grid-column: 1 / -1; }
label.check { flex-direction: row; align-items: center; gap: 8px; color: var(--texto); font-size: 14px; }
button.bt { font: inherit; border: 1px solid #cdd5dd; background: #fff; color: var(--texto); padding: 7px 14px; border-radius: 7px; cursor: pointer; white-space: nowrap; }
button.bt:hover { background: #f4f6f8; }
button.bt.prim { background: var(--marca); border-color: var(--marca); color: #fff; }
button.bt.prim:hover { background: var(--marca-2); }
button.bt.perigo { color: var(--saida); border-color: #efc4bc; }
button.bt.peq { padding: 3px 9px; font-size: 12px; }
button.bt:disabled { opacity: .55; cursor: default; }

/* ---------- modal e avisos */
.fundo-modal { position: fixed; inset: 0; background: rgba(15, 30, 40, .45); display: grid; place-items: center; z-index: 50; padding: 16px; }
.modal { background: #fff; border-radius: 12px; width: min(880px, 100%); max-height: 92vh; display: flex; flex-direction: column; box-shadow: 0 20px 50px rgba(0, 0, 0, .25); }
.modal.estreito { width: min(520px, 100%); }
.modal header { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--linha); }
.modal header button { border: 0; background: none; font-size: 22px; cursor: pointer; color: var(--suave); }
.modal .corpo { padding: 16px 18px; overflow-y: auto; }
.modal footer { padding: 12px 18px; border-top: 1px solid var(--linha); display: flex; justify-content: flex-end; gap: 8px; }
#avisos { position: fixed; right: 18px; bottom: 18px; display: flex; flex-direction: column; gap: 8px; z-index: 60; max-width: 420px; }
.aviso { background: #1d2733; color: #fff; padding: 10px 14px; border-radius: 8px; box-shadow: var(--sombra); white-space: pre-line; }
.aviso.erro { background: var(--saida); }
.aviso.ok { background: var(--entrada); }

/* ---------- login */
.tela-login { min-height: 100vh; display: grid; place-items: center; background: linear-gradient(135deg, #0f4c5c, #16687c 60%, #1f7f8f); padding: 16px; }
.caixa-login { background: #fff; border-radius: 14px; padding: 28px; width: min(380px, 100%); box-shadow: 0 20px 50px rgba(0, 0, 0, .25); }
.caixa-login h1 { margin-bottom: 4px; }
.caixa-login form { display: grid; gap: 12px; margin-top: 18px; }

/* ---------- gráfico */
.grafico svg { width: 100%; height: auto; display: block; }
.legenda { display: flex; gap: 14px; font-size: 12px; color: var(--suave); margin-top: 6px; }
.legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.mensagem { background: #f8fafb; border: 1px solid var(--linha); border-radius: 8px; padding: 10px 12px; white-space: pre-wrap; }
/* ---------- mapa comparativo de cotação */
table.mapa td.preco { vertical-align: top; }
table.mapa td.clicavel { cursor: pointer; }
table.mapa td.clicavel:hover { background: #f2f8f9; }
table.mapa td.melhor { background: #e3f4ec; }
table.mapa td.melhor b { color: var(--entrada); }
table.mapa td.vencedor { box-shadow: inset 0 0 0 2px var(--marca); }
.acoes-linha { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.portal { max-width: 980px; margin: 0 auto; padding: 22px 16px 60px; }
.portal .topo-portal { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.item-portal { border-top: 1px solid var(--linha); padding: 12px 0; }
.item-portal:first-of-type { border-top: 0; }
.item-cab { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.item-cab span { color: var(--suave); white-space: nowrap; }
.item-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; }
.item-campos input { width: 100% !important; }
.item-total { font-size: 15px; padding: 7px 0; color: var(--texto); }
.cab-pedido { display: flex; justify-content: space-between; gap: 16px; border-bottom: 2px solid var(--marca); padding-bottom: 10px; margin-bottom: 14px; }
@media print {
  .lateral, .trilho, .topo, .titulo-tela, .nao-imprimir, .rodape-acoes, #avisos, .abas, .lupa-tabela { display: none !important; }
  .extrato-cliente h3 { break-after: avoid; }
  .extrato-cliente table { font-size: 11px; }
  .app { display: block; }
  .area-trabalho { padding: 0; }
  .conteudo { padding: 0; max-width: none; }
  .cartao { box-shadow: none; border: 0; }
  body { background: #fff; }
}
.mono { font-family: Consolas, "Courier New", monospace; font-size: 12px; }

@media (max-width: 900px) {
  .app, .app.recolhido { grid-template-columns: 1fr; }
  .trilho, .lateral { position: fixed; top: 54px; z-index: 40; transition: transform .2s; transform: translateX(-340px); }
  .trilho { left: 0; width: 64px; }
  .lateral { left: 64px; width: 260px; display: block !important; }
  .app.menu-aberto .trilho, .app.menu-aberto .lateral { transform: none; }
  .menu-movel { display: inline-block; margin-left: 8px; }
  .duas { grid-template-columns: 1fr; }
  .area-trabalho { padding: 16px; grid-column: 1; }
  .usuario-nome, .topo .logo > div { display: none; }
  .topo { gap: 8px; padding-right: 10px; }
  .topo .logo { padding: 0 6px; }
  .busca-func-env { width: auto; flex: 1; min-width: 0; }
  .area-trabalho { overflow-x: clip; }
}
/* v0.40 — Suporte à decisão → Análise financeira */
a.cel-detalhe { color: inherit; text-decoration: none; border-bottom: 1px dotted var(--suave); }
a.cel-detalhe:hover { color: var(--marca); border-bottom-color: var(--marca); }
a.cel-detalhe.neg { color: var(--saida); }
.modal:has(.detalhe-analise), .modal:has(.comparativo-lb) { width: min(1240px, 100%); }
/* v0.42 — Comercial: frações, quadro espelho */
.fracoes { padding: 8px 12px; border-radius: 8px; margin-bottom: 10px; font-size: 13px; }
.fracoes.ok { background: #e3f4ec; color: var(--entrada); }
.fracoes.pendente { background: #fdf3df; color: var(--alerta); }
.et.roxa { background: #efe7fa; color: #6b3fa0; }
.esp-grade { display: grid; gap: 6px; overflow-x: auto; }
.esp-pav { display: flex; align-items: center; font-size: 12px; color: var(--suave); font-weight: 600; }
.esp-slot { display: flex; flex-direction: column; gap: 4px; }
.esp-slot.vazio { border: 1px dashed var(--linha); border-radius: 8px; min-height: 74px; }
.esp-livres { display: flex; flex-wrap: wrap; gap: 6px; }
.esp-livres .esp-cel { width: 140px; }
.esp-cel { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; text-align: left; border: 1px solid var(--linha);
  border-left: 5px solid #9aa7b3; border-radius: 8px; padding: 6px 8px; background: #fff; cursor: pointer; font: inherit; min-height: 74px; }
.esp-cel:hover { box-shadow: var(--sombra); border-color: var(--marca-2); }
.esp-cel b { font-size: 14px; }
.esp-cel small { font-size: 11px; color: var(--suave); }
.esp-cel small.preco { color: var(--texto); font-variant-numeric: tabular-nums; }
.esp-cel.sit-disponivel { border-left-color: var(--entrada); background-color: #f4fbf7; }
.esp-cel.sit-reservada { border-left-color: var(--alerta); background-color: #fffaf0; }
.esp-cel.sit-vendida { border-left-color: var(--info); background-color: #f2f7fc; }
.esp-cel.sit-permutada { border-left-color: #6b3fa0; background-color: #f7f2fc; }
.esp-cel.sit-bloqueada { border-left-color: var(--saida); background-color: #fdf4f2; }
.esp-cel.sit-fora_venda { border-left-color: #9aa7b3; background-color: #f5f6f7; }
.kpi-sit .bolinha { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; background: #9aa7b3; }
.kpi-sit.sit-disponivel .bolinha { background: var(--entrada); }
.kpi-sit.sit-reservada .bolinha { background: var(--alerta); }
.kpi-sit.sit-vendida .bolinha { background: var(--info); }
.kpi-sit.sit-permutada .bolinha { background: #6b3fa0; }
.kpi-sit.sit-bloqueada .bolinha { background: var(--saida); }
.num-input { width: 130px; text-align: right; }

/* v0.48 — lupa de pesquisa nas listas e nas listas de escolha */
.lupa-tabela { display: flex; align-items: center; gap: 6px; margin: 0 0 6px; }
.lupa-tabela .lupa-icone { font-size: 13px; opacity: .7; }
.lupa-tabela-campo { flex: 0 1 320px; min-width: 160px; padding: 5px 8px; font-size: 13px; }
.lupa-contador { white-space: nowrap; font-size: 12px; color: var(--suave); }
input.lupa-sel { font-size: 12px; padding: 3px 6px; max-width: 220px; min-width: 110px; border-style: dashed; align-self: flex-start; }
input.lupa-sel.sem-resultado { border-color: var(--perigo, #c0392b); background: #fff5f4; }
.item-orc { display: flex; flex-direction: column; gap: 4px; }
.item-orc .check { font-size: 12px; color: var(--suave); }

/* v0.50 — formato da tela de trabalho: no formulário, o rótulo fica à esquerda (alinhado à direita) e o campo ocupa a
   linha; lupa e dicas ficam embaixo do campo; caixas de marcar alinhadas com os campos. */
.form { grid-template-columns: 1fr; gap: 8px; max-width: 980px; }
.form > label:not(.check) { display: grid; grid-template-columns: minmax(150px, 30%) auto 1fr; column-gap: 12px; row-gap: 3px; align-items: center;
  font-size: 13px; color: var(--texto); text-align: right; }
.form > label:not(.check) > * { grid-column: 2 / -1; text-align: left; }
.form > label:not(.check) > input.lupa-sel { grid-column: 2; width: 150px; min-width: 0; column-gap: 6px; }
.form > label:not(.check) > input.lupa-sel + select { grid-column: 3; grid-row: 1; }
.form > label.check { margin-left: calc(30% + 12px); }
.modal .form > label:not(.check) { grid-template-columns: minmax(130px, 34%) auto 1fr; }
.modal .form > label.check { margin-left: calc(34% + 12px); }
@media (max-width: 700px) {
  .form > label:not(.check) { grid-template-columns: 1fr; text-align: left; }
  .form > label:not(.check) > *, .form > label:not(.check) > input.lupa-sel, .form > label:not(.check) > input.lupa-sel + select { grid-column: 1; grid-row: auto; }
  .form > label.check, .modal .form > label.check { margin-left: 0; }
}

/* v0.51 — botões de ação da tela no rodapé, embaixo à direita */
.rodape-acoes { position: sticky; bottom: 0; z-index: 6; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px;
  max-width: 1500px; width: 100%; padding: 10px 14px; background: var(--painel); border: 1px solid var(--linha);
  border-radius: var(--raio) var(--raio) 0 0; box-shadow: 0 -2px 8px rgba(16, 24, 40, .08); }
.rodape-acoes.vazio, .barra-acoes.sem-itens { display: none; }
@media (max-width: 700px) { .rodape-acoes { margin: 16px -16px 0; border-radius: 0; justify-content: stretch; }
  .rodape-acoes .bt { flex: 1 1 auto; } }
.area-trabalho { display: flex; flex-direction: column; }
.area-trabalho > .conteudo { width: 100%; }
.area-trabalho:has(.rodape-acoes:not(.vazio)) { padding-bottom: 0; }
.area-trabalho > .rodape-acoes { margin-top: auto; }
.conteudo:has(+ .rodape-acoes:not(.vazio)) { padding-bottom: 18px; }

/* v0.57: extrato do cliente com filtros */
.grade-filtros { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px 14px; }
.grade-filtros label { display: flex; flex-direction: column; gap: 3px; font-size: 13px; }
.grade-opcoes { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; margin-top: 10px; }
.extrato-cab { margin-top: 18px; border-top: 2px solid var(--linha); padding-top: 8px; }
table.extrato-tabela { font-size: 12px; }
table.extrato-tabela td, table.extrato-tabela th { padding: 4px 6px; white-space: nowrap; }
table.extrato-tabela tr.atraso td { color: var(--saida); }
table.extrato-tabela tr.apagada td { opacity: .55; }
table.extrato-tabela tfoot td { font-weight: 600; background: var(--fundo); }
@media print { .extrato-cab { break-inside: avoid; } table.extrato-tabela { font-size: 9px; } }

/* v0.63 — diário de obra: fotos em grade */
.grade-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.foto-diario { margin: 0; border: 1px solid var(--linha, #dde3e8); border-radius: 6px; padding: 6px; background: #fff; }
.foto-diario img { width: 100%; height: 140px; object-fit: cover; border-radius: 4px; display: block; }
.foto-diario figcaption { font-size: 12px; margin-top: 4px; }
.linha-turno label, .linha-eq label, .linha-eqp label, .linha-ta label { display: inline-flex; align-items: center; gap: 4px; }



/* v0.68 — Gantt (planejamento de obras) */
.gantt-cartao { padding: 0; overflow: hidden; }
.gantt { display: grid; grid-template-columns: minmax(260px, 38%) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); height: 62vh; min-height: 360px; border-bottom: 1px solid var(--linha); }
.gantt-nomes { position: relative; overflow: hidden; border-right: 1px solid var(--linha); background: var(--painel); }
.gantt-nomes-cab { height: 42px; display: grid; grid-template-columns: 1fr 78px 78px; align-items: end; padding: 0 8px 6px; font-size: 12px; color: var(--suave); border-bottom: 1px solid var(--linha); box-sizing: border-box; }
.gantt-nomes-corpo { position: relative; will-change: transform; }
.gantt-nome { position: absolute; left: 0; right: 0; height: 26px; display: grid; grid-template-columns: 1fr 78px 78px; align-items: center; padding: 0 8px; font-size: 12.5px; border-bottom: 1px solid var(--linha); box-sizing: border-box; }
.gantt-nome-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gantt-nome.resumo { font-weight: 650; }
.gantt-nome.critica .gantt-nome-txt { color: var(--saida); }
.gantt-abre { border: 0; background: none; cursor: pointer; padding: 0 4px 0 0; color: var(--suave); font: inherit; }
.gantt-direita { display: grid; grid-template-rows: 42px minmax(0, 1fr); min-width: 0; min-height: 0; }
.gantt > * { min-height: 0; }
.gantt-cab { overflow: hidden; border-bottom: 1px solid var(--linha); background: var(--painel); }
.gantt-cab-linha { stroke: var(--linha); }
.gantt-cab-txt { font-size: 11px; fill: var(--suave); }
.gantt-cab-txt.peq { font-size: 10px; }
.gantt-area { overflow: auto; position: relative; background: var(--painel); outline: none; }
.gantt-svg { display: block; }
.gantt-nao-util { fill: var(--fundo); }
.gantt-hoje { stroke: var(--destaque); stroke-width: 2; }
.gantt-status { stroke: var(--info); stroke-width: 1.5; stroke-dasharray: 4 3; }
.gantt-rect { fill: var(--marca-2); cursor: grab; }
.gantt-barra.critica .gantt-rect { fill: var(--saida); }
.gantt-barra.concluida .gantt-rect { fill: var(--entrada); cursor: default; }
.gantt-pct { fill: rgba(0, 0, 0, .35); pointer-events: none; }
.gantt-alca { fill: transparent; cursor: ew-resize; }
.gantt-barra:hover .gantt-alca { fill: rgba(0, 0, 0, .25); }
.gantt-resumo { fill: var(--texto); }
.gantt-marco { fill: var(--texto); cursor: grab; }
.gantt-barra.critica .gantt-marco { fill: var(--saida); }
.gantt-barra.arrastando { opacity: .7; }
.gantt-seta { fill: none; stroke: var(--suave); stroke-width: 1.2; }
.gantt-seta.critica { stroke: var(--saida); }
.gantt-seta-cab { fill: var(--suave); }
.gantt-info { margin: 6px 0 0; }
.gantt-legenda { padding: 8px 12px; margin: 0; }
.gantt-legenda .leg { display: inline-block; width: 14px; height: 8px; border-radius: 2px; vertical-align: middle; }
.leg.normal { background: var(--marca-2); } .leg.critica { background: var(--saida); } .leg.concluida { background: var(--entrada); }
.leg.hoje { background: var(--destaque); width: 3px; height: 12px; } .leg.status { border-left: 2px dashed var(--info); width: 0; height: 12px; }
.alertas-plano { margin: 8px 0 0; padding-left: 0; list-style: none; font-size: 13px; }
.alertas-plano li { margin: 4px 0; }
@media (max-width: 760px) { .gantt { grid-template-columns: 150px 1fr; } .gantt-nomes-cab, .gantt-nome { grid-template-columns: 1fr; } .gantt-nome span:not(.gantt-nome-txt), .gantt-nomes-cab span:not(:first-child) { display: none; } }

/* v0.69 — Linha de balanço */
.lob-area { overflow-x: auto; }
.lob-svg { display: block; }
.lob-grade { stroke: var(--linha); }
.lob-local { font-size: 12px; fill: var(--texto); }
.lob-mes { font-size: 11px; fill: var(--suave); }
.lob-banda { opacity: .14; }
.lob-linha { fill: none; stroke-width: 1.5; opacity: .8; }
.lob-rect { cursor: grab; }
.lob-tarefa.critica .lob-rect { stroke: var(--saida); stroke-width: 2; }
.lob-tarefa.concluida .lob-rect { opacity: .55; cursor: default; }
.lob-conflito { fill: var(--saida); opacity: .22; }
.lob-legenda { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; font-size: 13px; }
.lob-cor { display: inline-block; width: 14px; height: 10px; border-radius: 2px; vertical-align: middle; }
.lob-locais { max-height: 260px; overflow: auto; display: grid; gap: 2px; border: 1px solid var(--linha); border-radius: 8px; padding: 8px; }
.gantt-base { fill: var(--suave); opacity: .55; pointer-events: none; }

/* v0.72 — curva S */
.cs-caixa { position: relative; }
.curva-s { display: block; max-width: 100%; height: auto; }
.cs-grade { stroke: var(--linha); stroke-width: 1; }
.cs-eixo { font-size: 11px; fill: var(--suave); }
.cs-rotulo { font-size: 11px; fill: #1f2933; }
.cs-corte { stroke: var(--suave); stroke-dasharray: 3 3; }
.cs-cruz { stroke: var(--suave); stroke-width: 1; pointer-events: none; }
.cs-dica { position: absolute; top: 8px; background: #fff; border: 1px solid var(--linha); border-radius: 8px; padding: 8px 10px; font-size: 12px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .12); pointer-events: none; min-width: 210px; }
.cs-legenda { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; margin-bottom: 6px; }
.cs-marca { display: inline-block; width: 12px; height: 3px; border-radius: 2px; vertical-align: middle; }

/* v0.73/v0.74 — Lean */
.lean-celula { display: inline-block; width: 18px; height: 12px; border-radius: 3px; background: var(--linha); opacity: .35; }
.lean-celula.ativa { background: #1baf7a; opacity: 1; }
.lean-celula.bloqueada { background: #e34948; opacity: 1; }
.kanban { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.kanban-coluna { background: #f6f8fa; border-radius: 10px; padding: 8px; min-height: 80px; }
.kanban-coluna h3 { margin: 4px 4px 8px; }
.kanban-cartao { background: #fff; border: 1px solid var(--linha); border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; display: grid; gap: 4px; font-size: 13px; }
.kanban-cartao.vencida { border-color: #e34948; }
.kanban-cartao .acoes-linha { display: flex; flex-wrap: wrap; gap: 4px; }
.lean-barra { display: inline-block; height: 10px; border-radius: 3px; background: #eb6834; }
.ppc-grafico { display: block; max-width: 100%; height: auto; }
.alerta-avanco, .alerta-va { margin: 6px 0; }
@media (max-width: 900px) { .kanban { grid-template-columns: 1fr; } }
