/* previa-leitura-20260909a.css — 09/09/2026
   Prévia da rodada "altura antes de palavra". Três mudanças, todas de ALTURA, nenhuma de palavra:

   1. LISTA DE REVELAÇÃO (.rv) — a enumeração central do guia deixa de empilhar 7 a 9 blocos de
      30 a 76 palavras. Fica o número e a frase-título à vista; o resto abre no toque. Medido no
      bloco dos sete indicadores, num celular de 390 px: 2 091 px (lista de frases) e 2 322 px
      (tabela de 4 colunas) contra 645 px aqui. Nenhuma palavra sai do arquivo: <details> esconde
      do olho, não do rastreador.
   2. FAIXA DE OFERTA CEDO (.oferta-cedo) — o convite deixa de morar só no rodapé, a 5–12 telas
      do topo, e ganha uma linha logo depois da resposta direta.
   3. RESPIRO DE PÁGINA DE TEXTO (.txt-densa) — o padding de seção do blog veio da home, que tem
      figura grande em cada bloco. O guia não tem: 1 512 px de ar por post, quase duas telas.

   Carregada por ÚLTIMO, depois da legivel-*.css. Só acrescenta; não redefine token. */

/* ============ 1 · lista de revelação ============ */
.rv-lista{max-width:900px;margin:0;padding:0;list-style:none;
  border-top:1px solid var(--border-subtle)}
.rv{border-bottom:1px solid var(--border-subtle)}
.rv>summary{list-style:none;cursor:pointer;display:grid;
  grid-template-columns:auto 1fr auto;gap:12px;align-items:baseline;
  padding:15px 2px;margin:0}
.rv>summary::-webkit-details-marker{display:none}
.rv>summary::marker{content:""}
.rv>summary:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:6px}
.rv-n{font-family:var(--mono2);font-size:10.5px;font-weight:400;letter-spacing:.12em;
  color:var(--brand);padding-top:3px}
.rv-t{font-family:var(--disp);font-weight:600;font-size:16.5px;letter-spacing:-.015em;
  line-height:1.3;color:var(--text)}
.rv-v{font-family:var(--mono2);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--brand-2);padding-top:5px;white-space:nowrap;transition:color .18s ease}
.rv[open]>summary .rv-v{color:var(--muted)}
.rv-v::after{content:" +";font-weight:500}
.rv[open]>summary .rv-v::after{content:" −"}
.rv>summary:hover .rv-t{color:var(--brand-2)}
.rv-d{padding:0 2px 18px 32px;color:var(--muted);font-size:15px;line-height:1.7;max-width:72ch}
.rv-d>*:first-child{margin-top:0}
.rv-d p{margin:0 0 10px}
.rv-d p:last-child{margin-bottom:0}
.rv-d b{color:var(--text);font-weight:600}
@media(max-width:560px){
  .rv-t{font-size:15.5px}
  .rv-d{padding-left:2px;font-size:14.5px}
}
/* quem imprime ou usa leitor de tela sem JS vê tudo aberto */
@media print{.rv-d{display:block!important}}

/* ============ 2 · faixa de oferta logo após a resposta direta ============ */
.oferta-cedo{max-width:780px;margin:26px 0 0;display:flex;align-items:center;gap:14px;
  flex-wrap:wrap;padding:14px 18px;border:1px solid var(--border-subtle);border-radius:12px;
  background:linear-gradient(100deg,rgba(59,130,246,.10),rgba(59,130,246,.02) 62%),var(--bg-2)}
.oferta-cedo .oc-k{font-family:var(--mono2);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--brand-2);flex:0 0 auto}
.oferta-cedo p{margin:0;flex:1 1 260px;font-size:14.5px;line-height:1.5;color:var(--muted)}
.oferta-cedo p b{color:var(--text);font-weight:600}
.oferta-cedo a{flex:0 0 auto;font-family:var(--mono2);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--brand-2);text-decoration:none;
  border:1px solid rgba(59,130,246,.42);border-radius:9px;padding:10px 14px;min-height:44px;
  display:inline-flex;align-items:center;gap:7px;transition:border-color .18s ease,color .18s ease}
.oferta-cedo a:hover{color:var(--text);border-color:var(--brand)}
.oferta-cedo a:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media(max-width:560px){.oferta-cedo{padding:13px 15px;gap:11px}.oferta-cedo a{width:100%;justify-content:center}}

/* ============ 3 · respiro de página de texto ============ */
.txt-densa .section{padding-top:52px;padding-bottom:52px}
.txt-densa .section-head{margin-bottom:22px}
.txt-densa .sec-rule{margin-top:10px}
@media(max-width:760px){
  .txt-densa .section{padding-top:40px;padding-bottom:40px}
  .txt-densa .hero{padding-top:34px}
}

/* ============ 4 · modelos de mensagem do guia do líder ============ */
.gl-msg-rv{margin-top:10px}
.gl-msg-rv>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
  padding:11px 13px;border:1px dashed var(--border-subtle);border-radius:9px;min-height:44px;
  transition:border-color .18s ease}
.gl-msg-rv>summary::-webkit-details-marker{display:none}
.gl-msg-rv>summary::marker{content:""}
.gl-msg-rv>summary:hover{border-color:var(--brand)}
.gl-msg-rv>summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.gl-msg-rvk{font-family:var(--mono2);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-2)}
.gl-msg-rvk::after{content:" +"}
.gl-msg-rv[open] .gl-msg-rvk::after{content:" −"}
.gl-msg-rv[open]>summary{border-style:solid}
.gl-msg-rvn{font-family:var(--mono2);font-size:10px;color:var(--muted);margin-left:auto}
.gl-msg-rv>pre{margin-top:10px}

/* ============ 5 · figura do mecanismo da carteira (home, administradoras) ============
   As três caixas cinzas do fluxo 1 -> N -> 1 eram rótulo, não figura: o mecanismo da oferta
   ficava com o mesmo peso visual de um marcador. Vira desenho de linha com o feixe que abre
   na carteira e converge de volta, para a coluna da esquerda ter a densidade que o painel da
   direita já tem. Line-art, sem sombra, acento azul só nos fios e nas duas pontas. */
.adm-mec{margin:0 0 22px;padding:16px 16px 12px;border:1px solid var(--border-subtle);
  border-radius:12px;background:var(--bg-2)}
.adm-mec-svg{display:block;width:100%;height:auto}
.adm-mec-svg .mec-n{font-family:var(--disp);font-weight:700;font-size:22px;fill:var(--brand);
  letter-spacing:-.02em}
.adm-mec-svg .mec-n2{fill:var(--brand-2)}
.adm-mec-svg .mec-l{font-family:var(--mono2);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;fill:var(--muted)}
.adm-mec-svg .mec-plate rect{fill:var(--bg-3);stroke:var(--border-subtle);stroke-width:1}
.adm-mec-svg .mec-t text{font-family:var(--body);font-size:11px;fill:var(--muted)}
.adm-mec-svg .mec-t text:last-child{fill:var(--muted);opacity:.65;font-style:italic}
.adm-mec-cap{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px solid var(--border-subtle);
  font-family:var(--mono2);font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--muted)}
.adm-mec-per{color:var(--brand-2);white-space:nowrap}
@media(max-width:560px){
  .adm-mec{padding:13px 12px 10px}
  .adm-mec-cap{font-size:9px;letter-spacing:.08em}
}
