/* recursos editoriais — extensão pequena para preservar a folha principal */

/* ferramentas discretas, como notas de rodapé */
.brincadeiras-rodape,
.post-ferramentas {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  padding-top: 9px;
  border-top: 1px dashed var(--lilas-2);
}
.brincadeiras-rodape a,
.brincadeiras-rodape button,
.post-ferramentas button {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--lilas-4);
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.brincadeiras-rodape a:hover,
.brincadeiras-rodape button:hover,
.post-ferramentas button:hover { color: var(--tinta); }
.post-ferramentas {
  justify-content: flex-end;
  margin: 0 0 12px;
  padding: 0 0 8px;
  border-top: 0;
  border-bottom: 1px dashed var(--lilas-2);
}

/* achados e perdidos: coleção em formato de fichário */
.achados-lista {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 1.25rem 0 0;
}
.achado {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 14px;
  padding: 14px 16px;
  border-radius: var(--raio);
  background: var(--card);
}
.achado-tema { grid-column: 1 / -1; }
.achado h2 { font-size: 1.25rem; }
.achado h2 a { text-decoration-color: var(--lilas-3); text-underline-offset: 3px; }
.achado p { margin: 4px 0 0; }
.achado-imagem { grid-column: 1 / -1; max-height: 260px; overflow: hidden; }
.achado-imagem img { max-height: 260px; width: 100%; object-fit: contain; object-position: left center; }
.achado-fonte { align-self: end; text-align: right; }
.achados-vazio { margin-top: 2rem; text-align: center; color: var(--lilas-4); }
.achados-vazio .doodle { width: 76px; margin: 0 auto 10px; }
.achados-vazio p { margin: 0; }

/* marginalia autoral — separate das notas de rodapé automáticas */
.marginalia-nota {
  display: block;
  max-width: 22ch;
  margin: .25em 0 1em;
  padding: 8px 10px;
  border-left: 2px solid var(--lilas-3);
  color: var(--lilas-4);
  font-size: .86rem;
  font-style: italic;
  line-height: 1.4;
}
.marginalia-nota p { margin: 0; }
.marginalia-nota .marginalia-rabisco { display: block; width: 34px; margin-bottom: 5px; }
@media (min-width: 1120px) {
  .post-corpo > .marginalia-nota {
    float: right;
    clear: right;
    width: 190px;
    max-width: none;
    margin: .25em -230px 1em 0;
    padding: 0 0 0 9px;
    border-left: 1px dashed var(--lilas-3);
  }
  .marginalia-nota--esquerda {
    float: left !important;
    margin: .25em 0 1em -230px !important;
    padding: 0 9px 0 0 !important;
    border-left: 0 !important;
    border-right: 1px dashed var(--lilas-3);
    text-align: right;
  }
  .marginalia-nota--esquerda .marginalia-rabisco { margin-left: auto; }
}

