/* ============================================================
   biblia73 — identidade visual
   Referência: o missal. Papel claro, tinta azul-escura, filete
   dourado e a RUBRICA vermelha (as instruções em vermelho dos
   livros litúrgicos — daí a palavra "rubrica").
   Tipografia: EB Garamond (títulos e rubricas) + Literata
   (texto bíblico e leitura longa, desenhada para tela).
   ============================================================ */

:root{
  --papel:#ffffff;
  --fundo:#f5f6f8;
  --tinta:#1b2333;
  --tinta2:#5d6675;
  --linha:#dfe3ea;

  --azul:#16386e;
  --azul-claro:#e8eef8;
  --ouro:#b4923c;
  --ouro-claro:#f7f1e2;
  --rubrica:#a4241f;
  --verde:#2e6b4f;
  --roxo:#5b3a72;

  --grifo:#fff3bf;
  --grifo-borda:#e5c94f;

  --sombra:0 1px 2px rgba(22,56,110,.06), 0 8px 28px rgba(22,56,110,.07);
  --raio:16px;

  --serif:'Literata', Georgia, 'Times New Roman', serif;  /* mesma família em todo o site */
  --leitura:'Literata', Georgia, 'Times New Roman', serif;
  --texto-biblico:1.22rem;
  --entrelinha:1.85;
}

html[data-tema="escuro"]{
  --papel:#161c28; --fundo:#0f1420; --tinta:#e6e9ef; --tinta2:#9aa4b6;
  --linha:#2a3242; --azul:#8fb3e8; --azul-claro:#1c2537;
  --ouro:#d9b968; --ouro-claro:#272115; --rubrica:#e08a80;
  --verde:#6fbb92; --roxo:#b58fd0;
  --grifo:#4a4526; --grifo-borda:#6f6435;
  --sombra:0 1px 2px rgba(0,0,0,.4), 0 8px 28px rgba(0,0,0,.35);
}
@media (prefers-color-scheme: dark){
  html:not([data-tema]){
    --papel:#161c28; --fundo:#0f1420; --tinta:#e6e9ef; --tinta2:#9aa4b6;
    --linha:#2a3242; --azul:#8fb3e8; --azul-claro:#1c2537;
    --ouro:#d9b968; --ouro-claro:#272115; --rubrica:#e08a80;
    --verde:#6fbb92; --roxo:#b58fd0;
    --grifo:#4a4526; --grifo-borda:#6f6435;
    --sombra:0 1px 2px rgba(0,0,0,.4), 0 8px 28px rgba(0,0,0,.35);
  }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto} *{animation:none !important; transition:none !important}
}
body{
  margin:0; background:var(--fundo); color:var(--tinta);
  font:18px/1.65 var(--leitura);
  padding-bottom:env(safe-area-inset-bottom);
}
#app{max-width:660px; margin:0 auto; padding:0 18px 64px}
.carregando{padding:56px 0; color:var(--tinta2); text-align:center}

