/* Quando a conversa fecha — chassi visual, segunda geração
   Proposta de redesenho do guia de leitura. v0.7.0-mockup

   A ideia organizadora do curso é a janela do comportamento: três faixas,
   e a linha que se move entre elas. O desenho da página nasce dela.
   Três movimentos, três faixas, três cores — e a cor do movimento atravessa
   a página do módulo. Um trilho fixo à esquerda mostra onde se está.

   Tokens em :root (claro); tema escuro redefine só os tokens. */

:root{
  --papel:#EFF1EE;
  --superficie:#FAFBF9;
  --fundo-sala:#E6E9E5;
  --tinta:#161B18;
  --tinta-2:#3E4744;
  --apagado:#6F7A75;
  --linha:#D5DAD5;
  --linha-forte:#B9C1BB;

  /* os três movimentos */
  --mov-1:#2F4F7A;  --mov-1-suave:#E3E9F2;
  --mov-2:#2D6A57;  --mov-2-suave:#E0EDE7;
  --mov-3:#8A6320;  --mov-3-suave:#F3EBDA;

  /* a cor do movimento corrente; o body recebe data-movimento */
  --mov:var(--mov-1);
  --mov-suave:var(--mov-1-suave);

  --ocre:#8A6320;
  /* nomes antigos, usados pela projeção e pelo painel */
  --acento:var(--mov); --acento-suave:var(--mov-suave);
  --sombra:0 1px 2px rgba(22,27,24,.06), 0 10px 30px -18px rgba(22,27,24,.25);
  --medida:64ch;
  --larga:860px;
  --trilho:236px;
  --raio:3px;
}
[data-movimento="II"]{--mov:var(--mov-2);--mov-suave:var(--mov-2-suave)}
[data-movimento="III"]{--mov:var(--mov-3);--mov-suave:var(--mov-3-suave)}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --papel:#101413; --superficie:#171C1A; --fundo-sala:#1D2320;
    --tinta:#E9ECEA; --tinta-2:#C0C8C4; --apagado:#8C9691;
    --linha:#273029; --linha-forte:#3A453E;
    --mov-1:#8FB0DE; --mov-1-suave:#1B2536;
    --mov-2:#7FC1A7; --mov-2-suave:#172A23;
    --mov-3:#D3AC5E; --mov-3-suave:#2A2214;
    --ocre:#D3AC5E; --sombra:none;
  }
}
:root[data-theme="dark"]{
  --papel:#101413; --superficie:#171C1A; --fundo-sala:#1D2320;
  --tinta:#E9ECEA; --tinta-2:#C0C8C4; --apagado:#8C9691;
  --linha:#273029; --linha-forte:#3A453E;
  --mov-1:#8FB0DE; --mov-1-suave:#1B2536;
  --mov-2:#7FC1A7; --mov-2-suave:#172A23;
  --mov-3:#D3AC5E; --mov-3-suave:#2A2214;
  --ocre:#D3AC5E; --sombra:none;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

body{
  margin:0;background:var(--papel);color:var(--tinta);
  font-family:"Karla","Helvetica Neue",Arial,sans-serif;font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{margin:0;text-wrap:balance;font-family:"Source Serif 4",Georgia,serif;font-weight:400}
p{margin:0}
a{color:var(--mov)}
:focus-visible{outline:2px solid var(--mov);outline-offset:3px;border-radius:2px}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace}

/* ============================================================
   MOLDURA: trilho à esquerda, leitura à direita
   ============================================================ */
.pagina{display:grid;grid-template-columns:var(--trilho) 1fr;min-height:100vh}

.trilho-lateral{
  position:sticky;top:0;height:100vh;overflow:auto;
  border-right:1px solid var(--linha);background:var(--papel);
  padding:26px 22px 26px 26px;display:flex;flex-direction:column;gap:26px;
}
.trilho-lateral .marca{
  font-family:"Source Serif 4",Georgia,serif;font-size:1.02rem;line-height:1.25;color:var(--tinta);text-decoration:none;
  display:flex;flex-direction:column;gap:3px;
}
.trilho-lateral .marca small{font-family:"Karla",sans-serif;font-size:.74rem;color:var(--apagado)}

/* a janela como marca: três faixas, a do movimento corrente acesa */
.janela-marca{display:grid;grid-template-rows:repeat(3,10px);gap:3px;width:44px}
.janela-marca span{background:var(--linha);border-radius:1px}
.janela-marca span[data-m="I"]{background:var(--mov-1)}
.janela-marca span[data-m="II"]{background:var(--mov-2)}
.janela-marca span[data-m="III"]{background:var(--mov-3)}
.janela-marca span:not(.acesa){opacity:.28}

/* a barra do renderizador vive dentro do trilho: o seletor cai aqui */
.barra .interno{display:flex;flex-direction:column;gap:8px}

/* barra do topo das páginas sem trilho (painel e roteiro). Ficou sem estilo
   quando o redesenho moveu a marca para o trilho lateral. */
.no-painel .barra,.no-roteiro .barra{
  border-bottom:1px solid var(--linha);background:var(--papel);
  padding:14px 22px;margin-bottom:26px;
}
.no-painel .barra .interno,.no-roteiro .barra .interno{
  max-width:var(--larga);margin:0 auto;flex-direction:row;align-items:baseline;gap:14px;
}
.no-painel .barra .marca,.no-roteiro .barra .marca{
  font-family:"Source Serif 4",Georgia,serif;font-size:1.02rem;color:var(--tinta);
  text-decoration:none;display:flex;align-items:baseline;gap:12px;
}
.no-painel .barra .marca:hover,.no-roteiro .barra .marca:hover{color:var(--mov)}
.no-painel .barra .marca span,.no-roteiro .barra .marca span{
  font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--apagado);
}
.contexto{display:flex;flex-direction:column;gap:8px}
.contexto .rotulo{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--apagado)}
.contexto .opcoes{display:flex;flex-wrap:wrap;gap:4px}
.contexto button{
  font:inherit;font-size:.78rem;padding:4px 10px;border:1px solid var(--linha);border-radius:999px;
  background:transparent;color:var(--tinta-2);cursor:pointer;line-height:1.4;
}
.contexto button:hover{border-color:var(--mov);color:var(--mov)}
.contexto button[aria-pressed="true"]{background:var(--mov);border-color:var(--mov);color:var(--papel)}