/* marcações inline: traços que viajam junto com as palavras */
.post-corpo .circulo,
.post-corpo .sublinhado,
.post-corpo .riscado,
.post-corpo .grifo,
.post-corpo .seta {
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.post-corpo .circulo {
  display: inline;
  padding: .02em .16em .08em;
  border: 1.5px solid var(--lilas-4);
  border-radius: 48% 43% 51% 46% / 43% 54% 45% 57%;
  transform: rotate(-1deg);
}

.post-corpo .sublinhado {
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-color: var(--lilas-4);
  text-decoration-thickness: 1.5px;
  text-underline-offset: .16em;
}

.post-corpo .riscado {
  position: relative;
  text-decoration: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M1 8 Q12 2 24 7 T48 6 T72 5 T96 7 T119 4' fill='none' stroke='%236e5a99' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: 0 55%;
  background-size: 100% .52em;
}

.post-corpo .grifo {
  padding: 0 .1em;
  background: linear-gradient(101deg,
    transparent 0 1.5%,
    color-mix(in srgb, var(--lilas-3) 38%, transparent) 3% 96%,
    transparent 98%);
  border-radius: 3px 8px 4px 7px;
}

.post-corpo .seta {
  white-space: normal;
}
.post-corpo .seta[data-nota]::after {
  content: "↗ " attr(data-nota);
  display: inline-block;
  margin: 0 .15em 0 .5em;
  color: var(--lilas-4);
  font-family: var(--fonte-mono);
  font-size: .72em;
  font-style: italic;
  white-space: normal;
  transform: rotate(-2deg);
}

body.modo-xerox .post-corpo .circulo {
  border-color: #000;
}
body.modo-xerox .post-corpo .sublinhado {
  text-decoration-color: #000;
}
body.modo-xerox .post-corpo .riscado {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M1 8 Q12 2 24 7 T48 6 T72 5 T96 7 T119 4' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}
body.modo-xerox .post-corpo .grifo {
  background: linear-gradient(101deg, transparent 0 1.5%, rgba(0,0,0,.2) 3% 96%, transparent 98%);
}
body.modo-xerox .post-corpo .seta[data-nota]::after { color: #000; }

/* modo xerox: branco, preto e cinzas, sem textura nem enfeite */
body.modo-xerox {
  --fundo: #fff;
  --card: #fff;
  --lilas-1: #f1f1f1;
  --lilas-2: #aaa;
  --lilas-3: #555;
  --lilas-4: #222;
  --tinta: #000;
  background: #fff;
  background-image: none !important;
  color: #000;
  color-scheme: light;
}
body.modo-xerox::after { display: none; }
body.modo-xerox .pagina,
body.modo-xerox .card,
body.modo-xerox .resposta,
body.modo-xerox .comentario,
body.modo-xerox .comentario-form { box-shadow: none; }
body.modo-xerox img,
body.modo-xerox svg { filter: grayscale(1) contrast(1.15); }
body.modo-xerox .rabisco,
body.modo-xerox .aviao { display: none; }
body.modo-xerox .card { border: 1px solid #999; }
body.modo-xerox a { text-decoration-color: #555; }
body.modo-xerox .ficha-faixa { background: #ddd; color: #000; }

/* impressão: o texto fica limpo e as ferramentas saem da folha */
@media print {
  @page { margin: 17mm; }
  html, body, body.modo-xerox {
    background: #fff !important;
    background-image: none !important;
    color: #000 !important;
    font-size: 11pt;
  }
  body::after, .topo, .rodape, .brincadeiras-rodape, .post-ferramentas,
  .aviao, .pular, .comentarios, .resposta, .vizinhos, .post-rodape,
  .serie-nav, .citar-botao, .citar-janela { display: none !important; }
  .pagina { max-width: none; padding: 0; }
  .post { break-inside: auto; }
  .post-corpo { font-size: 11pt; }
  .post-corpo a { text-decoration: none; }
  .post-corpo img { filter: grayscale(1) contrast(1.15); max-width: 100%; }
  .nota-margem, .marginalia-nota { color: #222 !important; }
  .post-cabecalho h1 { font-size: 22pt; }
  .card, figure, blockquote { break-inside: avoid; }
}
@media (max-width: 600px) {
  .achado { grid-template-columns: 1fr; }
  .achado-fonte { text-align: left; }
  .nav { flex-wrap: wrap; gap: 8px 14px; }
  .marginalia-nota { max-width: none; }
}


/* links no texto: bloco de aquarela com borda orgânica */
.post-corpo a:not(.footnote):not(.reversefootnote):not(.post-link) {
  transition: color .16s ease;
}
.post-corpo a:not(.footnote):not(.reversefootnote):not(.post-link):hover,
.post-corpo a:not(.footnote):not(.reversefootnote):not(.post-link):focus-visible {
  color: #fff !important;
  background-color: transparent;
  background-image: url("../aquarela.svg");
  background-repeat: no-repeat;
  background-size: 100% 1.5em;
  background-position: center 52%;
  text-decoration: none;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.post-corpo a:not(.footnote):not(.reversefootnote):not(.post-link):focus-visible {
  outline: 2px solid var(--lilas-4);
  outline-offset: 3px;
}
body.modo-xerox .post-corpo a:not(.footnote):not(.reversefootnote):not(.post-link):hover,
body.modo-xerox .post-corpo a:not(.footnote):not(.reversefootnote):not(.post-link):focus-visible {
  color: #fff !important;
  filter: grayscale(1);
}
@media (prefers-reduced-motion: reduce) {
  .post-corpo a { transition: none !important; }
}

/* blocos editoriais e textos auxiliares usam o hover discreto do menu */
body .post-corpo :is(
  blockquote,
  .citacao-texto,
  .citacao-fonte,
  .citacao-comentario,
  .citacao-atribuicao,
  .nota-editorial,
  .footnotes,
  .nota-margem,
  .marginalia-nota,
  figcaption,
  .agora-legenda,
  .meta,
  small,
  sup,
  sub,
  code,
  mark,
  .serie-nav,
  .resposta,
  .rodape-midia,
  .post-rodape,
  .post-ferramentas,
  .brincadeiras-rodape,
  .etiquetas,
  .carimbo
) a:not(.footnote):not(.reversefootnote):not(.post-link):is(:hover, :focus-visible),
body .post-corpo a.footnote:is(:hover, :focus-visible),
body .post-corpo a.reversefootnote:is(:hover, :focus-visible) {
  color: var(--tinta) !important;
  background: transparent !important;
  background-image: none !important;
  text-decoration: underline wavy var(--lilas-3) !important;
  text-underline-offset: 4px;
}
body.modo-xerox .post-corpo :is(
  blockquote,
  .citacao-texto,
  .citacao-fonte,
  .citacao-comentario,
  .citacao-atribuicao,
  .nota-editorial,
  .footnotes,
  .nota-margem,
  .marginalia-nota,
  figcaption,
  .agora-legenda,
  .meta,
  small,
  sup,
  sub,
  code,
  mark,
  .serie-nav,
  .resposta,
  .rodape-midia,
  .post-rodape,
  .post-ferramentas,
  .brincadeiras-rodape,
  .etiquetas,
  .carimbo
) a:is(:hover, :focus-visible),
body.modo-xerox .post-corpo a.footnote:is(:hover, :focus-visible),
body.modo-xerox .post-corpo a.reversefootnote:is(:hover, :focus-visible) {
  color: #000 !important;
  text-decoration-color: #000 !important;
}

/* selo postal: o envelope fica limpo, sem a máscara perfurada atravessando o símbolo */
.resposta-selo {
  z-index: 1;
  border: 1px solid var(--lilas-2);
  border-radius: 4px;
  box-shadow: 1px 2px 0 var(--lilas-2);
  -webkit-mask: none;
  mask: none;
}


/* citações: um papelzinho destacado, como trecho anotado no caderno */
.post-corpo blockquote {
  position: relative;
  margin: 1.8em 0;
  padding: 1.15em 1.25em 1.05em 2.65em;
  border: 0;
  border-radius: 13px 4px 10px 5px;
  background: linear-gradient(112deg, var(--lilas-1), color-mix(in srgb, var(--card) 62%, var(--lilas-1)));
  box-shadow: 2px 2px 0 var(--lilas-2);
  font-style: italic;
  line-height: 1.55;
}
.post-corpo blockquote::before {
  content: "“";
  position: absolute;
  top: -.24em;
  left: .22em;
  color: var(--lilas-4);
  font-family: var(--fonte-titulo);
  font-size: 4.6rem;
  font-style: normal;
  line-height: 1;
  transform: rotate(-7deg);
  filter: url(#tremido);
  pointer-events: none;
}
.post-corpo blockquote p { margin: 0; }
.post-corpo blockquote p + p { margin-top: .7em; }
.post-corpo blockquote .citacao-atribuicao {
  display: block;
  margin-top: .9em;
  padding-top: .55em;
  border-top: 1px dashed var(--lilas-3);
  color: var(--lilas-4);
  font-family: var(--fonte-mono);
  font-size: .68em;
  font-style: normal;
  line-height: 1.5;
  text-align: right;
}
.post-corpo blockquote .citacao-atribuicao a { font-family: inherit; }
body.modo-xerox .post-corpo blockquote {
  background: #f2f2f2;
  box-shadow: 2px 2px 0 #999;
}
body.modo-xerox .post-corpo blockquote::before { color: #000; }
body.modo-xerox .post-corpo blockquote .citacao-atribuicao {
  color: #222;
  border-top-color: #888;
}
@media (max-width: 600px) {
  .post-corpo blockquote { padding: 1em 1em .9em 2.2em; }
  .post-corpo blockquote::before { left: .12em; font-size: 3.8rem; }
}


/* etiquetas em formato de fitinha, com ponta direita recortada em V.
   Aplica no rodapé do post e nos cards da home, arquivo e páginas de tag. */
.feed .etiqueta,
.post-rodape .etiqueta,
.arquivo-etiquetas .etiqueta {
  padding: 1px 13px 1px 7px;
  border-radius: 2px 1px 1px 2px;
  background: var(--lilas-1);
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 50%, 100% 100%, 0 100%);
}
.feed .etiqueta--modo,
.post-rodape .etiqueta--modo,
.arquivo-etiquetas .etiqueta--modo {
  border-style: dashed;
  border-color: var(--lilas-3);
}
.feed .etiqueta:hover,
.post-rodape .etiqueta:hover,
.arquivo-etiquetas .etiqueta:hover {
  background: var(--lilas-2);
  color: var(--tinta);
}
/* no card aberto, as etiquetas reaparecem só no rodapé do texto expandido */
.card-texto.aberto > .etiquetas { display: none; }

/* intertítulos: títulos de seção com hierarquia, sem virar outro card */
.post-corpo h2.post-intertitulo {
  margin: 2.1em 0 .7em;
  padding: 0 0 .42em;
  border-bottom: 1px solid var(--lilas-2);
  color: var(--lilas-4);
  font-family: var(--fonte-mono);
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .055em;
  line-height: 1.5;
}
.post-corpo h2.post-intertitulo + p { margin-top: .65em; }

/* avisos, disclaimers e notas de leitura: informação editorial, não citação */
.post-corpo .nota-editorial {
  margin: 1.35em 0;
  padding: .75em 1em;
  border-left: 3px solid var(--lilas-3);
  border-radius: 2px 6px 6px 2px;
  background: var(--lilas-1);
  color: var(--tinta);
  font-size: .94em;
  line-height: 1.55;
}
.post-corpo .nota-editorial p { margin: 0; }
.post-corpo .nota-editorial p + p { margin-top: .55em; }
.post-corpo .nota-editorial--aviso strong:first-child {
  color: var(--lilas-4);
  font-family: var(--fonte-mono);
  font-size: .82em;
  font-weight: 500;
}

/* fichas de filme: número, título e direção em uma linha editorial */
.post-corpo .filme-cabecalho {
  display: grid;
  grid-template-columns: 2.1rem minmax(0, 1fr);
  align-items: baseline;
  column-gap: .65rem;
  margin: 2.2em 0 .35em;
  padding-top: .72em;
  border-top: 1px solid var(--lilas-2);
}
.post-corpo .filme-numero {
  grid-row: 1 / span 2;
  align-self: start;
  padding-top: .18em;
  color: var(--lilas-3);
  font-family: var(--fonte-mono);
  font-size: .8rem;
  font-variant-numeric: tabular-nums;
}
.post-corpo .filme-titulo {
  margin: 0;
  color: var(--tinta);
  font-family: var(--fonte-titulo);
  font-size: 1.48rem;
  font-weight: 600;
  line-height: 1.18;
}
.post-corpo .filme-titulo a {
  color: inherit;
  text-decoration: none;
}
.post-corpo .filme-direcao {
  grid-column: 2;
  margin: .2rem 0 0;
  color: var(--lilas-4);
  font-family: var(--fonte-mono);
  font-size: .7rem;
  line-height: 1.45;
}
.post-corpo .filme-cabecalho + p { margin-top: .65em; }

/* páginas de quadrinhos: moldura de papel bem discreta, sem cortar a página */
.post-corpo figure.figura-hq {
  padding: 5px;
  border: 1px solid var(--lilas-2);
  background: var(--card);
  box-shadow: 2px 2px 0 var(--lilas-2);
}
.post-corpo figure.figura-hq img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0;
}
.post-corpo figure.figura-hq figcaption { padding: 0 3px 2px; }

@media (max-width: 600px) {
  .post-corpo .filme-cabecalho { grid-template-columns: 1.65rem minmax(0, 1fr); column-gap: .45rem; }
  .post-corpo .filme-titulo { font-size: 1.3rem; }
}


/* arquivo visual: imagens com datas, sem cartões */
.post-corpo hr {
  display: block;
  width: 100%;
  aspect-ratio: 1917 / 232;
  height: auto;
  margin: 2.6em 0;
  border: 0;
  background: url("../wordpress/2025/10/fe9c1e53-be75-4cde-a180-3090e89bb6cb_1917x232.webp") center / contain no-repeat;
}
body.modo-xerox .post-corpo hr { filter: grayscale(1) contrast(1.1); }

.arquivo-visual-nav { margin-top: .45rem; }
.arquivo-visual-nav a { text-decoration: underline wavy var(--lilas-3); text-underline-offset: 4px; }
.arquivo-visual-nav [aria-current="page"] { color: var(--tinta); }

.arquivo-visual-grade {
  columns: 3;
  column-gap: 16px;
  margin-top: 1.6rem;
}
.arquivo-visual-item {
  display: inline-block;
  width: 100%;
  margin: 0 0 18px;
  break-inside: avoid;
  color: inherit;
  text-decoration: none;
}
.arquivo-visual-item img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 2px;
}
.arquivo-visual-item time {
  display: block;
  margin-top: 5px;
  color: var(--lilas-4);
  font-family: var(--fonte-mono);
  font-size: .67rem;
  font-variant-numeric: tabular-nums;
}
.arquivo-visual-item:hover time,
.arquivo-visual-item:focus-visible time {
  text-decoration: underline wavy var(--lilas-3);
  text-underline-offset: 4px;
}
.arquivo-visual-item:focus-visible { outline: 2px solid var(--lilas-4); outline-offset: 4px; }
@media (max-width: 600px) {
  .arquivo-visual-grade { columns: 2; column-gap: 10px; }
  .arquivo-visual-item { margin-bottom: 13px; }
}