/* Radar de PLs de CT&I: tema verde em todo o site. */
.radar-page, .body--radar {
  --r-fundo: #0c1f1b; --r-painel: #12302a; --r-campo: #0f2823; --r-linha: #3d5c54; --r-borda-campo: #6f9a8d;
  --r-texto: #f2f0e6; --r-suave: #b9cbc4; --r-lime: #d7f56f; --r-laranja: #f4a574; --r-teal: #7fcdc4;
}
.radar-page {
  background: var(--r-fundo); color: var(--r-texto); border-radius: 0; padding: clamp(1rem, 2vw, 1.75rem);
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; min-width: 0;
}
.pagina--larga:has(.radar-page) { max-width: none; padding: 0; }
.body--radar { background: #081d17; color: #f2f0e6; }
.body--radar .cabecalho, .body--radar .rodape { background: #0b241c; }
.body--radar .cabecalho { border-bottom: 1px solid #35584b; }
.body--radar .cabecalho__simbolo, .body--radar .rodape a { color: #d7f56f; }
.body--radar .cabecalho__atualizado, .body--radar .cabecalho__titulo span { color: #b9cbc4; }
.body--radar .cabecalho__nav a { color: #e0eee5; }
.body--radar .cabecalho__nav a[aria-current="page"] { color: #d7f56f; border-bottom-color: #d7f56f; }
.body--radar .rodape { border-top-color: #d7f56f; color: #b9cbc4; }
.radar-page h1, .radar-page h2 { color: var(--r-texto); }
.radar-page h1 { font-size: clamp(1.7rem, 4vw, 2.6rem); line-height: 1.1; max-width: 22ch; margin: .25rem 0 .75rem; }
.radar-page a { color: var(--r-lime); }
.radar-page a:focus-visible, .radar-page button:focus-visible, .radar-page summary:focus-visible,
.radar-page select:focus-visible, .radar-page input:focus-visible, .body--radar select:focus-visible, .body--radar input:focus-visible,
.body--radar button:focus-visible, .radar-rolante:focus-visible { outline: 3px solid var(--r-teal); outline-offset: 2px; }
.radar-selo { color: var(--r-lime); font-size: .8125rem; letter-spacing: .06em; text-transform: uppercase; margin: 0; }
.radar-lide, .radar-cobertura, .radar-nota, .radar-apoio { color: var(--r-suave); }
.radar-lide { max-width: 60ch; margin: 0 0 .5rem; }
.radar-cobertura { max-width: 70ch; margin: 0 0 1rem; font-size: .9375rem; }
.radar-cobertura strong { color: var(--r-texto); }
.radar-apoio { font-size: .875rem; font-weight: 400; }
.radar-botao { display: inline-block; border: 0; border-radius: 999px; padding: .55rem 1.25rem; font: inherit; font-size: .875rem;
  font-weight: 700; letter-spacing: .04em; text-decoration: none; cursor: pointer; color: var(--r-fundo); }
.radar-page a.radar-botao { color: var(--r-fundo); }
.radar-botao--lime { background: var(--r-lime); } .radar-botao--laranja { background: var(--r-laranja); }
.radar-baixar { display: flex; gap: .6rem; margin: 0; }

.radar-grade { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(22rem, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.radar-figura { margin: 0; position: relative; min-width: 0; }
.radar-svg { width: 100%; height: auto; display: block; overflow: visible; filter: drop-shadow(0 12px 11px rgba(0, 0, 0, .38)); transition: transform .35s ease, filter .35s ease; }
.radar-figura:hover .radar-svg { transform: translateY(-2px); filter: drop-shadow(0 15px 13px rgba(0, 0, 0, .42)); }
.radar-plataforma-base { fill: #06140f; stroke: #294a3d; stroke-width: 3; filter: drop-shadow(0 9px 7px rgba(0, 0, 0, .42)); }
.radar-plataforma { fill: #10271f; stroke: #426359; stroke-width: 2; }
.radar-plano-3d { transform-box: view-box; }
.radar-svg .anel { stroke: rgba(255, 255, 255, .28); stroke-width: 1; }
.radar-svg .anel--3 { fill: #123029; } .radar-svg .anel--2 { fill: #17382f; }
.radar-svg .anel--1 { fill: #1d4337; } .radar-svg .anel--0 { fill: #265245; }
.radar-svg .eixo { stroke: rgba(255, 255, 255, .28); stroke-width: 1; }
.radar-varredura { transform-origin: 300px 300px; animation: radar-giro 9s linear infinite; pointer-events: none; }
.radar-varredura-feixe { fill: url(#radar-varredura-gradiente); }
.radar-varredura-eixo { stroke: #d7f56f; stroke-width: 1.6; opacity: .92; filter: drop-shadow(0 0 5px rgba(215, 245, 111, .9)); }
@keyframes radar-giro { to { transform: rotate(360deg); } }
.radar-svg .rotulo-anel { pointer-events: none; paint-order: stroke; stroke: #0c1f1b; stroke-width: 3px; fill: var(--r-suave); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.radar-svg .rotulo-quadrante { fill: var(--r-texto); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.radar-svg .centro { fill: #fff; stroke: var(--r-fundo); stroke-width: 2; }
.bolinha { stroke: var(--r-fundo); stroke-width: 1.5; }
.bolinha--novo { fill: var(--r-lime); animation: radar-retorno 2.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; filter: drop-shadow(0 0 4px rgba(215, 245, 111, .85)); } .bolinha--mudou { fill: var(--r-laranja); } .bolinha--igual { fill: var(--r-teal); }
@keyframes radar-retorno { 50% { transform: scale(1.45); filter: drop-shadow(0 0 8px rgba(215, 245, 111, 1)); } }
.radar-svg a:hover .bolinha, .radar-svg a:focus-visible .bolinha { stroke: #fff; stroke-width: 3; }
.radar-svg a:focus-visible { outline: none; }
.radar-legenda { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin-top: .75rem; font-size: .8125rem; color: var(--r-suave); }
.radar-eixos-mobile { display: none; }
.bolinha-legenda.bolinha--novo { background: var(--r-lime); } .bolinha-legenda.bolinha--mudou { background: var(--r-laranja); } .bolinha-legenda.bolinha--igual { background: var(--r-teal); }
.bolinha-legenda { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; margin-right: .35rem; }

.radar-total { margin: 0 0 1rem; color: var(--r-suave); }
.radar-total strong { display: block; font-size: 2.75rem; line-height: 1; color: var(--r-lime); }
.radar-tabela { background: var(--r-painel); border-radius: 10px; padding: .75rem 1rem; overflow-x: auto; }
.radar-tabela table { table-layout: auto; }
@media (max-width: 520px) { .radar-tabela table { font-size: .75rem; } .radar-tabela th, .radar-tabela td { padding: .35rem .2rem; } }
.radar-tabela summary, .radar-metodo summary { cursor: pointer; font-weight: 700; }
.radar-tabela table { background: transparent; color: var(--r-texto); width: 100%; margin-top: .75rem; border-collapse: collapse; font-size: .875rem; }
.radar-tabela th, .radar-tabela td { background: transparent; color: var(--r-texto); padding: .4rem .35rem; border-top: 1px solid var(--r-linha); text-align: right; }
.radar-tabela th[scope="row"], .radar-tabela thead th:first-child { text-align: left; }
.radar-tabela thead th { color: var(--r-suave); font-weight: 400; }
.radar-nota { font-size: .8125rem; margin: 1rem 0 0; }

.radar-filtros { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .85rem 1rem; align-items: end;
  background: var(--r-painel); border-radius: 10px; padding: 1rem; }
.radar-filtros .campo { margin: 0; }
.radar-filtros label { display: block; font-size: .8125rem; color: var(--r-suave); margin-bottom: .25rem; }
.radar-filtros select, .radar-filtros input[type="search"], .radar-filtros input[type="email"] { width: 100%; background: var(--r-campo); color: var(--r-texto);
  border: 1px solid var(--r-borda-campo); border-radius: 8px; padding: .5rem .6rem; font: inherit; }
.radar-filtros option { background: var(--r-campo); color: var(--r-texto); }
.radar-filtros ::placeholder { color: var(--r-suave); opacity: 1; }
.radar-busca, .radar-amplos, .radar-acoes { grid-column: 1 / -1; }
.radar-amplos label { display: flex; gap: .5rem; align-items: center; font-size: .875rem; color: var(--r-texto); }
.radar-acoes { display: flex; gap: 1rem; align-items: center; }

.radar-rolante { overflow-x: auto; border: 1px solid var(--r-linha); border-radius: 10px; }
.radar-lista { width: 100%; border-collapse: collapse; font-size: .9rem; min-width: 760px; }
.radar-lista { background: transparent; color: var(--r-texto); }
.radar-lista th, .radar-lista td { background: transparent; color: var(--r-texto); padding: .65rem .8rem; text-align: left; vertical-align: top; border-top: 1px solid var(--r-linha); }
.radar-lista thead th { border-top: 0; background: var(--r-painel); font-size: .8125rem; color: var(--r-suave); }
.radar-lista .radar-apoio, .radar-tabela .radar-apoio { color: var(--r-suave); }
.radar-lista tbody tr:target { background: #1d4337; outline: 2px solid var(--r-lime); outline-offset: -2px; }
.radar-estagio { display: inline-block; border-radius: 999px; padding: .1rem .6rem; font-size: .8125rem; font-weight: 700; background: var(--r-painel); border: 1px solid var(--r-linha); }
.radar-estagio--aprovado { background: var(--r-lime); color: var(--r-fundo); border-color: var(--r-lime); }
.radar-vazio { background: var(--r-painel); border-radius: 10px; padding: 1rem; margin: 0; color: var(--r-suave); }
.radar-paginas { display: flex; gap: 1rem; align-items: center; margin-top: 1rem; color: var(--r-suave); }
.radar-metodo { color: var(--r-suave); max-width: 75ch; }
.radar-metodo p { margin: .75rem 0 0; }

@media (max-width: 860px) {
  .radar-grade { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .radar-svg .rotulo-quadrante { font-size: 14px; } .radar-svg .rotulo-anel { font-size: 13px; }
  .radar-lado { max-width: none; }
}

@media (max-width: 520px) {
  .radar-page { padding: 1rem; gap: 1.5rem; }
  .radar-grade { gap: 1rem; }
  .radar-figura { overflow-x: clip; }
  .radar-figura:hover .radar-svg { transform: none; }
  .radar-rotulos .rotulo-quadrante { display: none; }
  .radar-legenda .radar-eixos-mobile { display: flex; flex-basis: 100%; flex-wrap: wrap; gap: .4rem 1rem; font-size: .75rem; line-height: 1.35; }
  .radar-rolante { overflow: visible; border: 0; border-radius: 0; }
  .radar-lista { display: block; min-width: 0; border-collapse: separate; }
  .radar-lista thead, .radar-tabela thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
  .radar-lista tbody, .radar-tabela tbody { display: grid; gap: .75rem; }
  .radar-lista tbody tr, .radar-tabela tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1rem; padding: .85rem; border: 1px solid var(--r-linha); border-radius: 12px; background: var(--r-painel); }
  .radar-lista tbody td { display: flex; flex-direction: column; min-width: 0; padding: 0; border: 0; overflow-wrap: anywhere; }
  .radar-lista tbody td::before, .radar-tabela tbody td::before { content: attr(data-label); display: block; margin-bottom: .2rem; color: var(--r-suave); font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
  .radar-lista tbody td:first-child, .radar-tabela tbody th[scope="row"] { grid-column: 1 / -1; }
  .radar-lista tbody td:first-child { font-size: .9rem; }
  .radar-tabela { overflow: visible; }
  .radar-tabela table { display: block; border-collapse: separate; }
  .radar-tabela tbody th[scope="row"] { padding: 0; border: 0; text-align: left; }
  .radar-tabela tbody td { padding: 0; border: 0; text-align: left; }
  .radar-lista tbody tr:target { background: #1d4337; outline: 2px solid var(--r-lime); outline-offset: -2px; }
}

@media (prefers-reduced-motion: reduce) {
  .radar-varredura, .bolinha--novo { animation: none !important; }
  .radar-svg, .radar-figura:hover .radar-svg { transition: none; transform: none; }
}

.radar-dica { position: absolute; z-index: 5; width: max-content; max-width: min(320px, 92%); pointer-events: none; background: #06120f;
  border: 1px solid var(--r-linha); border-radius: 8px; padding: .65rem .85rem; box-shadow: 0 6px 18px rgba(0, 0, 0, .45); }
.radar-dica[data-mov="novo"] .dica-meta { color: var(--r-lime); } .radar-dica[data-mov="mudou"] .dica-meta { color: var(--r-laranja); }
.radar-dica[data-mov="igual"] .dica-meta { color: var(--r-teal); }
.radar-dica p { margin: 0; }
.radar-dica .dica-municipio { font-size: 1.0625rem; font-weight: 700; color: var(--r-texto); line-height: 1.25; }
.radar-dica .dica-autor { font-size: .9375rem; font-weight: 700; color: var(--r-lime); margin-top: .1rem; }
.radar-dica .dica-meta { font-size: .8125rem; color: var(--r-suave); margin-top: .35rem; }
.radar-dica .dica-ementa { font-size: .875rem; color: var(--r-texto); margin-top: .35rem; line-height: 1.4; }
.radar-nivel { display: inline-block; border-radius: 999px; padding: .05rem .55rem; font-size: .75rem; font-weight: 700; border: 1px solid var(--r-linha); }
.radar-nivel--estruturante { background: var(--r-lime); color: var(--r-fundo); border-color: var(--r-lime); }

/* Páginas de texto (metodologia): quadro de destaque e links no tom do radar. */
.body--radar .prosa a { color: #d7f56f; }
.body--radar .ressalva { background: #12302a; border-left-color: #d7f56f; color: #f2f0e6; }
.body--radar .ressalva a { color: #d7f56f; }

/* Desktop: o estado do RJ em linhas ao fundo do cabeçalho (decorativo; tools/gerar_mapa_fundo.py). */
@media (min-width: 1200px) {
  .radar-page > .radar-topo { position: relative; min-height: 22rem; }
  .radar-page > .radar-topo::before {
    content: ""; position: absolute; z-index: 0; pointer-events: none;
    top: -.5rem; right: 0; bottom: -1rem; width: min(46%, 860px);
    background: url("/assets/img/mapa-rj-fundo.svg") right center / contain no-repeat;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 22%);
    mask-image: linear-gradient(to right, transparent, #000 22%);
  }
  .radar-page > .radar-topo > * { position: relative; z-index: 1; }
}

/* Barras das páginas de tema: <meter> (o CSP não admite style inline). Decorativas; o número está na célula ao lado. */
.radar-barra { appearance: none; -webkit-appearance: none; width: 100%; min-width: 6rem; height: .6rem; border: 0; background: transparent; }
.radar-barra::-webkit-meter-bar { background: transparent; border: 0; height: .6rem; }
.radar-barra::-webkit-meter-optimum-value, .radar-barra::-webkit-meter-suboptimum-value, .radar-barra::-webkit-meter-even-less-good-value { background: #7fcdc4; border-radius: 3px; }
.radar-barra::-moz-meter-bar { background: #7fcdc4; border-radius: 3px; }

/* Aviso de cookies: fixo no rodapé da janela até a escolha; Aceitar e Recusar com o mesmo peso. */
.aviso-cookies { position: fixed; z-index: 50; left: 1rem; right: 1rem; bottom: 1rem; max-width: 40rem; margin: 0 auto; padding: 1rem 1.25rem;
  background: var(--r-painel); color: var(--r-texto); border: 1px solid var(--r-linha); border-top: 3px solid var(--r-lime); border-radius: .75rem;
  box-shadow: 0 .5rem 2rem rgb(0 0 0 / .45); }
.aviso-cookies[hidden] { display: none; }
.aviso-cookies p { margin: 0; font-size: .9375rem; }
.aviso-cookies a { color: var(--r-lime); }
.aviso-cookies__botoes { display: flex; gap: .6rem; margin-top: .8rem !important; flex-wrap: wrap; }
