:root {
  /* Cor principal (verde musgo). Os nomes --azul e --azul-escuro foram
     mantidos porque o app inteiro usa essas variáveis. */
  --azul: #556b2f;
  --azul-escuro: #3f5022;
  --tom-claro: #e6ecdb;   /* fundos de menus, botões secundários e etiquetas */
  --tom-medio: #d3e0bd;   /* destaques suaves (etapa concluída, seleção) */
  --tom-texto: #33421c;   /* texto sobre os tons claros */
  --verde: #1e7e34;
  --vermelho: #b02a2a;
  --amarelo: #a86b00;
  --cinza-bg: #f2f4ec;
  --cinza-borda: #d7dde3;
  --texto: #1c2530;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  background: var(--cinza-bg);
  color: var(--texto);
  padding-bottom: calc(24px + env(safe-area-inset-bottom));
  -webkit-text-size-adjust: 100%;
}

#topbar {
  background: var(--azul);
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 12px 16px;
  padding-top: calc(12px + env(safe-area-inset-top));
  padding-left: calc(16px + env(safe-area-inset-left));
  padding-right: calc(16px + env(safe-area-inset-right));
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  position: sticky;
  top: 0;
  z-index: 10;
}

.brand { display: flex; flex-direction: column; line-height: 1.3; }
.brand strong { font-size: 0.95rem; }
.brand .subtitle { font-size: 0.72rem; opacity: 0.85; }

.topbar-actions { display: flex; align-items: center; gap: 10px; }

.conn {
  font-size: 0.72rem;
  padding: 3px 8px;
  border-radius: 999px;
  font-weight: 600;
}
.conn-online { background: #1e7e34; }
.conn-offline { background: #6b7280; }

.icon-btn {
  background: rgba(255,255,255,0.15);
  border: none;
  color: #fff;
  font-size: 1.1rem;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  cursor: pointer;
}

#module-nav { background: var(--azul-escuro); }
#grupos-nav { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; }
#grupos-nav[hidden] { display: none; }
.grupo-btn {
  background: none; border: none; color: rgba(255,255,255,0.75); font-weight: 700; font-size: 0.85rem;
  padding: 11px 4px; cursor: pointer; border-bottom: 3px solid transparent; white-space: nowrap;
}
@media (max-width: 380px) { .grupo-btn { font-size: 0.74rem; } }
.grupo-btn.active { color: #fff; border-bottom-color: #fff; background: rgba(255,255,255,0.08); }
#subnav {
  display: flex; background: var(--tom-claro); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
#subnav[hidden] { display: none; }
#subnav::-webkit-scrollbar { display: none; }
#subnav .tab-btn[hidden] { display: none; }
#subnav .tab-btn { color: #4a5868; padding: 9px 14px; }
#subnav .tab-btn.active { color: var(--azul-escuro); border-bottom-color: var(--azul); }
.tab-btn {
  flex: 0 0 auto;
  background: none;
  border: none;
  color: rgba(255,255,255,0.75);
  padding: 10px 14px;
  font-size: 0.85rem;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  border-bottom: 3px solid transparent;
}
.tab-btn.active {
  color: #fff;
  border-bottom-color: #fff;
}

#sync-bar {
  background: #fff3cd;
  color: #664d03;
  padding: 10px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  border-bottom: 1px solid #ffe69c;
}
#sync-bar button {
  background: var(--azul);
  color: #fff;
  border: none;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.8rem;
  cursor: pointer;
}
#sync-bar button:disabled { opacity: 0.6; }

main#view {
  max-width: 640px;
  margin: 0 auto;
  padding: 16px;
}

.screen-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.screen-header h1 {
  font-size: 1.1rem;
  margin: 0;
  flex: 1;
}

