/* =====================================================================
   OPCrim — site público
   Identidade visual oficial (OPCRIM_Tokens_de_Cor.css).
   ===================================================================== */

:root {
  --opcrim-black:      #141414;
  --opcrim-blue:       #334B6D;
  --opcrim-slate:      #6B7C8F;
  --opcrim-light-blue: #DCE3EA;
  --opcrim-off-white:  #F5F7FA;

  --texto:       var(--opcrim-black);
  /* O slate da marca (#6B7C8F) rende 4.28:1 no branco e 3.99:1 sobre o
     off-white — abaixo dos 4.5:1 que a WCAG AA exige para texto. A marca
     segue intacta em bordas, ícones e fundos; só o TEXTO secundário usa
     este tom um pouco mais escuro, que passa nos dois fundos. */
  --texto-suave: #5A6A78;
  --borda:       var(--opcrim-light-blue);
  --fundo:       #FFFFFF;
  --fundo-alt:   var(--opcrim-off-white);
  --acento:      var(--opcrim-blue);

  --largura: 1100px;
  --largura-texto: 720px;
  --raio: 8px;

  --serif: "Merriweather Text", "Merriweather", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --sans: "Sora", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--texto);
  background: var(--fundo);
  -webkit-font-smoothing: antialiased;
  /* Coluna de altura total: o rodapé não flutua no meio de páginas curtas. */
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}
main { flex: 1 0 auto; }

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

.container { max-width: var(--largura); margin: 0 auto; padding: 0 24px; }

/* --- cabeçalho -------------------------------------------------------- */

/* Cabeçalho azul-marinho sólido: mesma cor da marca (--opcrim-blue), como
   no painel — separa o site do fundo branco do conteúdo com autoridade
   editorial, em vez do cabeçalho branco anterior. */
