/* Portal de Formas — Arete. CSS mínimo, contraste WCAG AA verificado.
 *
 * Paleta base (todas testadas contra o fundo em que são usadas):
 *   texto principal  #1a1a1a sobre #ffffff  -> 18.1:1  (AA/AAA)
 *   texto secundário #4b5563 sobre #ffffff  ->  7.6:1  (AA/AAA)
 *   link/ação        #1d4ed8 sobre #ffffff  ->  6.3:1  (AA)
 *   badge cert.      #ffffff sobre #1e5631  ->  8.6:1  (AA) — do handoff §3
 *   badge beta       #ffffff sobre #8a1f0b  ->  8.9:1  (AA) — do handoff §3
 *   faixa erro       #7f1d1d sobre #fee2e2  ->  8.2:1  (AA)
 * Nenhum estado depende só de cor: todos carregam ícone + texto (§3.1, §6).
 */

/* [FIX 2026-07-07] atributo `hidden` tem a mesma especificidade de uma
   classe (.cab-grid, .painel-3 etc); quando essa classe seta display:grid/
   flex, ela silenciosamente vence o `[hidden]{display:none}` do UA
   stylesheet (origem de cascata mais baixa, perde até em empate de
   especificidade) — achado ao vivo: form.cab-grid[hidden] continuava visível.
   !important garante que hidden SEMPRE esconde, não importa a classe. */
[hidden] { display: none !important; }

/* [novo, a pedido do dono] some com a scrollbar cinza padrão do SO nos
   painéis escuros — continuam roláveis (mouse/trackpad), só sem a barra
   visível o tempo todo. */
.sidebar, .painel-2, .painel-3 {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Edge/IE legado */
}
.sidebar::-webkit-scrollbar,
.painel-2::-webkit-scrollbar,
.painel-3::-webkit-scrollbar {
  display: none; /* Chrome/Edge/Safari */
}

:root {
  --fg: #1a1a1a;
  --fg-muted: #4b5563;
  --bg: #ffffff;
  --bg-soft: #f3f4f6;
  --border: #d1d5db;
  --link: #1d4ed8;
  --focus: #1d4ed8;

  --cert-bg: #1e5631;
  --beta-bg: #8a1f0b;
  --badge-fg: #ffffff;

  --st-cinza: #374151;   /* aguardando ingestão (4.5:1+ em bg-soft) */
  --st-azul: #1d4ed8;    /* processando */
  --st-ambar: #92400e;   /* aguardando triagem (7.0:1 em branco) */
  --st-verde: #15803d;   /* pronta */
  --st-verde-esc: #166534;
  --st-vermelho: #b91c1c;/* erro */
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--fg);
  background: var(--bg-soft);
  line-height: 1.5;
}

a { color: var(--link); }

/* ---- foco visível AA (contraste >= 3:1, nunca removido) ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
  border-radius: 2px;
}

/* ---- layout shell: sidebar + área principal (2026-07-06 — antes só header) ---- */
.shell {
  display: flex;
  min-height: 100vh;
  --portal-sidebar-width: 280px;
}

.sidebar {
  width: 280px;
  flex: 0 0 280px;
  background: #111827;
  color: #e5e7eb;
  display: flex;
  flex-direction: column;
  padding: 18px 14px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}