/* a espinha dos quinze */
.espinha{display:flex;flex-direction:column;gap:18px}
.espinha .grupo{display:flex;flex-direction:column;gap:6px}
.espinha .g-rotulo{
  font-family:"IBM Plex Mono",monospace;font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--apagado);
  display:flex;gap:8px;align-items:center;
}
.espinha .g-rotulo i{display:inline-block;width:14px;height:6px;border-radius:1px}
.espinha .grupo[data-m="I"] .g-rotulo i{background:var(--mov-1)}
.espinha .grupo[data-m="II"] .g-rotulo i{background:var(--mov-2)}
.espinha .grupo[data-m="III"] .g-rotulo i{background:var(--mov-3)}
.espinha .g-titulo{font-family:"Source Serif 4",Georgia,serif;font-size:.92rem;color:var(--tinta-2);line-height:1.3;margin-bottom:4px}
.espinha a,.espinha .prev{
  display:grid;grid-template-columns:22px 1fr;gap:8px;align-items:baseline;
  font-size:.82rem;line-height:1.35;color:var(--tinta-2);text-decoration:none;padding:3px 6px 3px 4px;border-radius:2px;
}
.espinha a:hover{background:var(--superficie);color:var(--tinta)}
.espinha .prev{color:var(--apagado)}
.espinha .n{font-family:"IBM Plex Mono",monospace;font-size:.68rem;color:var(--apagado)}
.espinha .aqui{background:var(--mov-suave);color:var(--tinta);position:relative}
.espinha .aqui::before{content:"";position:absolute;left:-14px;top:6px;bottom:6px;width:3px;background:var(--mov);border-radius:2px}
.espinha .aqui .n{color:var(--mov)}
.espinha .lido .n::after{content:" ·";color:var(--mov)}

.trilho-lateral .pe{margin-top:auto;font-size:.72rem;color:var(--apagado);line-height:1.5}
.trilho-lateral .pe a{color:var(--apagado)}

/* ============================================================
   LEITURA
   ============================================================ */
.leitura{padding:0 clamp(22px,5vw,72px) 120px;max-width:calc(var(--larga) + 2*clamp(22px,5vw,72px))}

/* cabeçalho do módulo: o número grande, a faixa do movimento */
.cabecalho-modulo{
  padding:64px 0 34px;display:grid;grid-template-columns:auto 1fr;gap:10px 26px;align-items:end;
  border-bottom:1px solid var(--linha);position:relative;
}
.cabecalho-modulo::before{
  content:"";position:absolute;left:0;top:0;height:6px;width:120px;background:var(--mov);border-radius:0 0 2px 2px;
}
.cabecalho-modulo .trilho{
  grid-column:1/-1;font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mov);
}
.cabecalho-modulo .numero{
  font-family:"Source Serif 4",Georgia,serif;font-weight:300;font-size:clamp(4rem,9vw,6.4rem);line-height:.85;
  color:var(--mov);letter-spacing:-.04em;font-variant-numeric:tabular-nums;
}
.cabecalho-modulo h1{font-size:clamp(2.1rem,4.6vw,3.2rem);line-height:1.04;letter-spacing:-.015em;max-width:18ch;padding-bottom:6px}

.blocos{display:flex;flex-direction:column;gap:38px;padding:38px 0 0}
.bloco{max-width:var(--medida)}
.bloco.largo{max-width:100%}
.bloco .b-rotulo{
  font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--apagado);display:block;margin-bottom:10px;
}

/* âncora: a frase que sustenta o módulo, com a janela em miniatura à esquerda */
.ancora{
  font-family:"Source Serif 4",Georgia,serif;font-style:italic;font-size:clamp(1.3rem,2.4vw,1.6rem);line-height:1.38;
  color:var(--mov);max-width:50ch;padding-left:22px;position:relative;
}
.ancora::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:6px;border-radius:2px;
  background:linear-gradient(to bottom,var(--mov) 0 30%,var(--mov-suave) 30% 70%,var(--mov) 70% 100%);
}

.ideia{font-family:"Source Serif 4",Georgia,serif;font-size:1.28rem;line-height:1.5}
.desdobra{display:flex;flex-direction:column;gap:15px;color:var(--tinta-2)}
.desdobra p::first-letter{}

/* diálogo: roteiro, falas com gutter fino */
.dialogo{display:flex;flex-direction:column;gap:12px;padding:6px 0 6px 20px;border-left:1px solid var(--linha-forte)}
.dialogo .cena{font-size:.9rem;color:var(--apagado);font-style:italic;margin-bottom:4px}
.turno{display:grid;grid-template-columns:minmax(58px,auto) 1fr;gap:0 16px;align-items:baseline}
.turno .quem{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--apagado);text-align:right;white-space:nowrap;padding-top:.3em}
.turno .fala{font-family:"Source Serif 4",Georgia,serif;font-size:1.06rem;line-height:1.45}
.turno.observacao{padding:2px 0}
.turno.observacao .fala{font-family:"Karla",sans-serif;color:var(--apagado);font-size:.9rem;font-style:italic}

/* contraste: a mesma fala, duas respostas — presas por uma régua comum */
.contraste{display:grid;gap:0 22px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.contraste .fala-base{
  grid-column:1/-1;font-family:"Source Serif 4",Georgia,serif;font-size:1.2rem;line-height:1.4;
  padding:0 0 16px;margin-bottom:18px;border-bottom:2px solid var(--mov);color:var(--tinta);
}
.lado{display:flex;flex-direction:column;gap:9px;padding-top:2px}
.lado .l-r{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--apagado)}
.lado .l-f{font-family:"Source Serif 4",Georgia,serif;font-size:1.06rem;line-height:1.42}
.lado .l-e{font-size:.9rem;color:var(--tinta-2);border-top:1px solid var(--linha);padding-top:9px;margin-top:2px}

