vem sem data-views): o script.js desabilita o radio e explica no title. Aqui ele só fica esmaecido — e o :hover acima não pode revivê-lo, por isso a regra vem depois. */ main > search > fieldset > label:has(input:disabled), main > search > fieldset > label:has(input:disabled):hover { background: transparent; color: var(--texto-3); opacity: 0.5; cursor: not-allowed; } /* ---- contagem: "3 resultado(s)" ---- */ main > search > output { font-size: 13px; color: var(--texto-3); } main > search > output > span { font-weight: 700; color: var(--azul); } /* Quando nenhum artigo casa TODOS os termos, o script relaxa a busca para quem casa parte deles e marca data-busca="parcial" no . O aviso é daqui porque o script.js não pode criar nós. */ main > search[data-busca="parcial"] > output::after { content: " · correspondência parcial"; font-style: italic; } /* ---- destaque do termo buscado ---- Sem : o script registra Ranges na CSS Custom Highlight API (nada é inserido na árvore) e a pintura é toda daqui. Navegador sem suporte simplesmente ignora estas duas regras. */ ::highlight(busca) { background: var(--realce-teal); color: var(--azul); } main > ul article h3::highlight(busca) { background: var(--teal-transparente); } /* ---- lista de resultados — main > ul > li > a > article ---- `main > ul` só existe nesta página (na home e na categoria as listas estão dentro de

, no artigo dentro de

). O `display: flex` é OBRIGATÓRIO, não estético: o script.js ordena a lista escrevendo `style.order` em cada

(não pode mover nós), e `order` só vale entre itens de um contêiner flex ou grid. Pelo mesmo motivo o [hidden] precisa da regra explícita abaixo — como item flex o

é blocado, e o display do UA para [hidden] seria sobrescrito. */ main > ul { display: flex; flex-direction: column; gap: 12px; margin: 0 0 56px; padding: 0; list-style: none; transition: opacity var(--transicao); } main > ul > li[hidden] { display: none; } main > ul > li > a { display: block; color: inherit; text-decoration: none; } main > ul > li > a:hover { color: inherit; } main > ul article { display: flex; flex-direction: column; gap: 7px; padding: 16px 18px; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); transition: border-color var(--transicao), transform var(--transicao), box-shadow var(--transicao); } main > ul > li > a:hover article { border-color: var(--teal-transparente); transform: translateY(-2px); box-shadow: var(--sombra-card); } /* 1º

: categoria (o único com ícone) + tags. A categoria fica no véu azul e as tags no turquesa, os mesmos chips do resto do site. */ main > ul article > p:first-of-type { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; font-size: 11.5px; line-height: 1.5; } main > ul article > p:first-of-type > span { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px; background: var(--realce-teal); font-weight: 700; color: var(--teal-escuro); } main > ul article > p:first-of-type > span:has(svg) { background: var(--realce); color: var(--azul); } main > ul article > p:first-of-type svg { width: 13px; height: 13px; } main > ul article h3 { margin: 0; font-size: 16px; font-weight: 700; line-height: 1.35; color: var(--azul); } /* 2º

: descrição, duas linhas e o resto em reticências — é o que mantém os cartões com a mesma altura mesmo com textos de tamanhos bem diferentes */ main > ul article > p:nth-of-type(2) { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--texto-2); } /* 3º

: tempo de leitura + data */ main > ul article > p:last-of-type { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 2px 0 0; font-size: 12px; color: var(--texto-3); } main > ul article > p:last-of-type > span, main > ul article time { display: inline-flex; align-items: center; gap: 5px; } main > ul article > p:last-of-type svg { width: 13px; height: 13px; } /* ---- "nenhum resultado" ---- O script.js não pode criar nós, então o aviso é um ::after do próprio

sem [hidden]. Como o