/* ==========================================================================
   COMPONENTE — uc-anuncio
   O INVOLUCRO e o ROTULO DE DIVULGACAO de uma unidade de anuncio.

   ⛔ ESCOPO, ESCRITO ANTES DE QUALQUER REGRA: este arquivo NAO decide onde,
   quando nem com que frequencia um anuncio aparece, nao toca `inc/ads.php`
   nem qualquer configuracao do AdSense, e nao mexe no `uc-ad-topo` (o bloco
   abaixo do cabecalho) -- decisao em aberto do dono. O que esta aqui e' a
   caixa em volta e a palavra em cima dela.

   ==========================================================================
   1. A MARCACAO E' INVARIANTE — MEDIDA, NAO SUPOSTA
   ==========================================================================
   Medido em 05/09/2026 no HTML renderizado de NOVE telas do tema antigo,
   anonimo, por token de atributo `class` e com arvore DOM de verdade:

     uc-ad        22   <aside> em 22 de 22, com aria-label="Publicidade"
     uc-ad__tag   22   <p>     em 22 de 22        <- UM PARA UM, sem excecao

   e os 22 tem exatamente os mesmos quatro filhos, na mesma ordem:
     <p class="uc-eyebrow uc-ad__tag">publicidade</p>
     <ins class="adsbygoogle" ...></ins>
     <script>(adsbygoogle = ...).push({})</script>

   `uc-ad-topo` (9 renderizacoes, uma por tela) e' OUTRA coisa: o involucro de
   POSICAO do bloco que fica abaixo do cabecalho. Nao entra aqui.

   ==========================================================================
   2. ⛔ `uc-ad__tag` DEIXA DE EXISTIR — A TAREFA D JA O ENTREGOU
   ==========================================================================
   O rotulo nao e' decoracao: e' DIVULGACAO, e `inc/ads.php:85` escreve o
   motivo -- "identificar publicidade e' exigencia do CDC (art. 36) e do
   proprio AdSense". Ou seja, ele tem de ser LEGIVEL.

   MEDIDO no navegador, em producao, anonimo, nas tres unidades de /questoes/:
     .uc-ad__tag   font-size 10.88px   cor rgb(97,108,122) = --uc-ink-3
                   IBM Plex Mono, caixa alta   -> 5,02:1 sobre o papel
   Cinza-claro minusculo, exatamente como o briefing descreve.

   A tarefa D ja tinha medido isto (23 dos 47 `uc-eyebrow` do site sao
   `uc-ad__tag`) e ja entregou o conserto como `.uc-rotulo--divulgacao`:
     tamanho  10,88px  ->  var(--uc-s--1) = 12-13,1px
     cor      --uc-ink-3 (5,02:1)  ->  --uc-ink-2 (9,58:1)
     fio      nao havia  ->  border-top + padding-top

   ENTAO NAO HA `.uc-anuncio__tag` NESTE ARQUIVO, e nao ha uma linha
   sobrescrevendo o rotulo. O rotulo e' `<p class="uc-rotulo
   uc-rotulo--divulgacao">publicidade</p>`, inteiro. Escrever
   `.uc-anuncio .uc-rotulo--divulgacao{...}` aqui seria o hospedeiro pintando
   o convidado -- a Regra 16 acusa, e ela existe porque foi assim que o tema
   antigo produziu seis regras de desfazer em volta da marca.

   COR NUNCA E' O UNICO SINAL, e sao quatro (tres sem cor), todos ja no
   `rotulo.css`: a PALAVRA "publicidade" por extenso; o FIO acima, que separa
   o bloco pago do conteudo; a POSICAO, sempre imediatamente acima da unidade
   que ele nomeia; e a cor, so' acompanhando.

   ==========================================================================
   3. ⛔ O QUE ESTE CSS CONSEGUE LIMITAR — MEDIDO AO VIVO, COM CONTROLE
   ==========================================================================
   ⚠️ 06/10/2026 -- AS SECOES 3 E 4 SAO HISTORIA DO ADSENSE. O site trocou o
   AdSense direto pelo Google Ad Manager (GPT, tag da programatica): a vaga
   e' `<ins id="ContentN">` preenchida pelo GPT, que nao escreve altura
   inline nos nossos elementos, e o `uc_ads_latch` saiu junto. A medicao
   abaixo fica porque explica por que a contencao e' `max-width`+`overflow`.
   O que vale hoje para vaga vazia esta na secao 4.

   O briefing manda medir antes de supor que da' para limitar o AdSense.
   Medido em 05/09/2026, em producao, anonimo, /questoes/, 776px de visor,
   com as tres unidades em `unfill-optimized`/`unfilled`:

     ESTILO INLINE QUE O ADSENSE ESCREVE NOS NOSSOS PROPRIOS ELEMENTOS:
       div.uc-ad-topo   style="height: auto !important;"        <- DOIS niveis
                                                                  acima do <ins>
       ins.adsbygoogle  style="height: 280px"
       ins.adsbygoogle  style="height: 0px; width: 0px"
       ins.adsbygoogle  style="height: auto !important;
                               background-color: transparent !important"

     EXPERIMENTO com CONTROLE POSITIVO, no `div.uc-ad-topo` que ja carregava
     `height:auto!important` inline (folha injetada, computado lido de volta):

       folha  height:120px               -> computado 312px   PERDEU
       folha  height:120px !important    -> computado 312px   PERDEU
       folha  max-height:96px            -> computado  96px   VENCEU  (controle)

     O controle e' o que torna as duas derrotas informativas: o instrumento
     FUNCIONA (a terceira linha mudou a caixa de 312 para 96px de verdade),
     entao as duas primeiras nao sao falha de medicao. Inline `!important`
     vence folha externa `!important` na MESMA propriedade; so' outro inline
     vence.

   CONCLUSAO, e ela define o que este arquivo tenta e o que ele nao tenta:

     SOBREVIVE   `max-width` + `overflow` no involucro (o AdSense nao os
                 escreve inline). Medido: `div.uc-ad-topo` computa
                 `max-width:100%`, `overflow:hidden`, e a pagina nao rola de
                 lado (scrollWidth 761 <= innerWidth 776).
     SOBREVIVE   `min-height` na vaga. Medido: um `<ins>` com
                 `style="height:0px;width:0px"` inline mediu 250px de altura,
                 porque `min-height` da folha e' outra propriedade e vence
                 `height`. E' o que sustenta a reserva da secao 4.
     NAO SOBREVIVE  qualquer TETO de altura (`height`, `max-height`) depois
                 que o AdSense roda.

   ⛔ POR ISSO ESTE ARQUIVO NAO ESCREVE TETO DE ALTURA NENHUM. Escrever um
   seria pior que nao escrever: pareceria contencao e nao conteria -- o tipo
   de guarda que so' se descobre falsa quando alguem ja confiou nela. Quem
   limita altura no site de hoje e' JavaScript (`uc_ads_latch`, em
   `inc/ads.php`), que reaplica o teto INLINE depois do Google. Esse arquivo
   nao e' meu e nao foi tocado.

   ==========================================================================
   4. ANUNCIO QUE NAO CARREGA: COLAPSO -- E A DECISAO E' DO DONO
   ==========================================================================
   Decisao do dono em 06/10/2026, ao trocar para a programatica: seguir a tag
   do parceiro (`collapseDiv: ON_NO_FILL`) -- vaga sem anuncio SOME, selo
   junto. Revoga a reserva fixa de 250px de 27/08/2026, que existia por causa
   do AdSense (ele escrevia o criativo antes de decidir se servia, e colapsar
   depois produzia o "aparece e some").

   Como fica, e por que assim:
   - o bloco nasce INVISIVEL (`visibility`, nao `display`): o lazyLoad do GPT
     so' pede o anuncio quando a vaga se aproxima da tela, e caixa com
     `display:none` nunca se aproxima. Invisivel, ela continua no fluxo, sem
     reserva de altura, e o selo nao fica sobre um vao;
   - servido: o `slotRenderEnded` do motor (`inc/ads.php`) poe
     `.uc-anuncio--servido` e o bloco aparece inteiro, selo e criativo juntos;
   - vazio: o mesmo evento poe `display:none` no bloco -- a margem sai junto;
   - bloqueador de anuncio: sem gpt.js nao ha evento; o motor tira os blocos
     3s depois do `load`.
   O exemplar do mostruario nunca e' servido, entao fica de fora da regra.

   ==========================================================================
   5. CONTRATO DE MARCACAO
   ==========================================================================
     <aside class="uc-anuncio" aria-label="Publicidade">
       <p class="uc-rotulo uc-rotulo--divulgacao">publicidade</p>
       <ins ...></ins>
     </aside>

   `<aside>` porque o conteudo e' tangencial ao da pagina -- e' o elemento que
   o tema antigo ja usa nos 22, e ele esta certo. `aria-label` porque um
   `<aside>` entra na lista de regioes do leitor de tela e regiao sem nome e'
   "complementar" repetido tres vezes por pagina.

   A VAGA E' MIRADA PELO ELEMENTO (`ins`), NAO POR CLASSE, de proposito: em
   producao a vaga e' `<ins class="adsbygoogle">`, que e' classe de terceiro
   e teria de entrar em `classes_externas` do inventario para a Regra 6 nao
   acusar. Mirar o elemento resolve sem gastar uma entrada de excecao E e'
   mais honesto: o involucro serve a VAGA que estiver ali dentro, seja ela
   do AdSense ou de outro provedor -- desde 06/10/2026, o `<ins id="ContentN">`
   do GPT.

   NAO HA `data-uc-estado` AQUI, e a ausencia e' a descricao correta da peca.
   Os cinco estados sao obrigatorios em superficie que BUSCA ou ACEITA dado;
   esta nao busca -- ela cede um retangulo para um terceiro. E o que ela
   PODERIA sinalizar (chegou / nao chegou) e' justamente o que a decisao da
   secao 4 diz para NAO sinalizar: a caixa tem a mesma forma nos dois casos,
   e essa igualdade e' o recurso, nao uma lacuna. O estado real de uma
   unidade e' `data-ad-status`, atributo da plataforma, escrito pelo AdSense
   -- e a tarefa D ja fixou a regra: usa-se o atributo que a plataforma
   define, nao uma copia nossa que pode divergir dele.
   ========================================================================== */