/* sala de escolha: um recinto — chão mais escuro, sem moldura pesada */
.escolha{
  background:var(--fundo-sala);border-radius:6px;padding:26px 26px 22px;
  display:flex;flex-direction:column;gap:16px;max-width:var(--medida);
}
.escolha .e-cab{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.escolha .e-cab .e-t{font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mov)}
.condicoes{display:flex;flex-wrap:wrap;gap:6px}
.condicoes .cond{
  font-family:"IBM Plex Mono",monospace;font-size:.68rem;color:var(--tinta-2);
  border:1px solid var(--linha-forte);border-radius:2px;padding:3px 8px;background:transparent;
}
.condicoes .cond b{color:var(--apagado);font-weight:400}
.escolha .situacao{font-size:.95rem;color:var(--tinta-2)}
.escolha .fala-cena{font-family:"Source Serif 4",Georgia,serif;font-size:1.25rem;line-height:1.42;color:var(--tinta)}
.respostas{display:flex;flex-direction:column;gap:8px;counter-reset:resp}
.resposta{
  text-align:left;font:inherit;font-size:.98rem;cursor:pointer;line-height:1.5;
  background:var(--superficie);border:1px solid transparent;border-radius:4px;padding:12px 14px 12px 44px;color:var(--tinta);
  position:relative;counter-increment:resp;
}
.resposta::before{
  content:counter(resp,upper-alpha);position:absolute;left:14px;top:12px;
  font-family:"IBM Plex Mono",monospace;font-size:.72rem;color:var(--mov);border:1px solid var(--linha-forte);border-radius:2px;padding:0 5px;line-height:1.5;
}
.resposta:hover{border-color:var(--mov)}
.resposta[data-escolhida="sim"]{border-color:var(--mov);box-shadow:inset 3px 0 0 var(--mov)}
.resposta .efeito{display:block;margin-top:10px;padding-top:10px;border-top:1px solid var(--linha);font-size:.9rem;color:var(--tinta-2)}
.escolha .rodape-escolha{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.link-discreto{font:inherit;font-size:.85rem;background:none;border:0;padding:0;cursor:pointer;color:var(--mov);text-decoration:underline;text-underline-offset:3px}

/* figura: sai da medida e ocupa a largura toda, sem caixa pesada */
.figura{display:flex;flex-direction:column;gap:10px;max-width:100%}
.figura .caixa{background:var(--superficie);border-radius:6px;padding:22px 12px;overflow-x:auto;box-shadow:var(--sombra)}
.figura .caixa svg{display:block;min-width:600px;height:auto}
.figura figcaption{font-size:.86rem;color:var(--apagado);max-width:60ch}
svg .f-caixa{fill:var(--superficie);stroke:var(--linha-forte)}
svg .f-destaque{fill:var(--mov-suave);stroke:var(--linha-forte)}
svg .f-txt{fill:var(--tinta-2);font-family:"Karla",sans-serif;font-size:12px}
svg .f-min{fill:var(--apagado);font-family:"IBM Plex Mono",monospace;font-size:10px}
svg .f-linha{stroke:var(--mov);stroke-width:2;fill:none}
svg .f-tracejada{stroke:var(--mov);stroke-width:2;stroke-dasharray:5 4;fill:none}
svg g[id]{transition:opacity .28s ease}
.f-alca{fill:transparent;cursor:ns-resize}
.f-alca:hover,.f-alca:focus-visible{fill:var(--mov-suave)}

.painel-figura{display:flex;flex-direction:column;gap:8px}
.controles-figura{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.b-figura{font:inherit;font-size:.8rem;padding:5px 12px;cursor:pointer;border:1px solid var(--linha-forte);border-radius:999px;background:var(--superficie);color:var(--tinta)}
.b-figura:hover:not(:disabled){border-color:var(--mov)}
.b-figura:disabled{opacity:.4;cursor:default}
.b-figura.principal{background:var(--mov);border-color:var(--mov);color:var(--papel)}
.b-figura.principal:disabled{background:var(--superficie);color:var(--tinta);border-color:var(--linha-forte)}
.dica-figura{font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.06em;color:var(--apagado)}
.estado-figura{font-size:.92rem;color:var(--tinta-2);max-width:60ch;border-left:2px solid var(--mov);padding-left:12px;min-height:2.6em}

/* armadilha: um aviso de margem, ocre sempre — não muda com o movimento */
.armadilha{
  border-left:3px solid var(--ocre);padding:4px 0 4px 18px;display:flex;flex-direction:column;gap:6px;
}
.armadilha .a-r{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ocre)}
.armadilha p{color:var(--tinta-2)}

/* convite: o único bloco em cor cheia, sem campo nenhum para escrever */
.convite{
  background:var(--mov-suave);border-radius:6px;padding:20px 22px;display:flex;flex-direction:column;gap:8px;
  border-left:6px solid var(--mov);
}
.convite .c-r{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mov)}
.convite .c-t{font-family:"Source Serif 4",Georgia,serif;font-size:1.12rem;line-height:1.45}
.convite .c-n{font-size:.86rem;color:var(--tinta-2)}

/* limite: onde o método para. Silhueta contida — moldura fina, sem cor cheia,
   para que não pareça nem armadilha (ocre) nem convite (cor do movimento). */
.limite{
  border:1px solid var(--linha-forte);border-radius:var(--raio);padding:16px 20px 18px;
  display:flex;flex-direction:column;gap:8px;max-width:var(--medida);position:relative;
}
.limite::before{
  content:"";position:absolute;left:-1px;top:14px;bottom:14px;width:1px;background:var(--tinta);
}
.limite .l-r{font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--apagado)}
.limite .l-t{font-family:"Source Serif 4",Georgia,serif;font-size:1.02rem;line-height:1.55;color:var(--tinta-2)}

.saida{border-top:1px solid var(--linha-forte);padding-top:18px;display:flex;flex-direction:column;gap:8px}
.saida .s-r{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--apagado)}
.saida .s-t{font-family:"Source Serif 4",Georgia,serif;font-size:1.15rem;line-height:1.5}

.conduz,.fonte{border:1px dashed var(--linha-forte);border-radius:var(--raio);background:transparent;max-width:var(--medida)}
.fonte{margin-top:44px}
.conduz summary,.fonte summary{cursor:pointer;padding:11px 16px;font-size:.78rem;color:var(--apagado);letter-spacing:.08em;text-transform:uppercase}
.conduz summary::marker,.fonte summary::marker{color:var(--linha-forte)}
.conduz .corpo{padding:0 16px 16px;display:grid;gap:8px 18px;grid-template-columns:minmax(110px,150px) 1fr;font-size:.92rem}
.conduz .corpo dt{color:var(--apagado);font-size:.76rem;letter-spacing:.05em;text-transform:uppercase}
.conduz .corpo dd{margin:0;color:var(--tinta-2)}
.fonte .corpo{padding:0 16px 16px;display:flex;flex-direction:column;gap:10px}
.fonte .f-linha{font-size:.88rem;color:var(--tinta-2)}
.fonte .f-linha.aviso{color:var(--apagado);font-size:.82rem;border-top:1px solid var(--linha);padding-top:10px}
.fonte .f-rotulo{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--apagado)}
.fonte .f-lista{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:.86rem;color:var(--tinta-2)}
.fonte .f-links{display:flex;flex-wrap:wrap;gap:16px;font-size:.86rem}

