/* Observatório — coleta.css
   Estilos específicos da tela de coletas
   (coleta-* / seção 20)
   Incluído apenas em templates/coleta.html
*/
/* ============================================================
   20. COLETA v2 — layout da tela de coletas
   ============================================================ */

/* — Grid principal: pipeline (40%) + histórico (60%) — */
.operation-hero-v4 {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: end;
  gap: var(--space-4);
  min-height: 250px;
  padding: var(--space-6) var(--space-5);
}

.operation-hero-v4::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, transparent 12%, rgba(11, 17, 24, 0.94) 92%);
}

.operation-hero-constellation {
  position: absolute;
  top: -18px;
  right: -42px;
  width: min(64vw, 250px);
  opacity: 0.32;
  pointer-events: none;
}

.operation-hero-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 9px;
  border: 1px solid rgba(126, 224, 193, 0.28);
  border-radius: var(--radius-lg);
  background: rgba(126, 224, 193, 0.08);
  color: var(--obs-menta);
}

.operation-hero-copy { position: relative; z-index: 1; }
.operation-hero-copy h1 {
  max-width: 18ch;
  font-size: clamp(2rem, 9vw, 3rem);
  line-height: 1.08;
}
.operation-hero-copy p { max-width: 58ch; color: var(--color-text-2); }

.operation-hero-horizon {
  position: absolute;
  right: 0;
  bottom: 18px;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(214, 178, 109, 0.32), transparent);
}
.operation-hero-horizon span {
  position: absolute;
  top: 50%;
  left: 78%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--obs-marfim);
  box-shadow: 0 0 16px 4px rgba(214, 178, 109, 0.5);
  transform: translate(-50%, -50%);
}

@media (min-width: 768px) {
  .operation-hero-v4 { min-height: 310px; padding: var(--space-8); }
  .operation-hero-constellation {
    top: 50%;
    right: 5%;
    width: min(32vw, 390px);
    opacity: 0.4;
    transform: translateY(-50%);
  }
  .operation-hero-icon { width: 52px; height: 52px; padding: 10px; }
  .operation-hero-copy h1 { font-size: clamp(2.75rem, 5vw, 4rem); }
}

.coleta-main-grid {
  display: grid;
  grid-template-columns: 2fr 3fr;
  gap: var(--space-6);
  align-items: start;
}

.coleta-side-column {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  min-width: 0;
}

.coleta-job-monitor { overflow: hidden; }
.coleta-job-monitor-header { margin-bottom: 0; }

.coleta-job-running {
  padding: var(--space-5);
  border-top: 1px solid var(--color-border);
  background: rgba(126, 224, 193, 0.035);
}

.coleta-job-active-head,
.coleta-job-active-meta,
.coleta-job-queue-title,
.coleta-job-item {
  display: flex;
  align-items: center;
}

.coleta-job-active-head { justify-content: space-between; gap: var(--space-4); }
.coleta-job-active-head > div { min-width: 0; }
.coleta-job-active-head a {
  display: block;
  color: var(--color-text);
  font-size: var(--text-base);
  font-weight: 600;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.coleta-job-active-head a:hover { color: var(--color-accent); }
.coleta-job-active-head > strong { color: var(--color-accent); font-size: var(--text-lg); }
.coleta-job-active-actions { display: flex; align-items: center; gap: var(--space-3); flex-shrink: 0; }
.coleta-job-active-actions strong { color: var(--color-accent); font-size: var(--text-lg); }
.coleta-job-active-actions form { margin: 0; }

.coleta-job-state {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: 3px;
  color: var(--color-text-3);
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.coleta-job-state i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-accent);
  box-shadow: 0 0 0 4px rgba(126, 224, 193, 0.1);
}
.coleta-job-running p { margin: var(--space-3) 0; color: var(--color-text-2); font-size: var(--text-sm); }
.coleta-job-progress-track { height: 5px; overflow: hidden; border-radius: var(--radius-full); background: var(--color-surface-2); }
.coleta-job-progress-track > div { height: 100%; width: 0; background: var(--color-accent); transition: width 0.25s ease; }
.coleta-job-active-meta { justify-content: space-between; gap: var(--space-4); margin-top: var(--space-2); color: var(--color-text-3); font-size: var(--text-xs); }