/* --------------------------------------------------------------------------
   O INVOLUCRO
   -------------------------------------------------------------------------- */

/* `max-width` + `overflow:hidden` sao a UNICA contencao que sobrevive ao
   AdSense (secao 3), e ela nao e' cosmetica: o formato full-width-responsive
   injeta a `<ins>` com margem negativa e largura igual ao visor, e qualquer
   discrepancia de 1px entre o que o AdSense calcula e o `clientWidth` real
   faz a PAGINA INTEIRA rolar de lado. Medido em 390x844 no tema antigo, e e'
   o motivo escrito em `bancada.css:977`.
   `overflow:hidden` NAO esconde anuncio: o criativo continua do tamanho que
   o AdSense decidiu -- so' o que passa da largura da coluna e' cortado.

   `display:grid` com `gap` e' o que afasta o rotulo da vaga. O afastamento e'
   do HOSPEDEIRO porque o `uc-rotulo` nao emite margem (tarefa D), e 8px e' o
   vao de "mesmo grupo": o rotulo e a vaga sao a mesma coisa. */
.uc-anuncio{
  display:grid;
  gap:var(--sp-2);
  justify-items:center;
  min-width:0;
  max-width:100%;
  /* RESPIRO ENTRE O ANUNCIO E O CONTEUDO DO SITE.
     Era `margin:0`, e o bloco encostava na secao de cima e na de baixo.
     Relatado pelo dono em 06/09/2026, depois da virada.
     A regra desta casa: 8-12px DENTRO de um grupo, 32-48px ENTRE grupos.
     O anuncio nao pertence a secao nenhuma -- ele INTERROMPE -- entao a
     distancia dele para o conteudo e' de ENTRE grupos, nunca de dentro.
     --sp-7 = 3rem = 48px, o teto da faixa: separa de verdade sem empurrar
     a proxima secao para fora do primeiro ecra no celular.
     `margin-block` e nao `margin`: a horizontal e' do involucro que hospeda,
     e centralizar ja e' trabalho do `justify-items` acima. */
  margin-block:var(--sp-7);
  overflow:hidden;
}