.pe-modulo{margin-top:52px;padding-top:22px;border-top:1px solid var(--linha);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
.botao{display:inline-block;text-decoration:none;font-size:.92rem;border:1px solid var(--linha-forte);border-radius:999px;padding:9px 18px;color:var(--tinta);background:var(--superficie)}
.botao:hover{border-color:var(--mov)}
.botao.principal{background:var(--mov);border-color:var(--mov);color:var(--papel)}

.rodape{margin-top:64px;padding-top:22px;border-top:1px solid var(--linha);display:flex;flex-direction:column;gap:7px;color:var(--apagado);font-size:.8rem;max-width:72ch}
.rodape a{color:var(--apagado)}
.aviso-provisorio{border:1px dashed var(--linha-forte);border-radius:var(--raio);padding:12px 16px;font-size:.85rem;color:var(--apagado);max-width:var(--medida)}

/* ============================================================
   CELULAR: o trilho vira uma faixa no alto
   ============================================================ */
@media (max-width:860px){
  .pagina{grid-template-columns:minmax(0,1fr)}
  .trilho-lateral{
    position:sticky;top:0;height:auto;padding:12px 18px;gap:12px;
    border-right:0;border-bottom:1px solid var(--linha);z-index:20;
    flex-direction:row;align-items:center;flex-wrap:wrap;
  }
  .trilho-lateral .marca{flex:1}
  .trilho-lateral .espinha,.trilho-lateral .pe{display:none}
  .trilho-lateral .barra{flex:1 1 100%;min-width:0}
  .barra .interno{flex-direction:row;align-items:center;min-width:0}
  .contexto{flex-direction:row;align-items:center;min-width:0}
  .contexto .opcoes{flex-wrap:wrap}
  .contexto .rotulo{display:none}
  .cabecalho-modulo{grid-template-columns:1fr;padding-top:40px}
  .cabecalho-modulo .numero{font-size:3.4rem}
  .turno{grid-template-columns:1fr;gap:2px}
  .turno .quem{text-align:left;padding-top:0}
  .conduz .corpo{grid-template-columns:1fr}
  .escolha{padding:20px 16px}
}


/* ============================================================
   PORTAL — os três movimentos, cada um na sua cor
   ============================================================ */
.capa{padding:64px 0 40px;display:flex;flex-direction:column;gap:18px;border-bottom:1px solid var(--linha)}
.capa .sobrescrito{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--apagado)}
.capa h1{font-size:clamp(2.4rem,5.2vw,3.8rem);line-height:1.02;letter-spacing:-.018em;max-width:16ch}
.capa .sub{font-family:"Source Serif 4",Georgia,serif;font-style:italic;font-size:1.3rem;line-height:1.42;color:var(--tinta-2);max-width:50ch}
.capa .tese{font-size:1.04rem;color:var(--tinta-2);max-width:58ch}
.portas{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.porta{
  display:flex;flex-direction:column;gap:3px;text-decoration:none;color:var(--tinta);
  border:1px solid var(--linha-forte);border-radius:6px;padding:14px 18px;background:var(--superficie);min-width:240px;
}
.porta:hover{border-color:var(--mov)}
.porta .p-t{font-family:"Source Serif 4",Georgia,serif;font-size:1.08rem}
.porta .p-d{font-size:.85rem;color:var(--apagado)}

.movimento{padding:40px 0 10px;border-bottom:1px solid var(--linha);--mov:var(--mov-1);--mov-suave:var(--mov-1-suave)}
.movimento[data-m="II"]{--mov:var(--mov-2);--mov-suave:var(--mov-2-suave)}
.movimento[data-m="III"]{--mov:var(--mov-3);--mov-suave:var(--mov-3-suave)}
.movimento:last-of-type{border-bottom:0}
.mov-cab{display:grid;grid-template-columns:auto 1fr;gap:4px 22px;align-items:end;margin-bottom:18px}
.mov-cab .m-n{grid-column:1/-1;font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mov)}
.mov-cab .m-faixa{width:12px;align-self:stretch;border-radius:2px;background:linear-gradient(to bottom,var(--mov) 0 34%,var(--mov-suave) 34% 66%,var(--mov) 66% 100%)}
.mov-cab .m-texto{display:flex;flex-direction:column;gap:4px}
.mov-cab h2{font-size:clamp(1.5rem,2.8vw,2rem);line-height:1.15}
.mov-cab .m-p{font-family:"Source Serif 4",Georgia,serif;font-style:italic;color:var(--tinta-2);font-size:1.08rem}
.trilha{display:flex;flex-direction:column;border-top:1px solid var(--linha)}
.passo{
  display:grid;grid-template-columns:48px 1fr auto;align-items:baseline;gap:0 14px;
  padding:14px 6px;border-bottom:1px solid var(--linha);text-decoration:none;color:var(--tinta);
}
.passo:hover{background:var(--superficie)}
.passo[aria-disabled="true"]{color:var(--apagado);pointer-events:none}
.passo .n{font-family:"Source Serif 4",Georgia,serif;font-weight:300;font-size:1.5rem;color:var(--mov);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.passo[aria-disabled="true"] .n{color:var(--linha-forte)}
.passo .t{display:flex;flex-direction:column;gap:2px}
.passo .t b{font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:1.1rem}
.passo .t i{font-style:normal;font-size:.87rem;color:var(--apagado)}
.passo .marca-estado{font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--apagado);white-space:nowrap}
.passo .marca-estado.lido{color:var(--mov)}
@media (max-width:620px){.passo{grid-template-columns:36px 1fr;gap:0 10px}.passo .marca-estado{grid-column:2;font-size:.64rem}.passo .n{font-size:1.2rem}}

/* =====================================================================
   PROJEÇÃO — v0.5.0, fatia 3
   A mesma fonte, outro corpo. Aqui o texto é grande, cabe pouco por tela,
   e o que na leitura aparece de uma vez aparece por etapas: numa sala, a
   conversa acontece entre a pergunta e a resposta, não depois dela.
   ===================================================================== */

body.projetando{margin:0;height:100vh;overflow:hidden;background:var(--papel)}
.palco{
  height:100vh;display:grid;grid-template-rows:1fr auto;
  padding:0;position:relative;
}
.quadro{
  display:flex;align-items:center;justify-content:center;
  padding:clamp(24px,5vh,64px) clamp(24px,6vw,96px) 0;
  overflow:auto;position:relative;
}
.tela{
  width:100%;max-width:1100px;display:flex;flex-direction:column;gap:clamp(14px,2.4vh,26px);
}
.tela .grande,.tela .grande-italico{
  font-family:"Source Serif 4",Georgia,serif;
  font-size:clamp(1.5rem,3.4vw,2.6rem);line-height:1.3;max-width:26ch;
}
.tela .grande-italico{font-style:italic;color:var(--acento);max-width:24ch}
.tela .medio{font-family:"Source Serif 4",Georgia,serif;font-size:clamp(1.2rem,2.4vw,1.8rem);line-height:1.4;max-width:34ch}
.tela .nota{font-size:clamp(.9rem,1.4vw,1.05rem);color:var(--apagado);max-width:52ch}
.tela .etiqueta{
  font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--apagado);
}
.tela .trilho{font-family:"IBM Plex Mono",monospace;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--apagado)}
.tela h1{font-size:clamp(2.2rem,5.4vw,4rem);max-width:18ch}
.t-capa,.t-fim{justify-content:center}
.t-armadilha .etiqueta{color:var(--ocre)}
.t-armadilha{border-left:4px solid var(--ocre);padding-left:clamp(16px,2vw,28px)}
.t-convite .etiqueta{color:var(--acento)}
.t-limite{border:1px solid var(--linha-forte);border-radius:8px;padding:clamp(18px,2.4vw,34px) clamp(20px,2.8vw,40px);max-width:64ch}
.t-limite .medio{color:var(--tinta-2)}

.tela .fala-base{
  font-family:"Source Serif 4",Georgia,serif;font-size:clamp(1.35rem,2.9vw,2.1rem);
  line-height:1.35;border-left:3px solid var(--acento);padding-left:clamp(14px,1.6vw,22px);max-width:30ch;
}
.tela .situacao{font-size:clamp(1rem,1.7vw,1.25rem);color:var(--tinta-2);max-width:46ch}
.tela .cena{font-style:italic;color:var(--apagado);font-size:clamp(.95rem,1.5vw,1.1rem)}

