/* Wiki L5R 5e — estilos comuns. Claude, 29/10/2026 (site v1).
   Tokens de docs/chatgpt/INTEGRACAO-VISUAL-SITE.md. Texturas e padrões só em cabeçalho, margem e menu;
   área de regra em fundo liso. Cor de clã fora da arte do cabeçalho, nunca cor de texto.
   29/10/2026, pedido do usuário: paleta L5R (vermelho laca, preto, branco), sem madeira nem papel bege, cabeçalho com
   arte vetorial (elemento + arma + anel, ferramentas/arte_cabecalho.py), painel do artigo arredondado. */

@font-face{font-family:"EB Garamond";src:url(fontes/eb-garamond-w400-800.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(fontes/eb-garamond-italic-w400-800.woff2) format("woff2");font-weight:400 800;font-style:italic;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-w400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-w500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-w600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-w700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-italic-w400.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-italic-w500.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-italic-w600.woff2) format("woff2");font-weight:600;font-style:italic;font-display:swap}
@font-face{font-family:Spectral;src:url(fontes/spectral-italic-w700.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}

:root,[data-theme=claro]{
  /* paleta L5R: vermelho laca, preto de tinta e branco de papel de arroz; nada de bege/dourado */
  --fundo:#ffffff;--texto:#18181b;--link:#a3141e;--suave:#5c5b61;--linha:#e3e1e1;--linha-forte:#c9c6c7;
  --acento:#a3141e;--acento-texto:#a3141e;--selo:#a3141e;--ok:#2f6b3a;--realce:#f5f3f3;
  --textura:none;--padrao-op:.06;--sombra:0 1px 2px rgba(20,10,10,.06),0 4px 16px rgba(20,10,10,.06);
  --pagina:#ecebeb;--trama:#a3141e;--trama-op:.035;--luz:transparent;
  /* anéis: paleta do Core PDF 313 (manifesto anel.core-p313-diagrama), escurecida para fundo claro; Fogo em
     vermelho-alaranjado em vez do ocre do diagrama, para não cair no dourado */
  --air:#7b6577;--earth:#5d7a55;--fire:#b5401f;--water:#3f6c7a;--void:#4d4458;
  --aco:#6b7279;--aco-luz:#f2f4f5;--metal:#3d4045;--cabo:#5a1418;--ito:#2a2a2e;--pena:#8d8a86;
  color-scheme:light}
/* o cabeçalho com banner (arte escura) usa os tokens do tema escuro também no tema claro */
[data-theme=escuro],[data-theme=claro] .faixa:has(>.arte-fundo){
  --fundo:#17171a;--texto:#ecebea;--link:#f0857e;--suave:#a4a2a8;--linha:#2b2b31;--linha-forte:#3e3e46;
  /* --acento-texto: o vermelho do --acento como cor de texto; #d6403f dá 3,97:1 no fundo, #e85a55 dá 5,1:1 (S10-03) */
  --acento:#d6403f;--acento-texto:#e85a55;--selo:#f0857e;--ok:#93c99a;--realce:#212125;
  --textura:none;--padrao-op:.08;--sombra:0 1px 2px rgba(0,0,0,.4),0 6px 20px rgba(0,0,0,.35);
  --pagina:#0c0c0e;--trama:#d6403f;--trama-op:.04;--luz:#2a1416;
  /* anéis: mesma paleta, clareada para fundo escuro */
  --air:#b7a0b2;--earth:#a2bd98;--fire:#e8693f;--water:#86aebb;--void:#a493b8;
  --aco:#c9ced3;--aco-luz:#ffffff;--metal:#8a8e95;--cabo:#9b2a2c;--ito:#dcdad6;--pena:#e9e6e1;
  color-scheme:dark}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--texto);background:var(--pagina) var(--textura) repeat;background-size:512px;
  font:400 16px/1.55 Spectral,Georgia,"Times New Roman",serif;min-width:0}
h1,h2,h3,h4{font-family:"EB Garamond",Georgia,serif;font-weight:600;line-height:1.2;margin:.2em 0 .4em}
h1{font-size:2rem}h3{font-size:1.4rem}h4{font-size:1.1rem}
a{color:var(--link);text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}
code{font-size:.8em;overflow-wrap:anywhere}
small{font-size:.8em}
.pular{position:absolute;left:-999px}.pular:focus{left:8px;top:8px;z-index:9;background:var(--fundo);padding:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--acento);outline-offset:2px}

