/* LEITOR VISUAL (fase 2) · tudo com prefixo .lei */
.lei{--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--lei-fs:16.5px}
.lei p,.lei li,.lei b,.lei span,.lei dd,.lei blockquote,.lei figcaption{text-wrap:pretty}

/* barra do topo (é o ihead da tela: grudado no topo, como já é no app) */
.lei-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:var(--s2);margin:0 -16px;padding:calc(var(--s3) + env(safe-area-inset-top,0px)) 16px var(--s2);
  background:var(--bg1);box-shadow:0 8px 16px -8px rgba(0,0,0,.6)}
.lei-top-tx{flex:1;min-width:0}
.lei-top-t{font-family:'Cinzel',serif;font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.lei-prog{display:flex;align-items:center;gap:var(--s2);margin-top:6px;font-size:11.5px;color:var(--muted);white-space:nowrap}
.lei-bar{flex:1;height:5px;border-radius:9px;background:rgba(255,255,255,.1);overflow:hidden}
.lei-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--acc2));transform:scaleX(0);transform-origin:0 50%;transition:transform .15s linear}
.lei-fs{width:44px;height:44px;flex:none;border-radius:12px;border:1px solid var(--glassb);background:var(--glass);color:var(--ink);font:700 16px 'Poppins';cursor:pointer}
.lei-fs small{font-size:13px;color:var(--acc)}