.dialogo-proj{display:flex;flex-direction:column;gap:clamp(10px,1.8vh,18px);border-left:2px solid var(--linha-forte);padding-left:clamp(16px,2vw,26px)}
.dialogo-proj .turno{display:grid;grid-template-columns:minmax(90px,auto) 1fr;gap:0 20px;align-items:baseline}
.dialogo-proj .quem{font-family:"IBM Plex Mono",monospace;font-size:.8rem;color:var(--apagado);text-align:right}
.dialogo-proj .fala{font-family:"Source Serif 4",Georgia,serif;font-size:clamp(1.1rem,2.2vw,1.6rem);line-height:1.35}
.dialogo-proj .observacao .fala{font-family:"Karla",sans-serif;font-style:italic;color:var(--apagado);font-size:clamp(.9rem,1.5vw,1.1rem)}

.dois-lados{display:grid;gap:clamp(12px,1.6vw,22px);grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.dois-lados .lado{background:var(--superficie);border:1px solid var(--linha);border-radius:var(--raio);padding:clamp(14px,1.6vw,22px);display:flex;flex-direction:column;gap:9px}
.dois-lados .l-f{font-family:"Source Serif 4",Georgia,serif;font-size:clamp(1.05rem,1.9vw,1.35rem);line-height:1.35}
.dois-lados .l-e{font-size:clamp(.88rem,1.4vw,1.02rem);color:var(--tinta-2);border-top:1px solid var(--linha);padding-top:9px}

.condicoes-proj{display:flex;flex-wrap:wrap;gap:7px}
.condicoes-proj .cond{
  font-family:"IBM Plex Mono",monospace;font-size:clamp(.68rem,1.1vw,.82rem);color:var(--tinta-2);
  border:1px solid var(--linha);border-radius:2px;padding:4px 9px;background:var(--superficie);
}
.condicoes-proj .cond b{color:var(--apagado);font-weight:400}

.respostas-proj{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
.respostas-proj .resp{
  background:var(--superficie);border:1px solid var(--linha-forte);border-radius:var(--raio);
  padding:clamp(12px,1.4vw,18px);display:flex;gap:12px;align-items:flex-start;
  font-size:clamp(.98rem,1.6vw,1.14rem);line-height:1.45;
}
.respostas-proj .resp.com-efeito{flex-direction:column;gap:9px}
.respostas-proj .resp .topo{display:flex;gap:12px;align-items:flex-start}
.respostas-proj .resp.apagada{opacity:.4}
.respostas-proj .num{
  font-family:"IBM Plex Mono",monospace;font-size:.8rem;color:var(--acento);
  border:1px solid var(--linha-forte);border-radius:2px;padding:1px 7px;flex:none;
}
.respostas-proj .efeito{
  font-size:clamp(.85rem,1.3vw,1rem);color:var(--tinta-2);
  border-top:1px solid var(--linha);padding-top:9px;width:100%;
}

.t-figura .caixa-figura{background:var(--superficie);border:1px solid var(--linha);border-radius:var(--raio);padding:18px 10px;overflow-x:auto}
.t-figura .caixa-figura svg{display:block;min-width:640px;width:100%;height:auto;max-height:62vh}
.t-figura .legenda{font-size:clamp(.9rem,1.4vw,1.05rem);color:var(--apagado);max-width:62ch}

.progresso{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--linha)}
.progresso .feito{height:2px;background:var(--acento)}

.barra-projetor{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;
  padding:10px clamp(16px,3vw,32px);border-top:1px solid var(--linha);background:var(--papel);
}
.barra-projetor .lado-dir{display:flex;gap:8px;justify-content:flex-end}
.barra-projetor .lado-meio{display:flex;gap:12px;align-items:center}
.barra-projetor .b-ctx{font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--apagado)}
.barra-projetor .b-conta{font-family:"IBM Plex Mono",monospace;font-size:.78rem;color:var(--apagado);min-width:130px;text-align:center}
.b-nav{
  font:inherit;font-size:.85rem;padding:6px 14px;cursor:pointer;text-decoration:none;
  border:1px solid var(--linha-forte);border-radius:var(--raio);background:var(--superficie);color:var(--tinta);
}
.b-nav:hover{border-color:var(--acento)}

.notas-conduz{
  position:absolute;right:clamp(16px,3vw,32px);bottom:64px;width:min(420px,86vw);max-height:64vh;overflow:auto;
  background:var(--superficie);border:1px solid var(--linha-forte);border-radius:var(--raio);
  padding:16px 18px;box-shadow:0 8px 30px rgba(0,0,0,.18);z-index:5;
}
.notas-conduz dl{display:grid;grid-template-columns:minmax(96px,120px) 1fr;gap:7px 14px;margin:12px 0 0;font-size:.88rem}
.notas-conduz dt{color:var(--apagado);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}
.notas-conduz dd{margin:0;color:var(--tinta-2)}

@media (max-width:640px){
  .barra-projetor{grid-template-columns:1fr;gap:8px}
  .barra-projetor .lado-dir,.barra-projetor .lado-meio{justify-content:center}
  .dialogo-proj .turno{grid-template-columns:1fr;gap:2px}
  .dialogo-proj .quem{text-align:left}
}

/* =====================================================================
   PAINEL DO AUTOR
   ===================================================================== */
.cabecalho-painel{padding:52px 0 26px;display:flex;flex-direction:column;gap:12px;border-bottom:1px solid var(--linha)}
.cabecalho-painel .nota-acesso{
  font-size:.84rem;color:var(--apagado);border-left:2px solid var(--ocre);padding-left:12px;max-width:60ch;
}
.secao-painel{padding:34px 0;border-bottom:1px solid var(--linha)}
.secao-painel:last-of-type{border-bottom:0}
.secao-painel h2{margin-bottom:10px}
.secao-painel .sub{color:var(--tinta-2);font-size:.94rem;max-width:70ch}
.sub-mono{font-family:"IBM Plex Mono",monospace;font-size:.74rem;color:var(--apagado);letter-spacing:.04em}

.controles{display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap;margin-bottom:18px}
.controles label{display:flex;flex-direction:column;gap:5px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--apagado)}
.controles select{
  font:inherit;font-size:.95rem;padding:7px 10px;color:var(--tinta);
  background:var(--superficie);border:1px solid var(--linha-forte);border-radius:var(--raio);min-width:230px;
}
.acoes{display:flex;gap:8px;margin-left:auto}
.cab-modulo{display:flex;flex-direction:column;gap:5px;margin-bottom:20px}
.cab-modulo .sub{color:var(--tinta-2)}