/* A VAGA. Sem reserva de altura desde 06/10/2026 (secao 4): mede o criativo
   que o GPT servir. `width:100%` para a vaga ocupar a coluna;
   `display:block` porque `<ins>` e' inline por padrao.

   ⛔ `text-decoration:none` NAO E' ENFEITE, e ele foi achado OLHANDO A
   CAPTURA: `<ins>` e' o elemento HTML de "texto inserido", e a folha do
   NAVEGADOR lhe da' `text-decoration:underline`. Todo texto que caia dentro
   da vaga -- o exemplar desta folha, um aviso de bloqueador, um fallback de
   outro provedor -- sai SUBLINHADO, ou seja, parecendo link. O tema antigo
   nunca viu isso porque a `<ins>` do AdSense so' recebe um <iframe>, e
   iframe nao herda decoracao de texto. E' defeito latente do elemento, nao
   da nossa marcacao, e custa uma linha desarmar. */
.uc-anuncio > ins{
  display:block;
	/* CENTRALIZA O CRIATIVO DENTRO DA VAGA.
	   O involucro ja centraliza (justify-items) e o <ins> ja ocupa 100% da
	   coluna -- entao centralizar o <ins> nao muda nada. Quem fica a esquerda
	   e o IFRAME que a rede escreve DENTRO do <ins> quando o criativo
	   servido e mais estreito que a vaga (um retangulo de 300px numa coluna
	   de 728, por exemplo). Relatado pelo dono em 06/09/2026.
	   `text-align` e' a contencao certa aqui: o iframe e' de nivel inline, e
	   isto NAO mexe na largura do <ins> -- que e' o que o AdSense mede para
	   escolher o formato. Trocar o involucro por flex mexeria nessa largura e
	   arriscaria o anuncio deixar de preencher. */
	text-align:center;
  width:100%;
  text-decoration:none;
}