/* ícones */
svg.sym{height:1.1em;width:1.1em;vertical-align:-.18em;fill:currentColor}
svg.ic{height:1.05em;width:1.05em;vertical-align:-.15em;fill:none;stroke:currentColor}
svg.ic.grande{height:2rem;width:2rem}
svg.logo{height:1.8rem;width:1.8rem;fill:none;stroke:currentColor;vertical-align:middle}
svg.logo.grande{height:4.5rem;width:4.5rem;color:var(--acento)}
.sym-txt{font-weight:700}

/* trama seigaiha vermelha em máscara, quase imperceptível, e luz avermelhada no alto (escuro) */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:var(--trama-op);background:var(--trama);
  -webkit-mask:url(img/seigaiha.svg) 0 0/64px repeat;mask:url(img/seigaiha.svg) 0 0/64px repeat}
body{background-image:radial-gradient(ellipse 90% 60% at 50% 0,var(--luz) 0,transparent 70%);background-attachment:fixed}

/* topo e menu */
.topo{position:sticky;top:0;z-index:5;background:var(--fundo);border-bottom:1px solid var(--linha-forte);box-shadow:var(--sombra)}
.topo-in{max-width:1180px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:12px}
.marca{display:flex;align-items:center;gap:8px;color:var(--texto);text-decoration:none;font:600 1.3rem "EB Garamond",serif;white-space:nowrap}
.marca svg{color:var(--acento)}
.busca-topo{position:relative;flex:1 1 auto;min-width:0;max-width:420px;margin-left:auto}
.busca-topo label,.busca-grande,.busca-lista{display:flex;align-items:center;gap:6px;border:1px solid var(--linha-forte);border-radius:6px;
  background:var(--fundo);padding:4px 8px;color:var(--suave)}
input[type=search]{flex:1;min-width:0;border:0;background:transparent;color:var(--texto);font:inherit;padding:2px 0;outline:none}
.busca-topo label:focus-within,.busca-grande:focus-within,.busca-lista:focus-within{border-color:var(--acento)}
.resultados{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--fundo);border:1px solid var(--linha-forte);
  border-radius:6px;box-shadow:var(--sombra);max-height:70vh;overflow:auto;z-index:6}
.resultados a{display:block;padding:6px 10px;text-decoration:none;color:var(--texto);border-bottom:1px solid var(--linha)}
.resultados a:hover,.resultados a.ativo{background:var(--realce)}
.resultados small{color:var(--suave);display:block}
.botao-tema,.botao-menu,.alterna button,.filtro,.modo,.ordena{font:inherit;color:var(--texto);background:var(--fundo);
  border:1px solid var(--linha-forte);border-radius:6px;padding:4px 10px;cursor:pointer}