.vistas{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.coluna{
  background:var(--superficie);border:1px solid var(--linha);border-radius:var(--raio);
  padding:14px 16px;display:flex;flex-direction:column;gap:10px;
}
.col-cab{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.col-cab h3{font-size:1.05rem}
.col-cab .estado{
  font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--apagado);border:1px solid var(--linha);border-radius:2px;padding:2px 6px;
}
.col-cab .estado.pronta{color:var(--acento);border-color:var(--acento)}
.col-meta{display:flex;gap:12px;font-family:"IBM Plex Mono",monospace;font-size:.72rem;color:var(--apagado)}
.col-lista{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:7px;font-size:.84rem}
.col-lista li{color:var(--tinta-2)}
.col-lista .tipo{
  font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--acento);display:block;
}
.col-lista .sobreposto{
  display:inline-block;margin-top:3px;font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  color:var(--ocre);border:1px solid var(--ocre);border-radius:2px;padding:0 5px;
}
.col-fora{font-size:.76rem;color:var(--apagado);border-top:1px solid var(--linha);padding-top:8px}

.inventario{display:grid;grid-template-columns:minmax(180px,240px) 1fr;gap:7px 18px;margin:0;font-size:.94rem}
.inventario dt{color:var(--apagado);font-size:.78rem;letter-spacing:.05em;text-transform:uppercase}
.inventario dd{margin:0;color:var(--tinta-2)}

.lista-probs{margin:10px 0 0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:.88rem}
.lista-probs li{display:flex;gap:10px;align-items:baseline;color:var(--tinta-2)}
.grau{
  font-family:"IBM Plex Mono",monospace;font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--linha-forte);border-radius:2px;padding:1px 6px;color:var(--apagado);flex:none;min-width:92px;text-align:center;
}
.g-falta,.g-regra{color:var(--ocre);border-color:var(--ocre)}
#conferencia .ok{color:var(--tinta-2);border-left:2px solid var(--acento);padding-left:12px;max-width:70ch}
.rodape .linha-painel{opacity:.65}
.rodape .linha-painel a{color:var(--apagado)}
.rodape .linha-painel a:hover{color:var(--acento)}


.envelope{max-width:var(--larga);margin:0 auto;padding:0 22px 100px}
.sobrescrito{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.71rem;letter-spacing:.15em;text-transform:uppercase;color:var(--apagado)}

/* painel em tela estreita: nada aqui é essencial no celular, mas também não
   deve empurrar a página para o lado. */
@media (max-width:640px){
  .controles select{min-width:0;width:100%}
  .controles label{width:100%}
  .acoes{margin-left:0;flex-wrap:wrap}
  .vistas{grid-template-columns:minmax(0,1fr)}
  .inventario{grid-template-columns:minmax(0,1fr);gap:2px 0}
  .inventario dd{margin-bottom:10px}
  .cabecalho-painel{padding-top:32px}
}

/* =====================================================================
   ROTEIRO DE SALA  (terceiro renderizador)
   Duas exigências que os outros não tinham: precisa ser lido de pé, com a
   sala esperando — daí a coluna de relógio à esquerda e o corpo curto — e
   precisa imprimir bem, porque quem conduz não segura um laptop.
   ===================================================================== */
.no-roteiro .envelope{max-width:900px}

.r-cab{padding:34px 0 26px;border-bottom:1px solid var(--linha-forte);display:flex;flex-direction:column;gap:10px}
.r-cab h1{font-size:clamp(1.7rem,3.4vw,2.4rem)}
.r-nota{color:var(--tinta-2);max-width:66ch}
.r-conta{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:6px}
.medida{display:flex;flex-direction:column;gap:2px}
.medida .m-r{font-family:"IBM Plex Mono",monospace;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--apagado)}
.medida .m-v{font-size:1.05rem}
.medida.estoura .m-v{color:var(--ocre)}
.medida.cabe .m-v{color:var(--mov-3,#8A6320)}
.r-alerta{font-size:.9rem;color:var(--ocre);border-left:3px solid var(--ocre);padding-left:12px;max-width:70ch}
.r-alerta.sobra{color:var(--apagado);border-left-color:var(--linha-forte)}
.r-materiais{font-size:.9rem;color:var(--tinta-2)}

.r-modulo{padding:28px 0 10px;border-bottom:1px solid var(--linha)}
.rm-cab{display:flex;align-items:baseline;gap:16px;margin-bottom:14px}
.rm-n{font-family:"Source Serif 4",Georgia,serif;font-size:2.1rem;line-height:1;color:var(--mov);min-width:2.2ch}
.r-modulo[data-movimento="I"]{--mov:var(--mov-1)} 
.r-modulo[data-movimento="II"]{--mov:var(--mov-2)}
.r-modulo[data-movimento="III"]{--mov:var(--mov-3)}
.rm-t{flex:1 1 auto;min-width:0}
.rm-t h2{font-size:1.24rem;margin:0}
.rm-a{color:var(--apagado);font-size:.9rem}
.rm-tempo{font-family:"IBM Plex Mono",monospace;font-size:.82rem;color:var(--apagado);white-space:nowrap}

.r-linhas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.r-linha{display:grid;grid-template-columns:52px minmax(0,1fr) 46px;gap:14px;padding:11px 0;border-top:1px solid var(--linha);align-items:start}
.r-linha:first-child{border-top:0}
.l-rel{font-family:"IBM Plex Mono",monospace;font-size:.78rem;color:var(--apagado);padding-top:2px}
.l-min{font-family:"IBM Plex Mono",monospace;font-size:.78rem;color:var(--apagado);text-align:right;padding-top:2px}
.l-tipo{font-family:"IBM Plex Mono",monospace;font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mov);margin-bottom:3px}
.l-txt{font-size:.95rem;color:var(--tinta-2);max-width:62ch;margin:0}
.l-nome{display:block;font-size:1.02rem;margin-bottom:4px}

.r-linha.exercicio{background:var(--mov-suave);border-radius:6px;padding:14px;border-top:0;margin:8px 0}
.r-linha.exercicio .l-tipo{color:var(--mov)}
.r-linha.conduz{opacity:.92}
.r-linha.conduz .l-tipo{color:var(--apagado)}
.x-campos{display:grid;grid-template-columns:minmax(110px,150px) 1fr;gap:5px 16px;margin:8px 0 0;font-size:.88rem}
.x-campos dt{font-family:"IBM Plex Mono",monospace;font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--apagado);padding-top:3px}
.x-campos dd{margin:0;color:var(--tinta-2)}

.r-fim{padding:26px 0 0;display:flex;flex-direction:column;gap:6px;font-size:.84rem;color:var(--apagado);max-width:70ch}

@media (max-width:640px){
  .r-linha{grid-template-columns:44px minmax(0,1fr);gap:10px}
  .l-min{display:none}
  .x-campos{grid-template-columns:minmax(0,1fr);gap:1px 0}
  .x-campos dd{margin-bottom:8px}
}

