/**
 * Não Conformidades — a tela de rede.
 *
 * Quase tudo aqui já vem de `dados.css` (tabela, métricas, selos, chips): o
 * arquivo só carrega o que é próprio desta tela. Nenhuma cor literal, como
 * no resto do projeto.
 */

/* Barra proporcional das "principais causas". Estava em `pages/central.css`
   enquanto a Central mostrava causas; mudou de arquivo junto com a seção. */
.proporcoes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--e-3);
}
.proporcao__topo {
  display: flex;
  justify-content: space-between;
  gap: var(--e-2);
  font-size: var(--txt-sm);
}
.proporcao__rotulo { color: var(--texto); min-width: 0; overflow-wrap: anywhere; }
.proporcao__valor {
  color: var(--texto-2);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.proporcao__trilho {
  margin-top: 4px;
  height: 8px;
  border-radius: 999px;
  background: var(--surface-2);
  overflow: hidden;
}
.proporcao__barra { height: 100%; border-radius: 999px; background: var(--azul-500); }