.coleta-job-queue-group { padding: var(--space-4) var(--space-5) var(--space-5); border-top: 1px solid var(--color-border); }
.coleta-job-queue-title { justify-content: space-between; margin-bottom: var(--space-3); }
.coleta-job-queue-title strong { font-size: var(--text-sm); }
.coleta-job-queue-title small { color: var(--color-text-3); font-size: var(--text-xs); }
.coleta-job-queue-list { display: flex; flex-direction: column; gap: 2px; }
.coleta-job-item { gap: var(--space-3); padding: var(--space-3); border-radius: var(--radius-sm); background: var(--color-surface-2); }
.coleta-job-item > div { flex: 1; min-width: 0; }
.coleta-job-item a { display: block; color: var(--color-text); font-size: var(--text-sm); font-weight: 500; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.coleta-job-item a:hover { color: var(--color-accent); }
.coleta-job-item small { display: block; margin-top: 2px; color: var(--color-text-3); font-size: var(--text-xs); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.coleta-job-position { display: grid; place-items: center; width: 24px; height: 24px; flex-shrink: 0; border: 1px solid rgba(214, 178, 109, 0.3); border-radius: 50%; color: var(--obs-gold-0); font-size: var(--text-xs); font-weight: 600; }
.coleta-job-item form { margin: 0; }
.coleta-job-cancel { width: 28px; height: 28px; border: 1px solid var(--color-border-md); border-radius: var(--radius-sm); background: transparent; color: var(--color-text-3); cursor: pointer; }
.coleta-job-cancel:hover { border-color: rgba(248, 113, 113, 0.4); color: var(--obs-error); background: rgba(248, 113, 113, 0.08); }

/* — Pipeline compacto — */
.coleta-pipeline {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.coleta-pipeline-stage {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-surface-2);
  transition: border-color var(--transition);
}
.coleta-pipeline-stage.is-complete { border-color: rgba(74,222,128,0.25); }
.coleta-pipeline-stage.is-active   { border-color: rgba(126,224,193,0.35); }
.coleta-pipeline-stage.is-error    { border-color: rgba(248,113,113,0.25); }

.coleta-pipeline-stage > summary { list-style: none; }
.coleta-pipeline-stage > summary::-webkit-details-marker { display: none; }

.coleta-pipeline-row {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  transition: background var(--transition);
}
.coleta-pipeline-row:hover { background: rgba(126,224,193,0.04); }

.coleta-pipeline-num {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  background: var(--color-surface);
  border: 1px solid var(--color-border-md);
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--color-text-2);
}
/* — Cores por origem de coleta — */
.coleta-pipeline-num--core {
  background: rgba(126, 224, 193, 0.12);
  border-color: rgba(126, 224, 193, 0.35);
  color: #7EE0C1;
}
.coleta-pipeline-num--wiki {
  background: rgba(123, 159, 212, 0.12);
  border-color: rgba(123, 159, 212, 0.35);
  color: #7B9FD4;
}
.coleta-pipeline-num--acervo {
  background: rgba(214, 178, 109, 0.12);
  border-color: rgba(214, 178, 109, 0.35);
  color: #D6B26D;
}

/* Status (complete / error) sobrepõe cor de origem */
.coleta-pipeline-stage.is-complete .coleta-pipeline-num {
  background: rgba(74,222,128,0.12);
  border-color: rgba(74,222,128,0.3);
  color: var(--obs-success);
}
.coleta-pipeline-stage.is-error .coleta-pipeline-num {
  background: rgba(248,113,113,0.12);
  border-color: rgba(248,113,113,0.3);
  color: var(--obs-error);
}

.coleta-pipeline-info {
  flex: 1;
  min-width: 0;
}
.coleta-pipeline-info strong { font-size: var(--text-sm); font-weight: 600; display: block; }
.coleta-pipeline-info small  { font-size: var(--text-xs); color: var(--color-text-3); }


.coleta-pipeline-cta {
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--color-accent);
  padding: 3px 10px;
  border: 1px solid rgba(126,224,193,0.3);
  border-radius: var(--radius-sm);
  flex-shrink: 0;
  transition: background var(--transition), border-color var(--transition);
  white-space: nowrap;
}
details[open].coleta-pipeline-stage .coleta-pipeline-cta {
  background: rgba(126,224,193,0.08);
  border-color: rgba(126,224,193,0.5);
}