@media print{
  .nao-imprime,.barra{display:none !important}
  body{background:#fff}
  .no-roteiro .envelope{max-width:none;padding:0}
  .r-modulo{border-bottom:0;padding-top:18px}
  .rm-cab{break-after:avoid;page-break-after:avoid;break-inside:avoid}
  .r-linha{break-inside:avoid;page-break-inside:avoid}
  .r-linha.exercicio{background:transparent;border:1px solid #999;border-radius:0}
  .r-cab{break-after:avoid;page-break-after:avoid}
  a[href]::after{content:""}
  @page{margin:16mm 14mm}
}

/* tabela das receitas no painel */
.receitas{display:flex;flex-direction:column;margin-top:14px;border-top:1px solid var(--linha)}
.rec-linha{display:grid;grid-template-columns:minmax(0,2fr) .85fr .7fr 1.15fr .5fr .6fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--linha);align-items:baseline;font-size:.9rem}
.rec-linha.cab{font-family:"IBM Plex Mono",monospace;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--apagado)}
.rec-linha a{color:var(--tinta);text-decoration:none;border-bottom:1px solid var(--linha-forte)}
.rec-linha a:hover{color:var(--mov);border-color:var(--mov)}
.rec-linha span{color:var(--tinta-2)}
.rec-linha.atencao span:nth-child(4){color:var(--ocre)}
@media (max-width:760px){
  .rec-linha{grid-template-columns:minmax(0,1fr) auto;gap:2px 10px}
  .rec-linha.cab{display:none}
  .rec-linha span:nth-child(2)::after{content:" ·"}
  .rec-linha span:nth-child(n+2){font-size:.8rem;color:var(--apagado)}
}

/* =====================================================================
   APOSTILA  (quarto renderizador — papel)
   Medida de leitura contínua, hierarquia por peso e não por cor, e uma
   quebra de página por módulo. Nada aqui responde a clique.
   ===================================================================== */
.no-apostila .envelope{max-width:820px}
.no-apostila .barra .marca{font-size:1.02rem}

.a-capa{padding:30px 0 34px;border-bottom:2px solid var(--tinta);display:flex;flex-direction:column;gap:10px}
.a-capa h1{font-size:clamp(2rem,4.6vw,3rem);line-height:1.05}
.a-sub{font-family:"Source Serif 4",Georgia,serif;font-size:1.16rem;color:var(--tinta-2);max-width:52ch}
.a-tese{font-size:1rem;color:var(--tinta-2);max-width:62ch}
.a-receita{font-family:"IBM Plex Mono",monospace;font-size:.74rem;letter-spacing:.06em;color:var(--apagado)}
.a-sumario{margin:16px 0 0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:5px}
.a-sumario li{display:flex;gap:14px;align-items:baseline;font-size:.95rem;border-bottom:1px dotted var(--linha);padding-bottom:4px}
.a-sumario b{font-weight:600;white-space:nowrap}
.a-sumario span{color:var(--apagado);font-size:.86rem}
.a-ficcao{font-size:.8rem;color:var(--apagado);margin-top:12px;max-width:64ch}