.botao-menu{display:none}
.menu{max-width:1180px;margin:0 auto;padding:0 16px 6px;display:flex;flex-wrap:wrap;gap:4px 22px;font-size:.95rem}
.menu .grupo{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.grupo-rot{color:var(--suave);font-variant:small-caps;letter-spacing:.04em}
.grupo-itens{display:flex;flex-wrap:wrap;gap:2px 12px}
.grupo-itens a{text-decoration:none}
.grupo-itens a:hover{text-decoration:underline}

main{max-width:1180px;margin:0 auto;padding:20px 16px 40px}
.rodape{background:var(--fundo);color:var(--suave);font-size:.85rem;border-top:1px solid var(--linha-forte)}
.rodape p{max-width:1180px;margin:0 auto;padding:14px 16px}

/* superfícies de regra: fundo liso */
.entrada,.lista,.secao-bloco,.carta,.fontes,.inicio .hero{background:var(--fundo)}
.entrada{border:1px solid var(--linha);border-radius:14px;padding:14px;box-shadow:var(--sombra)}
.entrada>:first-child{margin-top:0}.entrada>:last-child{margin-bottom:0}
.secao-bloco,.fontes{border:1px solid var(--linha);border-radius:8px;padding:16px 20px;margin:16px 0;box-shadow:var(--sombra)}
.nota{color:var(--suave);font-size:.9rem}
.vazio{color:var(--suave)}
.num{font-variant-numeric:tabular-nums lining-nums}
.migalha{margin:0 0 4px;font-size:.85rem;color:var(--suave)}

/* cabeçalho de entrada/lista: arte vetorial à direita, esmaecendo para a esquerda; sem cor de clã na arte */
.faixa{position:relative;overflow:hidden;border:1px solid var(--linha);border-radius:8px;padding:16px 20px 14px;margin-bottom:12px;
  background:var(--fundo);box-shadow:var(--sombra)}
[data-theme=claro] .faixa:has(>.arte-fundo){color:var(--texto);border-color:#2b2b31}
.faixa:has(.arte){background:var(--fundo);min-height:150px}
.faixa>*{position:relative;z-index:1}
.faixa>.arte{position:absolute;z-index:0;top:0;right:0;width:min(74%,700px);height:100%;pointer-events:none;
  
  /* rampa em várias paradas: uma rampa linear deixa uma "borda" visível onde termina */
  -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.08) 12%,rgba(0,0,0,.3) 26%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 54%,#000 68%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.08) 12%,rgba(0,0,0,.3) 26%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 54%,#000 68%)}
.faixa>.arte-frente{-webkit-mask-image:none;mask-image:none}  /* arma e anel inteiros, sem esmaecer */
.arte{color:var(--el)}
.faixa>img.arte-fundo{object-fit:cover;object-position:right center}  /* banner do elemento (2000x496) */
.arte-arma{filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
/* símbolo do anel com contorno branco fino só por fora (sem brilho) */
.arte-anel{color:var(--el)}
.arte-anel-aro{fill:none;stroke:#fff;stroke-width:1;opacity:.9}  /* contorno externo fino, ~1px */
/* cor de fundo de cada banner, medida no JPG; a faixa inteira usa essa cor por baixo do banner. Esmaecer para
   outra cor, mesmo próxima (#17171a), gera um degradê de poucos tons que aparece em barras verticais */
.el-air{--banner:#141b23}.el-earth{--banner:#151c24}.el-fire{--banner:#161d25}.el-water{--banner:#131a22}.el-void{--banner:#100c1a}
.faixa>.arte-base{position:absolute;inset:0;z-index:0;background:var(--banner)}
.el-air{--el:var(--air)}.el-earth{--el:var(--earth)}.el-fire{--el:var(--fire)}.el-water{--el:var(--water)}.el-void{--el:var(--void)}
.faixa h1{text-shadow:0 1px 8px var(--fundo),0 0 2px var(--fundo)}
.entrada-cab h1{margin-top:6px}
.cab-campos{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;margin:4px 0 8px}
.cab-rot{color:var(--suave);font-size:.85rem;margin-right:2px}
.meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:.9rem;color:var(--suave)}
.meta a.pdf{white-space:nowrap}
.chip{display:inline-block;border:1px solid var(--linha-forte);border-radius:12px;padding:0 8px;margin:1px 4px 1px 0;font-size:.9em;background:var(--realce)}
.tag{display:inline-flex;align-items:center;gap:3px;font:500 .72rem/1.5 Spectral,serif;padding:0 7px;border-radius:9px;
  border:1px solid currentColor;margin-left:6px;vertical-align:middle;text-decoration:none;white-space:nowrap}
.tag.errata{color:var(--selo)}.tag.livro{color:var(--suave)}
.meta .tag{margin-left:0}

/* alternância impresso/corrigido */
.alterna{display:flex;align-items:center;gap:6px;margin:8px 0;flex-wrap:wrap}
.alterna button.on,.filtro[aria-pressed=true],.modo[aria-pressed=true]{background:var(--selo);border-color:var(--selo);color:var(--fundo)}
.entrada[data-v=corrigido] .versao.impresso{display:none}
.entrada[data-v=impresso] .versao.corrigido{display:none}
.versao{border-left:3px solid var(--selo);padding-left:10px}
.versao.impresso{border-left-color:var(--suave)}
.vrot{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--suave)}
.fontes-errata{font-size:.85rem;color:var(--suave);margin:.3em 0 0}
.texto-errata{margin:.3em 0 0;padding:.2em .8em;border-left:3px solid var(--linha);font-size:.9rem}
.interpretacao{display:block;font-size:.85rem;color:var(--suave);margin:.2em 0 0}

/* quadro (carta) com moldura geométrica nos cantos */
.carta{position:relative;border:1px solid var(--linha-forte);border-radius:4px;padding:18px 22px;margin:16px 0;box-shadow:var(--sombra)}
.carta>h3{font-size:1.25rem;color:var(--acento-texto);text-align:center;margin:0 0 10px}
.canto{position:absolute;width:28px;height:28px;color:var(--acento);pointer-events:none;opacity:.75}
.canto svg{width:100%;height:100%;fill:currentColor;stroke:none}
.canto.no{top:3px;left:3px}.canto.ne{top:3px;right:3px}.canto.so{bottom:3px;left:3px}.canto.se{bottom:3px;right:3px}
dl.quadro{margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.q-item{display:grid;grid-template-columns:minmax(150px,200px) minmax(0,1fr);gap:12px;padding:8px 0;border-top:1px solid var(--linha)}
.q-item:first-child{border-top:0}
.q-item dt{font-weight:600;color:var(--suave)}
.q-item dd{margin:0;min-width:0}
dd p,.b-item p{margin:0 0 .5em}
.marcas{float:right}
.anel{white-space:nowrap;margin-right:8px}
.escolha{font-variant:small-caps;color:var(--suave)}
ul.itens{margin:0;padding-left:1.1em}
ul.itens li{margin:.15em 0}
h4.hab{color:var(--texto)}
.qualif{font-weight:400;font-style:italic;color:var(--suave)}
dl.mapa{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0}
dl.mapa div{display:flex;gap:6px}dl.mapa dt{color:var(--suave)}dl.mapa dd{margin:0}

/* currículo: uma tabela por rank */
.curriculo{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:12px 16px}
.rank h4{margin:.2em 0;color:var(--acento-texto);font-size:1.05rem}
table.avancos{width:100%;border-collapse:collapse;font-size:.92rem}
table.avancos th{font-weight:600;color:var(--suave);text-align:left;border-bottom:1px solid var(--linha-forte);padding:2px 6px}
table.avancos td{border-bottom:1px solid var(--linha);padding:3px 6px;vertical-align:top}
table.avancos td.tp{color:var(--suave);font-size:.85em;white-space:nowrap}
table.avancos td.ic,table.avancos td.ex{width:1.6em;text-align:center}
table.avancos tr.exc td.av{font-weight:600}

.rolagem{max-width:100%;overflow-x:auto}

/* fontes e origem */
details summary{cursor:pointer;color:var(--suave)}
details.texto,details.origem{margin-top:10px}
details.texto[open]{border-left:3px solid var(--linha-forte);padding-left:12px}
table.origem-t,table.cobertura{border-collapse:collapse;font-size:.88rem;width:100%}
table.origem-t th,table.origem-t td,table.cobertura th,table.cobertura td{border-bottom:1px solid var(--linha);padding:4px 8px;text-align:left;vertical-align:top}
table.origem-t td:last-child{min-width:12em}
.orig-txt{font-size:.85em;color:var(--suave)}

/* lista */
.lista{border:1px solid var(--linha);border-radius:14px;padding:14px;box-shadow:var(--sombra)}
.lista-cab.faixa{box-shadow:none}

.filtros{display:flex;flex-direction:column;gap:8px;margin:12px 0}
.busca-lista{max-width:420px}
.filtro-grupo{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
.filtro-rot{color:var(--suave);font-size:.85rem;min-width:9em}
.filtro,.modo{font-size:.85rem;padding:1px 8px}
.filtro small{color:inherit;opacity:.7}
.filtro-url{align-self:flex-start}
.contagem{margin:0;color:var(--suave);font-size:.9rem}
table.tabela-lista{width:100%;border-collapse:collapse;background:var(--fundo);border:1px solid var(--linha);box-shadow:var(--sombra)}
table.tabela-lista th{text-align:left;border-bottom:2px solid var(--linha-forte);padding:0;background:var(--realce)}
.ordena{border:0;background:transparent;width:100%;text-align:left;padding:6px 8px;font-weight:600;border-radius:0}
.ordena[data-dir=asc]::after{content:" ▲";font-size:.7em}.ordena[data-dir=desc]::after{content:" ▼";font-size:.7em}
table.tabela-lista td{border-bottom:1px solid var(--linha);padding:6px 8px;vertical-align:top}
table.tabela-lista tbody tr:hover{background:var(--realce)}
tr.oculto{display:none}

/* início */
.hero{display:flex;gap:20px;align-items:center;border:1px solid var(--linha);border-radius:8px;padding:20px;box-shadow:var(--sombra);position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:40px;background:url(img/asanoha.svg) repeat-x 0 0/40px;opacity:var(--padrao-op)}
[data-theme=escuro] .hero::after{filter:invert(1)}
.busca-grande{margin:16px 0;font-size:1.1rem;padding:8px 12px;max-width:640px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:12px}
.card-cat{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border:1px solid var(--linha-forte);border-radius:8px;
  text-decoration:none;color:var(--texto);background:var(--fundo);box-shadow:var(--sombra)}
.card-cat:hover{border-color:var(--acento)}
.card-cat svg{color:var(--acento)}
.card-cat b{font:600 1.35rem "EB Garamond",serif}
.card-cat span{color:var(--suave);font-size:.88rem}
.card-grupo{font-variant:small-caps}

/* índice de livro */
ul.indice{list-style:none;padding:0;margin:0;font-size:.95rem}
ul.indice li{padding:2px 0;border-bottom:1px dotted var(--linha)}
ul.indice .n2{padding-left:1.2em}ul.indice .n3{padding-left:2.4em}ul.indice .n4,ul.indice .n5{padding-left:3.6em}
.inferido{color:var(--suave)}

@media (max-width:760px){
  h1{font-size:1.6rem}
  .topo-in{flex-wrap:wrap;gap:8px}
  .busca-topo{order:3;flex-basis:100%;max-width:none;margin:0}
  .marca{margin-right:auto}
  .botao-menu{display:inline-block}
  .menu{display:none;flex-direction:column;gap:8px;padding-bottom:12px}
  .menu.aberto{display:flex}
  .q-item{grid-template-columns:minmax(0,1fr);gap:2px}
  .marcas{float:none}
  .carta{padding:16px 14px}
  .secao-bloco,.fontes,.faixa{padding:14px}
  .entrada,.lista{padding:8px;border-radius:12px}
  .faixa>.arte{width:100%;opacity:.55}
  .hero{flex-direction:column;align-items:flex-start}
  .filtro-rot{min-width:0;width:100%}
  /* lista vira cartões */
  table.tabela-lista,table.tabela-lista tbody{display:block;border:0;box-shadow:none;background:transparent}
  table.tabela-lista thead{display:block}
  table.tabela-lista thead tr{display:flex;flex-wrap:wrap;gap:4px}
  table.tabela-lista th{border:1px solid var(--linha-forte);border-radius:6px}
  .ordena{padding:2px 8px;font-size:.85rem}
  table.tabela-lista tr{display:block;border:1px solid var(--linha);border-radius:8px;margin:8px 0;padding:8px 12px;background:var(--fundo)}
  table.tabela-lista tr.oculto{display:none}
  table.tabela-lista td{display:flex;gap:8px;border:0;padding:2px 0}
  table.tabela-lista td::before{content:attr(data-rot);color:var(--suave);font-size:.85rem;min-width:5.5em;flex:none}
  table.tabela-lista td:first-child{font-size:1.1rem}
  table.tabela-lista td:first-child::before{display:none}
}
@media print{.topo,.rodape,.alterna,.filtros{display:none}body{background:#fff}}

/* leitor de livros (S14): texto inteiro do 01-bruto por capítulo */
.leitor .texto-livro{line-height:1.6}
.leitor .texto-livro p{margin:.5em 0}
.pg-marca{margin:1.4em 0 .4em;padding-top:.4em;border-top:1px dashed var(--linha-forte);font-size:.8rem;color:var(--suave);text-align:right;scroll-margin-top:80px}
.virada{font-size:.75rem;color:var(--suave);padding:0 .3em;white-space:nowrap}
.tit-livro{margin:1em 0 .3em;font-size:1.05rem;color:var(--acento-texto)}
.fileira{display:flex;flex-wrap:wrap;gap:.2em 1.2em;padding:2px 0;border-bottom:1px dotted var(--linha);font-size:.95rem}
.fileira span{min-width:6em}
.nav-livro{margin:.6em 0;font-size:.9rem}
.sumario{margin:.6em 0 1em}.sumario summary{cursor:pointer;color:var(--suave)}

/* leitor: tabelas com cabeçalho (L3) */
.tabela-livro table{border-collapse:collapse;width:100%;font-size:.95rem;margin:.4em 0}
.tabela-livro th,.tabela-livro td{text-align:left;vertical-align:top;padding:3px 8px;border-bottom:1px dotted var(--linha)}
.tabela-livro th{border-bottom:1px solid var(--linha-forte);color:var(--acento-texto)}
/* busca no texto inteiro (L3) */
.resultados-texto{padding-left:1.2em}
.resultados-texto li{margin:.6em 0}
.resultados-texto p{margin:.2em 0;color:var(--suave);font-size:.95rem}
.livros-busca .chips{display:flex;flex-wrap:wrap;gap:4px;margin:.4em 0}
.tabela-livro .sub-tabela th{font-size:.85rem;letter-spacing:.04em;padding-top:8px}

/* Livro integral: índice persistente em telas largas e recolhível em telas pequenas. */
.leitor-layout{display:grid;grid-template-columns:minmax(12rem,18rem) minmax(0,1fr);gap:2rem;align-items:start}
.leitor-indice{position:sticky;top:1rem;max-height:calc(100vh - 2rem);overflow:auto;border:1px solid var(--linha);border-radius:8px;padding:.8rem}
.leitor-indice summary{cursor:pointer;font-weight:bold}.leitor-indice ol,.leitor-indice ul{padding-left:1.2em}
.leitor-indice li{margin:.35em 0}.leitor-indice ul{font-size:.88rem}.capitulo-integral{scroll-margin-top:80px}
@media(max-width:760px){.leitor-layout{display:block}.leitor-indice{position:static;max-height:45vh;margin-bottom:1rem}}

/* Grupos de navegação são rótulos, com links separados visualmente. */
.menu{gap:8px 14px;padding-bottom:10px;align-items:stretch}
.menu .grupo{display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:7px 10px;border:1px solid var(--linha);border-radius:8px;background:var(--realce)}
.grupo-rot{font-variant:normal;text-transform:uppercase;font:700 .68rem/1.2 Spectral,serif;letter-spacing:.08em;color:var(--suave)}
.grupo-itens{gap:3px 10px}.grupo-itens a{font-size:.88rem;text-decoration:underline;text-decoration-color:var(--linha-forte)}
.botao-previa{font:inherit;font-size:.8rem;color:var(--texto);background:var(--fundo);border:1px solid var(--linha-forte);border-radius:6px;padding:4px 7px;cursor:pointer;white-space:nowrap}
.previa-link{position:fixed;z-index:20;pointer-events:none;width:min(25rem,calc(100vw - 16px));max-height:min(50vh,25rem);overflow:hidden;padding:12px 14px;background:var(--fundo);color:var(--texto);border:1px solid var(--linha-forte);border-radius:8px;box-shadow:var(--sombra);font-size:.88rem;line-height:1.45}
.previa-link[hidden]{display:none}.previa-link strong{font-size:1.05rem}.previa-link p{margin:.35rem 0 0}
@media(max-width:600px){.botao-previa{font-size:.72rem;padding:3px 5px}.topo-in{gap:6px}.marca span{font-size:1rem}}

/* Índice persistente para guias de regras. */
.regra-grupo-layout{display:grid;grid-template-columns:minmax(12rem,18rem) minmax(0,1fr);gap:1.5rem;align-items:start}
.regra-grupo-indice{position:sticky;top:1rem;max-height:85vh;overflow:auto;border:1px solid var(--borda,#bbb);padding:.8rem;border-radius:.5rem}
.regra-grupo-indice ol{padding-left:1.4rem}.regra-grupo-indice li{margin:.45rem 0}
.regra-grupo-item{padding:1rem 0;border-bottom:1px solid var(--borda,#bbb);scroll-margin-top:1rem}
.regra-grupo-nav{display:flex;gap:1rem;flex-wrap:wrap}.regra-grupo-nav a{font-weight:bold}
@media(max-width:760px){.regra-grupo-layout{display:block}.regra-grupo-indice{position:static;max-height:20rem;margin-bottom:1rem}}

/* O índice lateral permanece visível sem ficar encoberto pelo cabeçalho. */
.topo{position:relative}

.filtros-recolhiveis{display:block;width:100%}.filtros-recolhiveis summary{cursor:pointer;padding:4px 0}.filtros-recolhiveis>div{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}

/* Navegação compacta e índices discretos. */
.menu{gap:2px;padding-bottom:0;align-items:stretch}
.menu .grupo{position:relative;display:block;padding:0;border:0;border-radius:0;background:transparent}
.menu .grupo-rot{display:flex;align-items:center;gap:.4rem;padding:.65rem .85rem;cursor:pointer;list-style:none;font:600 .9rem/1.2 Spectral,serif;text-transform:none;letter-spacing:0;color:var(--texto)}
.menu .grupo-rot::-webkit-details-marker{display:none}
.menu .grupo-rot::after{content:"";width:.35rem;height:.35rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-left:.3rem;margin-top:-.2rem}
.menu .grupo[open]>.grupo-rot,.menu .grupo-rot:hover{background:var(--realce);color:var(--acento-texto)}
.menu .grupo-itens{position:absolute;top:100%;left:0;z-index:10;min-width:13rem;display:flex;flex-direction:column;gap:0;padding:.35rem;background:var(--fundo);border:1px solid var(--linha);border-radius:0 0 8px 8px;box-shadow:var(--sombra)}
.menu .grupo-itens a{display:block;padding:.45rem .65rem;color:var(--texto);font-size:.88rem;text-decoration:none;border-radius:4px;white-space:nowrap}
.menu .grupo-itens a:hover,.menu .grupo-itens a:focus-visible{background:var(--realce);color:var(--acento-texto)}
.leitor-indice,.regra-grupo-indice{background:var(--realce);border:1px solid var(--linha);border-radius:10px;padding:1rem;font-size:.9rem;scrollbar-width:thin;scrollbar-color:var(--linha-forte) transparent}
.leitor-indice a,.regra-grupo-indice a{color:var(--texto);text-decoration:none}
.leitor-indice a:hover,.regra-grupo-indice a:hover{color:var(--acento-texto);text-decoration:underline}
.leitor-indice li,.regra-grupo-indice li{padding:.12rem 0}
html{scrollbar-width:thin;scrollbar-color:var(--linha-forte) var(--pagina)}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:var(--pagina)}
::-webkit-scrollbar-thumb{background:var(--linha-forte);border:2px solid var(--pagina);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:var(--suave)}
.previa-link{width:min(28rem,calc(100vw - 16px));max-height:min(65vh,31rem);padding:1rem 1.1rem;border-top:3px solid var(--acento);line-height:1.5}
.previa-titulo{display:block;font:600 1.25rem/1.2 "EB Garamond",serif}
.previa-fonte{color:var(--suave);font-size:.78rem;margin-top:.2rem}
.previa-trecho{margin-top:.7rem}.previa-trecho b{display:block;color:var(--acento-texto);font-size:.78rem}
.previa-trecho p{margin:.15rem 0 0}
@media(max-width:760px){
 .menu{gap:0;padding:0 16px 10px}.menu .grupo-rot{padding:.65rem}.menu .grupo-itens{position:static;min-width:0;box-shadow:none;border:0;border-left:2px solid var(--linha);border-radius:0;margin-left:1rem;padding-left:.4rem}
}

/* Elementos, fontes e símbolos dos dados */
img.logo { width:2.2rem; height:2.2rem; object-fit:cover; border-radius:50%; vertical-align:middle; }
img.logo.grande { width:5rem; height:5rem; }
.fonte-cor { color:var(--fonte-cor); font-weight:700; }
[data-theme="escuro"] .fonte-cor { filter:brightness(1.45) saturate(1.15); }
svg.sym-success,svg.sym-explosive,svg.sym-opportunity,svg.sym-strife { color:#c92e36; }
[data-theme="escuro"] svg.sym-success,[data-theme="escuro"] svg.sym-explosive,[data-theme="escuro"] svg.sym-opportunity,[data-theme="escuro"] svg.sym-strife { color:#ff666c; }

/* Ícones de elementos fornecidos pelo usuário. */
img.sym-elemento { width:1.35em; height:1.35em; object-fit:contain; vertical-align:-.25em; }
img.logo { object-fit:contain; }
