/* Jornada Integrada — só o que o /assets/site.css não cobre.
   Mobile primeiro: as regras base valem para telefone e as media queries
   acrescentam colunas em telas maiores. */

.j-app { padding: 30px 0 60px; }
.j-sub { color: var(--d); max-width: 62ch; }
.j-dica { display: block; margin-top: 4px; font-size: .78rem; color: var(--d2); }
.j-req { font-weight: 400; color: var(--d2); font-size: .74rem; }
.j-volta { margin-bottom: 10px; font-size: .86rem; }
.j-volta a { color: var(--d); }
.j-nota { color: var(--d); font-size: .86rem; margin-top: 12px; }
.j-vazio { color: var(--d); padding: 18px 0; }
.j-carregando { color: var(--d); padding: 40px 0; }

/* botão principal: mesmo vermelho do CTA do menu (.nc) */
.j-primario {
  background: var(--r); border: 1px solid var(--r); color: #fff;
  font-weight: 700; padding: 11px 22px; border-radius: 40px;
  text-decoration: none; display: inline-block; cursor: pointer;
}
.j-primario:hover { background: var(--rd); border-color: var(--rd); }
.j-primario:disabled { opacity: .55; cursor: default; }

/* O site.css só estiliza ".filtro button": um <button> solto fica com o cinza
   padrão do navegador. Estes são os secundários do app, no mesmo desenho. */
.j-sair, .j-apagar, .j-mais-problema, .j-tirar-problema {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb);
  border-radius: 30px; padding: 8px 16px; color: var(--b);
  font-family: inherit; font-size: .84rem; font-weight: 600; cursor: pointer;
}
.j-sair:hover, .j-apagar:hover, .j-mais-problema:hover { color: var(--w); border-color: var(--g); }
.j-apagar:hover { color: #ff9a9a; border-color: rgba(255, 154, 154, .4); }
.j-sair:disabled, .j-apagar:disabled, .j-mais-problema:disabled { opacity: .5; cursor: default; }
.j-sair { padding: 6px 14px; font-size: .8rem; }

/* ─── entrada: cadastro e login ─────────────────────────────── */
.j-entrada { display: grid; gap: 16px; }
.j-entrada .box h2 { font-size: 1.2rem; margin-bottom: 14px; }
.j-entrada form .bts { margin-top: 14px; }

.j-etapas-demo { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 26px; }
.j-etapas-demo span {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb);
  border-radius: 30px; padding: 5px 13px; font-size: .78rem; color: var(--d);
}
.j-etapas-demo span + span::before { content: '→ '; color: var(--g); }

/* ─── trilha das quatro etapas ──────────────────────────────── */
.j-trilha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 14px; }
.j-trilha a {
  font-size: .78rem; color: var(--d); text-decoration: none;
  border: 1px solid var(--cb); border-radius: 30px; padding: 5px 13px;
}
.j-trilha a:hover { color: var(--w); border-color: var(--g); }
.j-trilha a[aria-current="step"] {
  color: #fff; background: var(--r); border-color: var(--r); font-weight: 700;
}
.j-pct { font-size: .78rem; color: var(--g); font-weight: 700; margin-left: 4px; }

/* ─── painel ────────────────────────────────────────────────── */
.j-box-nova { margin-bottom: 30px; }
.j-box-nova h2 { font-size: 1.2rem; }
.j-box-nova .bts { margin-top: 14px; }
.j-lista-tit { font-size: 1.05rem; color: var(--d); margin: 0 0 14px; font-weight: 600; }

.j-cartao { margin-bottom: 14px; }
.j-cartao h3 { font-size: 1.1rem; color: var(--w); margin-bottom: 6px; font-weight: 700; }
.j-cartao h3 a { color: inherit; text-decoration: none; }
.j-cartao h3 a:hover { color: var(--g); }
.j-cartao-desc { color: var(--d); font-size: .9rem; margin-bottom: 10px; }
.j-cartao-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  font-size: .8rem; color: var(--d2); margin-bottom: 10px;
}
.j-cartao-pct { color: var(--g); font-weight: 700; }
.j-cartao .bts { margin-top: 14px; }