/* capa */
.lei-capa{position:relative;margin-top:var(--s2);border-radius:22px;overflow:hidden;border:1px solid var(--glassb);box-shadow:var(--sh)}
.lei-capa-art{position:relative;aspect-ratio:16/10;display:grid;place-items:center;
  background:radial-gradient(circle at 40% 30%,var(--acc2),var(--acc) 50%,#2a1450 100%)}
.lei-capa-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lei-capa-emo{font-size:72px;filter:drop-shadow(0 6px 18px rgba(0,0,0,.4))}
.lei-capa-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(12,4,32,.92))}
.lei-capa-tx{position:relative;margin-top:-92px;z-index:1;padding:0 var(--s4) var(--s4)}
.lei-eye{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.lei-capa h1{font-family:'Cinzel',serif;font-size:25px;line-height:1.15;margin-top:6px;text-wrap:balance}
.lei-capa p{color:var(--muted);font-size:14px;margin-top:6px}

.lei-acoes{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}
.lei-ouvir,.lei-volta{min-height:44px;display:inline-flex;align-items:center;gap:var(--s2);padding:0 var(--s4);border-radius:999px;font:600 14px 'Poppins';cursor:pointer}
.lei-ouvir{background:var(--accsoft);color:var(--acc);border:1px solid var(--acc)}
.lei-volta{background:var(--glass);color:var(--ink);border:1px solid var(--glassb)}

/* corpo */
.lei-corpo{font-size:var(--lei-fs);line-height:1.62}
.lei-b{margin-top:var(--s5)}
.lei-p{color:#e9e1fa}
.lei-p b,.lei-corpo b{color:var(--ink)}
.lei-h{font-family:'Cinzel',serif;font-size:1.15em;color:var(--acc);margin-top:var(--s6)}

.lei-abre{padding:var(--s5) var(--s4);border-radius:20px;text-align:center;background:radial-gradient(120% 90% at 50% 0%,var(--accsoft),rgba(31,17,64,.6));border:1px solid var(--glassb)}
.lei-abre-t{font-family:'Cinzel',serif;font-weight:700;font-size:1.5em;line-height:1.2;color:var(--gold2);text-wrap:balance}
.lei-abre p{margin-top:var(--s2);color:var(--muted);font-size:.95em}

.lei-dest{text-align:center;padding:var(--s3) var(--s2)}
.lei-dest span{display:block;color:var(--gold);font-size:14px;letter-spacing:.6em}
.lei-dest p{font-family:'Cinzel',serif;font-weight:700;font-size:1.32em;line-height:1.3;margin-top:var(--s2);text-wrap:balance;
  background:linear-gradient(90deg,var(--gold2),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.lei-dest::after{content:"";display:block;width:64px;height:2px;margin:var(--s3) auto 0;background:linear-gradient(90deg,transparent,var(--gold),transparent)}

.lei-nota{padding:var(--s4);border-radius:16px;background:rgba(245,197,66,.08);border-left:3px solid var(--gold)}
.lei-lista{list-style:none;display:grid;gap:var(--s2)}
.lei-lista li{padding:var(--s3) var(--s4);border-radius:14px;background:var(--glass);border:1px solid var(--glassb);font-size:.92em}

/* cards */
.lei-cards{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.lei-card{display:flex;flex-direction:column;gap:6px;padding:var(--s4) var(--s3);border-radius:18px;background:linear-gradient(160deg,rgba(58,33,104,.7),rgba(31,17,64,.85));border:1px solid var(--glassb)}
.lei-card:last-child:nth-child(odd){grid-column:1/-1}
.lei-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:24px;background:var(--accsoft);border:1px solid var(--glassb)}
.lei-card b{font-size:.92em;line-height:1.3}
.lei-card span:not(.lei-ic){font-size:.8em;color:var(--muted);line-height:1.45}

/* passos e linha do tempo */
.lei-passos,.lei-linha{list-style:none;position:relative}
.lei-passos li,.lei-linha li{position:relative;display:flex;gap:var(--s3);padding-bottom:var(--s4)}
.lei-passos li:not(:last-child)::before{content:"";position:absolute;left:19px;top:40px;bottom:0;width:2px;background:linear-gradient(var(--acc),transparent)}
.lei-n{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font:700 17px 'Cinzel',serif;color:#1a0e2e;background:linear-gradient(135deg,var(--acc2),var(--acc));box-shadow:0 0 0 4px var(--accsoft)}
.lei-passos div,.lei-linha div{display:flex;flex-direction:column;gap:2px;padding-top:7px;min-width:0}
.lei-passos span,.lei-linha span:not(.lei-dot){font-size:.88em;color:var(--muted)}
.lei-linha li:not(:last-child)::before{content:"";position:absolute;left:8px;top:22px;bottom:-4px;width:2px;background:rgba(245,197,66,.35)}
.lei-dot{flex:none;width:18px;height:18px;margin-top:6px;border-radius:50%;background:var(--bg1);border:3px solid var(--gold);box-shadow:0 0 10px rgba(245,197,66,.5)}
.lei-linha b{align-self:flex-start;padding:2px 10px;border-radius:999px;background:rgba(245,197,66,.14);color:var(--gold2);font-size:.85em}
.lei-linha div{padding-top:2px}

/* compara */
.lei-comp{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
.lei-comp>div{padding:var(--s4) var(--s3);border-radius:18px;min-width:0}
.lei-comp-a{background:linear-gradient(180deg,var(--accsoft),rgba(31,17,64,.8));border:1px solid var(--acc)}
.lei-comp-b{background:linear-gradient(180deg,rgba(226,59,208,.14),rgba(31,17,64,.8));border:1px solid rgba(226,59,208,.55)}
.lei-comp h3{font-family:'Cinzel',serif;font-size:.85em;line-height:1.25;margin-bottom:var(--s2);text-wrap:balance}
.lei-comp-a h3{color:var(--acc)} .lei-comp-b h3{color:#ff8ff0}
.lei-comp ul{list-style:none;display:grid;gap:6px}
.lei-comp li{font-size:.8em;line-height:1.4;padding-left:12px;position:relative}
.lei-comp li::before{content:"";position:absolute;left:0;top:.55em;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.6}
.lei-vs{position:absolute;left:50%;top:-14px;transform:translateX(-50%);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  background:var(--bg2);border:1px solid var(--glassb);color:var(--gold);font-weight:700}

/* de → para */
.lei-dp{display:grid;gap:var(--s2)}
.lei-dp-h{display:grid;grid-template-columns:1fr 26px 1fr;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.lei-dp-h span:first-child{color:#ff8a9c} .lei-dp-h span:last-child{grid-column:3;color:var(--ok)}
.lei-dp-r{display:grid;grid-template-columns:1fr 26px 1fr;align-items:stretch}
.lei-dp-r .de,.lei-dp-r .para{padding:var(--s3);border-radius:14px;font-size:.82em;line-height:1.4}
.lei-dp-r .de{background:rgba(255,84,112,.1);border:1px solid rgba(255,84,112,.35);color:#f3c9d1}
.lei-dp-r .para{background:rgba(58,209,122,.1);border:1px solid rgba(58,209,122,.4)}
.lei-dp-r .ar{display:grid;place-items:center;color:var(--gold)}

/* ficha */
.lei-ficha{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
.lei-ficha div{padding:var(--s3);border-radius:14px;background:var(--glass);border:1px solid var(--glassb);min-width:0}
.lei-ficha dt{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acc)}
.lei-ficha dd{font-size:.86em;line-height:1.35;margin-top:2px;overflow-wrap:anywhere}

/* número */
.lei-num{text-align:center;padding:var(--s4)}
.lei-num b{display:block;font:800 3.6em/1 'Cinzel',serif;background:linear-gradient(180deg,var(--gold2),var(--gold) 60%,var(--acc));-webkit-background-clip:text;background-clip:text;color:transparent}
.lei-num span{display:block;margin-top:var(--s2);color:var(--muted);font-size:.92em}

/* revela (vira ao tocar) */
.lei-rev{display:block;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:center;cursor:pointer;perspective:900px}
.lei-rev-in{display:grid;transition:transform .5s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d}
.lei-rev.on .lei-rev-in{transform:rotateY(180deg)}
.lei-rev .f,.lei-rev .v{grid-area:1/1;display:flex;flex-direction:column;justify-content:center;gap:var(--s2);min-height:150px;padding:var(--s5) var(--s4);border-radius:20px;
  backface-visibility:hidden;-webkit-backface-visibility:hidden}
.lei-rev .f{background:radial-gradient(circle at 50% 0%,rgba(245,197,66,.22),rgba(42,20,80,.95) 70%);border:1.5px dashed var(--gold)}
.lei-rev .f b{font-family:'Cinzel',serif;font-size:1.12em;line-height:1.3}
.lei-rev .v{transform:rotateY(180deg);background:linear-gradient(160deg,var(--accsoft),rgba(31,17,64,.95));border:1.5px solid var(--acc);font-size:.95em}
.lei-rev small{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.lei-rev .v small{color:var(--acc)}

/* quiz */
.lei-quiz,.lei-chk{padding:var(--s4);border-radius:20px;background:rgba(31,17,64,.85);border:1px solid var(--glassb)}
.lei-lab{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan)}
.lei-qq{font-weight:600;margin-top:6px;line-height:1.4}
.lei-ops{display:grid;gap:var(--s2);margin-top:var(--s3)}
.lei-ops button{min-height:48px;padding:var(--s2) var(--s4);border-radius:14px;text-align:left;font:500 .9em 'Poppins';color:var(--ink);
  background:var(--glass);border:1.5px solid var(--glassb);cursor:pointer;transition:transform .12s}
.lei-ops button:active{transform:scale(.98)}
.lei-ops button.ok{border-color:var(--ok);background:rgba(58,209,122,.16)}
.lei-ops button.no{border-color:var(--danger);background:rgba(255,84,112,.14)}
.lei-ops button:disabled{cursor:default;opacity:1}
.lei-quiz.feito .lei-ops button:not(.ok):not(.no){opacity:.5}
.lei-exp{margin-top:var(--s3);padding:var(--s3);border-radius:14px;background:rgba(66,232,224,.08);font-size:.88em}
.lei-exp b{color:var(--cyan)}

/* checklist */
.lei-chk-h{display:flex;justify-content:space-between;align-items:center;gap:var(--s2)}
.lei-chk-n{flex:none;padding:2px 10px;border-radius:999px;background:var(--accsoft);color:var(--acc);font-weight:700;font-size:13px}
.lei-chk button{display:flex;align-items:center;gap:var(--s3);width:100%;min-height:48px;margin-top:var(--s2);padding:var(--s2) var(--s3);border-radius:14px;
  border:1px solid var(--glassb);background:var(--glass);color:var(--ink);font:400 .9em 'Poppins';text-align:left;cursor:pointer}
.lei-chk .bx{flex:none;width:26px;height:26px;border-radius:8px;border:2px solid var(--acc);display:grid;place-items:center;color:transparent;transition:background .15s}
.lei-chk button.on .bx{background:var(--acc);color:#1a0e2e}
.lei-chk button.on>span:last-child{color:var(--muted);text-decoration:line-through}

/* citação */
.lei-cit{position:relative;padding:var(--s5) var(--s4) var(--s4);border-radius:20px;background:linear-gradient(160deg,rgba(58,33,104,.55),rgba(22,10,43,.6));border:1px solid var(--glassb)}
.lei-aspas{position:absolute;top:-6px;left:14px;font:700 64px/1 'Cinzel',serif;color:var(--gold);opacity:.8}
.lei-cit blockquote{font-style:italic;font-size:1.05em;line-height:1.5}
.lei-cit figcaption{margin-top:var(--s3);font-size:13px;font-weight:600;color:var(--gold2)}
.lei-cit figcaption::before{content:"";display:inline-block;width:18px;height:1.5px;margin-right:8px;vertical-align:middle;background:var(--gold)}

/* figura */
.lei-fig-i{position:relative;aspect-ratio:4/3;border-radius:20px;overflow:hidden;display:grid;place-items:center;font-size:48px;color:var(--gold);
  background:radial-gradient(circle at 40% 30%,var(--acc2),var(--acc) 50%,#2a1450)}
.lei-fig-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lei-fig figcaption{margin-top:var(--s2);font-size:13px;color:var(--muted);text-align:center}

/* aviso */
.lei-aviso{display:flex;gap:var(--s3);padding:var(--s4);border-radius:16px;background:rgba(245,197,66,.07);border:1px solid rgba(245,197,66,.35)}
.lei-aviso-ic{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#1a0e2e;font-weight:800}
.lei-aviso b{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.lei-aviso p{font-size:.85em;color:#e9e1fa;margin-top:2px}

/* resumo */
.lei-res{padding:var(--s5) var(--s4);border-radius:22px;background:linear-gradient(160deg,rgba(245,197,66,.12),rgba(31,17,64,.9));border:1.5px solid var(--gold)}
.lei-res h3{font-family:'Cinzel',serif;font-size:1.02em;color:var(--gold2)}
.lei-res ul{list-style:none;display:grid;gap:var(--s3);margin-top:var(--s3)}
.lei-res li{display:flex;gap:var(--s2);font-size:.92em;line-height:1.45}
.lei-res li svg{flex:none;color:var(--ok);margin-top:2px}

/* próximo passo, próxima leitura, fim */
.lei-prox,.lei-next,.lei-intro{display:flex;align-items:center;gap:var(--s3);width:100%;min-height:64px;padding:var(--s3) var(--s4);border-radius:18px;text-align:left;cursor:pointer;
  color:var(--ink);font-family:'Poppins';background:linear-gradient(135deg,var(--accsoft),rgba(31,17,64,.9));border:1.5px solid var(--acc)}
.lei-prox>span,.lei-next-tx,.lei-intro>span:nth-child(2){flex:1;display:flex;flex-direction:column;min-width:0}
.lei-prox small,.lei-next small,.lei-intro small{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--acc)}
.lei-prox b,.lei-next b,.lei-intro b{font-size:15px;line-height:1.3}
.lei-prox>svg,.lei-next>svg,.lei-intro>svg{flex:none;color:var(--acc)}
.lei-fim{margin-top:var(--s6);display:grid;gap:var(--s3)}
.lei-concl{width:100%}
.lei-ok{display:flex;align-items:center;justify-content:center;gap:var(--s2);min-height:52px;border-radius:16px;background:rgba(58,209,122,.12);border:1px solid var(--ok);color:var(--ok)}
.lei-ok2{flex-direction:column;padding:var(--s4);color:var(--ink);border-color:var(--glassb);background:var(--glass)}
.lei-next-art{flex:none;width:56px;height:56px;border-radius:14px;overflow:hidden;background:radial-gradient(circle at 40% 30%,var(--acc2),var(--acc) 55%,#2a1450)}
.lei-next-art img{width:100%;height:100%;object-fit:cover}

/* bônus consultáveis */
.lei-gen .lei-capa-tx p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lei-gprog{display:flex;align-items:center;gap:var(--s3);margin-top:var(--s4);font-size:13px;color:var(--muted);white-space:nowrap}
.lei-intro{margin-top:var(--s4)}
.lei-intro-ic{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--acc);color:#1a0e2e}
.lei-intro.lido{border-color:var(--ok)} .lei-intro.lido>svg{color:var(--ok)}
.lei-sec{font-family:'Cinzel',serif;font-size:18px;margin-top:var(--s6)}
.lei-ox{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);margin-top:var(--s3)}
.lei-oxc{position:relative;display:block;padding:0;border-radius:18px;overflow:hidden;border:1.5px solid var(--acc);background:var(--card);color:var(--ink);text-align:left;cursor:pointer;font-family:'Poppins'}
.lei-oxc-art{position:relative;display:grid;place-items:center;aspect-ratio:3/4;font-size:44px;background:radial-gradient(circle at 40% 30%,var(--acc2),var(--acc) 55%,#2a1450)}
.lei-oxc-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lei-oxc-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(12,4,32,.95))}
.lei-oxc-tx{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;padding:var(--s3)}
.lei-oxc-tx b{font-family:'Cinzel',serif;font-size:16px;color:var(--acc)}
.lei-oxc-tx small{font-size:11.5px;line-height:1.35;color:#e9e1fa;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lei-tag{position:absolute;top:8px;left:8px;z-index:1;padding:3px 9px;border-radius:999px;background:var(--gold);color:#1a0e2e;font-size:10.5px;font-weight:700}
.lei-lido{position:absolute;top:8px;right:8px;z-index:1;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--ok);color:#0c2a18}
.lei-oxc.lido{border-color:var(--ok)}
.lei-consulta{margin-top:var(--s6);border-radius:18px;border:1px solid var(--glassb);background:var(--glass)}
.lei-consulta summary{display:flex;align-items:center;gap:var(--s2);min-height:52px;padding:0 var(--s4);font-weight:600;cursor:pointer;list-style:none;color:var(--acc)}
.lei-consulta summary::-webkit-details-marker{display:none}
.lei-consulta summary::after{content:"+";margin-left:auto;font-size:22px}
.lei-consulta[open] summary::after{content:"−"}
.lei-consulta-in{padding:0 var(--s3) var(--s4);overflow-x:auto}

@media (prefers-reduced-motion:reduce){
  .lei-rev-in{transition:none}
  .lei-rev.on .lei-rev-in{transform:none}
  .lei-rev .v{transform:none;opacity:0}
  .lei-rev.on .v{opacity:1} .lei-rev.on .f{opacity:0}
  .lei-bar i,.lei-ops button,.lei-chk .bx{transition:none}
}
.lei-oxc.meu{grid-column:1/-1;border-width:2px;box-shadow:0 0 0 4px var(--accsoft)}
.lei-oxc.meu .lei-oxc-art{aspect-ratio:16/10}
.lei-oxc.meu .lei-oxc-art img{object-position:50% 22%}
.lei-oxc.meu .lei-oxc-tx b{font-size:20px}
.lei-oxc.meu .lei-oxc-tx small{font-size:13px}
.lei-capa-art img{object-position:50% 20%}

/* revisão 25/10: ponto/cantiga com quebra de linha; botão de volta no fim das leituras do Mapa */
.lei-cit blockquote{white-space:pre-line}
.lei-volmapa{width:100%;margin-top:var(--s3)}