/* ---------- acessibilidade: tamanho e contraste do texto ---------- */
html[data-fonte="1"]{--texto-biblico:1.06rem; --escala-ui:.94}
html[data-fonte="2"]{--texto-biblico:1.22rem; --escala-ui:1}
html[data-fonte="3"]{--texto-biblico:1.4rem;  --escala-ui:1.06}
html[data-fonte="4"]{--texto-biblico:1.6rem;  --escala-ui:1.12}
html[data-fonte="5"]{--texto-biblico:1.85rem; --escala-ui:1.2}
html[data-fonte="1"] body{font-size:17px}
html[data-fonte="3"] body{font-size:19px}
html[data-fonte="4"] body{font-size:21px}
html[data-fonte="5"] body{font-size:23px}
html[data-contraste="suave"]{--tinta:#414a5c}
html[data-contraste="suave"][data-tema="escuro"]{--tinta:#b9c0cd}
html[data-contraste="forte"]{--tinta:#000000; --tinta2:#3d4657}
html[data-contraste="forte"][data-tema="escuro"]{--tinta:#ffffff; --tinta2:#c9d1de}

.barra-acess{
  background:var(--papel); border:1px solid var(--linha); border-radius:12px;
  padding:6px 14px; margin:16px 0 6px;
}
.barra-acess .linha{
  display:flex; align-items:center; gap:10px; padding:11px 0;
  border-top:1px solid var(--linha);
}
.barra-acess .linha:first-child{border-top:none}
.barra-acess .rot{flex:1; font-family:var(--serif); font-size:.94rem; font-weight:700;
  color:var(--tinta); display:flex; align-items:center; gap:9px}
.barra-acess .rot .ic{color:var(--ouro)}
.barra-acess .grupo{display:flex; gap:8px}
.barra-acess button{
  min-width:46px; min-height:46px; border:1.5px solid var(--linha); background:var(--fundo);
  border-radius:10px; color:var(--azul); cursor:pointer; display:flex;
  align-items:center; justify-content:center; gap:5px; font-family:var(--serif); font-size:1rem;
}
.barra-acess button:hover{border-color:var(--azul); background:var(--azul-claro)}
.barra-acess button[disabled]{opacity:.4; cursor:default}

/* ---------- busca ---------- */
.busca{position:relative; margin:6px 0 14px}
.busca .ic{position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--tinta2)}
.busca input{width:100%; padding:15px 44px 15px 46px; border:1.5px solid var(--linha);
  border-radius:12px; font-family:var(--leitura); font-size:1.05rem; background:var(--papel);
  color:var(--tinta); min-height:54px}
.busca input:focus{outline:none; border-color:var(--azul); box-shadow:0 0 0 3px var(--azul-claro)}
.busca .limpar{position:absolute; right:8px; top:50%; transform:translateY(-50%);
  background:none; border:none; color:var(--tinta2); cursor:pointer; padding:10px; border-radius:8px}
.resultado-conta{color:var(--tinta2); font-size:.95rem; margin:0 0 12px}

/* filtros: mostram TODOS, em várias linhas */
.filtro-secoes{display:flex; flex-wrap:wrap; gap:8px; overflow:visible; padding:2px 0 14px}
.filtro-secoes button.aqui{border-color:var(--ouro); color:var(--ouro)}

.onde-estou{
  display:flex; align-items:center; gap:12px; background:var(--ouro-claro);
  border:1px solid var(--ouro); border-radius:12px; padding:14px 16px; margin:0 0 16px;
  cursor:pointer;
}
.onde-estou .ic-g{color:var(--ouro)}
.onde-estou b{font-family:var(--serif)}
.onde-estou small{display:block; color:var(--tinta2)}

.ao-topo{
  position:fixed; right:16px; bottom:20px; width:52px; height:52px; border-radius:50%;
  background:var(--azul); color:#fff; border:none; cursor:pointer; display:none;
  align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(0,0,0,.25); z-index:40;
}
html[data-tema="escuro"] .ao-topo{color:#0f1420}
.ao-topo.ver{display:flex}

/* ---------- ícones ---------- */
.ic{width:1.35em; height:1.35em; flex:none; stroke:currentColor; fill:none;
    stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.28em}
.ic-g{width:2.1em; height:2.1em; stroke-width:1.3}

/* ---------- rubrica ---------- */
.rubrica{
  font-family:var(--serif); font-size:.82rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--tinta);
  display:flex; align-items:center; gap:8px; margin:0 0 10px;
}
.rubrica .ic{color:var(--rubrica)}
.rubrica::after{content:''; flex:1; height:1px; background:var(--ouro); opacity:.45}

/* ---------- cabeçalho ---------- */
.topo{display:flex; align-items:center; gap:6px; padding:14px 0 12px;
  margin-bottom:6px; border-bottom:1px solid var(--linha)}
.marca{font-family:var(--serif); font-size:1.22rem; font-weight:700; color:var(--tinta);
  margin:0; flex:1; display:flex; align-items:center; gap:9px}
.marca .ic{color:var(--ouro)}
.topo .icone-botao, .voltar{
  background:none; border:none; color:var(--azul); cursor:pointer; font:inherit;
  font-size:1rem; padding:10px; border-radius:10px; display:flex;
  align-items:center; gap:6px; min-height:44px;
}
.topo .icone-botao:hover, .voltar:hover{background:var(--azul-claro)}
.voltar{font-family:var(--serif); padding-left:0}

:focus-visible{outline:2.5px solid var(--azul); outline-offset:2px; border-radius:6px}

/* ---------- capa ---------- */
.capa{padding:26px 0 8px; text-align:center}
.capa .selo{display:inline-flex; align-items:center; gap:8px; color:var(--tinta2);
  font-family:var(--serif); font-size:.86rem; letter-spacing:.18em;
  text-transform:uppercase; margin-bottom:14px}
h1{font-family:var(--serif); font-weight:600; font-size:2.35rem; line-height:1.12;
  margin:0 0 14px; letter-spacing:-.01em; color:var(--tinta); text-wrap:balance}
h1 em{font-style:normal; color:var(--tinta); display:block}
.linha-fina{width:88px; height:2px; margin:18px auto; border:0;
  background:linear-gradient(90deg,transparent,var(--ouro),transparent)}
.subtitulo{font-size:1.12rem; color:var(--tinta2); margin:0 auto; max-width:34em; line-height:1.6}

/* ---------- cartões ---------- */
.cartao{background:var(--papel); border:1px solid var(--linha); border-radius:var(--raio);
  box-shadow:var(--sombra); padding:22px; margin:0 0 16px}
.cartao h2{font-family:var(--serif); font-size:1.45rem; margin:0 0 10px; font-weight:600; line-height:1.25}
.cartao p{margin:0 0 12px}
.cartao .botao + p{margin-top:18px}
.cartao p:last-child{margin-bottom:0}
.secao{margin:38px 0 0}
.secao > h2{font-family:var(--serif); font-size:1.6rem; margin:0 0 16px; font-weight:600}

/* ---------- botões ---------- */
.botao{
  display:flex; align-items:center; justify-content:center; gap:10px; width:100%;
  min-height:56px; padding:16px 22px; margin:14px 0 0; border:none; border-radius:12px;
  background:var(--azul); color:#fff; font-family:var(--serif); font-size:1.16rem;
  font-weight:600; cursor:pointer; text-decoration:none;
  transition:transform .12s, box-shadow .12s; box-shadow:0 2px 10px rgba(22,56,110,.22);
}
html[data-tema="escuro"] .botao:not(.contorno){color:#0f1420}
.botao:hover{transform:translateY(-1px); box-shadow:0 6px 18px rgba(22,56,110,.28)}
.botao:active{transform:translateY(0)}
.botao.contorno{background:transparent; color:var(--azul); border:1.5px solid var(--azul); box-shadow:none}
html[data-tema="escuro"] .botao.contorno{color:var(--azul); border-color:var(--azul)}
.botao.contorno:hover{background:var(--azul-claro)}
.botao.pequeno{width:auto; min-height:48px; padding:12px 20px; font-size:1rem;
  display:inline-flex; margin:12px 10px 6px 0}
.botao.pequeno + p, .botao.pequeno + .silencio{margin-top:16px}

/* ---------- progresso ---------- */
.progresso{display:flex; align-items:center; gap:14px; margin:16px 0 6px}
.progresso .barra{flex:1; height:10px; background:var(--linha); border-radius:99px; overflow:hidden}
.progresso .barra i{display:block; height:100%; border-radius:99px;
  background:linear-gradient(90deg,var(--verde),var(--azul)); transition:width .5s}
.progresso .pct{font-family:var(--serif); font-size:1.1rem; color:var(--verde); font-weight:600}
.silencio{color:var(--tinta2); font-size:.98rem}
.centro{text-align:center}

/* ---------- ritmos ---------- */
.ritmos{display:flex; gap:10px; margin-top:14px}
.ritmos button{
  flex:1; padding:14px 6px; border:1.5px solid var(--linha); background:var(--papel);
  border-radius:12px; font-family:var(--serif); font-size:1.02rem; color:var(--tinta);
  cursor:pointer; min-height:58px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:3px; line-height:1.2;
}
.ritmos button{font-size:1.24rem; font-weight:700}
.ritmos button small{color:var(--tinta2); font-size:.82rem; font-weight:400;
  font-family:var(--leitura); letter-spacing:0}
.ritmos button.ativo{border-color:var(--azul); background:var(--azul-claro); color:var(--azul); font-weight:600}
.ritmos button.ativo small{color:var(--azul)}

/* ---------- passos e recursos ---------- */
.passo{display:flex; gap:16px; padding:14px 0; align-items:flex-start}
.passo .num{flex:none; width:38px; height:38px; border-radius:50%; border:1.5px solid var(--ouro);
  color:var(--ouro); font-family:var(--serif); font-size:1.15rem; font-weight:600;
  display:flex; align-items:center; justify-content:center}
.passo h3{font-family:var(--serif); font-size:1.18rem; margin:6px 0 4px; font-weight:600}
.passo p{margin:0; color:var(--tinta2); font-size:1rem}

.recursos{display:grid; grid-template-columns:1fr; gap:12px}
.recurso{display:flex; gap:14px; align-items:flex-start; padding:16px;
  background:var(--papel); border:1px solid var(--linha); border-radius:14px}
.recurso .ic-g{color:var(--azul); margin-top:2px}
.recurso:nth-child(2) .ic-g{color:var(--rubrica)}
.recurso:nth-child(3) .ic-g{color:var(--ouro)}
.recurso:nth-child(4) .ic-g{color:var(--verde)}
.recurso:nth-child(5) .ic-g{color:var(--roxo)}
.recurso h3{font-family:var(--serif); font-size:1.14rem; margin:0 0 4px; font-weight:600}
.recurso p{margin:0; color:var(--tinta2); font-size:1rem; line-height:1.55}

.atalhos{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:8px}
.atalho{display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center;
  padding:20px 12px; background:var(--papel); border:1px solid var(--linha);
  border-radius:14px; cursor:pointer; font-family:var(--serif); font-size:1.06rem;
  font-weight:700; color:var(--tinta); min-height:106px; justify-content:center}
.atalho .ic-g{color:var(--azul)}
.atalho:nth-child(2) .ic-g{color:var(--ouro)}
.atalho:nth-child(3) .ic-g{color:var(--verde)}
.atalho:nth-child(4) .ic-g{color:var(--roxo)}
.atalho:hover{border-color:var(--azul); background:var(--azul-claro)}

.citacao{border-left:3px solid var(--ouro); padding:6px 0 6px 18px; margin:22px 0;
  font-family:var(--serif); font-size:1.24rem; line-height:1.5; font-style:italic}
.citacao cite{display:block; font-style:normal; font-size:.86rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--tinta2); margin-top:8px}

/* ---------- leitura ---------- */
.leitura-cab{padding:18px 0 4px}
.leitura-cab h2{font-family:var(--serif); font-size:1.72rem; line-height:1.2; margin:4px 0 8px; font-weight:600}
.leitura-cab .refs{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px}
.leitura-cab .refs span{font-size:.92rem; background:var(--azul-claro); color:var(--azul);
  padding:5px 11px; border-radius:99px}
.comentario{background:var(--ouro-claro); border-radius:14px; padding:20px 22px;
  margin:18px 0 26px; font-size:1.08rem; line-height:1.72}
.comentario .rubrica{margin-bottom:8px}

.bloco-cap{margin:30px 0}
.bloco-cap h3{font-family:var(--serif); font-size:1.28rem; color:var(--tinta); font-weight:700;
  margin:0 0 6px; display:flex; align-items:center; gap:9px}
.bloco-cap h3 .ic{color:var(--ouro)}
.bloco-cap .regua{height:1px; background:var(--linha); margin:0 0 16px}
.texto{font-size:var(--texto-biblico); line-height:var(--entrelinha)}
.v{cursor:pointer; border-radius:5px; padding:2px 3px; transition:background .15s}
.v .n{color:var(--ouro); font-size:.68em; vertical-align:super; margin-right:4px;
  user-select:none; font-family:var(--serif); font-weight:600}
.v.grifado{background:var(--grifo); box-shadow:inset 0 -2px 0 var(--grifo-borda)}

.marcar{margin:18px 0 0; padding-top:16px; border-top:1px solid var(--linha)}
.marcar button{width:100%; min-height:54px; padding:14px; border:1.5px solid var(--linha);
  background:var(--papel); border-radius:12px; font-family:var(--serif); font-size:1.05rem;
  color:var(--tinta); cursor:pointer; display:flex; align-items:center; justify-content:center; gap:10px}
.marcar button:hover{border-color:var(--verde)}
.marcar button.feito{border-color:var(--verde); background:rgba(46,107,79,.08);
  color:var(--verde); font-weight:600}

.deutero{background:var(--papel); border:1px solid var(--ouro); border-radius:14px;
  padding:20px; margin:22px 0}
.deutero .rubrica{color:var(--ouro)}
.deutero a{color:var(--azul); font-weight:600; text-decoration:none;
  display:inline-flex; align-items:center; gap:8px}
.deutero a:hover{text-decoration:underline}

.aviso-flutuante{position:fixed; left:50%; bottom:22px; transform:translateX(-50%) translateY(8px);
  background:var(--azul); color:#fff; padding:13px 22px; border-radius:99px;
  font-family:var(--serif); font-size:1rem; opacity:0; pointer-events:none;
  transition:opacity .3s, transform .3s; z-index:50; box-shadow:0 6px 20px rgba(0,0,0,.2);
  display:flex; align-items:center; gap:9px; max-width:90vw}
html[data-tema="escuro"] .aviso-flutuante{color:#0f1420}
.aviso-flutuante.ver{opacity:1; transform:translateX(-50%) translateY(0)}

.concluir{
  background:var(--azul-claro); border:1.5px solid var(--azul); border-radius:14px;
  padding:20px 22px; margin:26px 0;
}
.concluir .rubrica .ic{color:var(--verde)}
.concluir p{margin:0 0 6px}
.estudo-item .abrir{color:var(--tinta2); align-self:center}
.estudo-item:hover .abrir{color:var(--azul)}

/* ---------- lista de estudos ---------- */
.filtro-secoes button{white-space:nowrap; border:1.5px solid var(--linha); background:var(--papel);
  color:var(--tinta2); border-radius:99px; padding:10px 16px; font-family:var(--serif);
  font-size:.98rem; cursor:pointer; min-height:44px}
.filtro-secoes button.ativo{border-color:var(--azul); background:var(--azul-claro);
  color:var(--azul); font-weight:600}

.lista-estudos{display:flex; flex-direction:column; gap:10px}
.estudo-item{background:var(--papel); border:1px solid var(--linha);
  border-left:4px solid var(--azul); border-radius:12px; padding:15px 16px;
  display:flex; gap:14px; align-items:flex-start; cursor:pointer; min-height:64px}
.estudo-item:hover{border-color:var(--azul)}
.estudo-item .num{font-family:var(--serif); color:var(--tinta2); font-size:1.02rem;
  min-width:2.6em; padding-top:1px}
.estudo-item .tit{flex:1; font-family:var(--serif); font-size:1.14rem; line-height:1.3}
.estudo-item .leituras{display:block; color:var(--tinta2); font-size:.92rem;
  margin-top:4px; font-family:var(--leitura); line-height:1.45}
.estudo-item .marca-lido{color:var(--verde)}
.estudo-item.lido{opacity:.68}
.estudo-item[data-cor="lei"]{border-left-color:var(--azul)}
.estudo-item[data-cor="sabedoria"]{border-left-color:var(--ouro)}
.estudo-item[data-cor="profetas"]{border-left-color:var(--roxo)}
.estudo-item[data-cor="evangelho"]{border-left-color:var(--rubrica)}
.estudo-item[data-cor="igreja"]{border-left-color:var(--verde)}
.estudo-item.atual{border-color:var(--ouro); background:var(--ouro-claro)}

.tambem{display:flex; gap:10px; align-items:flex-start; background:var(--ouro-claro);
  border-radius:12px; padding:12px 14px; margin:0 0 16px; font-size:.96rem; line-height:1.55}
.tambem .ic{color:var(--ouro); margin-top:3px}

.versiculos-achados{display:flex; flex-direction:column; gap:12px}
.v-achado{background:var(--papel); border:1px solid var(--linha); border-left:4px solid var(--ouro);
  border-radius:12px; padding:16px}
.v-ref{font-family:var(--serif); font-weight:700; margin-bottom:6px;
  display:flex; align-items:center; gap:8px}
.v-ref .ic{color:var(--ouro)}
.v-txt{margin:0; font-size:1.06rem; line-height:1.7}
.v-txt mark{background:var(--grifo); color:inherit; padding:1px 2px; border-radius:4px}
.v-ir{margin-top:12px; border:1.5px solid var(--azul); background:transparent; color:var(--azul);
  border-radius:10px; padding:10px 15px; min-height:44px; cursor:pointer;
  font-family:var(--serif); font-size:.98rem; display:flex; align-items:center; gap:8px}
.v-ir:hover{background:var(--azul-claro)}

/* ---------- caderno ---------- */
.grifo-item{background:var(--papel); border:1px solid var(--linha); border-radius:14px;
  padding:18px; margin:0 0 12px; border-top:3px solid var(--grifo-borda)}
.grifo-item .ref{font-family:var(--serif); color:var(--tinta); font-size:1.05rem;
  font-weight:600; margin-bottom:8px; display:flex; align-items:center; gap:8px}
.grifo-item .trecho{font-size:1.08rem; line-height:1.65}
.grifo-item .nota{margin-top:12px; padding:12px 14px; background:var(--ouro-claro);
  border-radius:10px; color:var(--tinta); font-size:1rem; display:flex; gap:10px; align-items:flex-start}
.grifo-item .nota .ic{color:var(--ouro); margin-top:3px}
.grifo-item .acoes{margin-top:12px; display:flex; gap:8px}
.grifo-item .acoes button{background:none; border:1px solid var(--linha); border-radius:10px;
  color:var(--azul); font-family:var(--serif); font-size:.98rem; cursor:pointer;
  padding:9px 14px; min-height:44px; display:flex; align-items:center; gap:7px}
.grifo-item .acoes button:hover{border-color:var(--azul); background:var(--azul-claro)}

.vazio{text-align:center; padding:34px 20px}
.vazio .ic-g{color:var(--ouro); width:3.2em; height:3.2em}
.vazio h2{font-family:var(--serif); font-size:1.4rem; margin:14px 0 8px}

/* ---------- chave ---------- */
.chave-caixa{font-family:var(--serif); font-size:1.85rem; font-weight:600;
  letter-spacing:.08em; text-align:center; background:var(--azul-claro); color:var(--azul);
  border-radius:14px; padding:20px; margin:14px 0; user-select:all}
.qr-caixa{background:#fff; border-radius:14px; padding:16px; margin:16px auto 6px;
  width:fit-content; box-shadow:var(--sombra)}
.qr-caixa canvas{display:block; width:min(240px,64vw); height:auto; image-rendering:pixelated}
.qr-legenda{text-align:center}
.campo{width:100%; padding:15px; border:1.5px solid var(--linha); border-radius:12px;
  font-family:var(--leitura); font-size:1.05rem; background:var(--fundo); color:var(--tinta);
  margin:10px 0 0; min-height:54px}
.campo:focus{outline:none; border-color:var(--azul); box-shadow:0 0 0 3px var(--azul-claro)}
.estado-sync{font-size:.95rem; color:var(--tinta2); display:flex; align-items:center;
  gap:8px; margin-top:14px}
.estado-sync.ok{color:var(--verde)}

.nav-trecho{display:flex; gap:10px; margin-top:10px}
.nav-trecho button{
  flex:1; min-height:50px; border:1.5px solid var(--linha); background:var(--papel);
  border-radius:12px; color:var(--tinta); font-family:var(--serif); font-size:1rem;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
}
.nav-trecho button:hover:not([disabled]){border-color:var(--azul); background:var(--azul-claro)}
.nav-trecho button[disabled]{opacity:.4; cursor:default}
.nav-trecho button:first-child .ic{transform:scaleX(-1)}

.pulados .pulado-item{
  display:flex; align-items:center; gap:12px; padding:12px 0;
  border-top:1px solid var(--linha); font-family:var(--serif);
}
.pulados .pulado-item span{flex:1; font-weight:700}
.pulados .pulado-item button{
  border:1.5px solid var(--azul); background:transparent; color:var(--azul);
  border-radius:10px; padding:10px 14px; min-height:44px; cursor:pointer;
  font-family:var(--serif); font-size:.98rem; display:flex; align-items:center; gap:7px;
}
.pulados .pulado-item button:hover{background:var(--azul-claro)}

.editor{margin-top:12px}
.editor .nota-campo{min-height:110px; resize:vertical; line-height:1.6}
.editor-rodape{display:flex; align-items:center; gap:12px; margin-top:8px}
.editor-rodape .salvo-aviso{flex:1; color:var(--verde); font-size:.92rem; opacity:0; transition:opacity .2s}
.editor-rodape .salvo-aviso.ver{opacity:1}
.editor-rodape .botao{margin:0}

.recado{
  display:flex; gap:12px; align-items:flex-start; margin:26px 0 0; padding:14px 16px;
  background:var(--fundo); border-radius:12px; color:var(--tinta2); font-size:.98rem; line-height:1.6;
}
.recado .ic{color:var(--rubrica); margin-top:3px}
.recado b{color:var(--tinta)}

.logo{height:34px; width:auto; display:block}

.acoes-caderno{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px}
.acoes-caderno .botao{margin:0}

/* ---------- rodapé ---------- */
.rodape{color:var(--tinta2); font-size:.92rem; line-height:1.65; text-align:center;
  margin-top:44px; padding-top:22px; border-top:1px solid var(--linha)}
.rodape .cruz{color:var(--ouro); margin-bottom:10px; display:block}
.rodape a{color:var(--azul)}

/* ============================================================ */
@media (min-width:720px){
  body{font-size:19px}
  #app{max-width:780px; padding:0 32px 80px}
  :root{--texto-biblico:1.26rem}
  h1{font-size:3rem}
  .recursos{grid-template-columns:1fr 1fr}
  .atalhos{grid-template-columns:repeat(4,1fr)}
  .lista-estudos{display:grid; grid-template-columns:1fr 1fr}
  .botao{width:auto; display:inline-flex; padding:16px 34px}
  .capa{padding:44px 0 12px}
}
@media (min-width:1080px){
  #app{max-width:820px}
  :root{--texto-biblico:1.3rem; --entrelinha:1.9}
  h1{font-size:3.3rem}
  .cartao{padding:28px 32px}
  .v:hover{background:var(--grifo); opacity:.75}
}
@media print{
  .topo,.marcar,.botao,.filtro-secoes,.atalhos{display:none}
  body{background:#fff; color:#000; font-size:12pt}
  .comentario{background:none; border-left:2px solid #999}
}