.j-barra { height: 5px; background: rgba(255, 255, 255, .06); border-radius: 4px; overflow: hidden; }
.j-barra span { display: block; height: 100%; background: var(--g); border-radius: 4px; }

/* ─── etapa GUT ─────────────────────────────────────────────── */
.j-legenda { display: grid; gap: 6px; margin: 16px 0 20px; font-size: .84rem; }
.j-legenda div { display: flex; gap: 8px; }
.j-legenda dt { color: var(--w); font-weight: 700; min-width: 86px; }
.j-legenda dd { color: var(--d); margin: 0; }

/* No telefone cada problema é um bloco; as notas ficam em linha embaixo. */
.j-gut-cab { display: none; }
.j-gut-linha {
  display: grid; grid-template-columns: repeat(3, 1fr) auto; gap: 8px;
  align-items: end; padding: 12px 0; border-bottom: 1px solid var(--cb);
}
.j-gut-linha .campo:first-child { grid-column: 1 / -1; }
.j-gut-linha select { width: 100%; }
.j-gut-linha .campo:not(:first-child)::before {
  content: attr(data-sigla); display: block; font-size: .72rem;
  color: var(--d2); font-weight: 700; margin-bottom: 3px;
}
.j-tirar-problema {
  border-radius: 10px; padding: 11px 14px; line-height: 1;
  color: var(--d); font-size: 1.1rem;
}
.j-tirar-problema:hover { color: #ff9a9a; border-color: rgba(255, 154, 154, .4); }
.j-form-gut .bts { margin-top: 18px; }
.j-limite { font-size: .8rem; color: var(--d2); margin-top: 8px; }

.j-resultado-gut { margin-top: 22px; }
/* O site.css estiliza tabela só dentro de ".texto" (prosa dos artigos). Aqui
   repetimos os mesmos valores, sem puxar o resto da cascata de texto corrido. */
.j-resultado-gut table { width: 100%; border-collapse: collapse; }
.j-resultado-gut th, .j-resultado-gut td {
  padding: 10px 12px; border-bottom: 1px solid var(--cb); text-align: left;
}
.j-resultado-gut th { color: var(--w); background: var(--card2); font-weight: 700; font-size: .84rem; }
.j-resultado-gut tr:last-child td { border-bottom: 0; }
/* As colunas de nota são estreitas e centradas; o nome do problema fica com o resto. */
.j-resultado-gut th:first-child, .j-resultado-gut td:first-child { width: 36px; color: var(--d2); }
.j-resultado-gut th:nth-child(n+3), .j-resultado-gut td:nth-child(n+3) {
  width: 52px; text-align: center; white-space: nowrap;
}
.j-resultado-gut td:last-child { color: var(--g); }
.j-resultado-gut .j-topo td { background: rgba(214, 179, 112, .07); }
.j-resultado-gut .ctabox { margin-top: 20px; display: block !important; }

@media (min-width: 620px) {
  .j-gut-cab {
    display: grid; grid-template-columns: 1fr 76px 76px 76px 46px; gap: 8px;
    font-size: .78rem; font-weight: 700; color: var(--d); margin-bottom: 4px;
  }
  .j-gut-linha {
    grid-template-columns: 1fr 76px 76px 76px 46px;
    align-items: center; border-bottom: 0; padding: 4px 0;
  }
  .j-gut-linha .campo:first-child { grid-column: auto; }
  .j-gut-linha .campo:not(:first-child)::before { content: none; }
  .j-legenda div { gap: 10px; }
}

@media (min-width: 860px) {
  .j-entrada { grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
  .j-legenda { grid-template-columns: repeat(3, 1fr); }
  .j-legenda div { flex-direction: column; gap: 2px; }
  .j-legenda dt { min-width: 0; }
}

.j-rod { color: var(--d2); font-size: .84rem; }
.j-rod a { color: var(--d); }

/* ─── etapa Ishikawa (6 Ms) ─────────────────────────────────── */
.j-campo-problema { margin-bottom: 20px; }
.j-dica-problema { display: block; margin-top: 4px; font-size: .78rem; color: var(--d2); }
.j-dica-problema a { color: var(--g); }

.j-categorias { display: grid; gap: 14px; margin-bottom: 20px; }
.j-categoria {
  border: 1px solid var(--cb); border-radius: 12px; padding: 14px; margin: 0;
  background: rgba(255, 255, 255, .015);
}
.j-categoria legend { padding: 0 6px; color: var(--w); font-weight: 700; font-size: .98rem; }
.j-cat-ajuda { color: var(--d2); font-size: .78rem; margin: 0 0 12px; }

.j-causa { padding: 10px 0; border-top: 1px solid var(--cb); }
.j-causa:first-child { border-top: 0; padding-top: 0; }
.j-causa-topo { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
.j-causa-detalhe { display: grid; gap: 8px; margin-top: 8px; padding-left: 2px; }
.j-causa-detalhe input[type="text"], .j-causa-detalhe input:not([type]) { font-size: .9rem; }
.j-tirar-causa {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb); border-radius: 10px;
  padding: 10px 13px; color: var(--d); font-size: 1.05rem; line-height: 1; cursor: pointer;
}
.j-tirar-causa:hover { color: #ff9a9a; border-color: rgba(255, 154, 154, .4); }
.j-mais-causa {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb); border-radius: 30px;
  padding: 7px 15px; color: var(--b); font-family: inherit; font-size: .82rem;
  font-weight: 600; cursor: pointer; margin-top: 10px;
}
.j-mais-causa:hover { color: var(--w); border-color: var(--g); }
.j-mais-causa:disabled { opacity: .45; cursor: default; }

.j-verificada { display: flex; align-items: center; gap: 8px; font-size: .82rem; color: var(--b); cursor: pointer; }
.j-verificada input { width: 17px; height: 17px; accent-color: var(--g); flex: none; }

/* ─── diagrama de causa e efeito ────────────────────────────── */
.j-diagrama { margin-top: 22px; }
.j-efeito {
  border-left: 3px solid var(--r); padding: 8px 0 8px 12px;
  color: var(--w); font-weight: 700; margin-bottom: 18px;
}
.j-efeito span {
  display: block; font-size: .72rem; color: var(--d2);
  font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
}
.j-espinhas { display: grid; gap: 16px; }
.j-espinha { border-left: 2px solid var(--cb); padding-left: 13px; }
.j-espinha h3 { color: var(--g); font-size: .9rem; font-weight: 700; margin: 0 0 8px; }
.j-espinha ul { list-style: none; margin: 0; padding: 0; }
.j-espinha > ul > li { margin-bottom: 10px; font-size: .88rem; }
.j-causa-txt { color: var(--b); }
.j-selo {
  display: inline-block; margin-left: 6px; font-size: .68rem; font-weight: 700;
  border-radius: 20px; padding: 2px 9px; vertical-align: middle; white-space: nowrap;
}
.j-hipotese .j-selo { background: rgba(214, 179, 112, .14); color: var(--g); }
.j-comprovada .j-selo { background: rgba(127, 211, 154, .13); color: #7fd39a; }
.j-subs { margin: 5px 0 0 14px !important; }
.j-subs li { font-size: .8rem; color: var(--d); margin-bottom: 3px; }
.j-subs li::before { content: '– '; color: var(--d2); }
.j-diagrama .ctabox { margin-top: 20px; display: block !important; }

@media (min-width: 720px) {
  .j-categorias { grid-template-columns: 1fr 1fr; }
  .j-espinhas { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1040px) {
  .j-categorias { grid-template-columns: repeat(3, 1fr); }
  .j-espinhas { grid-template-columns: repeat(3, 1fr); }
}

/* ─── etapa 5 Porquês ───────────────────────────────────────── */
.j-campo-causa { margin-bottom: 20px; }
.j-dica-causa { display: block; margin-top: 4px; font-size: .78rem; color: var(--d2); }
.j-dica-causa a { color: var(--g); }

.j-porques { display: grid; gap: 12px; margin-bottom: 16px; }
.j-porque {
  border: 1px solid var(--cb); border-radius: 12px; padding: 14px;
  background: rgba(255, 255, 255, .015); display: grid; gap: 10px;
}
.j-porque-n {
  font-size: .74rem; font-weight: 700; color: var(--g);
  text-transform: uppercase; letter-spacing: .06em;
}
.j-porque-extra { display: grid; gap: 10px; align-items: center; }
.j-tirar-porque {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb); border-radius: 10px;
  padding: 9px 13px; color: var(--d); font-size: 1.05rem; line-height: 1;
  cursor: pointer; justify-self: start;
}
.j-tirar-porque:hover { color: #ff9a9a; border-color: rgba(255, 154, 154, .4); }
.j-mais-porque {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb); border-radius: 30px;
  padding: 8px 16px; color: var(--b); font-family: inherit; font-size: .84rem;
  font-weight: 600; cursor: pointer;
}
.j-mais-porque:hover { color: var(--w); border-color: var(--g); }
.j-mais-porque:disabled { opacity: .45; cursor: default; }
.j-limite-porques { font-size: .8rem; color: var(--d2); margin-top: 8px; }

/* alerta de análise rasa: chama atenção sem parecer erro do cliente */
.j-alertas { margin-top: 20px; }
.j-box-alerta { border-color: rgba(214, 179, 112, .3); }
.j-box-alerta h2 { font-size: 1.1rem; color: var(--g); }
.j-lista-alertas { list-style: none; margin: 0 0 12px; padding: 0; }
.j-alerta {
  display: flex; gap: 8px; align-items: baseline; font-size: .88rem;
  color: var(--b); padding: 9px 0; border-top: 1px solid var(--cb);
}
.j-alerta:first-child { border-top: 0; }
.j-alerta-n {
  flex: none; font-size: .72rem; font-weight: 700; color: var(--g);
  background: rgba(214, 179, 112, .14); border-radius: 20px; padding: 2px 8px;
}

.j-box-conclusao { margin-top: 20px; }
.j-box-conclusao h2 { font-size: 1.15rem; }

/* a cadeia montada, em degraus */
.j-cadeia { margin-top: 22px; }
.j-escada { list-style: none; margin: 0 0 18px; padding: 0; counter-reset: pq; }
.j-escada li {
  counter-increment: pq; border-left: 2px solid var(--cb);
  padding: 0 0 16px 14px; position: relative;
}
.j-escada li::before {
  content: counter(pq); position: absolute; left: -11px; top: 0;
  width: 20px; height: 20px; border-radius: 50%; background: var(--card2);
  border: 1px solid var(--cb); color: var(--g); font-size: .68rem;
  font-weight: 700; display: grid; place-items: center;
}
.j-escada li:last-child { border-left-color: transparent; padding-bottom: 0; }
.j-escada-p { color: var(--d); font-size: .84rem; margin: 0 0 3px; }
.j-escada-r { color: var(--w); font-size: .92rem; margin: 0; }
.j-escada-e { color: var(--d2); font-size: .78rem; margin: 4px 0 0; }
.j-sh { background: rgba(214, 179, 112, .14); color: var(--g); }
.j-sv { background: rgba(127, 211, 154, .13); color: #7fd39a; }
.j-raiz {
  border-left: 3px solid var(--g); padding: 10px 0 10px 13px;
  color: var(--w); font-weight: 700;
}
.j-raiz span {
  display: block; font-size: .72rem; color: var(--d2); font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em;
}
.j-cadeia .ctabox { margin-top: 20px; display: block !important; }

@media (min-width: 720px) {
  .j-porque-extra { grid-template-columns: auto 1fr auto; }
}

/* ─── etapa 5W2H ────────────────────────────────────────────── */
.j-causa-origem { border-left: 3px solid var(--g); padding: 8px 0 8px 12px; color: var(--w); }
.j-causa-origem .j-de {
  display: block; font-size: .72rem; color: var(--d2); font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em;
}
.j-causa-origem a { color: var(--g); }

.j-acoes { display: grid; gap: 14px; margin: 18px 0; }
.j-acao {
  border: 1px solid var(--cb); border-radius: 12px; padding: 14px;
  background: rgba(255, 255, 255, .015);
}
.j-acao-cab { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.j-acao-n {
  font-size: .74rem; font-weight: 700; color: var(--g);
  text-transform: uppercase; letter-spacing: .06em;
}
.j-tirar-acao {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb); border-radius: 10px;
  padding: 7px 12px; color: var(--d); font-size: 1.05rem; line-height: 1; cursor: pointer;
}
.j-tirar-acao:hover { color: #ff9a9a; border-color: rgba(255, 154, 154, .4); }
.j-campos-7, .j-campos-ef { display: grid; gap: 10px; }
.j-mais-acao {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb); border-radius: 30px;
  padding: 8px 16px; color: var(--b); font-family: inherit; font-size: .84rem;
  font-weight: 600; cursor: pointer;
}
.j-mais-acao:hover { color: var(--w); border-color: var(--g); }
.j-mais-acao:disabled { opacity: .45; cursor: default; }
.j-limite-acoes { font-size: .8rem; color: var(--d2); margin-top: 8px; }

.j-eficacia { margin-top: 12px; border-top: 1px solid var(--cb); padding-top: 10px; }
.j-eficacia summary {
  cursor: pointer; font-size: .82rem; font-weight: 700; color: var(--g);
  list-style: none; padding: 4px 0;
}
.j-eficacia summary::before { content: '▸ '; }
.j-eficacia[open] summary::before { content: '▾ '; }
.j-eficacia summary::-webkit-details-marker { display: none; }
.j-campos-ef { margin-top: 10px; }

.j-resumo-plano { margin-top: 22px; }
.j-placar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.j-placar div {
  background: rgba(255, 255, 255, .03); border: 1px solid var(--cb);
  border-radius: 12px; padding: 12px; text-align: center;
}
.j-placar strong { display: block; font-size: 1.5rem; color: var(--g); font-weight: 800; }
.j-placar span { font-size: .74rem; color: var(--d); }
.j-resumo-plano .ctabox { margin-top: 18px; display: block !important; }

/* ─── relatório consolidado ─────────────────────────────────── */
.j-acoes-relatorio { margin-top: 16px; }
.j-compartilhar, .j-copiar {
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cb); border-radius: 30px;
  padding: 11px 20px; color: var(--b); font-family: inherit; font-size: .88rem;
  font-weight: 600; cursor: pointer;
}
.j-compartilhar:hover, .j-copiar:hover { color: var(--w); border-color: var(--g); }
.j-link-rel { font-weight: 700; }

.j-relatorio {
  background: var(--card); border: 1px solid var(--cb);
  border-radius: 14px; padding: 24px; margin-top: 10px;
}
.j-rel-cab { border-bottom: 1px solid var(--cb); padding-bottom: 18px; margin-bottom: 22px; }
.j-rel-marca { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.j-rel-marca strong { display: block; color: var(--w); font-size: .94rem; }
.j-rel-marca span { font-size: .76rem; color: var(--d2); }
.j-rel-cab h1 { font-size: clamp(1.4rem, 3vw, 1.9rem); margin-bottom: 8px; }
.j-rel-meta { font-size: .8rem; color: var(--d2); }
.j-rel-desc { color: var(--b); margin-top: 10px; }

.j-sec { margin-bottom: 28px; }
.j-sec h2 { font-size: 1.12rem; color: var(--g); margin-bottom: 12px; }
.j-sec h3 { font-size: .95rem; color: var(--w); margin: 0 0 6px; font-weight: 700; }
.j-rel-tab { width: 100%; border-collapse: collapse; margin-bottom: 10px; }
.j-rel-tab th, .j-rel-tab td { padding: 9px 10px; border-bottom: 1px solid var(--cb); text-align: left; }
.j-rel-tab th { color: var(--w); background: var(--card2); font-size: .8rem; }
.j-rel-tab th:nth-child(n+3), .j-rel-tab td:nth-child(n+3) { text-align: center; width: 48px; }
.j-rel-tab .j-topo td { background: rgba(214, 179, 112, .07); }
.j-rel-nota { font-size: .82rem; color: var(--d2); margin-top: 8px; }
.j-rel-fam { margin-bottom: 14px; }
.j-rel-fam ul { margin: 0 0 0 18px; padding: 0; }
.j-rel-fam li { margin-bottom: 7px; font-size: .9rem; }
.j-rel-ev { font-size: .78rem; color: var(--d2); }
.j-rel-sintese { margin-top: 12px; font-size: .9rem; }
.j-rel-escada { list-style: none; margin: 0 0 14px; padding: 0; counter-reset: rp; }
.j-rel-escada li {
  counter-increment: rp; border-left: 2px solid var(--cb);
  padding: 0 0 14px 14px; position: relative;
}
.j-rel-escada li::before {
  content: counter(rp); position: absolute; left: -10px; top: 0; width: 18px; height: 18px;
  border-radius: 50%; background: var(--card2); border: 1px solid var(--cb);
  color: var(--g); font-size: .64rem; font-weight: 700; display: grid; place-items: center;
}
.j-rel-ressalva {
  border: 1px solid rgba(214, 179, 112, .3); border-radius: 12px;
  padding: 12px 14px; margin-top: 12px; font-size: .86rem;
}
.j-rel-ressalva strong { color: var(--g); display: block; margin-bottom: 6px; }
.j-rel-ressalva ul { margin: 0 0 0 18px; padding: 0; }
.j-rel-placar { margin-bottom: 18px; }
.j-rel-acao { border-top: 1px solid var(--cb); padding: 14px 0; }
.j-rel-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 10px; }
.j-rel-7 { display: grid; gap: 7px; margin: 0; font-size: .88rem; }
.j-rel-7 div { display: grid; grid-template-columns: 160px 1fr; gap: 10px; }
.j-rel-7 dt { color: var(--d2); font-size: .8rem; font-weight: 600; }
.j-rel-7 dd { margin: 0; color: var(--b); }
.j-rel-pend { margin: 0 0 0 18px; padding: 0; font-size: .9rem; }
.j-rel-pend li { margin-bottom: 6px; }
.j-rel-rod { border-top: 1px solid var(--cb); padding-top: 16px; margin-top: 26px; font-size: .84rem; }
.j-rel-rod strong { color: var(--w); }
.j-url { color: var(--g); }

@media (min-width: 620px) {
  .j-campos-7 { grid-template-columns: 1fr 1fr; }
  .j-campos-7 .inteiro { grid-column: 1 / -1; }
  .j-campos-ef { grid-template-columns: 1fr 1fr; }
  .j-campos-ef .inteiro { grid-column: 1 / -1; }
}

/* ─── impressão: vira documento claro, com a marca da SDQuality ── */
@media print {
  .topo, .rod, .j-sem-impressao, .pular { display: none !important; }
  html, body { background: #fff !important; color: #1a1a1a !important; }
  main { padding: 0 !important; }
  .w { max-width: none; padding: 0; }
  .j-relatorio {
    background: #fff !important; border: 0 !important;
    border-radius: 0 !important; padding: 0 !important; margin: 0 !important;
  }
  .j-tela[hidden] { display: none !important; }
  .j-rel-cab h1, .j-sec h3, .j-rel-marca strong, .j-rel-rod strong,
  .j-rel-7 dd, .j-rel-desc, .j-rel-fam li, .j-rel-pend li,
  .j-rel-sintese, .j-rel-rod p { color: #1a1a1a !important; }
  .j-sec h2 { color: #B30718 !important; border-bottom: 1px solid #ddd; padding-bottom: 4px; }
  .j-rel-meta, .j-rel-nota, .j-rel-ev, .j-rel-7 dt, .j-rel-marca span { color: #555 !important; }
  .j-url { color: #B30718 !important; }
  .j-rel-cab, .j-rel-rod, .j-rel-acao, .j-rel-tab th, .j-rel-tab td { border-color: #ddd !important; }
  .j-rel-tab th { background: #f3f3f3 !important; color: #000 !important; }
  .j-rel-tab .j-topo td { background: #faf5e8 !important; }
  .j-rel-escada li, .j-raiz, .j-causa-origem { border-left-color: #ccc !important; }
  .j-rel-escada li::before { background: #f3f3f3 !important; color: #B30718 !important; border-color: #ccc !important; }
  .j-raiz { border-left-color: #B30718 !important; }
  .j-raiz, .j-escada-r { color: #000 !important; }
  .j-escada-p, .j-escada-e { color: #555 !important; }
  .j-rel-ressalva { border-color: #ccc !important; }
  .j-rel-ressalva strong { color: #B30718 !important; }
  .j-selo { border: 1px solid #ccc; color: #333 !important; background: none !important; }
  .chip { border: 1px solid #ccc !important; background: none !important; color: #333 !important; }
  .j-placar div { border: 1px solid #ddd !important; background: none !important; }
  .j-placar strong { color: #B30718 !important; }
  .j-placar span { color: #555 !important; }
  /* Não partir uma ação nem uma família de causas no meio da página. A seção
     inteira fica de fora: com muitas ações ela empurraria páginas quase vazias. */
  .j-rel-acao, .j-rel-fam, .j-rel-escada li { break-inside: avoid; }
  .j-sec h2 { break-after: avoid; }
  .j-rel-cab { break-after: avoid; }
  a[href^="#"]::after { content: ''; }
}

/* selo do plano no painel */
.j-selo-plano { background: rgba(214, 179, 112, .14); border-color: rgba(214, 179, 112, .3); color: var(--g); }
.j-plano-uso { font-size: .82rem; color: var(--d2); }

/* Botão de liberar/renovar nível, mostrado junto ao aviso de limite. */
.j-pagar{display:inline-block;margin:10px 0 0;padding:11px 18px;border:0;border-radius:30px;
  background:#B30718;color:#fff;font:800 14px/1 inherit;cursor:pointer}
.j-pagar:hover{background:#8f0513}
.j-pagar:disabled{opacity:.6;cursor:default}

/* Justificativa das notas do GUT: linha inteira abaixo do problema. */
.j-gut-linha .j-justif{grid-column:1/-1;margin-top:6px}
.j-linha-justif td{font-size:.85rem;color:var(--d);font-style:italic;padding-top:0}
@media print{.j-linha-justif td{color:#444}}

/* Causas que podem competir pela explicação (§5.3) e filtro de ações (§5.4). */
.j-box-concorrentes{border-left:3px solid var(--go,#D6B370)}
.j-outras-causas{margin:8px 0 0;padding-left:18px}
.j-outras-causas li{margin-bottom:4px}
.j-filtro-acoes{margin-bottom:14px}
.j-acao[hidden]{display:none}
@media print{.j-box-concorrentes,.j-filtro-acoes{display:none!important}}