.topo {
  background: var(--opcrim-blue);
  position: sticky;
  top: 0;
  z-index: 30;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.14), 0 2px 10px rgba(20,20,20,.12);
}
.topo__interno {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  height: 68px;
}
.topo__marca {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #fff;
  flex-shrink: 0;
}
.topo__marca img { display: block; }
/* Nome por extenso em HTML: o texto do logo em SVG ficava ilegível em 38px. */
.topo__nome {
  font-family: var(--serif);
  font-size: 17px;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.topo__sigla {
  display: none;
  font-family: var(--serif);
  font-size: 17px;
  font-weight: 600;
}
/* Busca de cabeçalho: existe em toda página que não seja a capa. */
.topo__busca {
  display: none;
  flex: 1 1 auto;
  max-width: 320px;
  margin-left: auto;
  position: relative;
}
.topo__busca input {
  width: 100%;
  height: 38px;
  padding: 0 40px 0 14px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  font: inherit;
  font-size: 14px;
  color: #fff;
  transition: background .12s ease, color .12s ease;
}
.topo__busca input::placeholder { color: rgba(255,255,255,.72); }
.topo__busca input:focus {
  background: #fff;
  color: var(--texto);
  border-color: #fff;
  outline: none;
}
.topo__busca input:focus::placeholder { color: var(--texto-suave); }
.topo__busca button {
  position: absolute;
  right: 4px;
  top: 4px;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: rgba(255,255,255,.8);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.topo__busca button:hover { background: rgba(255,255,255,.18); color: #fff; }
/* Depois do foco (fundo branco), o botão e o ícone voltam à paleta clara. */
.topo__busca input:focus ~ button { color: var(--texto-suave); }
.topo__busca input:focus ~ button:hover { background: var(--borda); color: var(--acento); }
/* Menu em caixa alta com leve espaçamento: registro institucional, não
   texto corrido — o mesmo tratamento que faculdades e publicações
   jurídicas usam no menu principal. */
.topo__nav { display: flex; gap: 26px; flex-shrink: 0; }
.topo__nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 2px;
  margin: 0 -2px;
  color: rgba(255,255,255,.78);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-bottom: 2px solid transparent;
}
.topo__nav a:hover { color: #fff; }
/* A seção atual leva uma barra fina encostada na borda do cabeçalho. */
.topo__nav a[aria-current="page"] {
  color: #fff;
  border-bottom-color: #fff;
}
/* O anel de foco padrão (azul-marinho) some sobre um fundo da mesma cor. */
.topo :focus-visible { outline-color: #fff; }

/* --- capa da home ----------------------------------------------------- */

.capa {
  background: var(--opcrim-blue);
  color: #fff;
  padding: 56px 0 60px;
  position: relative;
  overflow: hidden;
}
/* Padrão gráfico da marca, bem discreto, só onde há espaço. */
@media (min-width: 900px) {
  .capa::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url(/assets/img/OPCRIM_Padrao_Grafico.svg) right -40px center / auto 140% no-repeat;
    opacity: .09;
    pointer-events: none;
  }
}
.capa .container { position: relative; }
.capa__kicker {
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .8;
  margin: 0 0 16px;
}
.capa__atalhos {
  font-size: 15px;
  margin: 18px 0 0;
  opacity: .9;
}
.capa__atalhos a { color: #fff; text-underline-offset: 4px; }
.capa__atalhos a:hover { text-decoration-thickness: 2px; }
.capa h1 {
  font-family: var(--serif);
  font-size: 40px;
  line-height: 1.15;
  margin: 0 0 12px;
  max-width: 780px;
  letter-spacing: -.015em;
}
.capa p {
  font-size: 17.5px;
  opacity: .88;
  margin: 0 0 30px;
  max-width: 640px;
}

.busca-capa { display: flex; gap: 10px; max-width: 660px; }
.busca-capa input {
  flex: 1;
  padding: 14px 18px;
  border: 0;
  border-radius: var(--raio);
  font: inherit;
  font-size: 16px;
}
.busca-capa button {
  padding: 14px 26px;
  border: 0;
  border-radius: var(--raio);
  background: var(--opcrim-black);
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.busca-capa input:focus { outline: none; box-shadow: 0 0 0 3px rgba(255,255,255,.45); }
.busca-capa button:hover { background: #000; box-shadow: inset 0 0 0 2px rgba(255,255,255,.35); }

/* --- seções ----------------------------------------------------------- */

.secao { padding-top: 52px; padding-bottom: 52px; }
.secao--alt { background: var(--fundo-alt); }
.secao__titulo {
  font-family: var(--serif);
  font-size: 25px;
  margin: 0 0 6px;
  letter-spacing: -.01em;
}
.secao__ajuda { color: var(--texto-suave); margin: 0 0 26px; font-size: 15px; }

/* --- temas ------------------------------------------------------------ */

.temas { display: flex; flex-wrap: wrap; gap: 10px; }
.tema {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  padding: 9px 16px;
  border: 1px solid var(--borda);
  border-radius: 22px;
  text-decoration: none;
  color: var(--texto);
  background: var(--fundo);
  font-size: 14.5px;
}
.tema:hover { border-color: var(--acento); color: var(--acento); }
.tema span { color: var(--texto-suave); font-size: 12.5px; }
.tema--instituto { border-style: dashed; }
.temas__rotulo {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 22px 0 10px;
}

/* --- cartões de precedente ------------------------------------------- */

.cartoes {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 18px;
}

.cartao {
  display: block;
  position: relative;
  padding: 22px;
  border: 1px solid var(--borda);
  border-radius: var(--raio);
  background: var(--fundo);
  text-decoration: none;
  color: inherit;
}
.cartao { transition: border-color .15s ease, box-shadow .15s ease; }
.cartao:hover,
.cartao:focus-within { border-color: var(--acento); box-shadow: 0 2px 10px rgba(20,20,20,.06); }
/* O link é só o título, mas o cartão inteiro responde ao clique. */
.cartao__titulo a { color: inherit; text-decoration: none; }
.cartao__titulo a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.cartao__titulo a:focus-visible { outline: none; }
.cartao:focus-within { outline: 3px solid var(--acento); outline-offset: 2px; }
/* Etiquetas e outros links dentro do cartão ficam acima da camada clicável. */
.cartao__rodape { position: relative; z-index: 1; pointer-events: none; }

.cartao__origem {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 0 0 8px;
}
.cartao__titulo {
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.3;
  margin: 0 0 10px;
  color: var(--texto);
}
.cartao__questao {
  font-size: 14.5px;
  color: var(--texto-suave);
  margin: 0 0 12px;
}
.cartao__resposta {
  font-size: 14.5px;
  margin: 0 0 14px;
  padding-left: 12px;
  border-left: 3px solid var(--opcrim-light-blue);
}
.cartao__rodape {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12.5px;
  color: var(--texto-suave);
  border-top: 1px solid var(--fundo-alt);
  padding-top: 12px;
}

.etiqueta {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 11px;
  background: var(--opcrim-light-blue);
  color: var(--opcrim-blue);
  font-size: 12px;
  font-weight: 600;
}
.etiqueta--unanime  { background: var(--opcrim-light-blue); color: var(--acento); }
.etiqueta--dividida { background: #F6EDD3; color: #7A5F0B; }
.etiqueta--alerta   { background: #FDF4E0; color: #8A6100; }

/* Situação da tese: a informação de maior consequência jurídica da ficha
   ganha código próprio. Vigente é o único selo sólido do cabeçalho. */
.etiqueta--vigente        { background: var(--acento); color: #fff; }
.etiqueta--modificada,
.etiqueta--pendente_embargos { background: #FDF4E0; color: #8A6100; }
.etiqueta--superada       { background: #FBEDED; color: #A32C2C; }
.etiqueta--em_revisao,
.etiqueta--nao_verificada { background: #ECEFF2; color: #4E5A66; }
.etiqueta--neutra         { background: #ECEFF2; color: #4E5A66; }

/* --- números ---------------------------------------------------------- */

.numeros {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 20px;
}
.numero { text-align: center; }
.numero__valor {
  font-family: var(--serif);
  font-size: 34px;
  line-height: 1;
  color: var(--acento);
  display: block;
  margin-bottom: 5px;
}
.numero__rotulo { font-size: 13.5px; color: var(--texto-suave); display: block; }
.numero__sub { display: block; font-size: 12.5px; color: var(--texto-suave); margin-top: 3px; }
.numero__de { font-size: 18px; color: var(--texto-suave); }

/* --- atualizações recentes (capa) ------------------------------------- */

.atualizacoes { list-style: none; margin: 0; padding: 0; }
.atualizacoes li {
  display: grid;
  grid-template-columns: 96px 1fr auto;
  grid-template-areas: "tipo titulo data" "tipo meta data";
  column-gap: 16px;
  row-gap: 4px;
  align-items: baseline;
  padding: 14px 0;
  border-bottom: 1px solid var(--borda);
}
.atualizacoes li:last-child { border-bottom: 0; }
.atualizacoes__tipo {
  grid-area: tipo;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--texto-suave);
}
.atualizacoes__titulo { grid-area: titulo; font-family: var(--serif); font-size: 17px; text-decoration: none; }
.atualizacoes__titulo:hover { text-decoration: underline; }
.atualizacoes__meta { grid-area: meta; font-size: 13px; color: var(--texto-suave); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.atualizacoes__data { grid-area: data; font-size: 12.5px; color: var(--texto-suave); white-space: nowrap; }

.nota-metodologica {
  margin-top: 26px;
  padding: 14px 18px;
  background: var(--fundo);
  border-left: 3px solid var(--opcrim-slate);
  border-radius: 0 var(--raio) var(--raio) 0;
  font-size: 13.5px;
  color: var(--texto-suave);
}

/* =====================================================================
   Página do precedente — três níveis de leitura
   ===================================================================== */

.precedente { padding: 28px 0 80px; }
.precedente__corpo { min-width: 0; }
.precedente .trilha { margin-bottom: 18px; }

/* Texto à esquerda, sumário fixo à direita. Abaixo de 1000px o sumário vira
   uma dobra compacta acima do artigo. */
.precedente { display: grid; grid-template-columns: 1fr; gap: 0; align-items: start; }
@media (min-width: 1000px) {
  .precedente { grid-template-columns: minmax(0, var(--largura-texto)) 1fr; column-gap: 56px; }
  .precedente__trilho { position: sticky; top: 88px; max-width: 250px; }
}
@media (max-width: 999px) {
  .precedente__trilho { order: -1; margin-bottom: 22px; }
}

.p-cabecalho { border-bottom: 1px solid var(--borda); padding-bottom: 28px; margin-bottom: 32px; }
.p-cabecalho__origem {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 0 0 10px;
}
.p-cabecalho h1 {
  font-family: var(--serif);
  font-size: 36px;
  line-height: 1.18;
  margin: 0 0 18px;
  letter-spacing: -.015em;
  max-width: var(--largura-texto);
}
.p-cabecalho__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  font-size: 14px;
  color: var(--texto-suave);
  margin: 0 0 12px;
}
.p-cabecalho__etiquetas { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.p-secao__contexto { font-size: 13.5px; color: var(--texto-suave); margin: -6px 0 16px; }

/* Leitura em 30 segundos */
.resumo-rapido {
  background: var(--fundo-alt);
  border-radius: var(--raio);
  padding: 28px 30px;
  margin-bottom: 36px;
  max-width: var(--largura-texto);
}
.resumo-rapido dt {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin-bottom: 5px;
}
.resumo-rapido dd { margin: 0 0 20px; }
.resumo-rapido dd:last-child { margin-bottom: 0; }
.resumo-rapido .questao { font-family: var(--serif); font-size: 20px; line-height: 1.35; }
.resumo-rapido .resposta { font-size: 17px; }

.p-secao { margin-bottom: 40px; max-width: var(--largura-texto); }
.p-secao--larga { max-width: none; }
.p-secao h2 {
  font-family: var(--serif);
  font-size: 23px;
  margin: 0 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--borda);
}
.p-secao > h3 {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 600;
  margin: 26px 0 8px;
}
.p-secao > p { margin: 0 0 14px; }
.p-secao > p:last-child { margin-bottom: 0; }

/* Preserva as quebras de linha do texto editorial sem aceitar HTML. */
.texto-editorial { white-space: pre-line; }
.texto-editorial > :last-child { margin-bottom: 0; }
div.texto-editorial { margin: 0 0 14px; }

.tese-oficial {
  background: var(--fundo-alt);
  border-left: 3px solid var(--acento);
  border-radius: 0 var(--raio) var(--raio) 0;
  padding: 20px 24px;
  font-size: 15px;
  line-height: 1.65;
  white-space: pre-line;
}
.tese-oficial__rotulo {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin-bottom: 10px;
}

.itens-tese { list-style: none; padding: 0; margin: 16px 0 0; }
.itens-tese li {
  display: flex;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--fundo-alt);
  font-size: 14.5px;
}
.itens-tese li:last-child { border-bottom: 0; }
.itens-tese strong {
  flex: 0 0 44px;
  color: var(--acento);
  font-variant-numeric: tabular-nums;
}

/* --- mapa de votação público ----------------------------------------- */

.placar {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  font-family: var(--serif);
}
.placar__numero { font-size: 34px; line-height: 1; }
.placar__numero--maioria { color: var(--acento); }
.placar__numero--divergencia { color: var(--texto-suave); }
.placar__x { color: var(--texto-suave); font-size: 20px; }
.placar__rotulo { font-family: var(--sans); font-size: 13.5px; color: var(--texto-suave); }

.votacao { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.votacao th {
  text-align: left;
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--texto-suave);
  padding: 8px 10px;
  border-bottom: 1px solid var(--borda);
}
.votacao td { padding: 9px 10px; border-bottom: 1px solid var(--fundo-alt); }
.votacao tr:last-child td { border-bottom: 0; }
.votacao a { text-decoration: none; }
.votacao a:hover { text-decoration: underline; }

.posicao {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 11px;
  font-size: 12.5px;
  font-weight: 600;
}
.posicao--maioria              { background: var(--opcrim-light-blue); color: var(--acento); }
.posicao--divergencia          { background: #F6EDD3; color: #7A5F0B; }
.posicao--concordancia_parcial { background: #FDF4E0; color: #8A6100; }
.posicao--adesao_resultado     { background: #EDE8F5; color: #4A3B73; }
.posicao--ausente,
.posicao--impedido,
.posicao--nao_participou,
.posicao--nao_verificado       { background: var(--fundo-alt); color: var(--texto-suave); }

/* --- apêndice: classificação, amici, fontes, citar ------------------- */

.p-secao--apendice h2 {
  font-size: 19px;
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 12px;
}
/*
 * ".p-secao > p" (a regra de parágrafo comum, abaixo) tem mais
 * especificidade que uma classe sozinha — ".p-secao" + "p" conta como
 * duas partes contra uma. Sem o prefixo ".p-secao >" aqui, aquela regra
 * vencia e cada rótulo saía com 0 de margem acima e 14px abaixo: o grupo
 * inteiro invertido, colado no rótulo seguinte em vez do seu próprio.
 */
.p-secao > .classificacao__trilha { font-size: 15px; margin: 0 0 16px; }
.classificacao__trilha span { color: var(--texto-suave); margin: 0 6px; }
.p-secao > .classificacao__rotulo {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 14px 0 8px;
}
.temas--compactos { gap: 8px; }
.tema--pequeno { padding: 5px 12px; font-size: 13px; }
.amici { margin: 0; padding-left: 1.2em; font-size: 14.5px; }
.amici li { margin-bottom: 4px; }

/* --- fontes ----------------------------------------------------------- */

.fontes { list-style: none; padding: 0; margin: 0; }
.fontes li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--fundo-alt);
  font-size: 14.5px;
}
.fontes__tipo {
  flex: 0 0 140px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--texto-suave);
}
.fontes__data { color: var(--texto-suave); font-size: 12.5px; margin-left: auto; }
.fontes a[target="_blank"]::after { content: ' ↗'; font-size: 11px; color: var(--texto-suave); }
.fontes__sem-link { color: var(--texto-suave); }
.fontes__sem-link small { font-size: 12px; }

/* --- procedência do registro ----------------------------------------- */

.procedencia {
  margin-top: 48px;
  padding: 18px 22px;
  background: var(--fundo-alt);
  border-radius: var(--raio);
  font-size: 13.5px;
  color: var(--texto-suave);
  max-width: var(--largura-texto);
}
.procedencia dl { display: grid; grid-template-columns: auto 1fr; gap: 5px 16px; margin: 0; }
.procedencia dt { font-weight: 600; }
.procedencia dd { margin: 0; }

/* =====================================================================
   Catálogo
   ===================================================================== */

.catalogo { display: grid; grid-template-columns: 268px 1fr; gap: 36px; padding: 36px 0 80px; }

.filtros-lateral { font-size: 14px; }

/* No desktop a sanfona não é sanfona: fica sempre aberta e sem o cabeçalho
   clicável. Ela só existe para não empurrar os resultados no celular. */
.filtros-sanfona > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 14px;
  cursor: pointer;
  list-style: none;
}
.filtros-sanfona > summary::-webkit-details-marker { display: none; }
.filtros-sanfona__contagem {
  font-size: 12px;
  font-weight: 600;
  padding: 2px 9px;
  border-radius: 11px;
  background: var(--opcrim-light-blue);
  color: var(--opcrim-blue);
}
.filtro-grupo { margin-bottom: 20px; }
.filtro-grupo label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--texto-suave);
  margin-bottom: 5px;
}
.filtros-lateral select,
.filtros-lateral input:not([type="checkbox"]):not([type="radio"]) {
  width: 100%;
  padding: 9px 10px;
  border: 1px solid var(--borda);
  border-radius: 6px;
  font: inherit;
  font-size: 14px;
  background: #fff;
  color: var(--texto);
  -webkit-appearance: none;
  appearance: none;
}
.filtros-lateral select {
  padding-right: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236B7C8F' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 11px center;
}
.filtros-lateral select:focus-visible,
.filtros-lateral input:focus-visible { border-color: var(--acento); outline-offset: 0; }
.filtros-lateral select:disabled { opacity: .55; cursor: not-allowed; }

/* Segundo nível: filtros de pesquisa fina ficam dobrados. */
.filtros-mais { margin: 4px 0 20px; }
.filtros-mais > summary {
  cursor: pointer;
  list-style: none;
  font-size: 14px;
  font-weight: 600;
  color: var(--acento);
  padding: 8px 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.filtros-mais > summary::-webkit-details-marker { display: none; }
.filtros-mais > summary::before {
  content: '';
  width: 6px; height: 6px;
  border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor;
  transform: rotate(-45deg);
  transition: transform .15s ease;
  margin-right: 2px;
}
.filtros-mais[open] > summary::before { transform: rotate(45deg); }
.filtros-mais[open] > summary { margin-bottom: 14px; }

fieldset.filtro-grupo { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.filtro-grupo--par legend {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--texto-suave);
  padding: 0;
  margin-bottom: 8px;
}
.filtro-grupo--par label { text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--texto); font-size: 13.5px; }
.filtro-grupo--par select + label { margin-top: 10px; }
.filtro-grupo__ajuda { font-size: 12.5px; color: var(--texto-suave); margin: 6px 0 0; }

/* Barra de ações presa ao pé da tela enquanto a coluna de filtros rola. */
.filtros-acoes {
  position: sticky;
  bottom: 0;
  display: flex;
  gap: 8px;
  padding: 12px 0;
  margin-top: 4px;
  background: var(--fundo);
  border-top: 1px solid var(--borda);
}
.filtros-acoes .botao { flex: 1; text-align: center; }

/* Chips do que está aplicado, removíveis um a um. */
.filtros-ativos {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 20px;
  padding: 0;
  font-size: 13.5px;
}
.filtros-ativos li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 6px 5px 12px;
  border: 1px solid var(--borda);
  border-radius: 999px;
  background: var(--fundo-alt);
}
.filtros-ativos__rotulo { color: var(--texto-suave); }
.filtros-ativos__rotulo::after { content: ':'; }
.filtros-ativos li a {
  display: inline-grid;
  place-items: center;
  width: 24px; height: 24px;
  border-radius: 50%;
  text-decoration: none;
  color: var(--texto-suave);
  font-size: 16px;
  line-height: 1;
}
.filtros-ativos li a:hover { background: var(--borda); color: var(--texto); }
.filtros-ativos__limpar { background: transparent; border-color: transparent; padding-left: 4px; }
.filtros-ativos__limpar a { width: auto; height: auto; border-radius: 0; font-size: 13.5px; text-decoration: underline; color: var(--acento); }
.filtros-ativos__limpar a:hover { background: transparent; }

.resultados__topo {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.resultados__topo h1 { margin: 0 0 2px; }
.resultados__contagem { color: var(--texto-suave); font-size: 14.5px; margin: 0; }
.ordenacao { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--texto-suave); }
.ordenacao select {
  padding: 7px 28px 7px 10px;
  border: 1px solid var(--borda);
  border-radius: 6px;
  font: inherit;
  font-size: 13.5px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236B7C8F' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 10px center;
  -webkit-appearance: none;
  appearance: none;
  color: var(--texto);
}
/* Sem JS o botão fica; com JS a troca já envia. */
.ordenacao__aplicar {
  padding: 7px 10px;
  border: 1px solid var(--borda);
  border-radius: 6px;
  background: #fff;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
html.js .ordenacao__aplicar { display: none; }

.vazio-site__dica { font-size: 14px; max-width: 46ch; margin: 8px auto 20px; }
.vazio-site__acoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

.paginacao { display: flex; gap: 8px; justify-content: center; align-items: center; margin-top: 36px; flex-wrap: wrap; }
.paginacao a, .paginacao span {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--borda);
  border-radius: 6px;
  text-decoration: none;
  font-size: 14px;
  color: var(--texto);
}
.paginacao a:hover { border-color: var(--acento); color: var(--acento); }
.paginacao .atual { border-color: transparent; color: var(--texto-suave); }

/* --- ministros -------------------------------------------------------- */

.ministros-grade {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 18px;
}
.ministro-cartao {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--borda);
  border-radius: var(--raio);
  text-decoration: none;
  color: inherit;
}
.ministro-cartao { transition: border-color .15s ease, box-shadow .15s ease; }
.ministro-cartao:hover { border-color: var(--acento); box-shadow: 0 2px 10px rgba(20,20,20,.06); }
.ministro-cartao__foto {
  width: 48px; height: 48px;
  flex: 0 0 48px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--fundo-alt);
  display: grid;
  place-items: center;
  color: var(--texto-suave);
  font-weight: 600;
}
.ministro-cartao__foto.iniciais { background: var(--opcrim-light-blue); color: var(--acento); font-size: 15px; }
.ministro-cartao__texto { min-width: 0; }
.ministro-cartao__nome { display: block; font-weight: 600; font-size: 14.5px; line-height: 1.3; }
.ministro-cartao__meta { display: block; font-size: 12.5px; color: var(--texto-suave); margin-top: 2px; }
.ministro-cartao__meta .etiqueta { font-size: 11px; padding: 1px 7px; margin-left: 4px; }

/* Cabeçalho de página de entidade (tema, ministro): o mesmo bloco nas duas. */
.pagina-cabecalho {
  border-bottom: 1px solid var(--borda);
  padding-bottom: 26px;
  margin-bottom: 32px;
}
.pagina-cabecalho--com-retrato { display: flex; align-items: center; gap: 22px; }
.pagina-cabecalho__olho {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 0 0 8px;
}
.pagina-cabecalho__titulo {
  font-family: var(--serif);
  font-size: 32px;
  line-height: 1.18;
  letter-spacing: -.015em;
  margin: 0;
}
.pagina-cabecalho__retrato {
  width: 84px; height: 84px;
  flex: 0 0 84px;
  border-radius: 50%;
  object-fit: cover;
  font-size: 24px;
}
.pagina-cabecalho .tema-intro { margin: 14px 0 0; }
.secao__contagem { font-family: var(--sans); font-size: 14px; font-weight: 500; color: var(--texto-suave); margin-left: 6px; }
.secao__ajuda--compacta { margin-bottom: 14px; }
.panorama-frase { font-size: 16.5px; line-height: 1.6; max-width: var(--largura-texto); margin: 0 0 10px; }
.numeros--compactos { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.filtro-chips { margin: 0 0 14px; }
.filtro-chips input {
  width: 100%;
  max-width: 360px;
  padding: 9px 12px;
  border: 1px solid var(--borda);
  border-radius: 6px;
  font: inherit;
  font-size: 14px;
}
.tema[hidden] { display: none; }

.linha-tempo__rodape {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12.5px;
  color: var(--texto-suave);
}
.votacao__meta {
  display: block;
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--texto-suave);
  margin-top: 2px;
}
.publicacoes { list-style: none; margin: 0; padding: 0; }
.publicacoes li { padding: 10px 0; border-bottom: 1px solid var(--fundo-alt); font-size: 14.5px; }
.publicacoes li:last-child { border-bottom: 0; }
.publicacoes a[target="_blank"]::after,
.link-externo::after { content: ' ↗'; font-size: 11px; color: var(--texto-suave); }
.publicacao__ref { display: block; font-size: 13px; color: var(--texto-suave); margin-top: 2px; }

.aviso-metodologico {
  padding: 16px 20px;
  background: #FDF4E0;
  border-left: 3px solid #8A6100;
  border-radius: 0 var(--raio) var(--raio) 0;
  font-size: 14px;
  color: #6B4E08;
  margin-bottom: 26px;
}

/* --- rodapé ----------------------------------------------------------- */

.rodape {
  border-top: 1px solid var(--borda);
  background: var(--fundo-alt);
  padding: 40px 0;
  margin-top: auto;
  font-size: 14px;
  color: var(--texto-suave);
}
.rodape__interno {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 36px;
}
.rodape a { color: var(--texto-suave); }
.rodape a:hover { color: var(--acento); }
.rodape__marca {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: var(--texto);
  margin-bottom: 8px;
}
.rodape__marca strong { font-family: var(--serif); font-weight: 600; font-size: 15px; }
.rodape p { margin: 0 0 8px; }
.rodape__nota { font-size: 13px; line-height: 1.5; }
.rodape__titulo {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 0 0 10px;
}
.rodape__lista { list-style: none; margin: 0 0 12px; padding: 0; }
.rodape__lista li { margin-bottom: 6px; }
.rodape__lista span { color: var(--texto-suave); font-size: 13px; }

/* --- página de erro --------------------------------------------------- */

.erro-pagina {
  max-width: 560px;
  margin: 72px auto 96px;
  padding: 0 24px;
  text-align: center;
}
.erro-pagina__codigo {
  font-family: var(--serif);
  font-size: 64px;
  line-height: 1;
  color: var(--borda);
  margin: 0 0 8px;
}
.erro-pagina h1 { font-size: 26px; margin-bottom: 10px; }
.erro-pagina__texto { color: var(--texto-suave); margin: 0 0 24px; }
.erro-pagina__busca { display: flex; gap: 8px; margin-bottom: 20px; }
.erro-pagina__busca input {
  flex: 1;
  min-width: 0;
  padding: 10px 14px;
  border: 1px solid var(--borda);
  border-radius: var(--raio);
  font: inherit;
}
.erro-pagina__acoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; }
.erro-pagina--painel { margin-top: 40px; }

.vazio-site {
  text-align: center;
  padding: 70px 24px;
  color: var(--texto-suave);
  background: var(--fundo-alt);
  border-radius: var(--raio);
}

@media (min-width: 901px) {
  .topo__busca { display: block; }
  /* No desktop a sanfona é só um título: o servidor a manda aberta e o
     cabeçalho deixa de responder ao clique. */
  .filtros-sanfona > summary { cursor: default; pointer-events: none; }
}

@media (max-width: 900px) {
  .rodape__interno { grid-template-columns: 1fr 1fr; }
  .rodape__coluna--marca { grid-column: 1 / -1; }
  .catalogo { grid-template-columns: 1fr; gap: 24px; }
  .filtros-sanfona > summary {
    border: 1px solid var(--borda);
    border-radius: var(--raio);
    padding: 12px 16px;
    margin-bottom: 0;
  }
  .filtros-sanfona[open] > summary { margin-bottom: 16px; }
  /* Alvos de toque de 44px na coluna de filtros. */
  .filtros-lateral select,
  .filtros-lateral input:not([type="checkbox"]):not([type="radio"]) { padding-top: 11px; padding-bottom: 11px; }
  .filtros-acoes .botao { min-height: 44px; }
  .resultados__topo { flex-direction: column; align-items: flex-start; gap: 10px; }
  .capa h1 { font-size: 31px; }
  .p-cabecalho h1 { font-size: 28px; }
}
@media (max-width: 620px) {
  /* Tabela de participações vira lista: cada linha um bloco, célula com rótulo. */
  .votacao--empilhavel thead { display: none; }
  .votacao--empilhavel tr { display: block; padding: 12px 0; border-bottom: 1px solid var(--borda); }
  .votacao--empilhavel td { display: block; padding: 2px 0; border: 0; }
  .votacao--empilhavel td[data-rotulo]:not(:first-child)::before {
    content: attr(data-rotulo) ': ';
    font-size: 12px;
    color: var(--texto-suave);
  }
  .votacao--empilhavel td:first-child a { font-family: var(--serif); font-size: 16px; }
  .pagina-cabecalho--com-retrato { gap: 14px; }
  .pagina-cabecalho__retrato { width: 64px; height: 64px; flex-basis: 64px; font-size: 20px; }
  .pagina-cabecalho__titulo { font-size: 26px; }
  .ministro-cartao { padding: 12px 14px; gap: 12px; }
  .ministro-cartao__foto { width: 40px; height: 40px; flex-basis: 40px; }
  .topo__nav { gap: 16px; }
  .topo__nav a { font-size: 12px; letter-spacing: .04em; }
  .topo__interno { height: 60px; gap: 12px; }
  /* O nome por extenso não cabe ao lado do menu: fica a sigla. */
  /* O nome continua no DOM, só que fora da tela, para o leitor de tela. */
  .topo__nome {
    position: absolute;
    width: 1px; height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .topo__sigla { display: inline; }
  .rodape__interno { grid-template-columns: 1fr; gap: 26px; }
  .container { padding-left: 18px; padding-right: 18px; }
  .busca-capa { flex-direction: column; }
  .citar__copiar { min-height: 44px; padding: 10px 16px; }
  .mapa-votacao__numero { font-size: 28px; }
  .atualizacoes li {
    grid-template-columns: 1fr;
    grid-template-areas: "tipo" "titulo" "meta" "data";
    row-gap: 2px;
  }
  .fontes__tipo { flex-basis: 100%; }
  .fontes__data { margin-left: 0; }
}

/* =====================================================================
   Mapa visual da votação
   ===================================================================== */

.mapa-votacao { margin: 8px 0 8px; }

/* Placar nas pontas da barra: os números e a proporção numa leitura só. */
.mapa-votacao__placar { display: flex; align-items: center; gap: 14px; margin: 0 0 8px; }
.mapa-votacao__placar .mapa-votacao__barra { flex: 1; margin: 0; height: 10px; }
.mapa-votacao__numero {
  font-family: var(--serif);
  font-size: 34px;
  line-height: 1;
  min-width: 1.1em;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.mapa-votacao__numero--vencedora  { color: var(--acento); }
.mapa-votacao__numero--divergente { color: #7A5F0B; }
.mapa-votacao__placar--unanime { gap: 12px; }
.mapa-votacao__placar--unanime .mapa-votacao__numero { color: var(--acento); text-align: left; }
.mapa-votacao__legenda {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  font-size: 13px;
  color: var(--texto-suave);
  margin: 0 0 22px;
}
.mapa-votacao__placar--unanime .mapa-votacao__legenda { margin: 0; }
.mapa-votacao__ponto { display: inline-block; width: 10px; height: 10px; border-radius: 50%; }
.mapa-votacao__ponto--vencedora  { background: var(--acento); }
.mapa-votacao__ponto--divergente { background: #C9A227; }

/* Proporção entre as correntes, antes dos nomes. */
.mapa-votacao__barra {
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--fundo-alt);
  margin-bottom: 26px;
}
.mapa-votacao__parte--vencedora  { background: var(--acento); }
.mapa-votacao__parte--divergente { background: #C9A227; }

.mapa-votacao__correntes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 28px;
}

.corrente { min-width: 0; }
.corrente__titulo {
  display: flex;
  align-items: center;
  gap: 9px;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 0 0 14px;
  padding-bottom: 9px;
  border-bottom: 2px solid var(--borda);
}
.corrente--vencedora  .corrente__titulo { border-bottom-color: var(--acento); }
.corrente--divergente .corrente__titulo { border-bottom-color: #C9A227; }

.corrente__contagem {
  margin-left: auto;
  font-size: 15px;
  font-family: var(--serif);
  letter-spacing: 0;
  color: var(--texto);
}
.corrente__vazia { color: var(--texto-suave); font-size: 14px; margin: 0; }

.corrente--fora { margin-top: 30px; }
.corrente--fora .corrente__titulo { border-bottom-style: dashed; border-bottom-width: 1px; }

.julgadores { list-style: none; margin: 0; padding: 0; }

.julgador { padding: 0; }
/* A linha inteira é o alvo: link de 17px numa linha de 53px era difícil de tocar. */
.julgador__linha {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 7px 8px;
  margin: 0 -8px;
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
}
a.julgador__linha:hover { background: var(--fundo-alt); }
a.julgador__linha:hover .julgador__nome { color: var(--acento); }
.julgador--fora .julgador__dados { padding: 4px 0; }

/* Relator: anel no retrato, nome em negrito, selo. */
.julgador--relator .julgador__retrato { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--acento); }
.corrente--divergente .julgador--relator .julgador__retrato { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #C9A227; }
.julgador--relator .julgador__nome { font-weight: 600; }
.julgador__relator {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 9px;
  background: var(--opcrim-light-blue);
  color: var(--acento);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  vertical-align: 1px;
}
.corrente--divergente .julgador__relator { background: #F6EDD3; color: #7A5F0B; }
.julgador__funcao {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--texto-suave);
  margin-left: 6px;
}

.julgador__retrato {
  width: 38px; height: 38px;
  flex: 0 0 38px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--fundo-alt);
  display: grid;
  place-items: center;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--texto-suave);
  letter-spacing: .02em;
}
.corrente--vencedora  .julgador__retrato--iniciais { background: var(--opcrim-light-blue); color: var(--acento); }
.corrente--divergente .julgador__retrato--iniciais { background: #F6EDD3; color: #7A5F0B; }

.julgador__dados { min-width: 0; }
.julgador__nome { display: block; font-size: 14.5px; line-height: 1.35; }
.julgador__nome a { text-decoration: none; }
.julgador__nome a:hover { text-decoration: underline; }
.julgador__papel {
  display: block;
  font-size: 12px;
  color: var(--texto-suave);
  margin-top: 2px;
}
.julgador__papel:empty { display: none; }

.julgadores--discretos .julgador { padding: 4px 0; }
.julgadores--discretos .julgador__nome { font-size: 14px; color: var(--texto-suave); }

/* --- eixo horizontal de fundamentação ---------------------------------- */
/* Dois polos ligados por uma linha contínua. Os votos sem classificação
   ficam fora da linha: ausência de classificação não é posição intermediária. */
.eixo-fundamentacao { margin: 0 0 30px; }
.eixo-fundamentacao__titulo {
  font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
  color: var(--texto-suave); margin: 0 0 6px;
}
.eixo-fundamentacao__descricao {
  margin: 0 0 24px; color: var(--texto-suave); font-size: 13px;
}
.eixo-fundamentacao__rolagem { overflow-x: auto; padding: 2px 0 8px; scrollbar-width: thin; }
.eixo-fundamentacao__rolagem:focus-visible { outline: 2px solid var(--acento); outline-offset: 3px; border-radius: 16px; }
.eixo-fundamentacao__dica { display: none; font-size: 11px; color: var(--texto-suave); margin: 4px 0 0; }
.eixo-fundamentacao__trilha {
  min-width: var(--largura-eixo);
  position: relative;
  display: flex;
  padding: 24px 12px 0;
  border-radius: 16px;
  background: linear-gradient(90deg, #f0f4f9, #fafbfd 48%, #fcfaf3);
}
.eixo-fundamentacao__trilha::before {
  content: ''; position: absolute; top: 53px; left: 16px; right: 16px; height: 2px;
  background: linear-gradient(90deg, var(--acento), #a9b4bf 50%, #907017);
}
.eixo-fundamentacao__trilha::after {
  content: ''; position: absolute; left: calc(100% * var(--votos-garantia) / (var(--votos-garantia) + var(--votos-eficiencia))); top: 47px;
  height: 14px; width: 2px; background: #a9b4bf;
}
.eixo-fundamentacao__zona {
  min-width: 0; display: grid; grid-template-rows: 1fr auto;
  flex: var(--votos-garantia) 1 0;
  --polo-cor: var(--acento);
}
.eixo-fundamentacao__zona--eficiencia { flex-grow: var(--votos-eficiencia); --polo-cor: #907017; }
.eixo-fundamentacao__zona .eixo-fundamentacao__julgadores { flex-wrap: nowrap; align-items: start; gap: 0; padding: 0; }
.eixo-fundamentacao__zona .eixo-fundamentacao__julgador { flex: 1 1 0; width: 0; position: relative; }
.eixo-fundamentacao__rotulo {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--sans); font-size: 13px; font-weight: 600;
  color: var(--texto-suave); margin: 0;
}
.eixo-fundamentacao__rotulo[title] { cursor: help; }
.eixo-fundamentacao__zona > .eixo-fundamentacao__rotulo {
  position: relative; height: 54px; margin-top: 8px; padding: 12px 4px 0;
  color: var(--polo-cor);
}
.eixo-fundamentacao__zona--eficiencia > .eixo-fundamentacao__rotulo { justify-content: flex-end; }
.eixo-fundamentacao__contagem {
  font-size: 11px; font-weight: 600; letter-spacing: 0;
  background: #fff; border: 1px solid var(--borda); border-radius: 20px;
  padding: 1px 7px; color: var(--texto-suave);
}
.eixo-fundamentacao__julgadores {
  display: flex; flex-wrap: wrap; justify-content: center; align-content: end;
  gap: 16px 8px; list-style: none; margin: 0; padding: 0 8px;
}
.eixo-fundamentacao__julgador { padding: 0; width: 88px; min-width: 0; }
.eixo-fundamentacao__vazia {
  align-self: end; text-align: center; padding: 24px 8px;
  margin: 0; font-size: 12px; color: var(--texto-suave);
}
.julgador__linha--eixo {
  display: flex; flex-direction: column; gap: 9px; height: 100%;
  padding: 6px 3px; margin: 0; border-radius: 10px; text-align: center;
  transition: background .15s ease;
}
a.julgador__linha--eixo:hover { background: #fff; }
a.julgador__linha--eixo:focus-visible { outline: 2px solid var(--acento); outline-offset: 3px; }
.eixo-fundamentacao__nome {
  font-size: 10px; line-height: 1.5; overflow-wrap: anywhere;
}
.julgador__linha--eixo .julgador__relator { font-size: 8px; padding: 1px 5px; }
.julgador__retrato--eixo {
  width: 44px; height: 44px; flex-basis: 44px;
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--eixo-cor, var(--borda));
}
.julgador__retrato--eixo.julgador__retrato--favor  { --eixo-cor: var(--acento); }
.julgador__retrato--eixo.julgador__retrato--contra { --eixo-cor: #C9A227; }
.julgador__retrato--eixo.julgador__retrato--fora   { --eixo-cor: #8b98a5; filter: grayscale(70%); }
.eixo-fundamentacao__sem-classificacao {
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
  margin-top: 20px; padding: 18px 0; border-bottom: 1px solid var(--borda);
}
.eixo-fundamentacao__sem-classificacao > div { flex: 1 1 180px; }
.eixo-fundamentacao__sem-classificacao p { font-size: 12px; color: var(--texto-suave); margin: 5px 0 0; }
.eixo-fundamentacao__sem-classificacao .eixo-fundamentacao__julgadores { justify-content: flex-start; padding: 0; }
.eixo-fundamentacao__legenda {
  display: flex; flex-wrap: wrap; gap: 6px 18px;
  font-size: 11px; color: var(--texto-suave); margin: 18px 0 0;
}
.eixo-fundamentacao__ponto {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  margin-right: 4px; vertical-align: middle;
}
.eixo-fundamentacao__ponto--favor  { background: var(--acento); }
.eixo-fundamentacao__ponto--contra { background: #C9A227; }
.eixo-fundamentacao__ponto--fora   { background: #8b98a5; }
.eixo-fundamentacao__glossario { margin: 10px 0 0; }
.eixo-fundamentacao__glossario dt { font-weight: 600; font-size: 13.5px; margin-top: 8px; }
.eixo-fundamentacao__glossario dt:first-child { margin-top: 0; }
.eixo-fundamentacao__glossario dd { margin: 2px 0 0; font-size: 13.5px; color: var(--texto-suave); }

@media (max-width: 620px) {
  .eixo-fundamentacao__dica { display: block; }
  .eixo-fundamentacao__julgadores { gap: 14px 4px; padding: 0 4px; }
  .eixo-fundamentacao__julgador { width: 72px; }
  .eixo-fundamentacao__nome { font-size: 10px; }
  .eixo-fundamentacao__rotulo { font-size: 12px; gap: 5px; }

}

/* A tabela completa continua disponível, mas recolhida: o diagrama responde
   "como a maioria se formou"; a tabela é para quem quer conferir campo a campo. */
.detalhamento-votacao { margin-top: 30px; }
.detalhamento-votacao > summary {
  cursor: pointer;
  font-size: 13.5px;
  color: var(--acento);
  padding: 9px 0;
  list-style: none;
}
.detalhamento-votacao > summary::-webkit-details-marker { display: none; }
.detalhamento-votacao > summary::before { content: '▸ '; }
.detalhamento-votacao[open] > summary::before { content: '▾ '; }
.detalhamento-votacao > summary:hover { text-decoration: underline; }

/* O cabeçalho é fixo: sem isto, pular para uma âncora esconde o título. */
.p-secao[id] { scroll-margin-top: 88px; }

/* =====================================================================
   Páginas temáticas
   ===================================================================== */

.tema-intro {
  font-size: 17px;
  line-height: 1.65;
  max-width: var(--largura-texto);
  margin: 0 0 32px;
  color: var(--texto);
}

.questoes-tema { list-style: none; margin: 0; padding: 0; }
.questoes-tema li {
  display: flex;
  gap: 14px;
  align-items: baseline;
  padding: 11px 0;
  border-bottom: 1px solid var(--fundo-alt);
  font-size: 15px;
}
.questoes-tema li:last-child { border-bottom: 0; }
.questoes-tema a { text-decoration: none; }
.questoes-tema a:hover { text-decoration: underline; }
.questoes-tema__ano {
  margin-left: auto;
  flex: 0 0 auto;
  color: var(--texto-suave);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

/* --- linha do tempo do tema ------------------------------------------ */

.linha-tempo { list-style: none; margin: 0; padding: 0; }

.linha-tempo__item {
  display: grid;
  grid-template-columns: 78px 1fr;
  gap: 22px;
  padding-bottom: 30px;
  position: relative;
}
.linha-tempo__item:last-child { padding-bottom: 0; }

/* Fio ligando os julgamentos. */
.linha-tempo__item::before {
  content: '';
  position: absolute;
  left: 77px;
  top: 22px;
  bottom: -8px;
  width: 1px;
  background: var(--borda);
}
.linha-tempo__item:last-child::before { display: none; }

.linha-tempo__marca {
  text-align: right;
  position: relative;
  padding-right: 12px;
}
.linha-tempo__ano {
  font-family: var(--serif);
  font-size: 17px;
  color: var(--texto-suave);
  font-variant-numeric: tabular-nums;
}
.linha-tempo__marca::after {
  content: '';
  position: absolute;
  right: -5px;
  top: 8px;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--acento);
  border: 2px solid var(--fundo);
}

.linha-tempo__conteudo { min-width: 0; padding-bottom: 4px; }
.linha-tempo__titulo {
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.3;
  margin: 4px 0 10px;
}
.linha-tempo__titulo a { color: var(--texto); text-decoration: none; }
.linha-tempo__titulo a:hover { color: var(--acento); text-decoration: underline; }

@media (max-width: 620px) {
  .linha-tempo__item { grid-template-columns: 52px 1fr; gap: 14px; }
  .linha-tempo__item::before { left: 51px; }
  .linha-tempo__ano { font-size: 14px; }
}

/* Atalho para quem navega por teclado.
   Recolhido com clip-path em vez de left:-9999px: a posição negativa pode
   alargar o documento e criar rolagem horizontal em alguns navegadores. */
.pular-para-conteudo {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  padding: 12px 20px;
  background: var(--opcrim-blue);
  color: #fff;
  text-decoration: none;
  border-radius: 0 0 6px 0;
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
}
.pular-para-conteudo:focus {
  clip-path: none;
  width: auto;
  height: auto;
  outline: 3px solid var(--opcrim-black);
  outline-offset: -3px;
}

/* --- precedentes relacionados ---------------------------------------- */

.relacionados { list-style: none; margin: 0; padding: 0; }
.relacionado {
  display: flex;
  gap: 16px;
  align-items: baseline;
  padding: 12px 0;
  border-bottom: 1px solid var(--fundo-alt);
}
.relacionado:last-child { border-bottom: 0; }
.relacionado__tipo {
  flex: 0 0 168px;
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--texto-suave);
}
.relacionado__dados { min-width: 0; }
.relacionado__dados a { font-size: 15.5px; text-decoration: none; }
.relacionado__dados a:hover { text-decoration: underline; }
.pr__meta { display: block; color: var(--texto-suave); font-size: 12.5px; margin-top: 2px; }

@media (max-width: 620px) {
  .relacionado { flex-direction: column; gap: 4px; }
  .relacionado__tipo { flex-basis: auto; }
}

/* --- percurso do julgamento ------------------------------------------ */

.percurso { list-style: none; margin: 14px 0 0; padding: 0; }

.percurso__item {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 16px;
  padding: 10px 0 10px 0;
  position: relative;
  border-left: 2px solid var(--borda);
  padding-left: 20px;
  margin-left: 4px;
}
.percurso__item::before {
  content: '';
  position: absolute;
  left: -6px;
  top: 17px;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--fundo);
  border: 2px solid var(--opcrim-slate);
}
/* Etapas que mudam o rumo do julgamento ficam marcadas. */
.percurso__item--pedido_vista::before   { border-color: #C9A227; }
.percurso__item--conclusao::before,
.percurso__item--proclamacao::before    { background: var(--acento); border-color: var(--acento); }
.percurso__item--superacao::before,
.percurso__item--alteracao_tese::before { background: #A32C2C; border-color: #A32C2C; }

.percurso__quando {
  font-size: 13.5px;
  color: var(--texto-suave);
  font-variant-numeric: tabular-nums;
  padding-top: 1px;
}
.percurso__oque { font-size: 14.5px; min-width: 0; }
.percurso__descricao { display: block; color: var(--texto-suave); font-size: 14px; margin-top: 2px; }

@media (max-width: 620px) {
  .percurso__item { grid-template-columns: 1fr; gap: 2px; }
}

/* --- redações anteriores da tese -------------------------------------- */

.versoes-tese { margin: 16px 0 0; }
.versoes-tese > summary {
  cursor: pointer;
  font-size: 14px;
  color: var(--acento);
  padding: 8px 0;
  list-style: none;
}
.versoes-tese > summary::-webkit-details-marker { display: none; }
.versoes-tese > summary::before { content: '▸ '; }
.versoes-tese[open] > summary::before { content: '▾ '; }
.versoes-tese__lista { list-style: none; margin: 8px 0 0; padding: 0; }
.versoes-tese__lista li {
  border-left: 3px solid var(--borda);
  padding-left: 16px;
  margin-bottom: 18px;
}
.versoes-tese__meta {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--texto-suave);
  margin: 0 0 6px;
}
.versoes-tese__texto {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.6;
  white-space: pre-line;
  color: var(--texto-suave);
}

/* --- sumário da ficha ------------------------------------------------- */

.sumario { font-size: 13.5px; }
.sumario__dobra > summary {
  list-style: none;
  cursor: default;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--texto-suave);
  padding-bottom: 10px;
  border-bottom: 1px solid var(--borda);
  margin-bottom: 12px;
}
.sumario__dobra > summary::-webkit-details-marker { display: none; }
.sumario__grupo {
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin: 14px 0 4px;
}
.sumario__dobra > summary + .sumario__grupo { margin-top: 0; }
.sumario__lista { list-style: none; margin: 0; padding: 0; }
.sumario__lista a {
  display: block;
  padding: 5px 0 5px 12px;
  border-left: 2px solid transparent;
  color: var(--texto);
  text-decoration: none;
  line-height: 1.35;
}
.sumario__lista a:hover { color: var(--acento); }
.sumario__lista a.is-ativo { border-left-color: var(--acento); color: var(--acento); font-weight: 600; }

@media (max-width: 999px) {
  .sumario__dobra { border: 1px solid var(--borda); border-radius: var(--raio); padding: 0 16px; }
  .sumario__dobra > summary {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 44px;
    padding: 0;
    margin: 0;
    border: 0;
  }
  .sumario__dobra > summary::after { content: '▾'; font-size: 14px; }
  .sumario__dobra[open] > summary::after { content: '▴'; }
  .sumario__dobra[open] > summary { border-bottom: 1px solid var(--borda); margin-bottom: 10px; }
  .sumario__dobra[open] { padding-bottom: 12px; }
  .sumario__lista { display: flex; flex-wrap: wrap; gap: 2px 14px; }
  .sumario__lista a { padding-left: 0; border-left: 0; min-height: 36px; display: inline-flex; align-items: center; }
  .sumario__lista a.is-ativo { border-left: 0; }
}

/* --- como citar ------------------------------------------------------- */

.citar__lista { margin: 0; }
.citar__lista dt {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--texto-suave);
  margin-bottom: 6px;
}
.citar__lista dd { margin: 0 0 22px; }
.citar__lista dd:last-child { margin-bottom: 0; }

.citar__texto {
  margin: 0 0 8px;
  padding: 14px 16px;
  background: var(--fundo-alt);
  border-radius: var(--raio);
  font-size: 14px;
  line-height: 1.6;
  font-family: var(--serif);
}
.citar__copiar {
  border: 1px solid var(--borda);
  background: var(--fundo);
  border-radius: 6px;
  padding: 5px 14px;
  font: inherit;
  font-size: 13px;
  color: var(--acento);
  cursor: pointer;
}
.citar__copiar:hover:not(:disabled) { background: var(--opcrim-light-blue); }
.citar__copiar:disabled { color: var(--texto-suave); cursor: default; }

/* =====================================================================
   Fundação compartilhada (adicionada na revisão de UI/UX)
   ===================================================================== */

/* Foco visível e consistente em tudo que é interativo. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--acento);
  outline-offset: 2px;
}
.capa :focus-visible { outline-color: #fff; }

/* Só para leitor de tela. */
.visualmente-oculto {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Botões do site: antes o "Aplicar filtros" usava a classe de chip de tema. */
.botao {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: var(--raio);
  background: var(--acento);
  color: #fff;
  font: inherit;
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.botao:hover { background: #26395A; }
.botao--secundario {
  background: var(--fundo);
  color: var(--texto);
  border-color: var(--borda);
}
.botao--secundario:hover { background: var(--fundo-alt); border-color: var(--opcrim-slate); }
.botao--bloco { width: 100%; }
.botao:disabled, .botao[aria-busy="true"] { opacity: .55; cursor: progress; }

/* Título de página, um só para temas, ministros, institucionais e índices. */
.pagina__titulo {
  font-family: var(--serif);
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: -.015em;
  margin: 0 0 8px;
}
.pagina__titulo + .secao__ajuda { margin-top: 0; }

/* Trilha de localização acima do título: "Precedentes › Tema 506". */
.trilha {
  font-size: 13px;
  color: var(--texto-suave);
  margin: 0 0 14px;
}
.trilha a { color: var(--texto-suave); text-decoration: none; }
.trilha a:hover { color: var(--acento); text-decoration: underline; }
.trilha__sep { margin: 0 6px; opacity: .6; }

/* Cabeçalho de seção com saída explícita ("Todos os precedentes →"). */
.secao__cabecalho {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.secao__mais {
  font-size: 14px;
  color: var(--acento);
  text-decoration: none;
  white-space: nowrap;
}
.secao__mais:hover { text-decoration: underline; }

/* Texto editorial convertido (listas, parágrafos, subtítulos). */
.lista-editorial { margin: 0 0 14px; padding-left: 1.2em; }
.lista-editorial li { margin-bottom: 6px; }
.lista-editorial li:last-child { margin-bottom: 0; }
.texto-editorial h2 { font-family: var(--serif); font-size: 23px; margin: 30px 0 10px; }
.texto-editorial h3 { font-family: var(--serif); font-size: 18px; margin: 22px 0 8px; }
.texto-editorial p { margin: 0 0 14px; }

.nota-discreta { font-size: 13.5px; color: var(--texto-suave); margin: 10px 0 0; }
.texto-editorial--pagina { font-size: 16.5px; line-height: 1.65; }
.texto-editorial--pagina h2:first-child { margin-top: 0; }

/* Retrato substituto por iniciais — o mesmo em todo o site. */
.iniciais {
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: var(--opcrim-light-blue);
  color: var(--acento);
  font-weight: 600;
  letter-spacing: .02em;
}

/* Tabela larga rola dentro do próprio contêiner, com pista visual. */
.rolagem-horizontal {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background:
    linear-gradient(to right, var(--fundo) 30%, rgba(255,255,255,0)),
    linear-gradient(to left,  var(--fundo) 30%, rgba(255,255,255,0)) 100% 0,
    linear-gradient(to right, rgba(20,20,20,.10), rgba(20,20,20,0)),
    linear-gradient(to left,  rgba(20,20,20,.10), rgba(20,20,20,0)) 100% 0;
  background-repeat: no-repeat;
  background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
  background-attachment: local, local, scroll, scroll;
}

@media (max-width: 430px) {
  /* Quatro links e a sigla não cabem: fica o símbolo, que é a marca. */
  .topo__nav { gap: 12px; }
  .topo__nav a { font-size: 11px; letter-spacing: .03em; }
  .topo__interno { gap: 8px; }
  .topo__sigla { display: none; }
  .topo__marca img { width: 34px; height: 34px; }
}