.coleta-pipeline-form-panel {
  padding: var(--space-4) var(--space-5);
  border-top: 1px solid var(--color-border);
  background: var(--color-surface);
}

/* — Grid 2 colunas dentro do painel expandido: stats | form — */
.coleta-panel-grid {
  display: flex;
  gap: var(--space-5);
  align-items: flex-start;
}

.coleta-panel-stats {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  flex-shrink: 0;
  min-width: 72px;
  padding-right: var(--space-5);
  border-right: 1px solid var(--color-border);
}

.coleta-stat {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.coleta-stat strong {
  font-size: var(--text-xl);
  font-weight: 700;
  line-height: 1.1;
  color: var(--color-text);
}
.coleta-stat span {
  font-size: var(--text-xs);
  color: var(--color-text-3);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.coleta-stat--err strong { color: var(--obs-error); }

.coleta-panel-form {
  flex: 1;
  min-width: 0;
}

/* Mobile: empilha stats acima do form */
@media (max-width: 560px) {
  .coleta-panel-grid { flex-direction: column; gap: var(--space-3); }
  .coleta-panel-stats {
    flex-direction: row;
    gap: var(--space-5);
    padding-right: 0;
    padding-bottom: var(--space-3);
    border-right: none;
    border-bottom: 1px solid var(--color-border);
  }
}


/* — Seletor de período — */
.coleta-period-selector {
  display: flex;
  gap: 2px;
}

.coleta-period-btn {
  padding: 4px 10px;
  font-size: var(--text-xs);
  font-weight: 500;
  background: var(--color-surface);
  border: 1px solid var(--color-border-md);
  border-radius: var(--radius-sm);
  color: var(--color-text-2);
  cursor: pointer;
  transition: background var(--transition), color var(--transition), border-color var(--transition);
  white-space: nowrap;
}
.coleta-period-btn:hover {
  background: var(--color-surface-2);
  color: var(--color-text);
}
.coleta-period-btn.is-active {
  background: var(--obs-green-2);
  border-color: var(--obs-green-1);
  color: var(--obs-green-0);
}

/* — Formulário inline (pipeline + eventos) — */
.coleta-inline-form {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
}
.coleta-inline-form label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  color: var(--color-text-2);
}
.coleta-inline-form input {
  background: var(--color-surface-2);
  border: 1px solid var(--color-border-md);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  padding: 5px var(--space-3);
  font-size: var(--text-sm);
  width: 72px;
  transition: border-color var(--transition);
}
.coleta-inline-form input:focus { border-color: var(--color-accent); outline: none; }
.coleta-inline-form input[type="date"] { width: 136px; }
.coleta-inline-form button {
  padding: 5px var(--space-4);
  background: var(--obs-green-2);
  border: 1px solid var(--obs-green-1);
  border-radius: var(--radius-sm);
  color: var(--obs-green-0);
  font-size: var(--text-xs);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--transition);
}
.coleta-inline-form button:hover { background: rgba(77,160,138,0.3); }

/* — Eventos: bloco de métricas + forms — */
.coleta-eventos-resumo {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
  margin-bottom: var(--space-5);
}

.coleta-eventos-forms { border-top: 1px solid var(--color-border); padding-top: var(--space-5); }

.coleta-eventos-forms-label {
  display: block;
  font-size: var(--text-xs);
  color: var(--color-text-3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-4);
}

.coleta-eventos-forms-row {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.coleta-event-estimate {
  font-size: var(--text-xs);
  color: var(--color-text-3);
}

/* — Pontos de atenção: grid 2 colunas — */
.coleta-atencao-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

.atencao-counter-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-2);
  margin-bottom: var(--space-5);
}

.atencao-counter {
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface-2);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.atencao-counter > span   { font-size: var(--text-xs); color: var(--color-text-2); }
.atencao-counter > strong { font-family: var(--font-display); font-size: var(--text-xl); font-weight: 400; color: var(--color-text); line-height: 1.1; }
.atencao-counter > small  { font-size: var(--text-xs); color: var(--color-text-3); }
.atencao-counter.has-alert > strong { color: var(--obs-warning); }