.sidebar .brand {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-weight: 700;
  font-size: 1.02rem;
  text-decoration: none;
  padding: 6px 8px 18px;
  border-bottom: 1px solid #1f2937;
  margin-bottom: 12px;
}
.brand-mark { color: #60a5fa; font-size: 1.1rem; }

.sidebar-collapse-toggle {
  position: fixed;
  top: 10px;
  left: var(--portal-sidebar-width);
  z-index: 1200;
  display: grid;
  place-items: center;
  width: 28px;
  height: 32px;
  padding: 0;
  transform: translateX(-50%);
  color: #fff;
  background: #1d4ed8;
  border: 1px solid #60a5fa !important;
  border-radius: 7px;
  box-shadow: 0 3px 12px rgba(2, 6, 23, .32);
  font-size: 1.2rem;
  font-weight: 800;
  line-height: 1;
  transition: left .18s ease, transform .18s ease, background .15s ease;
}
.sidebar-collapse-toggle:hover,
.sidebar-collapse-toggle:focus-visible { background: #2563eb; }
.sidebar,
.area-principal { transition: width .18s ease, flex-basis .18s ease; }
body.sidebar-collapsed .sidebar {
  width: 0 !important;
  flex-basis: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  visibility: hidden;
  pointer-events: none;
}
body.sidebar-collapsed .sidebar-collapse-toggle {
  left: 0;
  transform: none;
  border-radius: 0 7px 7px 0;
}

.nav-lista { list-style: none; margin: 0; padding: 0; flex: 1; }
.nav-lista li { margin-bottom: 2px; }
.nav-lista a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #cbd5e1;
  text-decoration: none;
  padding: 10px 12px;
  border-radius: 6px;
  font-size: .94rem;
  font-weight: 500;
}
.nav-lista a:hover { background: #1f2937; color: #fff; }
.nav-lista a.ativo { background: #1d4ed8; color: #fff; }

/* [revertido v5, achado ao vivo com o dono] a navegação da obra (lista de
   obras + Triagem da obra atual) mora AGORA dentro da própria sidebar
   global, entre "Obras" e "Status Arete" (bloco sidebar_obras_extra em
   base.html/obra_detalhe.html) — não mais numa coluna .obras-strip
   separada, que antes "ficava à direita" da sidebar em vez de fazer parte
   dela mesma. */
.sidebar-obras-arvore { margin: 2px 0; }
.arvore-obras-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.arvore-obra-atual { display: flex; flex-direction: column; gap: 2px; }
.arvore-triagem-titulo {
  font-weight: 600;
  font-size: .78rem;
  color: #9ca3af;
  padding: 8px 10px 2px;
}
.arvore-obra-atual .n1-lista-itens {
  flex: none;
  width: 100%;
  border: none;
  background: transparent;
  padding: 0;
  max-height: none;
  overflow: visible;
}

.nav-rodape {
  border-top: 1px solid #1f2937;
  padding-top: 12px;
  margin-top: 12px;
}
.nav-rodape .who { display: flex; flex-direction: column; margin-bottom: 10px; }
.nav-rodape .who-nome { color: #fff; font-weight: 600; font-size: .92rem; }
.nav-rodape .who-papel { color: #9ca3af; font-size: .78rem; }
.nav-rodape form { margin: 0; }
.nav-rodape .btn-logout { width: 100%; }

.nav-icone-compacto { display: none; }

.btn-logout {
  background: #374151;
  color: #fff;
  border: 1px solid #4b5563;
  padding: 8px 12px;
  border-radius: 5px;
  cursor: pointer;
  font-size: .85rem;
}
.btn-logout:hover { background: #4b5563; }

.area-principal { flex: 1; min-width: 0; }

/* ---- conteúdo ---- */
main.conteudo {
  max-width: 1040px;
  margin: 0 auto;
  padding: 28px 32px 60px;
}

h1 { font-size: 1.5rem; margin: 0 0 4px; }
h2 { font-size: 1.15rem; margin: 24px 0 8px; }
.subtitulo { color: var(--fg-muted); margin: 0 0 20px; }

/* ---- botões ---- */
.btn {
  display: inline-block;
  background: var(--link);
  color: #fff;
  border: none;
  padding: 10px 18px;
  border-radius: 5px;
  font-size: 1rem;
  cursor: pointer;
  text-decoration: none;
}
.btn:hover { background: #1741b6; }
.btn[disabled], .btn.disabled {
  background: #9ca3af;
  cursor: not-allowed;
  color: #f3f4f6;
}
.btn-sec {
  background: #fff;
  color: var(--link);
  border: 1px solid var(--link);
}
.btn-sec:hover { background: #eff3ff; }

/* [novo, a pedido do dono] Validar/Invalidar recorte — nunca só cor: o botão
   ativo também troca de texto/ícone real (✔/✖ já fazem parte do label). */
#recorte-invalidar-btn { border-color: var(--st-vermelho); color: var(--st-vermelho); }
#recorte-invalidar-btn:hover { background: #fef2f2; }
.recorte-validacao-btn.ativo#recorte-validar-btn { background: var(--st-verde); border-color: var(--st-verde); color: #fff; }
.recorte-validacao-btn.ativo#recorte-invalidar-btn { background: var(--st-vermelho); border-color: var(--st-vermelho); color: #fff; }

/* [novo, a pedido do dono] Excluir — sempre vermelho solido (nao e' um
   estado que alterna feito Validar/Invalidar, e' uma acao destrutiva de
   verdade: apaga o .dxf do disco pra abrir espaco pro Modo Recorte Manual). */
#recorte-excluir-btn { background: var(--st-vermelho); border-color: var(--st-vermelho); color: #fff; }
#recorte-excluir-btn:hover { background: #b91c1c; }

/* ---- cartão "enviar obra" (2026-07-06 — onde começar, sem isso a tela era só lista vazia) ---- */
.upload-card {
  background: linear-gradient(135deg, #eff6ff, #f8fafc);
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  padding: 20px 22px;
  margin-bottom: 22px;
}
.upload-card h2 { margin: 0 0 6px; font-size: 1.15rem; }
.upload-card .passos {
  margin: 12px 0 16px;
  padding-left: 20px;
  color: var(--fg-muted);
  font-size: .92rem;
}
.upload-card .passos li { margin-bottom: 4px; }
.upload-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.upload-actions .status-verificar {
  font-size: .86rem;
  color: var(--fg-muted);
}

/* ---- área de arrastar-e-soltar (2026-07-06 — upload direto pelo portal) ---- */
.upload-drop {
  background: #f8fafc;
  border: 1.5px dashed #93c5fd;
  border-radius: 10px;
  padding: 20px 18px;
  text-align: center;
  margin: 0;
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.upload-drop-ativo {
  border-color: var(--link);
  background: #eff6ff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}
.upload-drop-texto { margin: 0 0 4px; font-size: .95rem; color: #0f172a; }

/* Primeiro acesso após o upload rápido de um pavimento. */
.obra-onboarding {
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid #93c5fd;
  border-radius: 10px;
  background: linear-gradient(135deg, #eff6ff 0%, #f8fbff 100%);
}
.obra-onboarding-head h2 { margin: 2px 0 5px; font-size: 1.05rem; color: #0f172a; }
.obra-onboarding-head p { margin: 0; color: #475569; font-size: .84rem; }
.obra-onboarding-kicker {
  display: inline-block;
  color: #1d4ed8;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.obra-onboarding-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0;
  padding: 0;
  list-style: none;
}
.obra-onboarding-steps li {
  display: flex;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #fff;
}
.obra-onboarding-steps li.is-current { border-color: #2563eb; box-shadow: inset 0 0 0 1px #2563eb; }
.obra-onboarding-steps li.is-skipped { border-color: #86efac; background: #f0fdf4; }
.obra-onboarding-num {
  display: grid;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: .72rem;
  font-weight: 800;
}
.obra-onboarding-steps .is-skipped .obra-onboarding-num { background: #16a34a; }
.obra-onboarding-steps strong,
.obra-onboarding-steps span { display: block; }
.obra-onboarding-steps strong { color: #0f172a; font-size: .78rem; }
.obra-onboarding-steps div > span { margin-top: 2px; color: #64748b; font-size: .7rem; line-height: 1.35; }
.obra-onboarding-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.obra-onboarding #acao-resultado { margin-top: 10px; }
@media (max-width: 760px) {
  .obra-onboarding-steps { grid-template-columns: 1fr; }
}

/* ---- página obra / documentos (harmonização 2026-07-31) ---- */
/* Cabeçalho da obra: 1 bloco compacto (menos ruído no topo) */
.obra-page-header {
  padding: 14px 28px 10px !important;
  border-bottom: 1px solid #eef2f7;
  background: #fff;
}
.obra-page-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.02em;
  color: #0f172a;
  line-height: 1.25;
}
.obra-page-desc { display: none; } /* descrição longa some do topo */
.obra-page-meta {
  margin: 2px 0 0 !important;
  font-size: .78rem;
  color: #94a3b8;
  line-height: 1.3;
}
.obra-page-code {
  margin: 4px 0 0 !important;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: .75rem;
  color: #64748b;
  line-height: 1.3;
}
.obra-page-code strong { color: #334155; font-weight: 600; }

/* Detalhe de recorte (torre/detalhes) — chrome mínimo */
.recorte-top {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px 16px;
  margin: 0 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #eef2f7;
}
.recorte-top-main { min-width: 0; flex: 1; }
.recorte-title {
  margin: 0 0 6px;
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
}
.recorte-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.recorte-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: .7rem;
  font-weight: 600;
  color: #475569;
}
.recorte-chip-pav { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.recorte-codes {
  margin: 0 0 10px;
  font-size: .78rem;
  color: #64748b;
}
.recorte-codes summary {
  cursor: pointer;
  user-select: none;
  font-weight: 600;
  font-size: .74rem;
  color: #64748b;
  list-style: none;
}
.recorte-codes summary::-webkit-details-marker { display: none; }
.recorte-codes summary::before { content: '▸ '; color: #94a3b8; }
.recorte-codes[open] summary::before { content: '▾ '; }
.recorte-codes-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
  margin-top: 8px;
  padding: 8px 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}
.recorte-viewer-host { margin-top: 4px; }
.recorte-status-msg:empty { display: none; }

/* Criar item SA no estrutural limpo — Proposta 2: <details> fechado por
   padrão (abre só quem for desenhar), máximo de SVG visível abaixo. */
.criar-item-coll {
  margin: 0 0 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}
.criar-item-coll summary {
  cursor: pointer;
  user-select: none;
  padding: 10px 12px;
  font-size: .85rem;
  font-weight: 700;
  color: #0f172a;
  list-style: none;
}
.criar-item-coll summary::-webkit-details-marker { display: none; }
.criar-item-coll summary::before { content: '▸ '; color: #94a3b8; }
.criar-item-coll[open] summary::before { content: '▾ '; }
.criar-item-coll summary .meta { font-weight: 500; margin-left: 2px; }
.criar-item-body {
  padding: 0 12px 12px;
}
.criar-item-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.criar-item-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .8rem;
  font-weight: 600;
  color: #334155;
  cursor: pointer;
  white-space: nowrap;
}
/* ORTHO (F8) — trava o traço a 0°/90°; chip minúsculo e discreto, do mesmo
   porte dos badges .recorte-chip — não é uma ação primária como Criar item. */
.criar-item-ortho-btn {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  color: #64748b;
  font: inherit;
  font-size: .68rem;
  font-weight: 600;
  line-height: 1.6;
  white-space: nowrap;
  cursor: pointer;
}
.criar-item-ortho-btn:hover { background: #e2e8f0; }
.criar-item-ortho-btn kbd {
  font: inherit;
  font-size: .62rem;
  font-weight: 700;
  padding: 0 3px;
  border-radius: 3px;
  background: rgba(15, 23, 42, .07);
  color: inherit;
}
.criar-item-ortho-btn[aria-pressed="true"] {
  background: #dcfce7;
  border-color: #86efac;
  color: #166534;
}
.criar-item-ortho-btn[aria-pressed="true"] kbd {
  background: rgba(255, 255, 255, .55);
}
.criar-item-row select,
.criar-item-row input[type="text"] {
  font: inherit;
  font-size: .8rem;
  padding: 6px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
  min-width: 0;
}
.criar-item-row select { max-width: 160px; }
.criar-item-row input[type="text"] { width: 110px; }
.criar-item-seg-wrap {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
}
.criar-item-seg-wrap[hidden] { display: none !important; }
.criar-item-seg-label {
  font-size: .72rem;
  font-weight: 700;
  color: #475569;
  letter-spacing: .04em;
}
#criar-item-segmento {
  max-width: 128px;
  min-width: 96px;
}
.criar-item-seg-livre {
  width: 64px !important;
  max-width: 64px;
}
.criar-item-seg-info {
  margin: 6px 0 0;
  font-size: .72rem;
  color: #0f766e;
  font-weight: 600;
}
.criar-item-seg-lista {
  margin: 8px 0 0;
  padding: 8px 10px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.criar-item-seg-lista[hidden] { display: none !important; }
.criar-item-seg-lista-title {
  font-size: .68rem;
  font-weight: 700;
  color: #475569;
  letter-spacing: .02em;
  margin-bottom: 2px;
}
.criar-item-seg-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.criar-item-seg-row-lab {
  font-size: .75rem;
  color: #0f172a;
  min-width: 7.5rem;
  font-weight: 600;
}
.criar-item-seg-row-sel {
  font: inherit;
  font-size: .78rem;
  padding: 4px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  min-width: 7rem;
}
.criar-item-seg-row-del {
  padding: 2px 8px !important;
  font-size: .75rem !important;
  line-height: 1.2;
}
.criar-item-hint { margin: 8px 0 0; font-size: .72rem; color: #64748b; }
#criar-item-status:empty { display: none; }
#criar-item-status { display: block; margin-top: 6px; color: #1d4ed8; font-weight: 600; }
.crop-ui-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  padding: 8px 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: .8rem;
}
.crop-ui-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  cursor: pointer;
  color: #334155;
}

/* Destaques por classe (viewer → page torre limpa) */
.destaque-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin: 0 0 10px;
  padding: 8px 10px;
  background: #0f172a;
  border: 1px solid #1e293b;
  border-radius: 10px;
  color: #e2e8f0;
}
.destaque-bar-label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #94a3b8;
  margin-right: 4px;
}
.destaque-botoes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.destaque-btn {
  font-size: .75rem !important;
  padding: 4px 9px !important;
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  color: #e2e8f0 !important;
}
.destaque-btn.on {
  border-color: transparent !important;
  font-weight: 700;
}
.destaque-nomes {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .74rem;
  color: #94a3b8;
  margin-left: 4px;
  cursor: pointer;
}
.destaque-fundo { position: absolute; inset: 0; }
.destaque-overlay { z-index: 2; }
.zoom-pan-viewport .destaque-fundo svg {
  width: 100%;
  height: 100%;
}
/* Estrutural (fundo): linhas finas em QUALQUER zoom — igual aos vínculos.
   NÃO aplicar em .destaque-overlay nem em .poly-draw-layer (desenho do usuário). */
.zoom-pan-viewport svg[data-struct-thin="1"] :is(path, line, polyline, polygon) {
  vector-effect: non-scaling-stroke !important;
  stroke-width: 0.55px !important;
  stroke-linecap: butt !important;
  stroke-linejoin: miter !important;
}
/* Desenho manual: JS define stroke em px (!important). Não forçar 0.55px do CAD. */
.zoom-pan-viewport svg .poly-draw-layer path,
.zoom-pan-viewport svg .poly-draw-layer line,
.zoom-pan-viewport svg .poly-draw-layer polyline {
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
}
.zoom-pan-viewport svg .poly-draw-layer circle {
  /* r em unidades user; fill sólido — OSNAP verde / pontos de seleção */
}
.criar-item-hint { line-height: 1.35; max-width: 52rem; }
.osnap-mark { pointer-events: none; }
.n1-detalhe .recorte-top { margin-top: 0; }
/* esconde dropzone/cabeçalho se ainda forem injetados no detalhe de recorte */
#docs-detalhe > #docs-cabecalho-slot:empty,
#docs-detalhe > #docs-intro-slot:empty { display: none; }
/* ---- Modo obra (lista de pavimentos) vs pavimento selecionado ----
   Ficha + documentos da obra só no modo pavs; com pavimento aberto some. */
body.obra-mode-pavimento #obra-ficha-docs { display: none !important; }
body.obra-mode-pavs #obra-ficha-docs { display: block; }
#obra-ficha-docs { display: block; }

/* Ficha da obra — proposta 1 Hero escuro (2026-08) */
.obra-ficha-hero {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .06);
  margin-bottom: 14px;
  background: #fff;
  overflow: hidden;
}
.obra-ficha-hero-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 18px 20px 16px;
  background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 55%, #2563eb 120%);
  color: #fff;
}
.obra-ficha-hero-top-text { min-width: 0; }
.obra-ficha-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .28);
  color: #e0e7ff;
  font-size: .65rem;
  font-weight: 750;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.obra-ficha-hero-title {
  margin: 0 0 4px;
  font-size: 1.28rem;
  font-weight: 750;
  letter-spacing: -.02em;
  color: #fff;
  line-height: 1.25;
  word-break: break-word;
}
.obra-ficha-hero-sub {
  margin: 0;
  font-size: .8rem;
  color: #bfdbfe;
  line-height: 1.35;
}
.obra-ficha-hero-edit {
  flex: 0 0 auto;
  background: rgba(255, 255, 255, .12) !important;
  border: 1px solid rgba(255, 255, 255, .35) !important;
  color: #fff !important;
  font-weight: 650;
}
.obra-ficha-hero-edit:hover {
  background: rgba(255, 255, 255, .22) !important;
}
.obra-ficha-hero-body {
  padding: 16px 18px 18px;
}
.obra-ficha-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.obra-ficha-chip {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 132px;
  flex: 1 1 140px;
  max-width: 280px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}
.obra-ficha-chip-lab {
  font-size: .66rem;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #94a3b8;
}
.obra-ficha-chip-val {
  font-size: .92rem;
  font-weight: 650;
  color: #0f172a;
  word-break: break-word;
}
.obra-ficha-chip-val.is-empty,
.obra-ficha-note-val.is-empty {
  font-weight: 500;
  color: #94a3b8;
}
.obra-ficha-notes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 640px) {
  .obra-ficha-notes { grid-template-columns: 1fr; }
  .obra-ficha-chip { max-width: none; }
}
.obra-ficha-note {
  padding: 12px 14px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #eef2f7;
  min-height: 72px;
}
.obra-ficha-note-val {
  margin: 6px 0 0;
  font-size: .9rem;
  color: #1e293b;
  line-height: 1.45;
  word-break: break-word;
  white-space: pre-wrap;
}
.obra-ficha-form {
  padding: 16px 18px 8px;
  border-top: 1px solid #eef2f7;
  background: #fafbfc;
}
.obra-ficha-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 14px;
}
@media (max-width: 640px) {
  .obra-ficha-form-grid { grid-template-columns: 1fr; }
}
.obra-ficha-form-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: .76rem;
  font-weight: 650;
  color: #475569;
}
.obra-ficha-form-grid input,
.obra-ficha-form-grid textarea {
  font: inherit;
  font-weight: 400;
  font-size: .9rem;
  padding: 8px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
}
.obra-ficha-form-grid input:focus,
.obra-ficha-form-grid textarea:focus {
  outline: none;
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}
.obra-ficha-form-wide { grid-column: 1 / -1; }
.obra-ficha-form-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  padding-bottom: 8px;
}
.obra-ficha-resultado {
  margin: 0;
  padding: 0 18px 12px;
  min-height: 1.2em;
}
/* legado (outros cards / docs) */
.obra-card-title {
  margin: 0;
  font-size: 1.08rem;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -.015em;
}
.obra-card-sub {
  margin: 4px 0 0;
  font-size: .78rem;
  color: #64748b;
  line-height: 1.35;
}

.obra-docs-panel {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  padding: 14px 16px 16px;
  margin-bottom: 16px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
}
.obra-ordem-panel {
  border: 1px solid #dbe4f0; border-radius: 14px; background: #fff;
  padding: 14px 16px; margin-bottom: 16px;
}
.obra-ordem-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.obra-ordem-head h2 { font-size: 1rem; margin: 0; }
.obra-ordem-head span { color: #64748b; font-size: .75rem; }
.obra-ordem-panel .docs-lista-scroll { max-height: 350px; }
.obra-ordem-panel td input[type=number] { width: 58px; margin-left: 4px; }
.obra-ordem-panel td button { margin-right: 3px; min-width: 26px; }
.obra-ordem-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.obra-ordem-actions input { flex: 1; min-width: 170px; }
.obra-ordem-documento { max-width: 230px; overflow-wrap: anywhere; line-height: 1.3; }
.obra-ordem-documento + .obra-ordem-documento { margin-top: 4px; }
#docs-intro .obra-ordem-panel { border: 0; border-radius: 0; padding: 0; margin: 0; box-shadow: none; }
#docs-intro .obra-ordem-panel .docs-lista-tabela { min-width: 700px; }
#docs-documentos-conteudo[hidden], #obra-ordem-panel[hidden] { display: none !important; }
.obra-docs-head { margin-bottom: 10px; }
.obra-docs-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}
.obra-docs-title-row .obra-card-title { margin: 0; }
.obra-docs-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-left: auto; }
.obra-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: .68rem;
  font-weight: 600;
  color: #64748b;
  text-transform: lowercase;
}
.btn-atualizar-lista {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  color: #334155;
  font: inherit;
  font-size: .75rem;
  font-weight: 650;
  cursor: pointer;
  transition: background .12s, border-color .12s;
}
.btn-atualizar-lista:hover {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.btn-atualizar-lista:disabled { opacity: .6; cursor: wait; }

/* Abas Documentos: PDF / DXF / Fotos / DWG */
.docs-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0 0 12px;
  padding: 3px;
  border-radius: 10px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}
.docs-tab-btn {
  flex: 1 1 auto;
  min-width: 72px;
  padding: 7px 10px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #475569;
  font: inherit;
  font-size: .8rem;
  font-weight: 650;
  cursor: pointer;
  transition: background .12s, color .12s, box-shadow .12s;
}
.docs-tab-btn:hover { color: #0f172a; background: rgba(255,255,255,.55); }
.docs-tab-btn.ativo {
  background: #fff;
  color: #1d4ed8;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .08);
}
.docs-tab-count {
  display: inline-grid;
  place-items: center;
  min-width: 1.35em;
  margin-left: 4px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e2e8f0;
  font-size: .68rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: #475569;
}
.docs-tab-btn.ativo .docs-tab-count {
  background: #dbeafe;
  color: #1e40af;
}

.docs-lista-wrap {
  margin-bottom: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.docs-lista-scroll {
  max-height: 220px;
  overflow: auto;
}
.docs-lista-tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
  margin: 0;
}
.docs-lista-tabela thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8fafc;
  font-size: .66rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #64748b;
  font-weight: 700;
  border-bottom: 1px solid #e2e8f0;
  padding: 7px 10px;
  text-align: left;
}
.docs-lista-tabela td {
  padding: 6px 10px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}
.docs-lista-tabela tr:last-child td { border-bottom: none; }
.docs-lista-tabela tr.docs-row {
  cursor: pointer;
  transition: background .1s;
}
.docs-lista-tabela tr.docs-row:hover { background: #f8fafc; }
.docs-lista-tabela tr.docs-row.ativo {
  background: #eff6ff;
  outline: 1px solid #bfdbfe;
  outline-offset: -1px;
}
.docs-lista-tabela .doc-nome {
  font-weight: 600;
  color: #0f172a;
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.docs-lista-tabela .doc-meta {
  font-size: .72rem;
  color: #64748b;
}
.docs-lista-tabela select.doc-classe-sel {
  font: inherit;
  font-size: .78rem;
  padding: 4px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
  max-width: 120px;
}
.docs-lista-tabela select.doc-classe-sel:focus {
  outline: none;
  border-color: #60a5fa;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, .12);
}
.docs-lista-tabela .doc-pavimento-editor { min-width: 135px; }
.docs-lista-tabela .doc-pavimento-sel {
  width: 100%; min-width: 128px; max-width: 190px; padding: 4px 6px;
  border: 1px solid #cbd5e1; border-radius: 6px; background: #fff;
  color: #0f172a; font: inherit; font-size: .76rem;
}
.docs-lista-tabela .doc-pavimento-sel:focus {
  outline: none; border-color: #60a5fa; box-shadow: 0 0 0 2px rgba(37, 99, 235, .12);
}
.docs-lista-tabela .doc-pavimento-extra:not([hidden]) {
  display: flex; align-items: end; flex-wrap: wrap; gap: 4px; margin-top: 5px;
}
.docs-lista-tabela .doc-pavimento-extra label { font-size: .68rem; color: #475569; }
.docs-lista-tabela .doc-pavimento-extra input {
  display: block; width: 45px; padding: 3px 4px; border: 1px solid #cbd5e1; border-radius: 4px;
}
.docs-lista-tabela .doc-pavimento-novo { width: 145px !important; }
.docs-lista-tabela .doc-pavimento-aplicar { padding: 4px 6px; font-size: .69rem; }
.docs-lista-tabela .doc-pavimento-status { display: block; font-size: .68rem; color: #475569; }
.docs-lista-empty {
  margin: 0;
  padding: 18px 12px;
  text-align: center;
  color: #94a3b8;
  font-size: .85rem;
}

/* Viewer dinâmico (PDF / DXF / foto) sob a lista */
.docs-viewer-panel {
  margin: 0 0 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fafbfc;
  min-height: 48px;
  overflow: hidden;
}
.docs-viewer-panel[hidden] { display: none !important; }
.docs-viewer-empty {
  margin: 0;
  padding: 16px;
  text-align: center;
  color: #94a3b8;
  font-size: .82rem;
}
.docs-viewer-panel iframe,
.docs-viewer-panel img {
  display: block;
  width: 100%;
  max-height: 62vh;
  border: 0;
  background: #fff;
}
.docs-viewer-panel .docs-dxf-host {
  width: 100%;
  max-height: 62vh;
  overflow: auto;
  background: #fff;
  padding: 6px;
}
.docs-viewer-panel .docs-dxf-host svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Converter DWG — só na aba DWG, discreto entre lista e drop */
.docs-dwg-convert-wrap {
  margin: 0 0 10px;
  padding: 0 2px;
}
.docs-dwg-convert-wrap[hidden] { display: none !important; }
.btn-converter-dwg-discreto {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 2px;
  border: none;
  background: none;
  color: #64748b;
  font: inherit;
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}
.btn-converter-dwg-discreto:hover { color: #1d4ed8; text-decoration: underline; }
.btn-converter-dwg-discreto:disabled { opacity: .55; cursor: wait; text-decoration: none; }

.obra-upload-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
}
.obra-upload-opts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px 14px;
  max-width: 280px;
}
.obra-upload-opts label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: .76rem;
  font-weight: 600;
  color: #475569;
}
.obra-upload-opts select,
.obra-upload-opts input {
  font: inherit;
  font-weight: 400;
  font-size: .86rem;
  padding: 7px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #fff;
  color: #0f172a;
}
.obra-upload-opts select:focus,
.obra-upload-opts input:focus {
  outline: none;
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

/* Só Triagem + Recortes como ação principal embaixo */
.obra-docs-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 4px;
}
.obra-action-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px 16px;
  border-radius: 10px;
  border: 1px solid transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background .12s, border-color .12s, box-shadow .12s, transform .08s;
}
.obra-action-btn:disabled {
  opacity: .65;
  cursor: wait;
}
.obra-action-btn:active:not(:disabled) { transform: translateY(1px); }
.obra-action-ico {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: .9rem;
  font-weight: 700;
}
.obra-action-txt {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.obra-action-title {
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.2;
}
.obra-action-sub {
  font-size: .7rem;
  font-weight: 500;
  opacity: .85;
  line-height: 1.2;
}
.obra-action-btn-pri {
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
  border-color: #1d4ed8;
  color: #fff;
  box-shadow: 0 1px 2px rgba(37, 99, 235, .25);
}
.obra-action-btn-pri .obra-action-ico {
  background: rgba(255, 255, 255, .18);
  color: #fff;
}
.obra-action-btn-pri .obra-action-sub { opacity: .9; }
.obra-action-btn-pri:hover:not(:disabled) {
  background: linear-gradient(180deg, #60a5fa 0%, #2563eb 100%);
  box-shadow: 0 2px 8px rgba(37, 99, 235, .35);
}
@media (max-width: 640px) {
  .obra-upload-opts { grid-template-columns: 1fr; max-width: none; }
  .obra-docs-chips { margin-left: 0; width: 100%; }
  .docs-tab-btn { min-width: 0; }
}
.btn-link {
  background: none;
  border: none;
  padding: 0;
  color: var(--link);
  text-decoration: underline;
  font-size: 1rem;
  cursor: pointer;
  font-family: inherit;
}
.upload-progresso { margin-bottom: 14px; }
.upload-progresso-barra {
  height: 8px;
  background: var(--bg-soft);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 6px;
}
#upload-barra-fill, #docs-barra-fill {
  height: 100%;
  width: 0;
  background: var(--link);
  transition: width .2s;
}

/* [novo, a pedido do dono] lista simples de DWGs (seção Documentos) — status
   "possui DXF" bem visível (nunca só cor: ícone + texto, mesma disciplina
   AA do resto do app). */
.dwgs-tabela { margin-bottom: 16px; }
.dwg-status { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; font-size: .8rem; }
.dwg-status-sim { color: var(--st-verde); }
.dwg-status-nao { color: var(--st-ambar); }

/* ---- documentos da obra (2026-07-06 — obra-como-container) ---- */
.docs-tabela { width: 100%; border-collapse: collapse; font-size: .9rem; }
.docs-tabela th, .docs-tabela td {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}
.docs-tabela select.doc-classe, .docs-tabela input.doc-pavimento {
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font: inherit;
  font-size: .86rem;
}
.docs-tabela input.doc-pavimento { width: 100px; }
.doc-status { font-size: .84rem; white-space: nowrap; }
.doc-status-classificado { color: var(--st-verde); }
.doc-status-revisar { color: var(--st-ambar); }
.doc-status-erro { color: var(--st-vermelho); }
.doc-status-pendente { color: var(--st-cinza); }

/* ---- card genérico ---- */
.card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 16px 18px;
  margin-bottom: 14px;
}
.card .meta { color: var(--fg-muted); font-size: .88rem; }

/* ---- cabeçalho do processamento + detalhe de doc (2026-07-07) ---- */
.cab-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px 20px;
  font-size: .88rem;
}
.cab-grid label { display: flex; flex-direction: column; gap: 4px; font-size: .82rem; font-weight: 600; color: var(--fg-muted); }
.cab-grid input, .cab-grid textarea {
  font: inherit; font-size: .88rem; font-weight: 400; color: var(--fg);
  border: 1px solid var(--border); border-radius: 6px; padding: 6px 8px;
}

/* ---- /app/status (tabela do STATUS.md renderizada via markdown) ---- */
.status-md table { border-collapse: collapse; width: 100%; font-size: .92rem; }
.status-md th, .status-md td {
  border: 1px solid var(--border); padding: 6px 10px; text-align: left;
}
.status-md th { background: #f3f4f6; }

/* ---- login ---- */
.login-box {
  max-width: 380px;
  margin: 48px auto;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 28px 26px;
}
.login-box .field { margin-bottom: 16px; }
.login-box label { display: block; font-weight: 600; margin-bottom: 6px; }
.login-box input {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 5px;
  font-size: 1rem;
}
.login-box .hint { color: var(--fg-muted); font-size: .82rem; margin-top: 16px; text-align: center; }

/* ---- faixas de estado (sempre ícone + texto, role=alert) ---- */
.faixa {
  padding: 10px 14px;
  border-radius: 6px;
  margin-bottom: 16px;
  font-weight: 600;
}
.faixa-erro { background: #fee2e2; color: #7f1d1d; border: 1px solid #fca5a5; }
.faixa-info { background: #dbeafe; color: #1e3a8a; border: 1px solid #93c5fd; }
.obra-engine-alert {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding-right: 48px;
}
.obra-engine-alert-content { display: grid; gap: 4px; line-height: 1.35; }
.obra-engine-alert-content span { font-weight: 500; }
.obra-engine-alert-close {
  position: absolute;
  top: 7px;
  right: 8px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(127, 29, 29, .25);
  border-radius: 6px;
  background: rgba(255, 255, 255, .48);
  color: inherit;
  font: 700 1.2rem/1 system-ui, sans-serif;
  cursor: pointer;
}
.obra-engine-alert-close:hover,
.obra-engine-alert-close:focus-visible { background: #fff; outline: 2px solid #b91c1c; outline-offset: 1px; }

.triagem-live {
  margin-top: 12px;
  padding: 14px 16px;
  border: 1px solid #93c5fd;
  border-radius: 9px;
  background: #eff6ff;
  color: #1e3a8a;
}
.triagem-live.is-done { border-color: #86efac; background: #f0fdf4; color: #166534; }
.triagem-live.is-error { border-color: #fca5a5; background: #fef2f2; color: #991b1b; }
.triagem-live-head, .triagem-live-times {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}
.triagem-live-head b { font-size: 1.05rem; white-space: nowrap; }
.triagem-live-head small { font-weight: 500; font-size: .72rem; }
.triagem-live-track {
  height: 9px;
  margin: 9px 0;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(30, 58, 138, .14);
}
.triagem-live-track i {
  display: block;
  height: 100%;
  min-width: 2px;
  border-radius: inherit;
  background: #2563eb;
  transition: width .5s ease;
}
.triagem-live.is-done .triagem-live-track i { background: #16a34a; }
.triagem-live.is-error .triagem-live-track i { background: #dc2626; }
.triagem-live-times { font-size: .8rem; }
.triagem-live p { margin: 8px 0 2px; font-weight: 600; }
.triagem-live > small { opacity: .78; }
.faixa-aviso { background: #fef3c7; color: #78350f; border: 1px solid #fcd34d; }

/* ---- StatusBadge (obra, §5) — ícone + texto + cor ---- */
.status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  font-size: .9rem;
}
.status-ingestao   { color: var(--st-cinza); }
.status-processando{ color: var(--st-azul); }
.status-triagem    { color: var(--st-ambar); }
.status-pronta     { color: var(--st-verde); }
.status-concluida  { color: var(--st-verde-esc); }
.status-erro       { color: var(--st-vermelho); }

/* ---- ClassBadge (cert/beta, §3) — nunca só cor: texto + ícone ---- */
.class-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 4px;
  font-weight: 700;
  font-size: .82rem;
  letter-spacing: .02em;
  color: var(--badge-fg);
}
.class-badge.cert { background: var(--cert-bg); }
.class-badge.beta { background: var(--beta-bg); }

/* ---- StepProgress (barra 6 passos, §detalhe) ---- */
.steps {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 12px;
}
.steps li { display: flex; align-items: center; }
.step {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 5px;
  font-size: .88rem;
  text-decoration: none;
  border: 2px solid transparent;
}
.step .num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  font-size: .78rem;
  font-weight: 700;
}
.step-feito { color: #14532d; }
.step-feito .num { background: var(--st-verde); color: #fff; }
.step-atual { color: #1e3a8a; border-color: var(--st-azul); background: #eff6ff; }
.step-atual .num { background: var(--st-azul); color: #fff; }
.step-bloq { color: #6b7280; cursor: not-allowed; }
.step-bloq .num { background: #e5e7eb; color: #6b7280; }
.steps .sep { color: var(--border); padding: 0 2px; }

/* ---- lista de fichas ---- */
.fichas-lista { list-style: none; padding: 0; margin: 0; }
.fichas-lista li {
  padding: 8px 0;
  border-bottom: 1px solid var(--bg-soft);
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

/* ---- ErrorMarker (reaproveitado de _error_marker_block, §4) ---- */
.error-marker {
  margin-top: 16px;
  border: 1px solid #e17055;
  border-radius: 6px;
  background: #fff7f3;
  padding: 12px 14px;
}
.error-marker .em-title { color: #b5471f; font-weight: 700; margin-bottom: 8px; }
.error-marker label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  color: #b5471f;
  font-weight: 700;
}
.error-marker input[type="checkbox"] { width: 18px; height: 18px; }
.error-marker textarea {
  width: 100%;
  min-height: 74px;
  margin-top: 8px;
  border: 1px solid #d1a08c;
  border-radius: 4px;
  padding: 8px;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: .85rem;
}
.error-marker .em-prov { color: var(--fg-muted); font-size: .78rem; margin-top: 8px; }
.error-marker .em-saved { color: var(--st-verde); font-size: .78rem; margin-top: 6px; }

/* ---- N5 tabela liberação ---- */
.n5-grid { width: 100%; border-collapse: collapse; margin-top: 8px; }
.n5-grid th, .n5-grid td {
  text-align: left;
  padding: 10px 8px;
  border-bottom: 1px solid var(--border);
  font-size: .92rem;
}
.n5-grid th { color: var(--fg-muted); font-weight: 600; }
.n5-aviso {
  background: #fff7ed;
  border: 2px solid #c2410c;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 18px;
}
.n5-aviso .t { font-weight: 700; color: #7c2d12; margin-bottom: 4px; }

/* ---- área de progresso do job (polling) ---- */
.job-panel {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 22px;
  text-align: center;
}
.spinner { font-size: 1.4rem; }

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.muted { color: var(--fg-muted); }
.stack > * + * { margin-top: 10px; }

/* ---- shell da obra: colunas em cascata estilo Miller columns (2026-07-07 v2) ----
   Achado com o dono (feedback direto no screenshot): v1 tinha uma FAIXA
   BRANCA entre a sidebar global e as colunas escuras, porque `main.conteudo`
   tem padding+max-width — as colunas ficavam "flutuando" no meio da página em
   vez de encostadas na sidebar, e só eram altas quanto o conteúdo (não a
   coluna inteira). Correção: `main.conteudo:has(.shell-obra)` zera o
   padding/max-width SÓ nesta página (:has() suportado no Chrome, navegador
   alvo), e a cadeia inteira de flex containers usa `align-items:stretch` +
   `flex:1` (não `flex-start`) pra cada coluna encher 100% da altura
   disponível com sua cor de fundo, não só a altura do próprio conteúdo. */
main.conteudo:has(.shell-obra) {
  max-width: none;
  padding: 0;
  min-height: calc(100vh - 0px);
}

.shell-obra { display: flex; gap: 0; align-items: stretch; min-height: 100vh; }

/* [FIX] achado comparando com o histórico recuperado: a regra base tinha
   ganhado `background: #1d4ed8` (o MESMO azul sólido do `.ativo`) — toda
   obra da lista ficava indistinguível da obra atualmente aberta. O pedido
   real (item 2/3 do histórico) era: obras NÃO selecionadas ganham uma caixa
   também (não só texto solto), só que num azul CLARO/sutil — diferente do
   azul sólido da obra ativa. */
.obras-strip-item {
  display: block;
  width: 100%;
  font: inherit;
  font-size: .8rem;
  padding: 8px 10px;
  border: none;
  border-radius: 6px;
  background: rgba(59, 130, 246, .16);
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #bfdbfe;
  text-decoration: none;
  cursor: pointer;
}
.obras-strip-item:hover { background: rgba(59, 130, 246, .28); color: #fff; }
.obras-strip-item.ativo { background: #1d4ed8; color: #fff; }

.painel-obra {
  flex: 1;
  min-width: 0;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.painel-obra-cabecalho { padding: 24px 28px 0; }
.painel-obra-corpo { padding: 0 28px 28px; flex: 1; display: flex; flex-direction: column; min-height: 0; }
.painel-obra-corpo > .conteudo-secao:not([hidden]) {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.aba-check { color: #4ade80; font-weight: 700; }

/* [revertido v5, achado ao vivo com o dono] painel 2 (substitui o antigo
   obras-strip): Recortes (árvore Pavimento→Tipo→Bruto→Torre, sempre aberta,
   aninhando pra baixo) + botões SA/N1, N3, N5 — clicar num desses expande
   as 9 classes aninhadas pra baixo, DENTRO deste mesmo painel (nunca uma
   coluna nova). Painel 3 (mais abaixo) só aparece quando uma classe é
   selecionada, com a lista de itens daquela classe. */
.painel-2 {
  flex: 0 0 280px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: #111827;
  color: #cbd5e1;
  border-right: 1px solid #1f2937;
  padding: 10px 8px;
  overflow-y: auto;
}
.painel2-secao { border-bottom: 1px solid #1f2937; padding-bottom: 8px; margin-bottom: 8px; }
.painel2-secao:last-child { border-bottom: none; margin-bottom: 0; }
.painel2-secao-titulo {
  font-weight: 600;
  font-size: .82rem;
  color: #e5e7eb;
  padding: 8px 10px 2px;
}
.painel2-tab-btn {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  padding: 9px 10px;
  font: inherit;
  font-weight: 600;
  font-size: .82rem;
  color: #9ca3af;
  cursor: pointer;
}
.painel2-tab-btn:hover { background: #1f2937; color: #fff; }
.painel2-tab-btn.ativo { background: #1d4ed8; color: #fff; }
.painel2-meta { font-size: .74rem; padding: 0 10px; margin: 4px 0; color: #9ca3af; }
.painel2-acao-btn {
  display: block;
  width: calc(100% - 4px);
  margin: 4px 2px 8px;
  text-align: center;
  font-size: .8rem;
  padding: 7px 10px;
}
.painel2-aninhado { padding: 2px 0 4px 10px; }

.painel-2 .n1-lista-itens {
  flex: none;
  width: 100%;
  border: none;
  background: transparent;
  padding: 0;
  max-height: none;
  overflow: visible;
}

/* painel 3 — só aparece quando uma classe (SA/N1 ou N3) é selecionada;
   mesma paleta escura, encostado sem gap no painel 2. */
.painel-3 {
  flex: 0 0 200px;
  display: flex;
  flex-direction: column;
  background: #111827;
  color: #cbd5e1;
  border-right: 1px solid #1f2937;
  padding: 10px 8px;
  overflow-y: auto;
}
.painel-3 .n1-lista-itens {
  flex: none;
  width: 100%;
  border: none;
  background: transparent;
  padding: 0;
  max-height: none;
  overflow: visible;
}

/* #docs-detalhe-painel/#recortes-detalhe-painel/#n1-detalhe-painel/
   #n3-detalhe-painel = painel claro de conteúdo à direita — só um visível
   por vez (.conteudo-secao), trocado conforme o que foi clicado em
   qualquer um dos 3 painéis escuros. */
#docs-detalhe-painel { display: flex; flex-direction: column; flex: 1; min-height: 0; }
#docs-detalhe-painel > .n1-detalhe { flex: 1; min-width: 0; }

/* [refinado, a pedido do dono: "mais vida e cor" + destaque no nome do
   pavimento, que é o que mais importa pra navegar a Triagem] fonte maior,
   negrito forte, branco quase puro, com uma faixa de destaque (barra
   colorida à esquerda + leve gradiente) — bem mais proeminente que o resto
   da lista, que é secundário. */
/* [FIX] prefixo `#docs-lista` só pra ganhar especificidade de
   `.n1-lista-cabecalho` (mesma classe base, definida mais abaixo no
   arquivo) — sem isso, cor/peso/tamanho da regra genérica venciam por
   ordem de cascata (as duas são seletor de 1 classe só). */
#docs-lista .docs-cabecalho-pavimento {
  font-size: .88rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: .01em;
  padding: 10px 10px 8px 12px;
  margin-top: 10px;
  border-left: 3px solid #3b82f6;
  background: linear-gradient(90deg, #1e3a8a, transparent 85%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
#docs-lista .docs-cabecalho-pavimento:first-child { margin-top: 2px; }

/* [novo, a pedido do dono] setinha de expandir/contrair (▶ fechado / ▼
   aberto) sempre a direita do nome do pavimento — o JS so' troca o
   caractere, o alinhamento fica por conta do flex acima. */
.pavimento-seta {
  flex: 0 0 auto;
  font-size: .7rem;
  opacity: .8;
}
#docs-lista .docs-cabecalho-tipo {
  padding-left: 20px;
  font-size: .66rem;
  color: #7dd3fc;
}
.docs-item { padding-left: 24px; cursor: grab; }
.docs-item:active { cursor: grabbing; }

/* [novo, a pedido do dono] Recortes (Torres Limpas/Detalhes e Convenções)
   aninhados debaixo do próprio Bruto que os gerou — 1 degrau a mais de
   indentação que o cabeçalho de tipo (Brutos/Detalhes/PDFs), pra ficar claro
   que são produtos exclusivos daquele documento, não do pavimento inteiro. */
.docs-recorte-subclasse { padding-left: 34px; font-size: .64rem; opacity: .9; }
.docs-recorte-item.docs-item { padding-left: 44px; }

/* [refinado, a pedido do dono: "pouco contraste entre elas" + "degradê:
   título mais escuro, itens mais claros"] 3 degraus de luminosidade por
   bloco de pavimento — título (mais escuro) → classe/tipo (meio) → item
   (mais claro) — igual pras 2 famílias de cor (par=azul, impar=roxo), bem
   mais afastadas uma da outra que antes pra não confundir qual pavimento é
   qual. */
#docs-lista li.pavimento-par { background: #1e3a5f; border-radius: 4px; }
#docs-lista li.pavimento-impar { background: #3d2359; border-radius: 4px; }

#docs-lista li.pavimento-par.docs-cabecalho-tipo { background: #16283f; border-radius: 4px; color: #7dd3fc; }
#docs-lista li.pavimento-impar.docs-cabecalho-tipo { background: #2a1740; border-radius: 4px; color: #d8b4fe; }
#docs-lista li.pavimento-par.docs-cabecalho-pavimento { border-left-color: #3b82f6; background: #0c1a2e; }
#docs-lista li.pavimento-impar.docs-cabecalho-pavimento { border-left-color: #a78bfa; background: #1a0e2e; }

/* [2026-07-07] cabeçalho de grupo vira zona de soltar (drag-and-drop) —
   feedback visual claro quando um item arrastado passa por cima. */
.docs-drop-alvo { transition: background-color .1s ease; }
.docs-drop-alvo.docs-drop-hover {
  background: rgba(29, 78, 216, .35);
  outline: 1px dashed #60a5fa;
  outline-offset: -1px;
}

.n1-lista-itens {
  flex: 0 0 190px;
  list-style: none;
  margin: 0;
  padding: 8px;
  overflow-y: auto;
  border: none;
  border-right: 1px solid #1f2937;
  border-radius: 0;
  background: #111827;
  color: #cbd5e1;
  /* hide scrollbar */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
}
.n1-lista-itens::-webkit-scrollbar {
  display: none; /* WebKit */
}
.n1-item-link {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  padding: 8px 10px;
  font-size: .82rem;
  cursor: pointer;
  color: #cbd5e1;
}
.n1-item-link:hover { background: #1f2937; color: #fff; }
.n1-item-link.ativo { background: #1d4ed8; color: #fff; }
.n1-detalhe { flex: 1; min-width: 0; min-height: 0; padding: 14px 18px; background: #fff; overflow-y: auto; }
/* Pan/zoom: SVG = viewBox (canônico FV); <img> = CSS scale só se bitmap */
.zoom-pan-viewport {
  position: relative;
  overflow: hidden;
  cursor: grab;
  user-select: none;
  background: #0a0a0a;
  border-radius: 8px;
  height: 60vh;
  max-height: 640px;
}
.zoom-pan-viewport.arrastando { cursor: grabbing; }
.zoom-pan-viewport img {
  display: block;
  max-width: 100%;
  max-height: 100%;
}
.zoom-pan-viewport svg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}
.zoom-pan-dica {
  font-size: .72rem;
  color: var(--fg-muted, #888);
  margin: 4px 0 0;
}
.n1-lista-cabecalho {
  padding: 8px 10px 4px;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #6b7280;
}

/* [2026-07-07] slot onde a intro (Cabeçalho do processamento / dropzone de
   Documentos) da Triagem é movida — passa a fazer parte da coluna de
   conteúdo, alinhada com o topo da lista, em vez de ficar acima empurrando
   tudo pra baixo. Recortes/SA-N1/N3 não precisam mais disso: os botões de
   ação (Rodar recortes/Rodar SA) ficam fixos no painel 2, perto da lista. */
#docs-cabecalho-slot:not(:empty),
#docs-intro-slot:not(:empty) {
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.n1-detalhe-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.n1-detalhe-corpo { display: flex; flex-direction: column; gap: 16px; }
.n1-campos { flex: 1 1 260px; min-width: 220px; }
.n1-campo {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid var(--border);
  font-size: .85rem;
}
.n1-campo-label { color: var(--fg-muted); font-weight: 600; }
.n1-campo-valor { text-align: right; white-space: pre-wrap; }
.n1-fotos { display: flex; flex-direction: column; gap: 12px; }
.n1-foto-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px;
  max-width: 100%;
}
.n1-foto-card h4 { margin: 0 0 6px; font-size: .78rem; color: var(--fg-muted); }
.n1-foto-card { width: 100%; max-width: 100%; }
.n1-foto-card svg { width: 100%; max-width: 100%; height: auto; max-height: 400px; display: block; }
.n1-foto-ausente { color: var(--fg-muted); font-size: .82rem; }

/* Pilar: uma aba governa a ficha e o viewer; QA fica sempre numa faixa
   separada abaixo e nunca se mistura aos campos N1/N3. */
.pillar-main-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 8px 8px 7px;
  margin: 0;
  border-bottom: 1px solid var(--border);
  background: #f8fafc;
  border-radius: 8px 8px 0 0;
}
#pillar-n1-subviewer.n1-tag-arete .zoom-pan-viewport { height: 560px; max-height: 560px; }
.pillar-main-tab {
  flex: 0 0 auto;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  color: #334155;
  padding: 7px 10px;
  font-size: .78rem;
  font-weight: 650;
  cursor: pointer;
}
.pillar-main-tab:hover { border-color: #2563eb; color: #1d4ed8; }
.pillar-main-tab.active { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
.pillar-n1-subtabs {
  display: flex;
  gap: 5px;
  overflow-x: auto;
  padding: 7px 8px;
  margin: 0 0 8px;
  border: 0;
  border-bottom: 1px solid #bfdbfe;
  border-radius: 0;
  background: #eff6ff;
}
.pillar-n1-subtab {
  flex: 0 0 auto;
  border: 1px solid #93c5fd;
  border-radius: 5px;
  background: #fff;
  color: #1e40af;
  padding: 6px 9px;
  font-size: .74rem;
  font-weight: 650;
  cursor: pointer;
}
.pillar-n1-subtab:hover { border-color: #2563eb; background: #dbeafe; }
.pillar-n1-subtab.active { background: #2563eb; border-color: #2563eb; color: #fff; }
#pillar-tab-fields { margin-bottom: 14px; }
.pillar-viewer-shell {
  margin-bottom: 14px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: #fff;
}
#pillar-tab-viewer { padding: 8px; }
#pillar-tab-viewer > .pillar-n1-subtabs { margin: -8px -8px 8px; }
#pillar-tab-viewer .n1-foto-card { border: 0; padding: 0; }
.pillar-n1-summary {
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}
.pillar-n1-summary > strong { display: block; margin-bottom: 9px; font-size: .82rem; }
.pillar-n1-summary > div {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 8px;
}
.pillar-n1-summary-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #f8fafc;
}
.pillar-n1-summary-field span { color: #64748b; font-size: .7rem; font-weight: 650; }
.pillar-n1-summary-field b { color: #0f172a; font-size: .82rem; }
.pillar-layer-empty {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 18px;
  border: 1px dashed #94a3b8;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
}
.pillar-layer-fields > strong { display: block; margin-bottom: 8px; }
.pillar-layer-fields pre {
  max-height: 340px;
  overflow: auto;
  margin: 0;
  padding: 12px;
  border-radius: 8px;
  background: #0f172a;
  color: #dbeafe;
  font-size: .75rem;
}
.pillar-qa-below {
  margin-top: 18px;
  padding: 14px;
  border-top: 3px solid #2563eb;
  border-radius: 8px;
  background: #f8fafc;
}
.pillar-qa-below > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.pillar-qa-below > div:first-child span { color: #64748b; font-size: .78rem; }
.pillar-qa-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.pillar-qa-status { padding: 10px; border: 1px solid #dbeafe; border-radius: 6px; background: #fff; font-size: .82rem; }
.pillar-qa-status.error { border-color: #fecaca; color: #b91c1c; }
.pillar-qa-result-head { display: flex; justify-content: space-between; gap: 12px; }
.pillar-qa-status p { margin: 7px 0; }
.pillar-qa-status small { color: #64748b; }

/* [FIX 2026-07-07] breakpoint desceu de 900px pra 640px (mobile de verdade)
   — achado ao vivo: em telas médias (640-900px) é melhor rolar
   horizontalmente (já funciona) do que um empilhamento incompleto. */
@media (max-width: 640px) {
  .shell-obra { flex-direction: column; }
  .painel-2, .painel-3 { flex-direction: row; width: 100%; max-height: none; overflow-x: auto; }
  .n1-detalhe-corpo { flex-direction: column; }
  .pillar-n1-summary > div { grid-template-columns: 1fr 1fr; }
}

/* ---- responsivo: sidebar vira barra superior em telas estreitas ---- */
@media (max-width: 760px) {
  .shell { flex-direction: column; }
  .sidebar {
    width: auto; flex: 0 0 auto; height: auto; position: static;
    flex-direction: row; align-items: center; flex-wrap: wrap; padding: 10px 14px;
  }
  .sidebar .brand { border-bottom: none; padding: 0 12px 0 0; margin: 0; }
  .nav-lista { display: flex; flex: 0 0 auto; }
  .nav-lista a { padding: 8px 10px; }
  .nav-rodape {
    border-top: none; margin: 0 0 0 auto; padding: 0;
    display: flex; align-items: center; gap: 10px;
  }
  .nav-rodape .who { display: none; }
  main.conteudo { padding: 18px 16px 40px; }
  .sidebar-collapse-toggle { display: none; }
  body.sidebar-collapsed .sidebar {
    width: auto !important; flex-basis: auto !important; padding: 10px 14px !important;
    visibility: visible; pointer-events: auto; overflow: visible !important;
  }
}

.nav-status-btn {
  background: rgba(16, 185, 129, 0.15) !important;
  color: #10b981 !important;
  margin-bottom: 8px;
}
.nav-status-btn:hover {
  background: rgba(16, 185, 129, 0.25) !important;
}
.nav-status-btn.ativo {
  background: #10b981 !important;
  color: #fff !important;
}

/* ------------------------------------------------------------------ */
/* [2026-07-30, pedido do dono] Painel DIREITO de status da obra,      */
/* recolhível. Saiu do painel 2 (esquerda), que ficou só com SA/N1,    */
/* N3 e N5. Recolhido vira uma faixa fina com o rótulo na vertical —   */
/* some da frente sem sumir da tela, então dá para reabrir sem         */
/* procurar onde estava.                                               */
/* ------------------------------------------------------------------ */
.painel-status {
  flex: 0 0 300px;
  display: flex;
  flex-direction: column;
  background: #111827;
  color: #cbd5e1;
  border-left: 1px solid #1f2937;
  overflow-y: auto;
  transition: flex-basis .18s ease;
}
.painel-status.recolhido { flex-basis: 34px; }
/* Aplicado antes de o painel entrar no DOM; evita expandir e recolher no carregamento. */
body.painel-status-inicial-recolhido .painel-status { flex-basis: 34px; }

.painel-status-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 8px 10px;
  background: #1f2937;
  color: #e5e7eb;
  border: 0;
  border-bottom: 1px solid #374151;
  cursor: pointer;
  font: inherit;
  font-size: .78rem;
  text-align: left;
}
.painel-status-toggle:hover { background: #374151; }
.painel-status-toggle:focus-visible { outline: 2px solid var(--accent-color); outline-offset: -2px; }

/* Seta aponta para a direita (recolher) e gira ao recolher (expandir). */
.painel-status-seta { transition: transform .18s ease; display: inline-block; }
.painel-status.recolhido .painel-status-seta { transform: rotate(180deg); }
body.painel-status-inicial-recolhido .painel-status-seta { transform: rotate(180deg); }

.painel-status.recolhido .painel-status-corpo { display: none; }
body.painel-status-inicial-recolhido .painel-status-corpo { display: none; }
.painel-status.recolhido .painel-status-toggle,
body.painel-status-inicial-recolhido .painel-status-toggle {
  writing-mode: vertical-rl;
  height: 100%;
  border-bottom: 0;
  justify-content: flex-start;
  padding: 10px 6px;
}

/* O bloco de fases perde a borda de baixo aqui — no painel direito ele
   e' o unico conteudo, e a borda ficava sobrando no meio do nada. */
.painel-status .painel-fases-obra { border-bottom: 0 !important; }

/* Apontamentos visuais comunitarios — acesso sempre no rodape esquerdo. */
.ui-feedback-nav { display:grid; gap:5px; margin:9px 0 7px; }
.ui-feedback-nav-btn { align-items:center; background:#17243a; border:1px solid #3b82f6; border-radius:5px; color:#dbeafe; cursor:pointer; display:flex; font-size:.7rem; gap:6px; justify-content:center; min-height:28px; padding:5px 7px; width:100%; }
.ui-feedback-nav-btn:hover,.ui-feedback-nav-btn:focus-visible { background:#1d4ed8; color:#fff; outline:none; }
.sidebar-collapsed .ui-feedback-nav-btn { padding:5px 2px; }
a.ui-feedback-nav-btn { box-sizing:border-box; text-decoration:none; }
.ui-feedback-nav-btn.ativo { background:#1d4ed8; color:#fff; }
.ui-feedback-hover-box { border:2px solid #0ea5e9; background:rgba(14,165,233,.08); box-shadow:0 0 0 2px rgba(255,255,255,.8); pointer-events:none; position:fixed; z-index:2147483000; }
.ui-feedback-mode { background:#0f172a; border:2px solid #38bdf8; border-radius:8px; bottom:18px; color:#fff; font-size:.82rem; left:50%; max-width:calc(100vw - 32px); padding:10px 16px; position:fixed; transform:translateX(-50%); z-index:2147483001; }
body.ui-feedback-selecting,body.ui-feedback-selecting * { cursor:crosshair !important; }
.ui-feedback-captured-target { outline:3px solid #ef4444 !important; outline-offset:2px !important; }
.ui-feedback-dialog { background:#f8fafc; border:0; border-radius:0; box-shadow:none; color:#0f172a; height:100dvh; margin:0; max-height:none; max-width:none; padding:0; width:100vw; }
.ui-feedback-dialog::backdrop { background:rgba(2,6,23,.64); }
.ui-feedback-dialog-head { align-items:center; background:#0f172a; color:#fff; display:flex; justify-content:space-between; padding:13px 16px; }
.ui-feedback-dialog-head h2,.ui-feedback-dialog-head span { display:block; }
.ui-feedback-dialog-head h2 { font-size:.92rem; margin:0; }
.ui-feedback-dialog-head span { color:#a5b4fc; font-size:.72rem; margin-top:2px; }
.ui-feedback-close { background:transparent; border:0; color:#fff; cursor:pointer; font-size:1.55rem; line-height:1; }
.ui-feedback-editor,.ui-feedback-history,.ui-feedback-session-viewer { box-sizing:border-box; height:calc(100dvh - 58px); padding:18px clamp(16px,4vw,56px); }
.ui-feedback-editor { display:grid; grid-template-rows:auto minmax(0,1fr) auto auto; overflow:hidden; }
.ui-feedback-editor[hidden],.ui-feedback-history[hidden],.ui-feedback-session-viewer[hidden] { display:none; }
.ui-feedback-history { overflow:auto; }
.ui-feedback-session-viewer { display:grid; gap:10px; grid-template-rows:auto auto minmax(0,1fr); overflow:hidden; }
.ui-feedback-viewer-head { align-items:center; display:flex; gap:14px; min-width:0; }
.ui-feedback-viewer-head>div { display:grid; min-width:0; }
.ui-feedback-viewer-head h3 { margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ui-feedback-viewer-head span { color:#64748b; font-size:.72rem; }
.ui-feedback-selected-meta { background:#e0f2fe; border:1px solid #7dd3fc; border-radius:7px; font-size:.74rem; margin-bottom:10px; overflow-wrap:anywhere; padding:8px; }
.ui-feedback-preview { background:#0b1220; border:1px solid #94a3b8; border-radius:7px; display:block; max-height:330px; object-fit:contain; width:100%; }
.ui-feedback-editor label { display:block; font-size:.78rem; font-weight:700; margin:11px 0 5px; }
.ui-feedback-editor textarea { border:1px solid #94a3b8; border-radius:7px; box-sizing:border-box; font:inherit; padding:9px; resize:vertical; width:100%; }
.ui-feedback-session-bar { display:grid; gap:10px; grid-template-columns:1fr; margin-bottom:10px; min-height:0; }
.ui-feedback-session-bar>label { display:grid; font-size:.76rem; font-weight:750; gap:5px; margin:0; }
.ui-feedback-session-bar input { border:1px solid #94a3b8; border-radius:7px; font:inherit; padding:7px 9px; }
.ui-feedback-page-tabs { display:flex; gap:7px; min-height:0; overflow-x:auto; overflow-y:hidden; padding:1px 1px 3px; }
.ui-feedback-page-tabs button { background:#e2e8f0; border:1px solid #cbd5e1; border-radius:8px; color:#334155; cursor:pointer; display:grid; flex:0 0 150px; gap:1px; padding:6px 9px; text-align:left; }
.ui-feedback-page-tabs button[aria-selected="true"] { background:#dbeafe; border-color:#2563eb; color:#1e3a8a; }
.ui-feedback-page-tabs small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ui-feedback-page-tabs b { font-size:.67rem; }
.ui-feedback-page-summary { align-items:center; background:#e0f2fe; border-bottom:1px solid #7dd3fc; display:flex; gap:12px; justify-content:space-between; padding:7px 11px; }
.ui-feedback-page-summary>div { display:grid; min-width:0; }
.ui-feedback-page-summary span { font-size:.68rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ui-feedback-page-summary a { color:#1d4ed8; font-size:.72rem; white-space:nowrap; }
.ui-feedback-points { display:grid; gap:10px; grid-template-rows:minmax(0,65fr) minmax(180px,35fr); min-height:0; }
.ui-feedback-capture-stage { background:#0b1220; border:1px solid #94a3b8; border-radius:10px; display:grid; grid-template-rows:auto minmax(0,1fr); min-height:0; overflow:hidden; }
.ui-feedback-capture-stage .ui-feedback-point-media { align-items:center; cursor:zoom-in; display:flex; justify-content:center; min-height:0; overflow:hidden; padding:8px; position:relative; touch-action:none; }
.ui-feedback-capture-stage .ui-feedback-point-media:focus-visible { box-shadow:inset 0 0 0 3px #60a5fa; outline:0; }
.ui-feedback-capture-stage .ui-feedback-point-media.is-zoomed { cursor:grab; }
.ui-feedback-capture-stage .ui-feedback-point-media.is-dragging { cursor:grabbing; }
.ui-feedback-capture-stage .ui-feedback-point-media img { display:block; height:100%; max-height:100%; max-width:100%; object-fit:contain; transform-origin:center center; user-select:none; width:100%; will-change:transform; }
.ui-feedback-zoom-tools { align-items:center; background:rgba(15,23,42,.9); border:1px solid rgba(148,163,184,.75); border-radius:7px; color:#fff; display:flex; font-size:.68rem; gap:7px; padding:4px 5px 4px 8px; position:absolute; right:14px; top:14px; z-index:2; }
.ui-feedback-point-media:not(:has(img)) .ui-feedback-zoom-tools { display:none; }
.ui-feedback-zoom-tools button { background:#fff; border:0; border-radius:5px; color:#1d4ed8; cursor:pointer; font:inherit; font-weight:750; padding:4px 7px; }
.ui-feedback-zoom-tools button:focus-visible { outline:2px solid #93c5fd; outline-offset:2px; }
.ui-feedback-comments-pane { background:#eef2f7; border:1px solid #cbd5e1; border-radius:10px; display:grid; grid-template-rows:auto minmax(0,1fr); min-height:0; overflow:hidden; }
.ui-feedback-comments-head { align-items:center; background:#e2e8f0; border-bottom:1px solid #cbd5e1; display:flex; gap:12px; justify-content:space-between; padding:7px 10px; }
.ui-feedback-comments-head>div { display:grid; }
.ui-feedback-comments-head span { color:#475569; font-size:.68rem; }
.ui-feedback-comments-head strong { color:#1e3a8a; font-size:.72rem; white-space:nowrap; }
.ui-feedback-comments-scroll { display:grid; gap:8px; min-height:0; overflow-y:auto; padding:8px; }
.ui-feedback-point-card { background:#fff; border:1px solid #cbd5e1; border-radius:9px; display:grid; gap:7px; padding:9px; position:relative; }
.ui-feedback-point-card.active { border-color:#2563eb; box-shadow:0 0 0 1px #2563eb; }
.ui-feedback-point-card-head { align-items:center; display:flex; gap:8px; justify-content:space-between; }
.ui-feedback-point-select { align-items:center; background:transparent; border:0; color:#1e3a8a; cursor:pointer; display:flex; font:inherit; font-size:.72rem; font-weight:750; gap:7px; padding:0; text-align:left; }
.ui-feedback-point-select:focus-visible { outline:2px solid #2563eb; outline-offset:3px; }
.ui-feedback-point-number { align-items:center; background:#2563eb; border-radius:50%; color:#fff; display:flex; font-weight:800; height:28px; justify-content:center; width:28px; }
.ui-feedback-capture-loading { align-items:center; background:#e2e8f0; border-radius:7px; color:#475569; display:flex; height:100%; justify-content:center; min-height:120px; width:100%; }
.ui-feedback-point-form { display:flex; flex-direction:column; min-width:0; }
.ui-feedback-saved-comment { background:#f8fafc; border-radius:7px; padding:8px 10px; }
.ui-feedback-saved-comment b { color:#334155; font-size:.68rem; text-transform:uppercase; }
.ui-feedback-saved-comment p { margin:3px 0 0; white-space:pre-wrap; }
.ui-feedback-point-form label { display:grid; gap:4px; margin:6px 0 0; }
.ui-feedback-selected-meta { display:grid; gap:3px; margin:0; }
.ui-feedback-selected-meta span { overflow-wrap:anywhere; }
.ui-feedback-remove-point { align-self:flex-end; background:transparent; border:0; color:#b42318; cursor:pointer; font-size:.7rem; margin:0; }
.ui-feedback-actions,.ui-feedback-history-tools { align-items:center; display:flex; flex-wrap:wrap; gap:7px; justify-content:flex-end; margin-top:9px; }
.ui-feedback-message { font-size:.74rem; min-height:1.2em; margin-top:6px; }
.ui-feedback-message.error { color:#b91c1c; }
.ui-feedback-history-tools { border-bottom:1px solid #dbe5f2; justify-content:space-between; margin:0 0 10px; padding-bottom:9px; }
.ui-feedback-list { display:grid; gap:9px; max-height:65vh; overflow:auto; }
.ui-feedback-history-row { align-items:center; background:#fff; border:1px solid #dbe5f2; border-left:4px solid #3b82f6; border-radius:8px; color:#0f172a; cursor:pointer; display:flex; font:inherit; gap:16px; justify-content:space-between; padding:12px 14px; text-align:left; width:100%; }
.ui-feedback-history-row:hover { background:#eff6ff; border-color:#60a5fa; }
.ui-feedback-history-row:focus-visible { outline:3px solid #2563eb; outline-offset:2px; }
.ui-feedback-history-row>span { display:grid; min-width:0; }
.ui-feedback-history-row b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ui-feedback-history-row small { color:#64748b; margin-top:3px; }
.ui-feedback-history-row strong { color:#1e3a8a; font-size:.72rem; white-space:nowrap; }
.ui-feedback-card { background:#fff; border:1px solid #dbe5f2; border-left:4px solid #3b82f6; border-radius:8px; padding:10px; }
.ui-feedback-card-head { align-items:center; display:flex; flex-wrap:wrap; gap:6px; justify-content:space-between; }
.ui-feedback-card-head b { font-size:.78rem; }
.ui-feedback-card time { color:#64748b; font-size:.66rem; }
.ui-feedback-card p { font-size:.78rem; margin:7px 0; white-space:pre-wrap; }
.ui-feedback-card-meta { color:#475569; font-family:ui-monospace,monospace; font-size:.67rem; overflow-wrap:anywhere; }
.ui-feedback-card a { color:#1d4ed8; font-size:.7rem; }
.ui-feedback-card h3 { font-size:.78rem; margin:0; }
.ui-feedback-card-context { background:#eff6ff; border-radius:5px; color:#1e3a8a; font-size:.68rem; margin:6px 0; padding:5px 7px; }
.ui-feedback-session-pages { display:grid; gap:7px; }
.ui-feedback-session-pages details { border:1px solid #dbe5f2; border-radius:7px; padding:7px; }
.ui-feedback-session-pages summary { cursor:pointer; display:grid; font-size:.75rem; font-weight:750; }
.ui-feedback-session-pages summary small { color:#64748b; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ui-feedback-history-point { background:#f8fafc; border-left:3px solid #60a5fa; display:grid; font-size:.72rem; gap:3px; margin-top:7px; padding:7px; }
.ui-feedback-history-point p { margin:0; }
.ui-feedback-card dl { display:grid; font-family:ui-monospace,monospace; font-size:.67rem; grid-template-columns:auto 1fr; margin:6px 0; }
.ui-feedback-card dt { color:#64748b; font-weight:700; padding-right:7px; }
.ui-feedback-card dd { color:#334155; margin:0; overflow-wrap:anywhere; }
@media (max-width:800px) { .ui-feedback-editor,.ui-feedback-session-viewer { overflow:auto; } .ui-feedback-session-viewer { grid-template-rows:auto auto auto; } .ui-feedback-points { grid-template-rows:minmax(320px,65vh) minmax(240px,35vh); } .ui-feedback-actions { align-items:stretch; flex-direction:column; } .ui-feedback-viewer-head,.ui-feedback-history-row { align-items:stretch; flex-direction:column; } }

@media (max-width: 900px) {
  /* Empilhado no mobile: largura fixa viraria uma coluna espremida. */
  .painel-status { flex: 1 1 auto; border-left: 0; border-top: 1px solid #1f2937; }
  .painel-status.recolhido,
  body.painel-status-inicial-recolhido .painel-status { flex-basis: auto; }
  .painel-status.recolhido .painel-status-toggle,
  body.painel-status-inicial-recolhido .painel-status-toggle { writing-mode: horizontal-tb; height: auto; }
}

/* ============================================================
   Drill grade � painel esquerdo 1 coluna (aprovado 2026-07)
   ============================================================ */
body.drill-grade-on .shell-obra > .painel-2,
body.drill-grade-on .shell-obra > .painel-3 {
  /* mant�m no DOM (bot�es processar / IDs de progresso) mas fora do layout */
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  padding: 0 !important;
  margin: -1px !important;
}

body.drill-grade-on .sidebar {
  width: 268px;
  flex: 0 0 268px;
  padding: 0;
  overflow: hidden;
}
body.drill-grade-on .sidebar .brand {
  padding: 11px 12px;
  margin: 0;
  border-bottom: 1px solid #1f2937;
  font-size: .82rem;
}
body.drill-grade-on .sidebar .nav-lista {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 4px 6px 0;
  margin: 0;
  overflow: hidden;
}
body.drill-grade-on .sidebar .nav-lista > li:not(.sidebar-obras-arvore) {
  flex: 0 0 auto;
}
body.drill-grade-on .sidebar .nav-lista a {
  padding: 5px 8px;
  font-size: .76rem;
  border-radius: 5px;
}
body.drill-grade-on .sidebar .nav-rodape {
  margin: 0;
  padding: 8px 12px;
  font-size: .68rem;
}
body.drill-grade-on .sidebar-obras-arvore {
  flex: 1;
  min-height: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
body.drill-grade-on .arvore-obras-lista {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
body.drill-grade-on .arvore-obra-atual {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
body.drill-grade-on .arvore-triagem-titulo,
body.drill-grade-on #docs-viewer {
  display: none !important;
}

#drill-root.drill {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #111827;
  color: #cbd5e1;
  font-size: 13px;
}
#drill-root button {
  appearance: none;
  -webkit-appearance: none;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
  padding: 0;
}
.drill-crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
  padding: 7px 10px;
  font-size: .68rem;
  color: #7d8ba1;
  background: #0e1524;
  border-bottom: 1px solid #1f2937;
  flex: 0 0 auto;
}
.drill-crumb b { color: #fff; font-weight: 600; }
.drill-crumb-link { color: #4ea1ff; }
.drill-crumb-link:hover { text-decoration: underline; }
.drill-sep { opacity: .45; margin: 0 1px; }
.drill-obra-title {
  margin: 10px 10px 5px;
  padding: 0 1px 7px;
  background: transparent;
  border-bottom: 2px solid #2563eb;
  color: #f8fafc;
  font-size: .9rem;
  line-height: 1.2;
}
.drill-obra-title strong { color: inherit; font-size: inherit; font-weight: 700; }
.drill-pav-title {
  align-self: flex-start;
  margin: 0 10px 8px;
  padding: 5px 9px;
  border: 1px solid #335fa1;
  border-radius: 6px;
  background: #152d50;
  color: #dbeafe;
  font-size: .76rem;
  line-height: 1.2;
  flex: 0 0 auto;
}
.drill-back {
  display: block;
  width: 100%;
  padding: 7px 10px;
  font-size: .72rem;
  color: #4ea1ff;
  border-bottom: 1px solid #1f2937;
  flex: 0 0 auto;
}
.drill-back:hover { background: #162033; }
/* Abas do painel esquerdo (dono 2026-09-28) */
#drill-root .drill-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  flex: 0 0 auto;
  gap: 1px;
  padding: 6px 4px 0;
  border-bottom: 1px solid #1f2937;
}
#drill-root .drill-tabs .drill-tab {
  flex: 1 1 auto;
  min-width: 0;
  padding: 6px 1px;
  font-size: .64rem;
  letter-spacing: -.01em;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #94a3b8;
  border-radius: 6px 6px 0 0;
  border-bottom: 2px solid transparent;
}
#drill-root .drill-tabs .drill-tab:hover:not([disabled]) { background: #162033; color: #e2e8f0; }
#drill-root .drill-tabs .drill-tab.on { color: #e2e8f0; background: #1b2740; border-bottom-color: #4ea1ff; font-weight: 600; }
#drill-root .drill-tabs .drill-tab[disabled] { opacity: .4; cursor: default; }
.drill-scroll { flex: 1; overflow: auto; min-height: 0; }
.ui-feedback-attachments { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.ui-feedback-attachment { display:flex; flex-direction:column; gap:5px; max-width:220px; padding:8px; border:1px solid #cbd5e1; border-radius:6px; overflow-wrap:anywhere; }
.ui-feedback-attachment img { max-width:200px; max-height:150px; object-fit:contain; }

.drill-structural-home-wrap {
  padding: 8px 8px 2px;
}
body.drill-grade-on .shell { --portal-sidebar-width: 268px; }
#drill-root .drill-structural-home {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-height: 26px;
  padding: 4px 8px;
  color: #dbeafe;
  background: #152544;
  border: 1px solid #3b82f6 !important;
  border-radius: 6px;
  font-size: .66rem;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
}
#drill-root .drill-structural-home:hover,
#drill-root .drill-structural-home:focus-visible {
  color: #fff;
  background: #1d4ed8;
  border-color: #60a5fa !important;
  outline: none;
}
.drill-structural-home .ico {
  font-size: .86rem;
  line-height: 1;
}
.drill-sec {
  padding: 9px 10px 3px;
  font-size: .58rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #7d8ba1;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.drill-sec em { font-style: normal; letter-spacing: 0; text-transform: none; font-size: .62rem; opacity: .85; }
.drill-sec-recortes {
  margin: 5px 8px 2px;
  padding: 10px 10px 8px;
  border-radius: 8px;
  border: 1px solid rgba(59, 130, 246, .42);
  background: linear-gradient(135deg, rgba(37, 99, 235, .2), rgba(14, 165, 233, .08));
  color: #dbeafe;
  letter-spacing: 0;
  text-transform: none;
  align-items: baseline;
}
.drill-sec-recortes strong { font-size: .78rem; line-height: 1.2; }
.drill-sec-recortes span { font-size: .66rem; font-weight: 700; color: #60a5fa; }
.drill-sec-etapas { margin-top: 10px; }
.drill-sec-preprocessamento { margin-top: 10px; }
.drill-pre-action { padding: 5px 8px 4px; }
.drill-pre-run { width: 100%; min-height: 30px; border: 1px solid #60a5fa; border-radius: 6px;
  background: #1d4ed8; color: #fff; font-size: .67rem; font-weight: 700; cursor: pointer; }
.drill-pre-run:disabled { opacity: .65; cursor: not-allowed; }
.drill-pre-feedback { padding-top: 4px; color: #a9c5e8; font-size: .59rem; line-height: 1.35; }
.drill-pre-indeterminate { height: 3px; margin-top: 5px; border-radius: 3px;
  background: linear-gradient(90deg, #1d4ed8, #93c5fd, #1d4ed8); background-size: 200% 100%;
  animation: drill-pre-flow 1.4s linear infinite; }
@keyframes drill-pre-flow { to { background-position: -200% 0; } }
.drill-pre-list { display:grid; gap:4px; padding:0 8px 4px; }
.drill-pre-row {
  display:flex;
  align-items:center;
  gap:6px;
  width:100%;
  min-height:28px;
  padding:4px 8px;
  border:1px solid #3b82f6 !important;
  border-radius:6px;
  background:#152544;
  color:#dbeafe;
  font-size:.66rem;
  font-weight:700;
}
.drill-pre-row .nm { flex:1; min-width:0; text-align:left; }
.drill-pre-row .meta { min-width:18px; padding:1px 4px; border-radius:999px; background:rgba(15,23,42,.6); color:#bfdbfe; font-size:.58rem; text-align:center; }
.drill-pre-row .seta { color:#93c5fd; font-size:.64rem; }
.drill-pre-row:not(:disabled):hover,
.drill-pre-row:not(:disabled):focus-visible { background:#1d4ed8; border-color:#60a5fa !important; color:#fff; outline:none; }
.drill-pre-row:disabled { cursor:not-allowed; opacity:.48; border-color:#475569 !important; }
.drill-pre-itens { grid-template-columns:1fr; }
.drill-tower-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin: 10px 10px 5px;
  padding: 0 1px 7px;
  border-bottom: 2px solid #2563eb;
  color: #f8fafc;
}
.drill-tower-title strong { font-size: .9rem; line-height: 1.2; }
.drill-tower-title span { font-size: .66rem; font-weight: 700; color: #60a5fa; }
.drill-etapa-row .lab small { display:block; margin-top:2px; color:#7d8ba1; font-size:.54rem; font-weight:500; }
.drill-etapa-row.on { border-color:#4ea1ff !important; background:#152544; color:#fff; box-shadow:0 0 0 1px #4ea1ff inset; }
.drill-empty {
  padding: 14px 12px;
  font-size: .74rem;
  color: #7d8ba1;
  text-align: center;
  line-height: 1.4;
}
.drill-pav-list { display: flex; flex-direction: column; gap: 4px; padding: 4px 8px 10px; }
.drill-pav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding: 10px 12px;
  min-height: 38px;
  background: #131c2e;
  border: 1px solid #1f2937 !important;
  border-radius: 6px;
  font-size: .84rem;
  font-weight: 700;
  color: #cbd5e1;
}
.drill-pav:hover { border-color: #3b4f6e !important; background: #18233a; }
.drill-pav.on {
  border-color: #4ea1ff !important;
  background: #152544;
  color: #fff;
  box-shadow: 0 0 0 1px #4ea1ff inset;
}
.drill-pav .lab { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.drill-pav .seta, .drill-etapa-row .seta, .drill-cls-row .seta { color: #7d8ba1; font-size: .64rem; }

/* Estrutural: um item por linha (Torre / Detalhes / Bruto / Conv.) */
.drill-tiles {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 4px 8px 10px;
}
.drill-tile {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 10px;
  min-height: 36px;
  text-align: left;
  background: #131c2e;
  border: 1px solid #1f2937 !important;
  border-radius: 6px;
  color: #cbd5e1;
  position: relative;
}
.drill-tile:hover { border-color: #3b4f6e !important; background: #18233a; }
.drill-tile.on {
  border-color: #4ea1ff !important;
  background: #152544;
  color: #fff;
  box-shadow: 0 0 0 1px #4ea1ff inset;
}
.drill-tile .ico {
  flex: 0 0 auto;
  font-size: .95rem;
  line-height: 1;
  margin: 0;
}
.drill-tile .k {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 700;
  font-size: .78rem;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.drill-tile .s {
  flex: 0 0 auto;
  font-size: .6rem;
  color: #7d8ba1;
  margin: 0;
  white-space: nowrap;
}
.drill-tile.on .s { color: #93c5fd; }
.drill-tile.ok { border-color: #16a34a !important; }
.drill-tile-ok {
  position: static;
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #16a34a;
  color: #fff;
  font-size: .62rem;
  font-weight: 800;
  line-height: 16px;
  text-align: center;
  box-shadow: 0 0 0 1px rgba(0,0,0,.25);
  order: 10;
  margin-left: auto;
}
.recorte-acoes-primarias {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  flex: 0 0 auto;
}
.recorte-acoes-primarias .btn {
  padding: 5px 10px;
  font-size: .78rem;
  min-height: 0;
}
/* Menu "⋯" — Proposta 2: Regenerar/Excluir/Códigos públicos saem da faixa
   principal, só Validar/Invalidar ficam sempre visíveis. */
.recorte-mais-wrap { position: relative; }
.recorte-mais-btn {
  padding: 5px 10px !important;
  min-width: 34px;
  text-align: center;
}
.recorte-mais-menu {
  position: absolute;
  right: 0;
  top: 100%;
  margin-top: 4px;
  z-index: 20;
  min-width: 180px;
  padding: 6px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
}
.recorte-mais-menu[hidden] { display: none !important; }
.recorte-mais-menu button {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: none;
  padding: 8px 10px;
  border-radius: 6px;
  font: inherit;
  font-size: .8rem;
  color: #1e293b;
  cursor: pointer;
}
.recorte-mais-menu button:hover { background: #f1f5f9; }
.recorte-mais-menu .recorte-mais-danger { color: #b91c1c; }
.recorte-mais-menu .recorte-mais-danger:hover { background: #fef2f2; }
.recorte-tag-ok {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  background: #dcfce7;
  border: 1px solid #86efac;
  color: #166534;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .03em;
}
.recorte-validacao-btn.recorte-btn-validado,
.recorte-validacao-btn.ativo {
  background: #16a34a !important;
  border-color: #15803d !important;
  color: #fff !important;
}

/* Etapas: lista vertical — botões maiores (1 linha = 1 botão) */
.drill-etapa-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 4px 8px 12px;
}
.drill-etapa-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  background: #131c2e;
  border: 1px solid #2b3a52 !important;
  border-radius: 8px;
  color: #e2e8f0;
  cursor: pointer;
  transition: background .12s, border-color .12s;
}
.drill-etapa-row:hover {
  border-color: #4ea1ff !important;
  background: #152544;
  color: #fff;
}
.drill-etapa-row .lab { flex: 1; min-width: 0; }
.drill-etapa-row .lab .k {
  display: block;
  font-weight: 700;
  font-size: .9rem;
  line-height: 1.25;
}
.drill-etapa-row .seta { color: #7d8ba1; font-size: .85rem; }
.drill-etapa-row:hover .seta { color: #93c5fd; }
/* segmentado SA|N3|N5 desativado */
.drill-etapa-seg,
.drill-etapa-btn { display: none !important; }

.drill-proc {
  margin: 6px 8px 8px;
  padding: 10px;
  background: #1a2332;
  border: 1px solid #2b3a52;
  border-radius: 6px;
}
.drill-proc .ph { font-size: .72rem; font-weight: 700; color: #e5e7eb; margin-bottom: 6px; }
.drill-proc .pr {
  display: flex;
  justify-content: space-between;
  font-size: .68rem;
  color: #7d8ba1;
  margin-bottom: 4px;
}
.drill-proc .pr strong { color: #fff; }
.drill-proc .bar {
  height: 6px;
  background: #0b1220;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 8px;
}
.drill-proc .bar i { display: block; height: 100%; background: #2563eb; border-radius: 3px; }
.drill-proc .run {
  display: block;
  width: 100%;
  padding: 7px 10px;
  border-radius: 5px;
  background: #131c2e;
  border: 1px solid #4ea1ff !important;
  color: #fff;
  font-size: .72rem;
  font-weight: 600;
  text-align: center;
}
.drill-proc .run:hover { background: #152544; }
.drill-proc .run:disabled {
  cursor: not-allowed;
  opacity: .62;
  border-color: #64748b !important;
  background: #111827;
}

/* Um único viewer de recortes por pavimento. As abas e os itens do menu
   lateral usam os mesmos ids; trocar em qualquer lado atualiza o outro. */
.recorte-tabs-shell {
  margin: 0 0 12px;
  padding: 10px 12px 12px;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fbff, #fff);
}
.recorte-tabs-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  color: #64748b;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.recorte-tabs-heading b { color: #1d4ed8; font-size: .72rem; }
.recorte-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: thin;
  padding-bottom: 1px;
}
.recorte-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 0 0 auto;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px;
  background: #fff;
  color: #475569;
  font-size: .76rem;
  font-weight: 700;
}
.recorte-tab:hover { border-color: #60a5fa !important; color: #1d4ed8; background: #eff6ff; }
.recorte-tab.on {
  border-color: #2563eb !important;
  background: #1d4ed8;
  color: #fff;
  box-shadow: 0 2px 8px rgba(37, 99, 235, .22);
}
.recorte-tab-status {
  display: inline-grid;
  place-items: center;
  width: 15px;
  height: 15px;
  border-radius: 999px;
  background: #16a34a;
  color: #fff;
  font-size: .6rem;
}
.recorte-tab.on .recorte-tab-status { background: #fff; color: #15803d; }
.drill-proc .job-live {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0 0 8px;
  padding: 7px 8px;
  border-radius: 5px;
  background: #0f2747;
  border: 1px solid #245c9c;
  color: #dbeafe;
  font-size: .64rem;
  line-height: 1.35;
}
.drill-proc .job-live strong { color: #fff; font-size: .68rem; }
.drill-proc .job-live small { color: #93c5fd; font-size: .57rem; }
.drill-proc .hint { font-size: .6rem; color: #7d8ba1; margin-top: 6px; line-height: 1.3; }

.drill-engine-status { display:flex; align-items:center; justify-content:space-between; padding:4px 7px; border:1px solid #334155; border-radius:5px; background:#0b1323; font-size:.64rem; }
.drill-engine-status b { color:#60a5fa; letter-spacing:.05em; }
.drill-proc-unified { margin:0 8px 8px; padding:0; background:transparent; border:0; border-radius:0; }
.drill-engine-step { display:grid; gap:4px; margin-bottom:8px; }
.drill-proc-unified .run { margin:0; min-height:30px; }
.drill-engine-all { margin-top:11px; padding-top:10px; border-top:1px solid #334155; }
.drill-proc-unified .run-all { background:linear-gradient(135deg,#7c3aed,#2563eb); border-color:#c4b5fd; color:#fff; font-weight:800; box-shadow:0 3px 10px rgba(124,58,237,.28); }
.drill-inline-job { display:grid; gap:4px; margin:4px 0 7px; padding:6px 7px; border:1px solid #245c9c; border-radius:5px; background:#0f2747; color:#dbeafe; }
.drill-inline-job > div:first-child { display:flex; justify-content:space-between; gap:5px; font-size:.55rem; }
.drill-inline-job b { color:#fff; }
.drill-inline-job span { color:#93c5fd; text-align:right; }
.drill-inline-job .bar { height:5px; margin:0; overflow:hidden; border-radius:999px; background:#1e293b; }
.drill-inline-job .bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#2563eb,#60a5fa); transition:width .35s ease; }
.drill-job-failed { display:grid; gap:3px; margin-top:7px; padding:7px 8px; border:1px solid #ef4444; border-radius:5px; background:rgba(127,29,29,.28); color:#fecaca; font-size:.56rem; line-height:1.35; }
.drill-job-failed b { color:#fff; font-size:.61rem; }
.drill-sec-motores { margin-top:12px; }
.drill-class-actions { display:grid; gap:5px; margin:7px 8px 10px; }
.drill-class-engine { display:grid; gap:4px; }
.drill-class-engine .drill-inline-job { margin:0 0 4px; }
.drill-class-engine button:disabled { cursor:not-allowed; opacity:.7; border-color:#475569 !important; }
.drill-class-engine button:disabled:hover { background:#152544; color:#dbeafe; }
.drill-qa-class { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
.drill-class-actions .drill-qa-class button { min-height:34px; padding:4px 2px; flex-direction:column; gap:0; }
.drill-class-actions .drill-qa-class button span { font-size:.68rem; }
.drill-class-actions .drill-qa-class button small { color:#93c5fd; font-size:.5rem; }
.drill-class-actions .drill-qa-class button:disabled { border-color:#475569 !important; color:#64748b; cursor:not-allowed; opacity:.55; }
.drill-class-actions .drill-qa-class button.is-processing { border-color:#60a5fa !important; background:#1e3a8a; color:#fff; opacity:1; }
.drill-class-actions .drill-qa-class button.is-processing small { color:#dbeafe; }
.drill-qa-notice,
.human-qa-disabled-notice,
.drill-unificados-notice { margin:4px 8px 6px; padding:6px 7px; border:1px solid #92400e; border-radius:5px; background:#451a03; color:#fde68a; font-size:.56rem; line-height:1.4; }
.drill-unificados-notice { border-color:#1d4ed8; background:#172554; color:#bfdbfe; }
.human-qa-disabled-notice { margin:8px 0; font-size:11px; }
.drill-qa-progress { padding:7px 8px; border:1px solid #334155; border-radius:6px; background:#0b172b; color:#dbeafe; }
.drill-qa-progress > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:6px; font-size:.59rem; }
.drill-qa-progress strong { color:#fff; }
.drill-qa-progress span { color:#93c5fd; text-align:right; }
.drill-qa-progress small { display:block; margin-top:3px; color:#94a3b8; font-size:.52rem; text-align:right; }
.drill-qa-progress.active { border-color:#3b82f6; box-shadow:0 0 0 1px rgba(59,130,246,.18) inset; }
.drill-qa-progress.done { border-color:#22c55e; }
.drill-qa-progress.warn { border-color:#f59e0b; }
.drill-qa-progress.error { border-color:#ef4444; }
.drill-qa-progress-bar { height:4px; margin-top:6px; overflow:hidden; border-radius:999px; background:#1e293b; }
.drill-qa-progress-bar i { display:block; height:100%; min-width:0; border-radius:inherit; background:#3b82f6; transition:width .25s ease; }
.drill-qa-progress.done .drill-qa-progress-bar i { background:#22c55e; }
.drill-qa-progress.warn .drill-qa-progress-bar i { background:#f59e0b; }
.drill-qa-progress.error .drill-qa-progress-bar i { background:#ef4444; }
.drill-qa-controls { display:grid; grid-template-columns:1fr 1fr 1fr; gap:3px; margin-top:6px; }
.drill-qa-controls button { min-height:24px !important; padding:3px 2px !important; border-color:#60a5fa !important; border-radius:4px; background:#152544; color:#dbeafe; font-size:.52rem; }
.drill-qa-controls button:not(:disabled):hover { background:#1d4ed8; }
.drill-qa-controls button.danger:not(:disabled) { border-color:#ef4444 !important; color:#fecaca; }
.drill-qa-controls button:disabled { cursor:not-allowed; opacity:.4; }
.drill-qa-control-feedback { margin-top:4px; color:#bfdbfe; font-size:.5rem; text-align:center; }
.drill-pi.human-ok { background:#14532d !important; border-color:#22c55e !important; color:#fff; }
.drill-qa-tag { border-radius:999px; display:block; font-size:.48rem; font-weight:800; line-height:1.2; margin-top:2px; padding:2px 4px; text-align:center; }
.drill-qa-tag.ok { background:#dcfce7; color:#166534; }
.drill-qa-tag.bad { background:#fee2e2; color:#991b1b; }
.drill-qa-tag.pending { background:#fef3c7; color:#92400e; }
.drill-class-actions button,
.drill-unified,
.drill-other-classes button,
#drill-root .drill-pre-run {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 32px;
  padding: 6px 9px;
  color: #dbeafe;
  background: #152544;
  border: 1px solid #3b82f6 !important;
  border-radius: 6px;
  font-size: .66rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
}
.drill-class-actions button,
#drill-root .drill-pre-run { flex-direction: column; position:relative; }
#drill-root .drill-pre-run { padding-right:22px; min-height:42px; }
#drill-root .drill-pre-run small { color:#93c5fd; font-size:.54rem; margin-top:3px; }
#drill-root .drill-pre-run:disabled { cursor:not-allowed; opacity:.7; }
.drill-stage-mark {
  position:absolute; top:3px; right:5px; display:grid; place-items:center;
  width:13px; height:13px; border-radius:999px; font-size:.48rem; line-height:1;
  color:#fff; background:#475569; box-shadow:0 0 0 1px rgba(255,255,255,.16);
}
.drill-stage-mark.done { background:#16a34a; }
.drill-stage-mark.active { background:#2563eb; }
.drill-stage-mark.error { background:#dc2626; }
.drill-stage-mark.pending { background:#92400e; }
.drill-class-actions button:hover,
.drill-class-actions button:focus-visible,
#drill-root .drill-pre-run:not(:disabled):hover,
#drill-root .drill-pre-run:not(:disabled):focus-visible,
.drill-unified:hover,
.drill-unified:focus-visible,
.drill-other-classes button:hover,
.drill-other-classes button:focus-visible {
  color: #fff;
  background: #1d4ed8;
  border-color: #60a5fa !important;
  outline: none;
}
.drill-class-actions b { color:#93c5fd; font-size:.66rem; }
.drill-class-actions button:hover b,
.drill-class-actions button:focus-visible b { color:#fff; }
.drill-unified { margin:4px 8px 5px; width:calc(100% - 16px); }
.drill-class-actions .drill-unified { margin:0; width:100%; }
.drill-other-classes { display:grid; gap:5px; margin:4px 8px 12px; }

.n5-management-head { margin-bottom:14px; }
.n5-management-head h2 { margin:2px 0 0; }
.n5-management-head p:last-child { margin:6px 0 0; color:#64748b; }
.n5-final-page { display:flex; flex-direction:column; gap:14px; }
.n5-final-list { display:flex; flex-direction:column; gap:10px; }
.n5-final-pav { border:1px solid #cbd5e1; border-radius:10px; background:#fff; overflow:hidden; }
.n5-final-pav > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; background:#f8fafc; border-bottom:1px solid #e2e8f0; }
.n5-final-pav > header small { display:block; color:#64748b; font-size:.62rem; font-weight:800; letter-spacing:.08em; }
.n5-final-pav > header h3 { margin:1px 0 0; font-size:1rem; }
.n5-final-summary { border-radius:999px; padding:4px 8px; font-size:.69rem; font-weight:800; }
.n5-final-summary.pending { background:#fff7ed; color:#92400e; }
.n5-final-summary.done { background:#dcfce7; color:#166534; }
.n5-final-classes { display:flex; flex-direction:column; }
.n5-final-row { display:grid; grid-template-columns:minmax(175px,1.25fr) minmax(112px,.7fr) minmax(190px,auto); align-items:center; gap:12px; padding:10px 14px; border-bottom:1px solid #eef2f7; }
.n5-final-name { display:flex; align-items:center; gap:7px; min-width:0; }
.n5-final-name > strong { color:#0f3d77; min-width:24px; }
.n5-final-name > span { color:#334155; white-space:nowrap; }
.n5-final-state { display:flex; flex-direction:column; gap:1px; }
.n5-final-state > span { font-size:.75rem; font-weight:800; }
.n5-final-state > small { color:#64748b; font-size:.64rem; }
.n5-final-state.approved > span { color:#15803d; }
.n5-final-state.pending > span { color:#b45309; }
.n5-final-actions { display:flex; justify-content:flex-end; gap:6px; }
.n5-final-actions .btn { margin:0; white-space:nowrap; }
.n5-final-pav > footer { display:flex; justify-content:flex-end; padding:10px 14px; background:#f8fafc; }
.n5-final-all { display:flex; justify-content:flex-end; padding-top:4px; }
.n5-final-all .btn { min-width:240px; }
.n5-pav-page { display:flex; flex-direction:column; gap:16px; min-height:0; }
.n5-pav-page > header { display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid #d7e0ee; border-radius:10px; padding:18px; background:#fff; }
.n5-pav-page > header h2 { margin:3px 0; }
.n5-pav-page > header p:last-child { margin:0; color:#64748b; }
.n5-pav-zip { flex:0 0 auto; }
.n5-pav-zip .btn { margin:0; white-space:nowrap; }
.n5-pav-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.n5-pav-tabs button { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:7px; min-width:0; padding:10px 12px; border:1px solid #cbd5e1; border-radius:8px; background:#f8fafc; color:#334155; text-align:left; cursor:pointer; }
.n5-pav-tabs button:hover { border-color:#93c5fd; background:#eff6ff; }
.n5-pav-tabs button.active { border-color:#2563eb; background:#0f2748; color:#fff; box-shadow:0 0 0 1px #2563eb inset; }
.n5-pav-tabs strong { color:#2563eb; }
.n5-pav-tabs button.active strong { color:#93c5fd; }
.n5-pav-tabs span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.75rem; }
.n5-pav-tabs i { font-style:normal; font-size:.72rem; }
.n5-pav-tabs .n5-generation-status { font-size:.65rem; color:#92400e; }
.n5-pav-tabs .n5-generation-status.generated { color:#15803d; }
.n5-pav-tabs button.active .n5-generation-status { color:#fcd34d; }
.n5-pav-tabs button.active .n5-generation-status.generated { color:#86efac; }
.n5-pav-tabs .n5-result-tags { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:4px; white-space:normal; overflow:visible; }
.n5-pav-tabs .n5-result-tag { display:block; white-space:normal; overflow:visible; font-size:.62rem; line-height:1.35; padding:3px 5px; border-radius:4px; background:#dcfce7; color:#166534; }
.n5-pav-tabs .n5-result-tag.empty { background:#e2e8f0; color:#475569; }
.n5-pav-viewer-shell { min-width:0; }
.n5-pav-panel { border:1px solid #d7e0ee; border-radius:10px; padding:12px; background:#fff; min-width:0; }
.n5-pav-panel.done { border-color:#86efac; }
.n5-pav-panel[hidden] { display:none; }
.n5-pav-card-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.n5-pav-card-head small { color:#2563eb; font-weight:800; }
.n5-pav-card-head h3 { margin:1px 0 0; font-size:.95rem; }
.n5-pav-card-head > span { border-radius:999px; padding:4px 7px; font-size:.68rem; font-weight:800; background:#fff7ed; color:#92400e; }
.n5-pav-panel.done .n5-pav-card-head > span { background:#dcfce7; color:#166534; }
.n5-pav-preview { height:min(62vh,620px); min-height:390px; margin-bottom:9px; background:#080d14; border-radius:7px; overflow:hidden; }
.n5-pav-preview svg { width:100%; height:100%; display:block; }
.drawing-mode-badge { position:absolute; left:10px; bottom:10px; z-index:8; padding:5px 9px; border:1px solid rgba(125,181,255,.65); border-radius:999px; background:rgba(4,13,27,.88); color:#dcecff; font-size:11px; font-weight:700; letter-spacing:.02em; box-shadow:0 2px 10px rgba(0,0,0,.35); }
button.drawing-mode-badge { cursor:pointer; pointer-events:auto; }
.n5-pav-tabs.drawing-mode-tabs { margin:10px 0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:3px; width:180px; max-width:100%; padding:6px; border:1px solid #334155; border-radius:6px; background:#0b172b; }
.drawing-mode-tabs::before { content:'Modo de desenho · N3'; grid-column:1 / -1; color:#dbeafe; font-size:9px; font-weight:700; margin-bottom:2px; }
.n5-pav-tabs.drawing-mode-tabs button { min-height:34px; padding:3px 1px; border:1px solid #3978ff; border-radius:4px; background:#152544; color:#dbeafe; font-size:9px; font-weight:700; line-height:1.1; text-align:center; white-space:normal; }
.n5-pav-tabs.drawing-mode-tabs button:hover { background:#1e3a5f; }
.n5-pav-tabs.drawing-mode-tabs button.active { background:#15803d; border-color:#4ade80; color:#fff; }
.n5-pav-tabs.drawing-mode-tabs button.active:hover { background:#166534; }
.n5-pav-tabs.drawing-mode-tabs button:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.drill-class-actions .drill-qa-progress button.drill-qa-dismiss { flex:0 0 18px; width:18px; min-height:18px; padding:0; border:0; background:transparent; color:#93c5fd; font-size:16px; line-height:1; }
.drill-class-actions .drill-qa-progress button.drill-qa-dismiss:hover { color:#fff; background:#334155; }
.drawing-mode-missing-switch { margin-top:10px; padding:7px 11px; border:1px solid #2768d9; border-radius:7px; background:#eef5ff; color:#174b9c; font-weight:700; }
.drawing-mode-dialog { width:min(620px,calc(100vw - 28px)); border:1px solid #bfd3f2; border-radius:14px; padding:0; color:#12213a; box-shadow:0 24px 70px rgba(4,13,27,.42); }
.drawing-mode-dialog::backdrop { background:rgba(4,13,27,.72); backdrop-filter:blur(2px); }
.drawing-mode-dialog form { padding:22px; }
.drawing-mode-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; }
.drawing-mode-head small { color:#1f5fda; font-weight:800; letter-spacing:.08em; }
.drawing-mode-head h2 { margin:4px 0 0; font-size:21px; }
.drawing-mode-head > button { border:0; background:transparent; font-size:26px; line-height:1; color:#60708b; }
.drawing-mode-options { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:18px 0 14px; }
.drawing-mode-options button { min-height:108px; padding:17px; text-align:left; border:1px solid #c8d7ed; border-radius:10px; background:#f7faff; color:#13233d; }
.drawing-mode-options button.selected { border-color:#1d63e9; box-shadow:0 0 0 2px rgba(29,99,233,.15); }
.drawing-mode-options strong,.drawing-mode-options span { display:block; }
.drawing-mode-options strong { margin-bottom:7px; font-size:17px; }
.drawing-mode-options span { color:#60708b; line-height:1.35; }
.drawing-mode-cancel { width:100%; padding:9px; border:0; background:transparent; color:#60708b; }
@media (max-width:620px) { .drawing-mode-options { grid-template-columns:1fr; } }
.n5-svg-loading, .n5-svg-error { display:grid; place-items:center; width:100%; height:100%; padding:24px; color:#cbd5e1; text-align:center; }
.n5-svg-error { color:#fecaca; }
.n5-pav-empty { min-height:110px; display:grid; place-items:center; text-align:center; padding:18px; border-radius:7px; background:#f8fafc; color:#64748b; font-size:.8rem; }
@media (max-width: 900px) {
  .n5-pav-page > header { align-items:flex-start; flex-direction:column; }
  .n5-pav-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .n5-final-row { grid-template-columns:1fr; gap:7px; }
  .n5-final-actions { justify-content:flex-start; }
}

.drill-cls-grp {
  padding: 8px 10px 3px;
  font-size: .58rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #7d8ba1;
}
.drill-cls-list { display: flex; flex-direction: column; gap: 3px; padding: 0 8px 6px; }
.drill-cls-row {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 28px;
  padding: 4px 8px;
  background: #152544;
  border: 1px solid #3b82f6 !important;
  border-radius: 6px;
  color: #dbeafe;
  font-size: .66rem;
  font-weight: 700;
}
.drill-cls-row:hover,
.drill-cls-row:focus-visible { border-color: #60a5fa !important; background: #1d4ed8; color:#fff; outline:none; }
.drill-cls-row.on {
  border-color: #4ea1ff !important;
  background: #152544;
  color: #fff;
  box-shadow: 0 0 0 1px #4ea1ff inset;
}
.drill-cls-row .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.drill-cls-row .meta { min-width:18px; padding:1px 4px; border-radius:999px; background:rgba(15,23,42,.6); font-size:.58rem; color:#bfdbfe; font-variant-numeric:tabular-nums; text-align:center; }
.drill-cls-row.on .meta { color: #93c5fd; }

.drill-itens {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3px;
  padding: 4px 8px 6px;
}
.drill-pi {
  padding: 6px 2px;
  text-align: center;
  background: #131c2e;
  border: 1px solid #1f2937 !important;
  border-radius: 4px;
  font-size: .7rem;
  font-weight: 700;
  color: #cbd5e1;
}
.drill-pi:hover { border-color: #3b4f6e !important; }
.drill-pi.on {
  border-color: #4ea1ff !important;
  background: #152544;
  color: #fff;
}
.drill-pi .subn {
  display: block;
  font-size: .52rem;
  font-weight: 500;
  color: #7d8ba1;
  margin-top: 1px;
}
.drill-pi.on .subn { color: #93c5fd; }

.drill-seg-wrap {
  margin: 0 8px 8px;
  padding: 8px;
  background: #0e1524;
  border: 1px solid #1f2937;
  border-radius: 6px;
}
.drill-seg-wrap .sh {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: .68rem;
  color: #7d8ba1;
  margin-bottom: 6px;
}
.drill-seg-wrap .sh b { color: #fff; font-size: .74rem; }
.drill-segs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; }
.drill-sg {
  padding: 5px 2px;
  text-align: center;
  background: #131c2e;
  border: 1px solid #1f2937 !important;
  border-radius: 4px;
  font-size: .66rem;
  font-weight: 700;
  color: #cbd5e1;
}
.drill-sg:hover { border-color: #3b4f6e !important; }
.drill-sg.on {
  border-color: #eab308 !important;
  background: #2a2410;
  color: #fde68a;
  box-shadow: 0 0 0 1px #eab308 inset;
}
.drill-cls-title {
  margin:8px 8px 3px;
  padding:7px 9px;
  border-left:3px solid #3b82f6;
  border-radius:4px;
  background:linear-gradient(90deg,rgba(37,99,235,.18),rgba(37,99,235,0));
  color:#bfdbfe;
  font-size:.64rem;
  font-weight:800;
}

.drill-side-card {
  margin: 5px 7px 9px;
  padding: 0 0 4px;
  overflow: hidden;
  background: #0e1524;
  border: 1px solid #2b3a52;
  border-radius: 7px;
}
.drill-side-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  padding: 7px 8px;
  background: #17233a;
  border-bottom: 1px solid #2b3a52;
}
.drill-side-head span { min-width: 0; }
.drill-side-head b {
  display: block;
  color: #fff;
  font-size: .72rem;
  line-height: 1.1;
}
.drill-side-head small {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: #7d8ba1;
  font-size: .55rem;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.drill-side-head strong {
  flex: 0 0 auto;
  color: #93c5fd;
  font-size: .61rem;
  font-variant-numeric: tabular-nums;
}
.drill-side-card .drill-itens { padding-top: 6px; }
.drill-side-card .drill-seg-wrap { margin-bottom: 5px; }
.drill-side-card .drill-criar-side { margin-top: 5px; margin-bottom: 4px; }
.drill-side-card .drill-hint { padding-bottom: 5px; text-align: center; }

.drill-combined-total {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 5px 8px 0;
  color: #7d8ba1;
  font-size: .58rem;
}
.drill-combined-total span { margin-right: auto; text-transform: uppercase; letter-spacing: .08em; }
.drill-combined-total strong {
  padding: 2px 5px;
  border: 1px solid #2b3a52;
  border-radius: 4px;
  color: #93c5fd;
  font-variant-numeric: tabular-nums;
}
.drill-viga-combined { min-height: 46px; padding: 4px 3px; }
.drill-viga-name { display: block; margin-bottom: 2px; color: inherit; }
.drill-pi .drill-viga-sidecount {
  display: block;
  margin-top: 0;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}
.drill-selected-sides { margin-top: 5px; }
.drill-seg-side { margin-bottom: 6px; }
.drill-seg-side .drill-criar-side { margin: 7px 0 0; width: 100%; }
.drill-seg-side-letter { color: #93c5fd; font-size: .48rem; }
.drill-empty-side {
  grid-column: 1 / -1;
  padding: 5px 2px;
  color: #64748b;
  font-size: .57rem;
  text-align: center;
}
.drill-create-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 6px 8px 2px;
}
.drill-create-pair .drill-criar { margin: 0; width: 100%; font-size: .6rem; }

.drill-criar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: calc(100% - 16px);
  margin: 4px 8px 8px;
  padding: 8px 10px;
  border: 1px dashed #4ea1ff !important;
  border-radius: 6px;
  background: rgba(37, 99, 235, .08);
  color: #4ea1ff;
  font-size: .74rem;
  font-weight: 600;
}
.drill-criar:hover { background: rgba(37, 99, 235, .18); border-style: solid !important; }
.drill-criar.on {
  background: rgba(37, 99, 235, .28);
  border-style: solid !important;
  color: #fff;
  box-shadow: 0 0 0 1px #4ea1ff inset;
}
.drill-criar .plus { font-size: 1rem; line-height: 1; font-weight: 700; }
.drill-hint {
  font-size: .64rem;
  color: #7d8ba1;
  padding: 0 10px 12px;
  line-height: 1.35;
}
.drill-torre-criar { padding: 4px 0 12px; }

/* ========================================================================
   Lista de obras � wizard 3 passos + sidebar com data/busca (2026-08)
   ======================================================================== */
.sidebar-obras-lista-page {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  margin-top: 6px;
}
.side-obras-search { padding: 4px 2px 8px; }
.side-obras-search input {
  width: 100%;
  padding: 8px 10px 8px 28px;
  border-radius: 8px;
  border: 1px solid #334155;
  background: #0f172a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%2394a3b8' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") 8px 50% no-repeat;
  color: #f1f5f9;
  font: inherit;
  font-size: .78rem;
}
.side-obras-search input::placeholder { color: #64748b; }
.side-obras-search input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 2px rgba(37,99,235,.25);
}
.side-obras-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding-bottom: 8px;
  scrollbar-width: none;
}
.side-obras-scroll::-webkit-scrollbar { display: none; }
.side-obras-group { margin-bottom: 10px; }
.side-obras-group-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin: 2px 0 5px;
  padding: 6px 8px;
  border-left: 3px solid #3b82f6;
  border-radius: 5px;
  background: linear-gradient(90deg, rgba(37, 99, 235, .2), rgba(37, 99, 235, .04));
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .065em;
  text-transform: uppercase;
  color: #dbeafe;
}
.side-obras-group-title .side-you {
  font-style: normal;
  text-transform: none;
  letter-spacing: 0;
  color: #93c5fd;
  font-weight: 650;
}
.side-obras-count {
  font-variant-numeric: tabular-nums;
  border: 1px solid rgba(96, 165, 250, .45);
  background: #17243a;
  color: #bfdbfe;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: .6rem;
}
.obra-card-side {
  display: block;
  width: 100%;
  text-align: left;
  text-decoration: none;
  padding: 8px 10px;
  border-radius: 9px;
  margin-bottom: 3px;
  border: 1px solid #3b82f6;
  background: rgba(59, 130, 246, .12);
  color: #e2e8f0;
  transition: background .1s, border-color .1s;
}
.obra-card-side:hover {
  background: rgba(59, 130, 246, .28);
  border-color: #60a5fa;
  color: #fff;
}
.obra-card-side:focus-visible {
  outline: none;
  border-color: #93c5fd;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, .28);
}
.obra-card-side-n {
  display: block;
  font-size: .8rem;
  font-weight: 650;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #f1f5f9;
}
.obra-card-side-d {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
  font-size: .68rem;
  color: #94a3b8;
  font-variant-numeric: tabular-nums;
}
.obra-card-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: #64748b;
}
.obra-card-dot.st-pronta,
.obra-card-dot.st-concluida { background: #22c55e; }
.obra-card-dot.st-processando { background: #3b82f6; }
.obra-card-dot.st-aguardando_triagem,
.obra-card-dot.st-aguardando_ingestao { background: #f59e0b; }
.obra-card-dot.st-erro { background: #ef4444; }
.side-obras-empty {
  margin: 0;
  padding: 10px 8px;
  font-size: .75rem;
  color: #64748b;
}

.obras-page { max-width: 980px; }
.obras-page-head { margin-bottom: 14px; }
.obras-page-head h1 {
  margin: 0 0 4px;
  font-size: 1.35rem;
  font-weight: 750;
  letter-spacing: -.02em;
}
.obras-page-sub-inline {
  font-weight: 600;
  color: var(--fg-muted);
  font-size: .85rem;
}
.obras-page-sub {
  margin: 0;
  font-size: .85rem;
  color: var(--fg-muted);
}

.obras-wizard-steps {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 16px;
}
@media (max-width: 720px) {
  .obras-wizard-steps { grid-template-columns: 1fr; }
}
.obras-wiz-step {
  text-align: left;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #fff;
  color: #475569;
  cursor: pointer;
  font: inherit;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
  transition: .12s border-color, .12s box-shadow, .12s background;
}
.obras-wiz-step:hover { border-color: #93c5fd; color: #0f172a; }
.obras-wiz-step.on {
  background: linear-gradient(180deg, #eff6ff 0%, #fff 70%);
  border-color: #3b82f6;
  color: #1e3a8a;
  box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
.obras-wiz-step .ws-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #475569;
  font-size: .72rem;
  font-weight: 800;
  margin-right: 8px;
  vertical-align: middle;
}
.obras-wiz-step.on .ws-num { background: #2563eb; color: #fff; }
.obras-wiz-step .ws-label {
  font-size: .82rem;
  font-weight: 750;
  vertical-align: middle;
}
.obras-wiz-step .ws-sub {
  display: block;
  margin-top: 4px;
  margin-left: 30px;
  font-size: .68rem;
  font-weight: 500;
  color: #94a3b8;
}
.obras-wiz-step.on .ws-sub { color: #64748b; }

.obras-wiz-panel { display: none; }
.obras-wiz-panel.on { display: block; }

.flow-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(15,23,42,.05);
  overflow: hidden;
  margin-bottom: 14px;
}
.flow-card-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid #f1f5f9;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}
.flow-card-head .ico {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  font-size: 1.15rem;
}
.flow-card-head.pav .ico { background: #fef3c7; }
.flow-card-head.obra .ico { background: #dbeafe; }
.flow-card-head h2 {
  margin: 0 0 3px;
  font-size: 1.02rem;
  font-weight: 750;
}
.flow-card-head .meta {
  margin: 0;
  font-size: .78rem;
  color: var(--fg-muted);
  line-height: 1.4;
}
.flow-card-body { padding: 16px 18px 18px; }
.field-label {
  display: block;
  font-size: .72rem;
  font-weight: 700;
  color: #475569;
  margin: 0 0 5px;
}
.field-label .field-opt { font-weight: 500; color: #94a3b8; }
.flow-card-body .field {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  font: inherit;
  font-size: .9rem;
  margin-bottom: 12px;
  background: #fff;
}
.flow-card-body .field:focus {
  outline: none;
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
.flow-drop { margin-bottom: 0; }
.flow-drop .drop-ico {
  display: block;
  font-size: 1.5rem;
  margin-bottom: 6px;
}
.hint-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
  justify-content: center;
}
.chip-hint {
  display: inline-flex;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: .68rem;
  font-weight: 650;
  color: #64748b;
}
.flow-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #f1f5f9;
  align-items: center;
}
.btn-sm { padding: 6px 10px !important; font-size: .78rem !important; }

.ingest-section {
  margin: 4px 0 8px;
  padding: 14px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
}
.ingest-section h3 {
  margin: 0 0 4px;
  font-size: .88rem;
  font-weight: 750;
}
.ingest-section > .meta {
  margin: 0 0 10px;
  font-size: .74rem;
  color: var(--fg-muted);
  line-height: 1.4;
}
.ingest-note {
  margin: 0 0 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
  font-size: .72rem;
  line-height: 1.4;
}
.ingest-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 10px;
  padding: 3px;
  background: #e2e8f0;
  border-radius: 9px;
}
.ingest-tab {
  flex: 1 1 auto;
  min-width: 72px;
  padding: 6px 8px;
  border: none;
  border-radius: 7px;
  background: transparent;
  font: inherit;
  font-size: .74rem;
  font-weight: 700;
  color: #475569;
  cursor: pointer;
}
.ingest-tab.on {
  background: #fff;
  color: #1d4ed8;
  box-shadow: 0 1px 2px rgba(15,23,42,.08);
}
.ingest-tab .n {
  display: inline-grid;
  place-items: center;
  min-width: 1.3em;
  margin-left: 4px;
  padding: 0 4px;
  border-radius: 999px;
  background: #cbd5e1;
  font-size: .65rem;
  font-weight: 800;
  color: #334155;
}
.ingest-tab.on .n { background: #dbeafe; color: #1e40af; }
.docs-ingest-list {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  overflow: auto;
  max-height: 260px;
  margin-bottom: 10px;
}
.docs-ingest-list table {
  width: 100%;
  border-collapse: collapse;
  font-size: .8rem;
}
.docs-ingest-list th {
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: left;
  font-size: .64rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #64748b;
  background: #f1f5f9;
  padding: 7px 10px;
  border-bottom: 1px solid #e2e8f0;
}
.docs-ingest-list td {
  padding: 8px 10px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}
.docs-ingest-list tr:last-child td { border-bottom: none; }
.docs-ingest-list .doc-fn {
  font-weight: 650;
  color: #0f172a;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.docs-ingest-list .doc-sz {
  font-size: .7rem;
  color: #94a3b8;
}
.docs-empty {
  margin: 0;
  padding: 18px 12px;
  text-align: center;
  color: #94a3b8;
  font-size: .8rem;
}
.cls-group { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.cls-opt {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid #cbd5e1;
  background: #fff;
  font-size: .7rem;
  font-weight: 650;
  color: #475569;
  cursor: pointer;
  user-select: none;
}
.cls-opt input { margin: 0; accent-color: #2563eb; }
.cls-opt.on-bruto { border-color: #86efac; background: #f0fdf4; color: #166534; }
.cls-opt.on-docs { border-color: #93c5fd; background: #eff6ff; color: #1e40af; }
.cls-opt.on-detalhe { border-color: #fcd34d; background: #fffbeb; color: #92400e; }
.btn-rm {
  border: none;
  background: transparent;
  color: #94a3b8;
  font-size: .85rem;
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 6px;
}
.btn-rm:hover { background: #fee2e2; color: #b91c1c; }
.lote-cls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  margin-bottom: 10px;
  font-size: .74rem;
  color: #475569;
}
.lote-cls select {
  font: inherit;
  font-size: .78rem;
  padding: 5px 8px;
  border-radius: 7px;
  border: 1px solid #cbd5e1;
  background: #fff;
}

.list-head-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 12px;
}
.list-head-row h2 { margin: 0; font-size: 1.05rem; }
.list-head-row .meta { font-size: .78rem; color: var(--fg-muted); }
.obras-table-card { padding: 0; overflow: hidden; }
.obras-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
}
.obras-table th {
  text-align: left;
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--fg-muted);
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  background: #f8fafc;
}
.obras-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}
.obras-table tr:hover td { background: #f8fafc; }
.obras-user-sep td {
  background: #f1f5f9 !important;
  font-size: .72rem;
  font-weight: 750;
  color: #475569;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 8px 12px;
}
.obras-td-date {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-size: .8rem;
  color: #475569;
}
.obras-table .pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  border-radius: 6px;
  background: #f1f5f9;
  color: #475569;
  font-size: .7rem;
  font-weight: 600;
}
.obras-table .code {
  font-family: ui-monospace, Consolas, monospace;
  font-size: .78rem;
  background: #f8fafc;
  border: 1px solid var(--border);
  padding: 2px 6px;
  border-radius: 5px;
  cursor: pointer;
}
.status-verificar { margin-left: 8px; font-size: .8rem; color: var(--fg-muted); }
.painel-status-pavimentos {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 0 7px;
}

.painel-status-pavimento {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  padding: 5px 7px;
  border: 1px solid #454545;
  border-radius: 4px;
  color: #e5e7eb;
  text-decoration: none;
  background: #202020;
}

.painel-status-pavimento small { color: #fbbf24; }
.painel-status-pavimento.concluido { border-color: #237a45; }
.painel-status-pavimento.concluido small { color: #4ade80; }
.painel-status-pavimentos-vazio { color: #9ca3af; font-size: .7rem; }

.preproc-level-page { width: 100%; min-height: 240px; margin: 18px 0;
  background: #172235; color: #e8f0fb; border: 1px solid #58708e; border-radius: 10px; }
.preproc-level-page header { display: flex; align-items: center; justify-content: space-between;
  padding: 10px 16px; border-bottom: 1px solid #455a72; }
.preproc-level-page header small { color: #9fb5d0; }
.preproc-level-page h2 { margin: 2px 0 0; font-size: 1rem; }
.preproc-level-back { border: 1px solid #58708e; border-radius: 6px;
  background: #22334d; color: #e8f0fb; padding: 6px 10px; cursor: pointer; }
.preproc-level-body { overflow-x: auto; padding: 12px 16px 20px; font-size: .78rem; }
.preproc-level-empty { padding: 18px 4px; }
.preproc-level-body h3 { margin: 16px 0 4px; font-size: .88rem; }
.preproc-level-body p { line-height: 1.5; color: #c8d8eb; }
.preproc-level-body table { width: 100%; border-collapse: collapse; margin: 8px 0 18px; }
.preproc-level-body th, .preproc-level-body td { border-bottom: 1px solid #344860;
  padding: 5px 8px; text-align: left; vertical-align: top; }
.preproc-level-body th { position: sticky; top: 0; background: #22334d; color: #dce9fa; }
.preproc-level-warning { color: #fbbf24 !important; font-weight: 700; }
.preproc-level-tabs { display:flex; gap:6px; margin:16px 0 10px; flex-wrap:wrap; }
.preproc-level-tabs button { border:1px solid #526987; border-radius:7px; padding:9px 14px;
  background:#22334d; color:#dce9fa; cursor:pointer; font-weight:600; }
.preproc-level-tabs button[aria-selected="true"] { background:#2563eb; border-color:#60a5fa; color:white; }
.preproc-level-tabs button:focus-visible { outline:2px solid #93c5fd; outline-offset:2px; }
.preproc-level-tabs button span { margin-left:8px; padding:1px 5px; border-radius:4px; background:#ffffff20; }
.preproc-level-legend { display:flex; flex-wrap:wrap; gap:8px 16px; font-size:.72rem; }
.preproc-level-table-wrap { overflow-x:auto; border:1px solid #344860; border-radius:8px; }
.preproc-level-body .preproc-level-table-wrap table { margin:0; min-width:780px; }
.preproc-level-body .preproc-level-table-wrap td, .preproc-level-body .preproc-level-table-wrap th { padding:11px 10px; }
.preproc-level-body th[scope="row"] { position:sticky; left:0; z-index:1; background:#1b2b42; white-space:nowrap; }
.preproc-level-body .preproc-level-panel[hidden] { display:none; }
.level-badge { display:inline-block; padding:4px 7px; border-radius:5px; border:1px solid currentColor; white-space:nowrap; }
.preproc-level-body .level-good { color:#86efac; }
.preproc-level-body .level-doubt { color:#fde68a; }
.preproc-level-body .level-pending { color:#b3c5dd; }
.preproc-level-body .level-conflict { color:#fda4af; }
.level-row-good { background:#14532d22; }
.level-row-doubt { background:#78350f22; }
.level-row-conflict { background:#88133722; }
.level-part { min-width:120px; margin-bottom:6px; }
.level-part strong, .level-part small { display:block; }
.level-part small { margin-top:4px; line-height:1.5; }
.preproc-level-body details { min-width:185px; max-width:400px; }
.preproc-level-body summary { color:#93c5fd; cursor:pointer; padding:3px 0; }
.level-evidence { border-top:1px solid #344860; padding:8px 0; overflow-wrap:anywhere; }
.preproc-level-body .level-evidence p { margin:4px 0; }
.level-evidence small { color:#b3c5dd; line-height:1.5; }
.preproc-level-body .preproc-level-note { font-size:.72rem; color:#a5b8cf; }

/* Convenção do pilar prevalece na cor; seleção usa contorno. */
.drill-pi.pillar-convention-segue, .drill-pi.pillar-convention-segue.human-ok { background:#153858 !important; border-color:#4ea1ff !important; color:#a5d3ff !important; }
.drill-pi.pillar-convention-morre, .drill-pi.pillar-convention-morre.human-ok { background:#4b4010 !important; border-color:#ffe033 !important; color:#fff09d !important; }
.drill-pi.pillar-convention-nasce, .drill-pi.pillar-convention-nasce.human-ok { background:#4b1e25 !important; border-color:#ff4545 !important; color:#ffb3b3 !important; }
.drill-pi[class*="pillar-convention-"].on { outline:2px solid #fff; outline-offset:1px; }
.pillar-n1-summary-field input, .pillar-n1-summary-field select { width:100%; min-width:0; font:inherit; padding:5px; border:1px solid #cbd5e1; border-radius:4px; background:#fff; }
.pillar-n1-summary [data-sa-save] { margin-top:10px; }

.drill-vigas-config {margin:7px 0;padding:7px;border:1px solid #334a70;border-radius:6px;background:#0c1525;color:#dbeafe;}
.drill-vigas-config fieldset {border:0;padding:0;margin:0 0 7px;min-width:0;}
.drill-vigas-config legend {font-size:10px;font-weight:700;margin-bottom:5px;}
.drill-vigas-config label {display:flex;align-items:center;gap:5px;font-size:10px;padding:4px 0;cursor:pointer;}
.drill-vigas-config input {margin:0;accent-color:#3978ff;}
.drill-vigas-config small {font-size:9px;color:#a7bedf;}
/* N3: single-choice cards, matching the compact sidebar controls. */
.drill-drawing-modes fieldset {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;}
.drill-drawing-modes legend {width:100%;}
.drill-drawing-modes label {position:relative;display:block;padding:0;min-width:0;}
.drill-drawing-modes input {position:absolute;width:1px;height:1px;opacity:0;}
.drill-drawing-modes label span {display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:34px;padding:4px 2px;border:1px solid #3978ff;border-radius:4px;background:#152544;color:#dbeafe;font-size:10px;font-weight:700;}
.drill-drawing-modes label:hover span {background:#1e3a5f;}
.drill-drawing-modes input:checked + span {background:#15803d;border-color:#4ade80;color:#fff;}
.drill-drawing-modes label:hover input:checked + span {background:#166534;}
.drill-drawing-modes input:focus-visible + span {outline:2px solid #fff;outline-offset:2px;}

/* Compact single-choice cards: beam options in pairs, five modes on one row. */
.drill-vigas-config fieldset {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-bottom:5px;}
.drill-vigas-config legend {width:100%;margin-bottom:4px;}
.drill-vigas-config label {position:relative;display:block;padding:0;min-width:0;}
.drill-vigas-config input[type="radio"] {position:absolute;width:1px;height:1px;opacity:0;}
.drill-vigas-config label span {display:flex;align-items:center;justify-content:center;box-sizing:border-box;height:100%;min-height:30px;padding:4px 2px;border:1px solid #3978ff;border-radius:4px;background:#152544;color:#dbeafe;font-size:10px;font-weight:700;line-height:1.2;text-align:center;white-space:normal;overflow-wrap:anywhere;}
.drill-vigas-config label:hover span {background:#1e3a5f;}
.drill-vigas-config input:checked + span {background:#15803d;border-color:#4ade80;color:#fff;}
.drill-vigas-config label:hover input:checked + span {background:#166534;}
.drill-vigas-config input:focus-visible + span {outline:2px solid #fff;outline-offset:2px;}
.drill-drawing-modes fieldset {grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;margin-bottom:0;}
.drill-drawing-modes label span {font-size:9px;padding:3px 1px;}
.drill-n3-button-row { display:grid; grid-template-columns:minmax(0,1fr) 28px; gap:4px; align-items:stretch; }
.drill-n3-button-row > button:first-child { min-width:0; }
.drill-n3-expand { min-width:28px; padding:0 !important; font-size:15px; line-height:1; display:grid; place-items:center; }
.drill-n3-options { margin:0 0 4px; }
.drill-n3-options .drill-vigas-config { margin:4px 0; }
.drill-engine-meta { display:flex; align-items:center; justify-content:center; gap:5px; width:100%; margin-top:2px; }
.drill-generation-time { color:#94a3b8; font-size:8px; font-weight:400; line-height:1.2; white-space:nowrap; }

/* Compact navigation and collapsible granular motors. */
#drill-root .drill-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#drill-root .drill-tabs .drill-tab { white-space: normal; font-size: .59rem; padding: 5px 1px; }
#drill-root .drill-motores-granulares { display: flex; align-items: center; justify-content: space-between; width: 100%; cursor: pointer; }
#drill-granular-motors[hidden] { display: none; }
#drill-root button.drill-motores-granulares { box-sizing: border-box; width: calc(100% - 16px); margin: 6px 8px 3px; padding: 6px 8px; font-size: .64rem; font-weight: 700; color: #bfdbfe; border-left: 3px solid #3b82f6; background: linear-gradient(90deg,rgba(37,99,235,.18),rgba(37,99,235,0)); }
#drill-root .drill-motores-granulares > span:last-child { flex-shrink: 0; color: #93c5fd; }