.btn-primary, .btn-secondary, .btn-link, .btn-danger {
  font-size: 0.9rem;
  border-radius: 8px;
  padding: 10px 16px;
  cursor: pointer;
  border: none;
}
.btn-primary { background: var(--azul); color: #fff; }
.btn-primary:hover { background: var(--azul-escuro); }
.btn-secondary { background: var(--tom-claro); color: var(--azul-escuro); margin: 10px 0; }
.btn-link { background: none; color: var(--azul); padding: 6px 4px; }
.btn-danger { background: #fff; color: var(--vermelho); border: 1px solid var(--vermelho); }
.btn-pequeno { padding: 6px 12px; font-size: 0.8rem; margin: 0; }

.insp-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.insp-card {
  background: #fff;
  border: 1px solid var(--cinza-borda);
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}
.insp-card-title { font-weight: 600; font-size: 0.95rem; }
.insp-card-sub { font-size: 0.8rem; color: #5a6572; }

.badge {
  font-size: 0.72rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  white-space: nowrap;
}
.badge-rascunho { background: var(--tom-claro); color: #33475b; }
.badge-pendente { background: #fff3cd; color: #664d03; }
.badge-sync { background: var(--tom-medio); color: var(--tom-texto); }
.badge-ok { background: #d1e7dd; color: #0a3622; }
.badge-erro { background: #f8d7da; color: #58151c; }
.badge-alto { background: #ffe0b2; color: #7a4100; }

.insp-card-side { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.btn-excluir-card {
  background: none; border: none; cursor: pointer; font-size: 0.95rem;
  color: #8a929b; padding: 2px 4px; line-height: 1;
}
.btn-excluir-card:hover { color: var(--vermelho); }

.empty-state { color: #6b7280; text-align: center; padding: 32px 8px; }

.form-section { display: flex; flex-direction: column; gap: 14px; background: #fff; padding: 16px; border-radius: 10px; border: 1px solid var(--cinza-borda); }
.form-section label { display: flex; flex-direction: column; gap: 6px; font-size: 0.85rem; font-weight: 600; color: #33475b; }
.form-section input, .form-section select, .form-section textarea {
  font-size: 0.95rem;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid var(--cinza-borda);
  font-family: inherit;
  font-weight: 400;
  color: var(--texto);
}
.form-section fieldset { border: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.form-section legend { font-size: 0.85rem; font-weight: 600; color: #33475b; padding: 0; margin-bottom: 4px; }
.radio-inline { font-weight: 400 !important; flex-direction: row !important; align-items: center; gap: 6px !important; display: flex; }

.form-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; gap: 8px; }

.steps-nav { display: flex; justify-content: center; gap: 10px; margin-bottom: 14px; }
.step-dot {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--tom-claro); color: #6b7280;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.8rem; font-weight: 700;
}
.step-dot.active { background: var(--azul); color: #fff; }
.step-dot.done { background: var(--tom-medio); color: var(--azul-escuro); }

.checklist { display: flex; flex-direction: column; gap: 12px; }
.checklist-card {
  background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 14px;
}
.checklist-card.destaque-nc { border-color: var(--vermelho); background: #fff7f7; }
.checklist-question { font-weight: 600; font-size: 0.9rem; margin-bottom: 10px; display: flex; justify-content: space-between; gap: 8px; }
.btn-remover-item { background: none; border: none; color: var(--vermelho); cursor: pointer; font-size: 0.9rem; }

.radio-group { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.radio-pill {
  border: 1px solid var(--cinza-borda);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.8rem;
  display: flex; align-items: center; gap: 6px;
  cursor: pointer;
}
.radio-pill input { margin: 0; }
.radio-ok:has(input:checked) { background: #d1e7dd; border-color: var(--verde); }
.radio-nc:has(input:checked) { background: #f8d7da; border-color: var(--vermelho); }
.radio-na:has(input:checked) { background: var(--tom-claro); border-color: #6b7280; }
.radio-parcial:has(input:checked) { background: #fff3cd; border-color: var(--amarelo); }

.tipos-trabalho-grid { display: flex; flex-wrap: wrap; gap: 8px; }
.checkbox-pill {
  border: 1px solid var(--cinza-borda);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.8rem;
  display: flex; align-items: center; gap: 6px;
  cursor: pointer;
}
.checkbox-pill input { margin: 0; }
.checkbox-pill:has(input:checked) { background: var(--tom-medio); border-color: var(--azul); }

.leitura-card {
  background: #f9fafb; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 10px;
  display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px;
}
.leitura-card.leitura-alerta { border-color: var(--vermelho); background: #fff7f7; }
.campo-leitura {
  flex: 1; min-width: 90px; display: flex; flex-direction: column; gap: 4px;
  font-size: 0.78rem; font-weight: 600; color: #5a6572;
}
.campo-leitura input {
  font-size: 0.9rem; padding: 8px; border-radius: 8px; border: 1px solid var(--cinza-borda); font-weight: 400; color: var(--texto);
}
.leitura-aviso { color: var(--vermelho); font-size: 0.8rem; font-weight: 600; margin: 0; }

.croqui-container { max-width: 280px; margin: 0 auto 12px; }
.croqui-svg { width: 100%; height: auto; display: block; cursor: crosshair; border-radius: 10px; touch-action: manipulation; }

.matriz-risco-mini { display: flex; flex-direction: column; gap: 2px; max-width: 220px; margin: 8px 0; }
.matriz-linha { display: flex; gap: 2px; }
.matriz-celula {
  flex: 1; aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
  font-size: 0.7rem; border-radius: 4px; color: #33475b;
}
.matriz-celula-ativa { outline: 3px solid var(--azul); outline-offset: -3px; font-weight: 700; }

.checklist-details { display: flex; flex-direction: column; gap: 8px; }
.checklist-details label { font-size: 0.78rem; font-weight: 600; color: #5a6572; display: flex; flex-direction: column; gap: 4px; }
.checklist-details textarea, .form-section textarea { resize: vertical; }

.file-label {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--tom-claro); color: var(--azul-escuro);
  border-radius: 8px; padding: 8px 12px; font-size: 0.8rem;
  cursor: pointer; width: fit-content;
}
.file-label input { display: none; }
.foto-botoes { display: flex; gap: 8px; flex-wrap: wrap; }

.thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.thumb { position: relative; width: 80px; height: 80px; border-radius: 8px; overflow: hidden; border: 1px solid var(--cinza-borda); }
.thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.thumb-sync {
  position: absolute; bottom: 2px; left: 2px; background: rgba(0,0,0,0.55); color: #fff;
  font-size: 0.65rem; border-radius: 4px; padding: 1px 4px;
}
.thumb-sync.ok { background: rgba(30,126,52,0.85); }
.btn-remover-foto {
  position: absolute; top: 0; right: 0; background: rgba(0,0,0,0.65); color: #fff;
  border: none; border-radius: 0 0 0 10px; width: 30px; height: 30px; font-size: 1rem; cursor: pointer; line-height: 1;
}

.resumo { background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 16px; }
.resumo-stats { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 0.9rem; }
.resumo-stats .ok { color: var(--verde); }
.resumo-stats .nc { color: var(--vermelho); }
.resumo-stats .alerta { color: var(--amarelo); }

.hint { font-size: 0.8rem; color: #6b7280; }

.cipa-gestao-resumo { border-left: 4px solid var(--azul); margin-bottom: 18px; }

.diag-categoria { margin-bottom: 18px; }
.diag-categoria-header {
  display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px;
}
.diag-categoria-header h3 { margin: 0; font-size: 1rem; color: var(--azul-escuro); }
.diag-score-mini {
  font-size: 0.78rem; font-weight: 700; padding: 3px 10px; border-radius: 999px;
  background: var(--tom-claro); color: var(--azul-escuro); white-space: nowrap;
}
.resumo-categorias { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 0.88rem; margin-top: 8px; }

.lista-participantes { display: flex; flex-direction: column; gap: 10px; }
.participante-card {
  background: #f9fafb; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 10px;
  display: flex; flex-direction: column; gap: 8px;
}
.participante-linha { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.participante-linha input, .participante-linha select {
  flex: 1; min-width: 120px; font-size: 0.9rem; padding: 8px; border-radius: 8px; border: 1px solid var(--cinza-borda);
  font-family: inherit; color: var(--texto);
}
.rep-assinatura-compacta { text-align: left; font-size: 0.78rem; }
.rep-assinatura-compacta .rep-linha-assinatura { max-width: 260px; }
.rep-assinatura-compacta .rep-assinatura-img { margin: 0 0 6px 0; }

.lista-presenca { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.lista-presenca li {
  background: #fff; border: 1px solid var(--cinza-borda); border-radius: 8px; padding: 8px 12px;
  display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 0.88rem;
}

.detail-block { background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 14px; margin-bottom: 12px; font-size: 0.88rem; }
.detail-item { background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 12px; margin-bottom: 8px; font-size: 0.88rem; }
.detail-resposta { font-weight: 700; margin: 4px 0; }
.resposta-ok { color: var(--verde); }
.resposta-nc { color: var(--vermelho); }
.resposta-na { color: #6b7280; }
.detail-obs { color: #33475b; margin: 2px 0; }
.erro-msg { color: var(--vermelho); font-size: 0.85rem; }

@media (max-width: 420px) {
  .brand .subtitle { display: none; }
}

/* ---------------- Relatório técnico (impressão / PDF) ---------------- */

.rep-doc {
  --rep-good: #0ca30c;
  --rep-critical: #d03b3b;
  --rep-warning: #fab219;
  --rep-muted: #898781;
  --rep-ink: #0b0b0b;
  --rep-ink-secondary: #52514e;
  --rep-border: #c3c2b7;
  background: #fff;
  color: var(--rep-ink);
  max-width: 210mm;
  margin: 0 auto;
  padding: 14mm;
  border: 1px solid var(--cinza-borda);
  border-radius: 6px;
  font-size: 0.85rem;
  line-height: 1.45;
}

.rep-cabecalho {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  border-bottom: 3px solid var(--azul);
  padding-bottom: 10px;
  margin-bottom: 16px;
}
.rep-titulo { display: flex; align-items: center; gap: 12px; }
.rep-logo { width: 40px; height: 40px; border-radius: 8px; }
.rep-titulo h2 { margin: 0; font-size: 1.15rem; color: var(--azul-escuro); }
.rep-titulo p { margin: 2px 0 0; color: var(--rep-ink-secondary); font-size: 0.8rem; }

.rep-controle { border-collapse: collapse; font-size: 0.75rem; }
.rep-controle th, .rep-controle td { border: 1px solid var(--rep-border); padding: 3px 8px; text-align: left; }
.rep-controle th { background: var(--cinza-bg); font-weight: 600; white-space: nowrap; }

.rep-secao { margin-bottom: 18px; }
.rep-secao h3 { font-size: 0.95rem; color: var(--azul-escuro); border-bottom: 1px solid var(--rep-border); padding-bottom: 4px; margin-bottom: 10px; }

.rep-tabela-ident, .rep-table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.rep-tabela-ident th, .rep-tabela-ident td, .rep-table th, .rep-table td {
  border: 1px solid var(--rep-border); padding: 5px 8px; text-align: left; vertical-align: top;
}
.rep-tabela-ident th { background: var(--cinza-bg); width: 18%; font-weight: 600; }
.rep-table th { background: var(--cinza-bg); }
.rep-td-status { font-weight: 600; white-space: nowrap; }
.rep-status-ok { color: var(--rep-good); }
.rep-status-nc { color: var(--rep-critical); }
.rep-status-na { color: var(--rep-muted); }

.rep-bar {
  display: flex;
  width: 100%;
  height: 22px;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--rep-border);
  background: var(--cinza-bg);
}
.rep-bar-seg { border-right: 2px solid #fff; }
.rep-bar-seg:last-child { border-right: none; }
.rep-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 8px; font-size: 0.78rem; }
.rep-legend-item { display: flex; align-items: center; gap: 6px; }
.rep-legend-swatch { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }

.rep-foto-bloco {
  border: 1px solid var(--rep-border);
  border-radius: 6px;
  padding: 10px;
  margin-bottom: 10px;
  break-inside: avoid;
}
.rep-foto-bloco.rep-nc { border-left: 4px solid var(--rep-critical); }
.rep-foto-bloco.rep-ok { border-left: 4px solid var(--rep-good); }
.rep-foto-header { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 0.82rem; flex-wrap: wrap; }
.rep-status-pill { font-size: 0.7rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--cinza-bg); white-space: nowrap; }
.rep-fotos-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.rep-foto { width: 140px; height: 140px; object-fit: cover; border-radius: 6px; border: 1px solid var(--rep-border); }
.rep-hint { color: var(--rep-ink-secondary); font-style: italic; }

.rep-parecer { text-align: justify; }

.rep-assinaturas { margin-top: 24px; }
.rep-assinatura-grid { display: flex; gap: 24px; flex-wrap: wrap; margin-top: 20px; }
.rep-assinatura { flex: 1; min-width: 220px; text-align: center; font-size: 0.78rem; }
.rep-linha-assinatura { border-top: 1px solid var(--rep-ink); margin-bottom: 6px; height: 36px; }
.rep-assinatura-img { display: block; max-width: 100%; height: 60px; object-fit: contain; margin: 0 auto 6px auto; }
.rep-assinatura-controles { margin-top: 8px; }
.rep-assinatura-pad { margin-top: 8px; text-align: left; }
.rep-canvas-assinatura {
  display: block; width: 100%; height: 110px; border: 1px dashed var(--cinza-borda);
  border-radius: 6px; background: #fff; touch-action: none; cursor: crosshair;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}

.rep-table-presenca .rep-td-assinatura { width: 160px; }
.rep-assinatura-mini { display: block; max-width: 140px; height: 34px; object-fit: contain; }
.rep-linha-assinatura-mini { border-top: 1px solid var(--rep-ink); height: 24px; max-width: 140px; }

.rep-rodape { margin-top: 24px; border-top: 1px solid var(--rep-border); padding-top: 8px; font-size: 0.7rem; color: var(--rep-ink-secondary); text-align: center; }

/* ---------- Relatos, Central de ações e Painel ---------- */
.chips-filtro { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 12px; }
.chip-filtro {
  border: 1px solid var(--cinza-borda); background: #fff; border-radius: 999px;
  padding: 6px 12px; font-size: 0.8rem; cursor: pointer; color: var(--texto);
}
.chip-filtro span { font-weight: 700; margin-left: 4px; color: #5a6572; }
.chip-filtro.ativo { background: var(--azul); border-color: var(--azul); color: #fff; }
.chip-filtro.ativo span { color: #fff; }
.checkbox-anonimo { align-self: flex-start; margin-top: 6px; }
.badge-disciplina { color: #fff; }
#sync-bar .btn-ver-erros { background: #fff; color: var(--vermelho); border: 1px solid var(--vermelho); }
.disciplinas-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 10px; }
.disciplina-card {
  background: #fff; border: 1px solid var(--cinza-borda); border-left: 8px solid var(--cor-disciplina);
  border-radius: 12px; padding: 18px 16px; text-align: left; cursor: pointer; font: inherit; color: var(--texto);
  display: flex; flex-direction: column; gap: 6px; min-height: 130px;
}
.disciplina-card:hover, .disciplina-card:focus-visible { box-shadow: 0 3px 10px rgba(0,0,0,0.12); outline: none; }
.disciplina-titulo { font-size: 1.15rem; font-weight: 700; color: var(--cor-disciplina); }
.disciplina-desc { font-size: 0.85rem; color: #5a6572; }
.disciplina-qtd { margin-top: auto; font-size: 0.78rem; font-weight: 700; color: var(--cor-disciplina); }
.form-section label.radio-pill, .form-section label.checkbox-pill { flex-direction: row; align-items: center; font-weight: 500; }
#sync-bar[hidden] { display: none; }

.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; margin: 10px 0 14px; }
.kpi-grid-4 { grid-template-columns: repeat(4, 1fr); }
.kpi {
  background: #fff; border: 1px solid var(--cinza-borda); border-left: 5px solid var(--azul);
  border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px;
  text-align: left; font: inherit; color: var(--texto);
}
.kpi-clicavel { cursor: pointer; }
.kpi-clicavel:hover { box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
.kpi-valor { font-size: 1.6rem; font-weight: 700; line-height: 1.1; }
.kpi-valor small { font-size: 0.75rem; font-weight: 600; color: #5a6572; }
.kpi-rotulo { font-size: 0.78rem; color: #5a6572; }
.kpi-ok { border-left-color: var(--verde); }
.kpi-atencao { border-left-color: var(--amarelo); }
.kpi-alerta { border-left-color: var(--vermelho); }
.kpi-alerta .kpi-valor { color: var(--vermelho); }

.filtros-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.filtros-acoes select, .filtros-acoes input {
  padding: 8px 10px; border: 1px solid var(--cinza-borda); border-radius: 8px; font-size: 0.9rem; background: #fff;
}
.filtros-acoes input { flex: 1 1 200px; min-width: 0; }
.acoes-envio { justify-content: flex-start; margin-bottom: 8px; }

.acao-card {
  list-style: none; background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px;
  padding: 12px 14px; display: flex; flex-direction: column; gap: 6px;
}
.acao-topo { display: flex; flex-wrap: wrap; gap: 6px; }
.badge-origem { background: var(--tom-claro); color: var(--azul-escuro); }
.acao-card .btn-abrir-origem { align-self: flex-start; padding: 0; }
.acao-card .participante-linha { flex-wrap: wrap; }

.painel-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.painel-card { background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 12px 14px; min-width: 0; }
.painel-card h3 { margin: 0 0 10px; font-size: 0.95rem; }
.painel-barras { display: flex; flex-direction: column; gap: 6px; }
.painel-barra-linha { display: grid; grid-template-columns: minmax(90px, 40%) 1fr 44px; align-items: center; gap: 8px; font-size: 0.8rem; }
.painel-barra-rotulo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.painel-barra-trilho { background: #e9ece2; border-radius: 4px; height: 14px; overflow: hidden; }
.painel-barra { display: block; height: 100%; border-radius: 4px; }
.painel-barra-valor { text-align: right; font-weight: 700; }
.painel-colunas { display: flex; align-items: flex-end; gap: 8px; height: 150px; padding-top: 16px; }
.painel-coluna { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; }
.painel-coluna-barra { width: 70%; background: var(--azul); border-radius: 4px 4px 0 0; min-height: 2px; }
.painel-coluna-valor { font-size: 0.75rem; font-weight: 700; }
.painel-coluna-rotulo { font-size: 0.72rem; color: #5a6572; text-transform: capitalize; }

.compartilhar-opcoes { display: flex; flex-wrap: wrap; gap: 8px; }
.btn-compartilhar { background: var(--verde); color: #fff; }
.btn-compartilhar:hover { background: #17642a; }
.painel-compartilhar { margin-bottom: 12px; }
.cobertura-pdf { position: fixed; inset: 0; z-index: 9999; background: rgba(244,246,248,0.97); display: flex; align-items: center; justify-content: center; }
.cobertura-pdf-caixa { background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 18px 24px; font-weight: 600; color: var(--azul-escuro); box-shadow: 0 4px 16px rgba(0,0,0,0.12); }
.compartilhar-opcoes a { text-decoration: none; display: inline-block; }

@media (max-width: 520px) {
  .kpi-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .painel-grid { grid-template-columns: 1fr; }
}

/* Celular deitado (horizontal): cabeçalho mais baixo para sobrar área útil. */
@media (orientation: landscape) and (max-height: 500px) {
  #topbar { padding: 6px 16px; }
  #topbar .subtitle { display: none; }
  .tab-btn { padding: 7px 12px; }
  .painel-colunas { height: 110px; }
}

/* ---------- Programação, equipamentos/QR, marcação de foto, observação ---------- */
.aviso-backup { background: #fff3cd; border: 1px solid #f0d488; color: #664d03; border-radius: 8px; padding: 8px 10px; font-size: 0.85rem; margin: 6px 0; }
.aviso-backup .btn-link { padding: 0 4px; }
.atalhos-inspecao { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 4px; }
.atalhos-inspecao .btn-secondary { margin: 0; display: inline-flex; align-items: center; gap: 6px; }
.eq-ficha { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-start; }
.eq-qr { background: #fff; border: 1px solid var(--cinza-borda); border-radius: 10px; padding: 8px; }
.eq-qr svg { display: block; width: 150px; height: 150px; }
.etiquetas-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.etiqueta { display: flex; gap: 10px; align-items: center; border: 2px solid #000; border-radius: 8px; padding: 8px; background: #fff; break-inside: avoid; }
.etiqueta-qr svg { display: block; width: 110px; height: 110px; }
.etiqueta-texto { display: flex; flex-direction: column; gap: 2px; font-size: 0.8rem; color: #000; }
.etiqueta-texto strong { font-size: 1.1rem; }
.leitor-qr { position: fixed; inset: 0; z-index: 10000; background: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: #fff; }
.leitor-qr video { width: 100%; max-height: 70vh; object-fit: cover; }
.leitor-qr-mira { position: absolute; top: 35%; left: 50%; width: 220px; height: 220px; transform: translate(-50%, -50%); border: 3px solid #fff; border-radius: 16px; box-shadow: 0 0 0 9999px rgba(0,0,0,0.35); pointer-events: none; }
.leitor-qr p, .leitor-qr button { position: relative; z-index: 1; }
.thumb .btn-marcar-foto { position: absolute; left: 3px; top: 3px; background: rgba(0,0,0,0.65); color: #fff; border: none; border-radius: 6px; font-size: 0.7rem; padding: 3px 6px; cursor: pointer; }
.marcacao-foto { position: fixed; inset: 0; z-index: 10000; background: #111; display: flex; flex-direction: column; }
.marcacao-barra { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 8px; background: #222; }
.marcacao-barra button { background: #3a3a3a; color: #fff; border: 1px solid #555; border-radius: 8px; padding: 8px 10px; font-size: 0.85rem; cursor: pointer; }
.marcacao-barra button.ativo { background: var(--azul); border-color: #fff; }
.marcacao-ferramentas, .marcacao-cores { display: flex; gap: 6px; flex-wrap: wrap; }
.marcacao-cores button { width: 32px; height: 32px; padding: 0; border-radius: 50%; border: 2px solid #555; }
.marcacao-cores button.ativo { border: 3px solid #fff; }
.marcacao-espaco { flex: 1; }
.marcacao-barra .marcacao-salvar { background: var(--verde); border-color: var(--verde); }
.marcacao-area { flex: 1; display: flex; align-items: center; justify-content: center; overflow: hidden; min-height: 0; }
.marcacao-area canvas { touch-action: none; max-width: 100%; max-height: 100%; }
.obs-categoria { border-top: 1px solid var(--cinza-borda); padding-top: 8px; }
.obs-categoria h3 { margin: 4px 0 6px; font-size: 0.95rem; color: var(--azul-escuro); }
.obs-item { margin-bottom: 10px; }
.obs-item p { margin: 0 0 6px; font-size: 0.88rem; }
.form-section .obs-item .radio-pill { flex-direction: row; }

@media print {
  .no-print, #topbar, #module-nav, #sync-bar { display: none !important; }
  .etiqueta { border-color: #000; }
  body { background: #fff; padding: 0; }
  main#view { max-width: none; padding: 0; margin: 0; }
  .rep-doc { border: none; border-radius: 0; max-width: none; padding: 0; }
  .rep-quebra { break-before: auto; }
  .rep-foto-bloco { break-inside: avoid; }
  @page { size: A4; margin: 14mm; }
  /* Inventário de riscos e plano de ação do PGR: folha deitada (paisagem). */
  @page paisagem { size: A4 landscape; margin: 12mm; }
  .rep-paisagem { page: paisagem; }
}
.detail-thumbs { margin-top: 8px; }
.rep-inventario-pgr { font-size: 0.68rem; table-layout: fixed; width: 100%; }
.rep-inventario-pgr td, .rep-inventario-pgr th { overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; padding: 3px 4px; }
.rep-inventario-pgr th:nth-child(2) { width: 8%; }
.rep-inventario-pgr th:nth-child(7) { width: 16%; }
.rep-inventario-pgr th:nth-child(9), .rep-inventario-pgr th:nth-child(10) { width: 9%; }
.rep-inventario-pgr th:first-child, .rep-inventario-pgr td:first-child { width: 2.2em; }
.rep-inventario-pgr td, .rep-inventario-pgr th { vertical-align: top; }
.rep-matriz-pgr td, .rep-matriz-pgr th { font-size: 0.75rem; }

/* ---------- iPhone (iOS) e Android ---------- */
/* Em telas de toque, campos com 16px: abaixo disso o iPhone dá zoom ao tocar. */
@media (pointer: coarse) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea { font-size: 16px; }
}
.marcacao-area canvas { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.cartao-instalar { background: #eef2e4; border: 1px solid var(--azul); border-radius: 10px; padding: 12px 14px; margin: 0 0 12px; }
.cartao-instalar p { margin: 4px 0 6px; font-size: 0.88rem; color: #33475b; }
.cartao-instalar ol { margin: 4px 0 0; padding-left: 20px; font-size: 0.88rem; }
.cartao-instalar .btn-primary { margin-top: 4px; }
.dica-pdf-ios { margin: 8px 0; }
.aviso-instalar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom)); background: rgba(10, 20, 30, 0.35); }
.aviso-instalar-caixa { max-width: 520px; margin: 0 auto; background: #fff; border-radius: 12px; border: 1px solid var(--azul); padding: 14px 16px; box-shadow: 0 6px 24px rgba(0,0,0,0.2); }
.aviso-instalar-caixa p { margin: 6px 0; font-size: 0.9rem; color: #33475b; }
.aviso-instalar-caixa ol { margin: 4px 0 8px; padding-left: 20px; font-size: 0.9rem; }
.aviso-instalar-caixa .btn-primary { width: 100%; margin: 6px 0; }
.aviso-instalar-caixa .btn-link { display: block; margin: 4px auto 0; }
@media print { .aviso-instalar { display: none !important; } }

/* ---------- Aparência (botão Aa) ---------- */
.icon-btn-texto { font-weight: 800; font-size: 0.95rem; }
.aparencia-fundo { position: fixed; inset: 0; z-index: 70; background: rgba(10, 20, 30, 0.45); display: flex; align-items: flex-end; justify-content: center; padding: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
@media (min-width: 700px) { .aparencia-fundo { align-items: center; } }
.aparencia-caixa { background: #fff; color: var(--texto); border-radius: 12px; width: min(560px, 100%); max-height: 85vh; overflow-y: auto; padding: 14px 16px; box-shadow: 0 8px 28px rgba(0,0,0,0.25); }
.aparencia-cab { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; font-size: 1.05rem; }
.aparencia-grupo { margin: 12px 0; }
.aparencia-titulo { font-size: 0.85rem; font-weight: 700; color: #33475b; margin-bottom: 6px; }
.aparencia-opcoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.aparencia-opcao { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 8px 6px; border: 2px solid var(--cinza-borda); border-radius: 10px; background: #fff; color: var(--texto); font-size: 0.8rem; cursor: pointer; min-height: 72px; }
.aparencia-opcao.ativa { border-color: var(--azul); box-shadow: 0 0 0 2px rgba(0,0,0,0.05); font-weight: 700; }
.aparencia-amostra { display: block; width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(0,0,0,0.15); }
.aparencia-amostra-texto { font-style: normal; font-weight: 800; color: var(--azul); line-height: 34px; }
.aparencia-caixa .btn-secondary { width: 100%; margin-top: 6px; }
@media print { .aparencia-fundo { display: none !important; } }

/* ---------- Inteligência SSMA: criticidade, reincidência, eficácia e IMP ---------- */
.radio-alto:has(input:checked) { background: #ffe0b2; border-color: #c26a00; }
.nc-criticidade { margin: 8px 0 4px; padding: 8px 10px; background: #fff; border: 1px dashed var(--vermelho); border-radius: 8px; }
.nc-criticidade-titulo { display: block; font-weight: 700; font-size: 0.85rem; margin-bottom: 6px; }
.criticidade-group { flex-wrap: wrap; }
.alerta-reincidencia { margin: 8px 0 0; padding: 6px 8px; border-radius: 6px; background: #f8d7da; color: #58151c; font-weight: 700; font-size: 0.85rem; }

.kpi-grid-acoes { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
.acao-topo { display: flex; flex-wrap: wrap; gap: 4px; }
.acao-evidencia { margin: 6px 0; font-size: 0.85rem; }
.acao-falha { color: #58151c; }
.acao-card .btn-verificar-eficacia, .acao-card .btn-registrar-evidencia { margin: 6px 0; }

.dialogo-fundo { position: fixed; inset: 0; z-index: 75; background: rgba(10, 20, 30, 0.45); display: flex; align-items: flex-end; justify-content: center; padding: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
@media (min-width: 700px) { .dialogo-fundo { align-items: center; } }
.dialogo-caixa { background: #fff; color: var(--texto); border-radius: 12px; width: min(560px, 100%); max-height: 88vh; overflow-y: auto; padding: 14px 16px; box-shadow: 0 8px 28px rgba(0,0,0,0.25); }
.dialogo-caixa h2 { margin: 0 0 6px; font-size: 1.1rem; }
@media print { .dialogo-fundo { display: none !important; } }

.secao-titulo { font-size: 1.05rem; margin: 18px 0 8px; }
.pontos-atencao { list-style: none; margin: 0; padding: 0; }
.pontos-atencao li { padding: 8px 0; border-bottom: 1px solid var(--cinza-borda); font-size: 0.9rem; line-height: 1.4; }
.pontos-atencao li:last-child { border-bottom: none; }
.ponto-marca { display: inline-block; min-width: 84px; margin-right: 8px; padding: 1px 6px; border-radius: 4px; font-size: 0.72rem; font-weight: 700; text-align: center; }
.ponto-n3 .ponto-marca { background: #f8d7da; color: #58151c; }
.ponto-n2 .ponto-marca { background: #ffe0b2; color: #7a4100; }
.ponto-n1 .ponto-marca { background: var(--tom-claro); color: var(--tom-texto); }

.calor-rolagem { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.calor-tabela { border-collapse: separate; border-spacing: 2px; font-size: 0.82rem; min-width: 100%; }
.calor-tabela th { font-weight: 600; text-align: left; padding: 4px 6px; color: var(--texto); }
.calor-tabela thead th { vertical-align: bottom; max-width: 90px; font-size: 0.75rem; line-height: 1.2; }
.calor-tabela tbody th { white-space: nowrap; max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
.calor-tabela td { min-width: 44px; height: 36px; text-align: center; font-weight: 700; border-radius: 4px; cursor: default; }
.calor-tabela td sup { font-size: 0.65rem; margin-left: 1px; }
.calor-vazio { background: #f3f4f1; color: #a0a69a; font-weight: 400 !important; }
.calor-legenda { display: flex; align-items: center; gap: 4px; margin-top: 8px; font-size: 0.75rem; color: #555; }
.calor-legenda i { display: inline-block; width: 22px; height: 12px; border-radius: 2px; }

.area-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; flex-wrap: wrap; }
.area-topo h3 { margin: 0; }
.imp-selo { font-size: 0.75rem; font-weight: 700; padding: 3px 8px; border-radius: 12px; background: #eceee8; color: #333; }
.imp-verde.imp-selo, .kpi.imp-verde { background: #d1e7dd; color: #0a3622; }
.imp-amarelo.imp-selo, .kpi.imp-amarelo { background: #fff3cd; color: #5c3c00; }
.imp-laranja.imp-selo, .kpi.imp-laranja { background: #ffe0b2; color: #7a4100; }
.imp-vermelho.imp-selo, .kpi.imp-vermelho { background: #f8d7da; color: #58151c; }
.kpi.imp-verde { border-left-color: var(--verde); }
.kpi.imp-amarelo { border-left-color: var(--amarelo); }
.kpi.imp-laranja { border-left-color: #c26a00; }
.kpi.imp-vermelho { border-left-color: var(--vermelho); }
.area-numeros { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 10px 0; }
.area-numeros div { background: var(--cinza-bg); border-radius: 6px; padding: 6px; text-align: center; }
.area-numeros dt { font-size: 0.7rem; color: #555; }
.area-numeros dd { margin: 2px 0 0; font-size: 1.15rem; font-weight: 700; }
.area-numeros dd.num-alerta { color: var(--vermelho); }
.area-linha { margin: 4px 0; font-size: 0.86rem; }
.tend { font-weight: 700; }
.tend-sobe { color: var(--vermelho); }
.tend-desce { color: var(--verde); }
.area-detalhe { margin: 6px 0; font-size: 0.85rem; }
.area-detalhe summary { cursor: pointer; color: var(--azul); }
.imp-tabela { width: 100%; border-collapse: collapse; margin-top: 6px; }
.imp-tabela td { padding: 3px 0; border-bottom: 1px solid var(--cinza-borda); }
.imp-tabela td:last-child { text-align: right; font-weight: 700; }
.tabela-simples { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.tabela-simples th, .tabela-simples td { text-align: left; padding: 6px 4px; border-bottom: 1px solid var(--cinza-borda); vertical-align: top; }
#form-criterios small { display: block; color: #555; font-weight: 400; margin-top: 2px; }

/* ---------- Ações da equipe e perfis ---------- */
.equipe-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 4px 0 10px; }
.equipe-barra .hint { margin: 0; flex-basis: 100%; }
.check-inline { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 0.9rem; }
.check-inline input { width: auto; margin: 0; }
.acao-card input:disabled { background: #f1f2ee; color: #555; }