.atencao-expandable { border-top: 1px solid var(--color-border); padding-top: var(--space-4); }
.atencao-expandable > summary {
  list-style: none;
  cursor: pointer;
  font-size: var(--text-sm);
  color: var(--color-accent);
  font-weight: 500;
  padding: var(--space-1) 0;
  transition: color var(--transition);
}
.atencao-expandable > summary::-webkit-details-marker { display: none; }
.atencao-expandable[open] > summary { color: var(--color-text-2); margin-bottom: var(--space-3); }

.atencao-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 420px;
  overflow-y: auto;
  padding-right: var(--space-1);
}

.atencao-group-label {
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--color-text-3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: var(--space-3) 0 var(--space-1);
}
.atencao-group-label:first-child { padding-top: 0; }

.atencao-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  border-left: 2px solid transparent;
  background: var(--color-surface-2);
  transition: background var(--transition);
}
.atencao-item:hover { background: var(--color-surface); }

.atencao-item.atencao-erro         { border-left-color: var(--obs-error); }
.atencao-item.atencao-parcial      { border-left-color: var(--obs-warning); }
.atencao-item.atencao-sem_candidatos { border-left-color: var(--obs-warning); }
.atencao-item.atencao-resumo_pendente { border-left-color: var(--color-accent); }
.atencao-item.atencao-sem_acervos  { border-left-color: var(--obs-gold-0); }
.atencao-item.atencao-incompleto   { border-left-color: var(--color-text-3); }

.atencao-item-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}
.atencao-item-head a,
.atencao-item-head strong {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text);
}
.atencao-item > small { font-size: var(--text-xs); color: var(--color-text-3); }

/* — Estado atual da coleta (resumo do pipeline) — */
.coleta-estado-link {
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--color-text-2);
  text-decoration: none;
  transition: color var(--transition);
}
.coleta-estado-link:hover { color: var(--color-accent); }

.coleta-estado-simbolo {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-surface);
  border: 1px solid var(--color-border-md);
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--color-text-2);
}
.obs-pipeline-stage.is-complete .coleta-estado-simbolo {
  background: rgba(74,222,128,0.12);
  border-color: rgba(74,222,128,0.3);
  color: var(--obs-success);
}
.obs-pipeline-stage.is-error .coleta-estado-simbolo {
  background: rgba(248,113,113,0.12);
  border-color: rgba(248,113,113,0.3);
  color: var(--obs-error);
}

/* — Variantes de cor por origem da etapa — */
.coleta-estado-simbolo--core {
  background: rgba(126, 224, 193, 0.12);
  border-color: rgba(126, 224, 193, 0.35);
  color: #7EE0C1;
}
.coleta-estado-simbolo--wiki {
  background: rgba(123, 159, 212, 0.12);
  border-color: rgba(123, 159, 212, 0.35);
  color: #7B9FD4;
}

/* — Seção unificada de estado — */
.coleta-grupo + .coleta-grupo {
  padding-top: var(--space-5);
  margin-top: var(--space-5);
  border-top: 1px solid var(--color-border);
}

.coleta-grupo-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-bottom: var(--space-3);
}

.coleta-grupo-titulo {
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--color-text-3);
  margin: 0 0 var(--space-3);
}
.coleta-grupo-head .coleta-grupo-titulo { margin-bottom: 0; }

.coleta-grupo-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
  align-items: start;
}

@media (min-width: 400px) {
  .coleta-grupo-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 900px) {
  .coleta-grupo-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
}