/* SO' O BLOCO SERVIDO APARECE (secao 4). */
.uc-anuncio:not(.uc-anuncio--servido):not(.uc-anuncio--exemplar){
  visibility:hidden;
}

/* --------------------------------------------------------------------------
   ANUNCIO AUTOMATICO DO ADSENSE (Auto Ads) -- AUTO_ADS_LARGURA_20260911
   --------------------------------------------------------------------------
   ⛔ NAO E' NOSSO: o AdSense INJETA `div.google-auto-placed` dentro de
   `main#uc-conteudo`, fora de qualquer `.uc-anuncio`. Medido em 11/09/2026,
   producao, anonimo, pagina de questao, visor 1520px: a unidade automatica
   veio `unfilled`, o Google zerou a `<ins>` (inline `width:0;height:0`,
   `margin:auto` -> x=754), mas o `aswift_N_host` de dentro ficou com os
   1200px da requisicao e comecou no MEIO da coluna: borda direita em 1954px,
   `scrollWidth` 1954 contra `clientWidth` 1507 -- a PAGINA INTEIRA rolando de
   lado no desktop.

   E' a mesma contencao do nosso involucro (secao 3: `max-width` e overflow
   sobrevivem ao inline do AdSense), com uma diferenca de proposito: aqui e'
   `overflow-x:clip`, nao `overflow:hidden`. So' o eixo HORIZONTAL e' contido
   -- a altura continua a que o Google escrever, entao criativo servido nao
   tem como ser cortado na vertical (a memoria da casa: corte de criativo e'
   problema de politica) -- e `clip` nao cria contexto de rolagem.
   Nao decide onde, quando nem se o anuncio automatico aparece (escopo deste
   arquivo, no cabecalho): so' impede que a sobra de largura role a pagina.
   A classe e' do Google e esta em `classes_externas` do inventario (R6). */
.google-auto-placed{
  max-width:100%;
  overflow-x:clip;
}

/* --------------------------------------------------------------------------
   VARIANTE: EXEMPLAR DO MOSTRUARIO
   --------------------------------------------------------------------------
   ⚠️ ESTA VARIANTE SO' EXISTE NO MOSTRUARIO, e ela existe porque a
   alternativa era pior. Nesta pagina o `functions.php` desliga a injecao
   global de script (medido na tarefa A2: quatro elementos `google-anno-*`,
   dois deles focaveis, contaminavam a ordem de tabulacao), entao nao ha
   AdSense aqui -- e um exemplar com a vaga vazia mostraria tres retangulos
   invisiveis e identicos, sem nada para julgar.

   O tracejado NAO e' vocabulario novo: e' o mesmo que o `uc-chip--mais` usa
   para dizer "isto nao e' um chip, e' um expansor". Aqui ele diz "isto nao
   e' um anuncio, e' o lugar dele". Na pagina real esta classe nao aparece e
   a vaga NAO e' pintada -- quem desenha dentro dela e' o AdSense.

   O `<b>` de dentro nao leva classe: ele existe para provar, com um bloco
   propositalmente MAIS LARGO que a coluna, que o `overflow:hidden` acima
   contem o criativo sem a pagina rolar de lado. E' o unico caso hostil desta
   peca que da' para reproduzir sem o AdSense. */
.uc-anuncio--exemplar > ins{
  display:grid;
  align-content:center;
  padding:var(--sp-4);
  border:var(--uc-borda) dashed var(--uc-rule-forte);
  border-radius:var(--uc-r-3);
  background:none;
  color:var(--uc-ink-3);
  text-align:center;
}

.uc-anuncio--exemplar > ins > b{
  display:block;
  width:150%;
  margin-top:var(--sp-3);
  padding:var(--sp-2);
  border-radius:var(--uc-r-1);
  background:var(--uc-paper-3);
  color:var(--uc-ink-2);
  font-weight:var(--uc-w-ler);
}