.a-modulo{padding:30px 0 18px;border-bottom:1px solid var(--linha)}
.a-modulo[data-movimento="I"]{--mov:var(--mov-1);--mov-suave:var(--mov-1-suave,#eef2f7)}
.a-modulo[data-movimento="II"]{--mov:var(--mov-2);--mov-suave:var(--mov-2-suave,#edf3f0)}
.a-modulo[data-movimento="III"]{--mov:var(--mov-3);--mov-suave:var(--mov-3-suave,#f5f0e6)}
.a-cab{display:flex;gap:16px;align-items:baseline;margin-bottom:16px;border-bottom:1px solid var(--linha-forte);padding-bottom:10px}
.a-n{font-family:"Source Serif 4",Georgia,serif;font-size:2rem;line-height:1;color:var(--mov)}
.a-cab h2{font-size:1.4rem;margin:0}
.a-anc{color:var(--apagado);font-size:.9rem;margin:2px 0 0}

.a-bloco{margin:0 0 15px;max-width:66ch}
.a-bloco p{margin:0 0 8px}
.a-ancora{font-family:"Source Serif 4",Georgia,serif;font-style:italic;font-size:1.2rem;color:var(--mov)}
.a-ideia{font-family:"Source Serif 4",Georgia,serif;font-size:1.08rem;line-height:1.55}
.a-rot{font-family:"IBM Plex Mono",monospace;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--apagado);margin-bottom:4px}
.a-armadilha,.a-limite{border-left:2px solid var(--linha-forte);padding-left:14px}
.a-armadilha{border-left-color:var(--ocre)}
.a-armadilha .a-rot{color:var(--ocre)}
.a-saida{font-family:"Source Serif 4",Georgia,serif;font-size:1.05rem;border-top:1px solid var(--linha-forte);padding-top:8px}

.a-figura{margin:0;display:flex;flex-direction:column;gap:8px}
.a-svg{border:1px solid var(--linha);border-radius:3px;padding:10px;background:#fff;overflow-x:auto}
.a-etapas{margin:0;padding-left:20px;font-size:.88rem;color:var(--tinta-2);display:flex;flex-direction:column;gap:4px}
.a-figura figcaption{font-size:.84rem;color:var(--apagado);max-width:64ch}

.a-contraste .a-fala{font-family:"Source Serif 4",Georgia,serif;font-size:1.05rem;margin-bottom:10px}
.a-par{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.a-lado{border-top:2px solid var(--linha-forte);padding-top:8px}
.a-lado.b{border-top-color:var(--mov)}
.a-resp{font-family:"Source Serif 4",Georgia,serif;font-size:.98rem}
.a-ef{font-size:.85rem;color:var(--tinta-2)}

.a-dialogo{border-left:2px solid var(--linha);padding-left:14px}
.a-cena{font-size:.86rem;color:var(--apagado);font-style:italic}
.a-turno{font-family:"Source Serif 4",Georgia,serif;font-size:1rem}
.a-obs{font-size:.84rem;color:var(--tinta-2);border-left:2px solid var(--mov);padding-left:10px;margin-left:-2px}

.a-escolha{border:1px solid var(--linha-forte);border-radius:3px;padding:12px 14px;margin-bottom:12px}
.a-cond{font-size:.8rem;color:var(--apagado)}
.a-sit{font-size:.94rem}
.a-escolha .a-fala{font-family:"Source Serif 4",Georgia,serif;font-size:1.06rem}
.a-respostas{margin:8px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:8px}

.a-convite{background:var(--mov-suave);border-radius:4px;padding:12px 14px}
.a-conv-t{font-family:"Source Serif 4",Georgia,serif;font-size:1.05rem}
.a-espaco{height:56px}

.a-conduz,.a-exercicio{border:1px dashed var(--linha-forte);border-radius:3px;padding:11px 14px}
.a-conduz dl,.a-exercicio dl{display:grid;grid-template-columns:minmax(100px,140px) 1fr;gap:4px 14px;margin:6px 0 0;font-size:.86rem}
.a-conduz dt,.a-exercicio dt{font-family:"IBM Plex Mono",monospace;font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--apagado);padding-top:3px}
.a-conduz dd,.a-exercicio dd{margin:0;color:var(--tinta-2)}

.a-fim{padding:20px 0 0;font-size:.82rem;color:var(--apagado);display:flex;flex-direction:column;gap:5px;max-width:70ch}

@media (max-width:640px){
  .a-par{grid-template-columns:minmax(0,1fr)}
  .a-conduz dl,.a-exercicio dl{grid-template-columns:minmax(0,1fr);gap:1px 0}
  .a-conduz dd,.a-exercicio dd{margin-bottom:8px}
  .a-sumario li{flex-direction:column;gap:1px}
}

@media print{
  .no-apostila .envelope{max-width:none;padding:0}
  .a-capa{break-after:page;page-break-after:always}
  .a-modulo{break-before:page;page-break-before:always;border-bottom:0}
  .a-modulo:first-of-type{break-before:auto;page-break-before:auto}
  /* texto corrido pode quebrar entre páginas; o que é caixa, não. */
  .a-escolha,.a-figura,.a-convite,.a-conduz,.a-exercicio,.a-contraste,
  .a-armadilha,.a-limite,.a-saida,.a-ancora{break-inside:avoid;page-break-inside:avoid}
  .a-ideia{break-after:avoid;page-break-after:avoid}
  .a-cab{break-after:avoid;page-break-after:avoid}
  .a-convite{background:transparent;border:1px solid #999}
  .a-svg{border-color:#999}
}

/* =====================================================================
   CARTÕES  (vista curta — bolso, dez segundos, semanas depois)
   ===================================================================== */
.no-cartoes .envelope{max-width:var(--larga)}
.folha-cartoes{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-top:18px}
.cartao{
  border:1px solid var(--linha-forte);border-radius:4px;padding:16px 18px 18px;
  display:flex;flex-direction:column;gap:9px;background:var(--superficie);
  min-height:330px;
}
.cartao[data-movimento="I"]{--mov:var(--mov-1)}
.cartao[data-movimento="II"]{--mov:var(--mov-2)}
.cartao[data-movimento="III"]{--mov:var(--mov-3)}
.cartao .c-n{font-family:"Source Serif 4",Georgia,serif;font-size:1.6rem;line-height:1;color:var(--mov)}
.cartao h2{font-size:1.08rem;margin:0;line-height:1.25}
.c-perg{font-family:"Source Serif 4",Georgia,serif;font-style:italic;font-size:1.06rem;color:var(--mov);margin:0}
.c-rot{font-family:"IBM Plex Mono",monospace;font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--apagado);margin-bottom:3px}
.c-sai p,.c-conv p{font-size:.9rem;margin:0;color:var(--tinta-2)}
.c-sai{border-top:1px solid var(--linha);padding-top:8px}
.c-conv{background:var(--mov-suave);border-radius:3px;padding:8px 10px}
.c-limite{margin-top:auto;border-top:1px solid var(--linha);padding-top:8px}
.c-lim{font-size:.78rem;color:var(--apagado);margin:0;line-height:1.45}
.cartao.nucleo{background:var(--tinta);color:var(--papel);border-color:var(--tinta)}
.cartao.nucleo h2,.cartao.nucleo .c-n,.cartao.nucleo .c-perg{color:var(--papel)}
.cartao.nucleo .c-lim{color:rgba(255,255,255,.62)}
.c-movs{margin:4px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:.86rem}
.c-movs li{color:rgba(255,255,255,.86)}
.c-movs b{display:block;font-weight:600}
.c-movs span{color:rgba(255,255,255,.62)}

@media print{
  .folha-cartoes{grid-template-columns:1fr 1fr;gap:0}
  .cartao{
    break-inside:avoid;page-break-inside:avoid;border-radius:0;background:#fff;
    height:138mm;box-sizing:border-box;border:1px dashed #999;min-height:0;
    padding:7mm 7mm 6mm;gap:5px;overflow:hidden;
  }
  /* o cartão é curto por restrição física: tudo encolhe para caber quatro
     numa folha, e o limite continua entrando inteiro. */
  .cartao h2{font-size:.98rem}
  .cartao .c-n{font-size:1.3rem}
  .c-perg{font-size:.94rem}
  .c-sai p,.c-conv p{font-size:.78rem;line-height:1.4}
  .c-lim{font-size:.68rem;line-height:1.38}
  .c-rot{font-size:.54rem}
  .c-conv{padding:6px 8px}
  .c-movs{font-size:.76rem;gap:4px}
  .cartao.nucleo{background:#fff;color:#000;border-color:#000}
  .cartao.nucleo h2,.cartao.nucleo .c-n,.cartao.nucleo .c-perg{color:#000}
  .cartao.nucleo .c-lim,.c-movs li,.c-movs span{color:#444}
  .c-conv{background:transparent;border:1px solid #bbb}
  @page{margin:8mm}
}

/* índice de distinções */
.capa.curta{padding-bottom:24px}
.porta.menor{grid-column:1/-1}
.contexto-autor{font-size:.95rem;color:var(--tinta-2);max-width:var(--medida);margin-top:6px}
.contexto-autor a{color:var(--tinta);text-decoration:none;border-bottom:1px solid var(--linha-forte)}
.contexto-autor a:hover{color:var(--mov);border-color:var(--mov)}
.indice-distincoes{display:flex;flex-direction:column;gap:0;max-width:var(--medida)}
.d-cab{margin-top:26px;padding-bottom:6px}
.d-cab[data-movimento="I"]{--mov:var(--mov-1)}
.d-cab[data-movimento="II"]{--mov:var(--mov-2)}
.d-cab[data-movimento="III"]{--mov:var(--mov-3)}
.d-lista[data-movimento="I"]{--mov:var(--mov-1)}
.d-lista[data-movimento="II"]{--mov:var(--mov-2)}
.d-lista[data-movimento="III"]{--mov:var(--mov-3)}
.d-mod{display:flex;align-items:baseline;gap:12px;text-decoration:none;color:var(--tinta)}
.d-mod:hover .d-t{color:var(--mov)}
.d-n{font-family:"IBM Plex Mono",monospace;font-size:.74rem;color:var(--mov)}
.d-t{font-family:"Source Serif 4",Georgia,serif;font-size:1.06rem}
.d-lista{display:flex;flex-direction:column;border-top:1px solid var(--linha-forte)}
.d-par{padding:12px 0;border-bottom:1px solid var(--linha)}
.d-poles{margin:0 0 3px;font-family:"Source Serif 4",Georgia,serif;font-size:1.08rem;display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
.d-poles b{font-weight:600}
.d-vs{font-family:"IBM Plex Mono",monospace;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--apagado)}
.d-linha{margin:0;color:var(--tinta-2);font-size:.94rem}
.saidas{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