/* — Card de fonte (sem barra de progresso) — */
.coleta-stage-info {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.coleta-stage-info strong {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text);
}
.coleta-stage-sub {
  display: block;
  font-size: var(--text-xs);
  color: var(--color-text-3);
  font-weight: 400;
}
.coleta-stage-count {
  margin-top: var(--space-3);
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.coleta-stage-count strong {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.1;
}
.coleta-stage-count span {
  font-size: var(--text-xs);
  color: var(--color-text-3);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* — Cards em coluna estreita: sobrescritas escopadas — */
.coleta-grupo .obs-pipeline-head { align-items: flex-start; gap: var(--space-2); }
.coleta-grupo .obs-pipeline-label { flex: 1; min-width: 0; }
.coleta-grupo .coleta-stage-info  { min-width: 0; }
.coleta-grupo .coleta-stage-info strong {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coleta-grupo .obs-pipeline-pct {
  font-size: var(--text-base);
  font-weight: 700;
  flex-shrink: 0;
  padding-top: 2px;
}

/* Estado com preenchimento colorido (aplicado via classe no stage pai) */
.obs-pipeline-stage.is-complete .obs-pipeline-fill {
  background: linear-gradient(90deg, rgba(74,222,128,0.6), var(--obs-success));
}
.obs-pipeline-stage.is-error .obs-pipeline-fill {
  background: linear-gradient(90deg, rgba(248,113,113,0.5), var(--obs-error));
}

/* — Divisor: Horizonte de expansão — */
.coleta-pipeline-divider {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  padding: var(--space-5) var(--space-4) var(--space-3);
  border-top: 1px dashed rgba(214,178,109,0.2);
  margin-top: var(--space-2);
}
.coleta-pipeline-divider > span {
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--obs-gold-0);
}
.coleta-pipeline-divider > small {
  font-size: var(--text-xs);
  color: var(--color-text-3);
}

/* — Fontes planejadas — */
.coleta-pipeline-stage.is-planned {
  opacity: 0.65;
  border-style: dashed;
  border-color: rgba(214,178,109,0.15);
  transition: opacity var(--transition), border-color var(--transition);
}
.coleta-pipeline-stage.is-planned:hover {
  opacity: 0.9;
  border-color: rgba(214,178,109,0.3);
}
.coleta-pipeline-stage.is-planned .coleta-pipeline-num {
  border-style: dashed;
  border-color: rgba(214,178,109,0.25);
  background: rgba(214,178,109,0.06);
  color: var(--obs-gold-0);
}
.coleta-pipeline-stage.is-planned .coleta-pipeline-cta {
  color: var(--color-text-3);
  border-color: var(--color-border);
  pointer-events: none;
  font-style: italic;
}
.coleta-planned-desc {
  font-size: var(--text-xs);
  color: var(--color-text-3);
  margin: 0;
  font-style: italic;
}

/* — Responsivo: tablet e abaixo — */
@media (max-width: 1024px) {
  .coleta-main-grid    { grid-template-columns: 1fr; }
  .coleta-atencao-grid { grid-template-columns: 1fr; }
  .coleta-eventos-resumo { grid-template-columns: repeat(2, 1fr); }
}

/* — Mobile (≤ 640px) — */
@media (max-width: 640px) {

  /* Hero: padding reduzido */
  .operation-hero-v4 {
    padding: var(--space-5);
    border-radius: var(--radius-xl);
    grid-template-columns: 1fr;
    align-content: end;
  }

  /* Section headers: permite wrap para captions longas */
  .c-section-header { flex-wrap: wrap; }

  /* Pipeline row: padding reduzido no mobile */
  .coleta-pipeline-row {
    padding: var(--space-3);
  }
  /* Formulários: áreas de toque confortáveis */
  .coleta-inline-form input,
  .coleta-inline-form select,
  .coleta-inline-form button { min-height: 40px; padding: var(--space-2) var(--space-3); }
  .coleta-inline-form input[type="date"] { width: auto; }
  .coleta-period-btn { min-height: 36px; }

  /* Histórico: empilhar conteúdo e timestamp */
  .operation-process-item {
    flex-direction: column;
    gap: var(--space-2);
  }
  .operation-process-time {
    flex-direction: row;
    align-items: center;
    gap: var(--space-3);
    text-align: left;
  }

  /* Eventos históricos: coluna de rótulo mais estreita */
  .eventos-pipeline-row { grid-template-columns: 7rem 1fr auto; }

  /* Estado unificado: cabeçalho de grupo empilha no mobile */
  .coleta-grupo-head { flex-direction: column; gap: var(--space-2); }

  /* Cobertura: cards compactos em 2 colunas no mobile */
  .coleta-grupo .obs-pipeline-stage    { padding: var(--space-3); }
  .coleta-grupo .obs-pipeline-meta     { gap: var(--space-2); flex-wrap: wrap; }
  .coleta-grupo .coleta-stage-count strong { font-size: var(--text-xl); }

  /* Métrica não-acionável: omite "sem res." em telas pequenas */
  .coleta-meta-sem-res { display: none; }
}