body { font-family: 'DM Sans', sans-serif; }
.controls { font-family: 'DM Sans', sans-serif; }
.book-row:hover { background: var(--fundo-suave); cursor:pointer; }
.book-row.selected { background: rgba(255,146,0,.14); }
.timeline-item::before { content:''; position:absolute; left:0; top:8px; width:12px; height:12px; border-radius:50%; background:#d6d3d1; border:2px solid var(--acento); }
.timeline-item.active::before { background: var(--laranja); border-color: var(--laranja); }
.timeline-line { position:absolute; left:5px; top:20px; bottom:0; width:2px; background:#d6d3d1; }
.detail-panel { max-height:0; overflow:hidden; transition: max-height 0.3s ease; }
.detail-panel.open { max-height:500px; }
.year-axis { position:relative; height:40px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:flex-end; }
.year-label { font-size:11px; color:#ffffff; font-weight:700; white-space:nowrap; letter-spacing:0.5px; }
.timeline-scroll { max-height: 300px; overflow-y:auto; scroll-behavior:smooth; }
.sumario-item { border-left: 3px solid var(--acento); padding-left: 12px; margin-bottom: 8px; }
.copy-toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:#16a34a; color:#fff; padding:8px 20px; border-radius:8px; font-size:14px; z-index:999; opacity:0; transition:opacity 0.3s; pointer-events:none; }
.copy-toast.show { opacity:1; }
.christ-badge { background: var(--laranja); color:#171717; font-size:11px; padding:2px 8px; border-radius:12px; font-weight:700; display:inline-flex; align-items:center; gap:4px; }
.tipo-cristo { border-left: 3px solid var(--laranja); background: var(--fundo-suave); }
.conn-link {
  cursor:pointer; text-decoration:underline; color: var(--acento); font-weight:600;
  display:inline-block; transition: transform .18s ease, color .18s ease, text-shadow .18s ease;
}
.conn-link:hover { color: var(--laranja); transform: translateY(-2px); text-shadow: 0 2px 10px rgba(255,146,0,.55); }
.geo-tag { display:inline-flex; align-items:center; gap:4px; background:#ecfdf5; border:1px solid #6ee7b7; border-radius:9999px; padding:2px 10px; font-size:12px; color:#065f46; }

/* Leitor da Bíblia */
.verse { padding:4px 6px; border-radius:6px; cursor:pointer; transition:background 0.15s; }
.verse:hover { background: var(--fundo-suave); }
.verse-num { color: var(--acento); font-weight:700; font-size:0.75em; vertical-align:super; margin-right:4px; font-family:'DM Sans',sans-serif; }

/* Cartões de estudo */
.est-card { border:1px solid var(--borda); border-left:4px solid var(--laranja); background: var(--fundo-cartao); border-radius:12px; padding:12px 14px; cursor:pointer; transition:box-shadow 0.15s, transform .2s; }
.est-card:hover { box-shadow:0 6px 18px rgba(255,146,0,.16); transform: translateY(-2px); }
.est-badge { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; padding:2px 8px; border-radius:9999px; }
.est-badge.estudo { background:#dbeafe; color:#1e40af; }
.est-badge.pregacao { background: rgba(255,146,0,.15); color: var(--acento); }
.est-badge.devocional { background:#dcfce7; color:#166534; }

/* ---- Anotações e navegação por versículo ---- */
.ref-link {
  color: var(--acento);
  text-decoration: underline;
  text-decoration-color: var(--laranja);
  text-underline-offset: 2px;
  cursor: pointer;
  font-weight: 600;
}
.ref-link { transition: background-color .18s ease, text-shadow .18s ease; }
.ref-link:hover { background: var(--fundo-suave); border-radius: 3px; text-shadow: 0 1px 8px rgba(255,146,0,.4); }

.verse-noted { border-left: 3px solid var(--laranja); padding-left: 8px; background: var(--fundo-suave); }
.note-flag { font-size: 12px; opacity: .8; }

.busca-destaque {
  background: var(--laranja); color: #171717; padding: 0 2px; border-radius: 3px; font-weight: 700;
}

.verse-target {
  animation: verse-flash 3.5s ease-out;
}
@keyframes verse-flash {
  0%   { background: rgba(255,146,0,.35); }
  60%  { background: rgba(255,146,0,.16); }
  100% { background: transparent; }
}

/* ============================================================
   IDENTIDADE OFICINA MINISTERIAL — grafite + laranja, DM Sans
   Paleta espelhada de https://oficina-ministerial.web.app/
   ============================================================ */
:root {
  --fundo-pagina: #f5f4f2;
  --fundo-painel: #ffffff;
  --fundo-cartao: #ffffff;
  --fundo-suave: #f0efec;
  --texto: #17140f;
  --texto-suave: #6b6560;
  --titulo: var(--texto);
  --acento: #b8600a;      /* laranja com contraste em texto/borda sobre fundo claro */
  --laranja: #ff9200;     /* laranja puro da marca — só em preenchimentos sólidos */
  --laranja-hover: #ffa426;
  --borda: rgba(23, 20, 15, .12);
  --header-bg: rgba(22, 22, 22, 0.92);
  --header-texto: #ffffff;
  --fundo-painel-transl: rgba(255, 255, 255, .88);
  --linha-grade: rgba(23, 20, 15, .035);
}
html[data-theme="escuro"] {
  --fundo-pagina: #161616;
  --fundo-painel: #222222;
  --fundo-cartao: #2b2b2b;
  --fundo-suave: #2b2b2b;
  --texto: #f2f0ed;
  --texto-suave: #b3b0ac;
  --titulo: var(--texto);
  --acento: #ff9200;      /* no escuro o laranja puro já tem contraste de sobra */
  --laranja: #ff9200;
  --laranja-hover: #ffa426;
  --borda: rgba(255, 255, 255, .14);
  --header-bg: rgba(22, 22, 22, 0.92);
  --header-texto: #ffffff;
  --fundo-painel-transl: rgba(34, 34, 34, .88);
  --linha-grade: rgba(255, 255, 255, .025);
}
/* Laranja da marca, o mesmo nos dois temas, em toda superfície de destaque
   (botões principais, setas do leitor) — texto escuro por cima, igual ao
   botão sólido do portal. */
.bg-amber-700 { background-color: var(--laranja) !important; color: #171717 !important; }
.bg-amber-800, .bg-amber-900 { background-color: var(--fundo-cartao) !important; }
.hover\:bg-amber-800:hover, .hover\:bg-amber-900:hover { background-color: var(--laranja-hover) !important; }
.border-amber-700 { border-color: var(--laranja) !important; }

/* Grade de pontos bem sutil no fundo, igual ao portal */
body {
  background-color: var(--fundo-pagina); color: var(--texto);
  background-image:
    linear-gradient(var(--linha-grade) 1px, transparent 1px),
    linear-gradient(90deg, var(--linha-grade) 1px, transparent 1px);
  background-size: 44px 44px;
}
.painel { background: var(--fundo-painel); }
.painel, .rounded-xl { border-radius: 16px; }
.titulo-painel { color: var(--titulo); }
.titulo-header { color: var(--header-texto); font-weight: 700; font-size: clamp(17px, 4.5vw, 26px); }
.logo-header { width: 34px; height: 34px; border-radius: 9px; object-fit: cover; flex-shrink: 0; box-shadow: 0 1px 4px rgba(0,0,0,.35); }
header { background: var(--header-bg) !important; border-color: var(--borda) !important; }

/* ------------------------------------------------------------
   TELA DE ABERTURA — saudação rápida ao abrir o app, some sozinha
   e revela a Bíblia já aberta na última leitura.
   ------------------------------------------------------------ */
#splash {
  position: fixed; inset: 0; z-index: 100;
  display: flex; align-items: center; justify-content: center;
  background: #161616;
  background-image: radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: 26px 26px;
  transition: opacity .5s ease, visibility .5s ease;
}
#splash.splash-oculto { opacity: 0; visibility: hidden; pointer-events: none; }
.splash-conteudo { text-align: center; padding: 0 28px; }
.splash-logo {
  width: 88px; height: 88px; object-fit: cover; object-position: 0% center;
  border-radius: 22px; margin: 0 auto 22px;
  box-shadow: 0 0 46px rgba(255,146,0,.3);
  animation: splash-logo-surge .6s cubic-bezier(.22,.75,.3,1) both;
}
.splash-titulo { font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 1.7rem; color: #ffffff; letter-spacing: -.01em; margin-bottom: 10px; }
.splash-saudacao {
  font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: .95rem; color: var(--laranja); margin-bottom: 22px;
  opacity: 0; animation: splash-linha-surge .6s ease .95s both;
}
.splash-portal {
  font-family: 'DM Sans', sans-serif; font-size: .8rem; color: #9a9a9a;
  opacity: 0; animation: splash-linha-surge .6s ease 1.35s both;
}
.splash-portal span { color: #ffffff; font-weight: 600; }
/* Letras do título escritas uma a uma — cada letra vira um <span>
   (ver iniciarSplash em app.js) com o delay calculado em JS. */
.splash-titulo .letra-escrita {
  display: inline-block;
  opacity: 0;
  filter: blur(3px);
  transform: translateY(8px);
  animation: splash-letra-surge .5s ease forwards;
}
@keyframes splash-logo-surge {
  from { opacity: 0; transform: scale(.82); }
  to { opacity: 1; transform: none; }
}
@keyframes splash-linha-surge {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}
@keyframes splash-letra-surge {
  to { opacity: 1; filter: blur(0); transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  #splash { transition: none; }
  .splash-logo, .splash-saudacao, .splash-portal, .splash-titulo .letra-escrita { animation: none; opacity: 1; filter: none; transform: none; }
}

/* Superfícies "âmbar" (cor de marca antiga) viram o laranja novo nos dois
   temas — não é mais algo que só se ajusta no escuro. */
.bg-amber-50, .bg-amber-50\/50 { background-color: var(--fundo-suave) !important; }
.bg-amber-100 { background-color: rgba(255,146,0,.14) !important; }
.hover\:bg-amber-200:hover, .hover\:bg-amber-50:hover { background-color: rgba(255,146,0,.22) !important; }
.text-amber-900, .text-amber-800 { color: var(--titulo) !important; }
.text-amber-700 { color: var(--acento) !important; }
[class*="border-amber-"] { border-color: var(--borda) !important; }

/* Superfícies e textos comuns no tema escuro (famílias não relacionadas à marca) */
html[data-theme="escuro"] .bg-white { background-color: var(--fundo-cartao) !important; }
html[data-theme="escuro"] .bg-green-50, html[data-theme="escuro"] .bg-blue-50,
html[data-theme="escuro"] .bg-yellow-50 { background-color: var(--fundo-suave) !important; }
html[data-theme="escuro"] .bg-gray-50 { background-color: var(--fundo-suave) !important; }
html[data-theme="escuro"] .bg-gray-200 { background-color: #333333 !important; }
html[data-theme="escuro"] .hover\:bg-gray-300:hover { background-color: #3d3d3d !important; }
html[data-theme="escuro"] [class*="text-gray-"], html[data-theme="escuro"] [class*="text-stone-"] { color: var(--texto-suave) !important; }
html[data-theme="escuro"] [class*="border-gray-"] { border-color: var(--borda) !important; }

/* ------------------------------------------------------------
   Caixas e selos coloridos (Termos, Referências Cruzadas, Panorama,
   badges de Estudos/Personagens) — cada família Tailwind usada no
   app ganha um fundo em vidro fosco (cor translúcida + desfoque),
   em vez de um bloco sólido, pra seguir o mesmo padrão do resto do
   app (cartões, pergaminho, barra flutuante). A cor de cada família
   ainda identifica o significado, só que como um tom sutil.
   ------------------------------------------------------------ */
html[data-theme="escuro"] [class*="bg-"][class*="-50"],
html[data-theme="escuro"] [class*="bg-"][class*="-100"] {
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
html[data-theme="escuro"] .bg-blue-50  { background-color: rgba(59,130,246,.14) !important; color: #93c5fd !important; }
html[data-theme="escuro"] .bg-blue-100 { background-color: rgba(59,130,246,.22) !important; color: #bfdbfe !important; }
html[data-theme="escuro"] .text-blue-800, html[data-theme="escuro"] .text-blue-900 { color: #93c5fd !important; }
html[data-theme="escuro"] [class*="border-blue-"] { border-color: rgba(59,130,246,.35) !important; }

html[data-theme="escuro"] .bg-green-50  { background-color: rgba(34,197,94,.14) !important; color: #86efac !important; }
html[data-theme="escuro"] .bg-green-100 { background-color: rgba(34,197,94,.22) !important; color: #bbf7d0 !important; }
html[data-theme="escuro"] .text-green-800, html[data-theme="escuro"] .text-green-900 { color: #86efac !important; }
html[data-theme="escuro"] [class*="border-green-"] { border-color: rgba(34,197,94,.35) !important; }

html[data-theme="escuro"] .bg-red-50  { background-color: rgba(239,68,68,.14) !important; color: #fca5a5 !important; }
html[data-theme="escuro"] .bg-red-100 { background-color: rgba(239,68,68,.22) !important; color: #fecaca !important; }
html[data-theme="escuro"] .text-red-700, html[data-theme="escuro"] .text-red-800 { color: #fca5a5 !important; }
html[data-theme="escuro"] [class*="border-red-"] { border-color: rgba(239,68,68,.35) !important; }

html[data-theme="escuro"] .bg-indigo-50 { background-color: rgba(99,102,241,.16) !important; color: #a5b4fc !important; }
html[data-theme="escuro"] .text-indigo-900, html[data-theme="escuro"] .text-indigo-700 { color: #a5b4fc !important; }
html[data-theme="escuro"] [class*="border-indigo-"] { border-color: rgba(99,102,241,.35) !important; }

html[data-theme="escuro"] .bg-yellow-50 { background-color: rgba(234,179,8,.14) !important; color: #fde68a !important; }
html[data-theme="escuro"] [class*="border-yellow-"] { border-color: rgba(234,179,8,.35) !important; }

/* Famílias usadas só nos selos de "tipo de conexão" das Referências Cruzadas */
html[data-theme="escuro"] .bg-purple-50   { background-color: rgba(168,85,247,.16) !important; color: #d8b4fe !important; }
html[data-theme="escuro"] [class*="border-purple-"]   { border-color: rgba(168,85,247,.35) !important; }
html[data-theme="escuro"] .bg-pink-50     { background-color: rgba(236,72,153,.16) !important; color: #f9a8d4 !important; }
html[data-theme="escuro"] [class*="border-pink-"]     { border-color: rgba(236,72,153,.35) !important; }
html[data-theme="escuro"] .bg-orange-50   { background-color: rgba(249,115,22,.16) !important; color: #fdba74 !important; }
html[data-theme="escuro"] [class*="border-orange-"]   { border-color: rgba(249,115,22,.35) !important; }
html[data-theme="escuro"] .bg-emerald-50  { background-color: rgba(16,185,129,.16) !important; color: #6ee7b7 !important; }
html[data-theme="escuro"] [class*="border-emerald-"]  { border-color: rgba(16,185,129,.35) !important; }
html[data-theme="escuro"] .bg-cyan-50     { background-color: rgba(6,182,212,.16) !important; color: #67e8f9 !important; }
html[data-theme="escuro"] [class*="border-cyan-"]     { border-color: rgba(6,182,212,.35) !important; }
html[data-theme="escuro"] .bg-violet-50   { background-color: rgba(139,92,246,.16) !important; color: #c4b5fd !important; }
html[data-theme="escuro"] [class*="border-violet-"]   { border-color: rgba(139,92,246,.35) !important; }
html[data-theme="escuro"] .bg-fuchsia-50  { background-color: rgba(217,70,239,.16) !important; color: #f0abfc !important; }
html[data-theme="escuro"] [class*="border-fuchsia-"]  { border-color: rgba(217,70,239,.35) !important; }
html[data-theme="escuro"] .bg-sky-50      { background-color: rgba(14,165,233,.16) !important; color: #7dd3fc !important; }
html[data-theme="escuro"] [class*="border-sky-"]      { border-color: rgba(14,165,233,.35) !important; }
html[data-theme="escuro"] .bg-slate-50    { background-color: rgba(100,116,139,.18) !important; color: #cbd5e1 !important; }
html[data-theme="escuro"] [class*="border-slate-"]    { border-color: rgba(100,116,139,.4) !important; }
html[data-theme="escuro"] .bg-stone-50    { background-color: rgba(120,113,108,.18) !important; color: #d6d3d1 !important; }
html[data-theme="escuro"] [class*="border-stone-"]    { border-color: rgba(120,113,108,.4) !important; }
html[data-theme="escuro"] .bg-lime-50     { background-color: rgba(132,204,22,.16) !important; color: #bef264 !important; }
html[data-theme="escuro"] [class*="border-lime-"]     { border-color: rgba(132,204,22,.35) !important; }
html[data-theme="escuro"] .bg-rose-50     { background-color: rgba(244,63,94,.16) !important; color: #fda4af !important; }
html[data-theme="escuro"] [class*="border-rose-"]     { border-color: rgba(244,63,94,.35) !important; }

html[data-theme="escuro"] input, html[data-theme="escuro"] select, html[data-theme="escuro"] textarea,
html[data-theme="escuro"] .editor-area { background: var(--fundo-cartao) !important; color: var(--texto) !important; border-color: var(--borda) !important; }
html[data-theme="escuro"] .est-card { background: var(--fundo-cartao); border-color: var(--borda); border-left-color: var(--laranja); }
html[data-theme="escuro"] .timeline-item.active { background: rgba(255,146,0,.14); }
html[data-theme="escuro"] .geo-tag { background: #16301f; color: #86efac; }

/* ============================================================
   VERSÍCULO DO DIA — cartão translúcido, acompanha o tema
   ============================================================ */
.pergaminho {
  position: relative;
  background: var(--fundo-painel-transl);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid var(--borda);
  border-radius: 16px;
  padding: 30px 26px 26px;
  box-shadow: 0 6px 22px rgba(0,0,0,.1);
}
html[data-theme="escuro"] .pergaminho { box-shadow: 0 6px 22px rgba(0,0,0,.4); }
.perg-titulo { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--acento); font-weight: 700; margin-bottom: 4px; text-align: center; }
.perg-titulo::after {
  content: ''; display: block; width: 56px; height: 2px; margin: 12px auto 0;
  background: linear-gradient(90deg, transparent, var(--acento), transparent); opacity: .55; border-radius: 2px;
}
.perg-texto { font-family: 'Source Serif Pro', serif; font-size: 20px; font-style: italic; line-height: 1.6; color: var(--texto); text-align: center; }
.perg-ref { margin-top: 14px; font-weight: 700; font-size: 13px; color: var(--acento); text-align: center; }
.perg-ref .ref-link { color: var(--acento); }

/* Navegação de capítulo flutuante, fixa na parte de baixo da tela.
   bottom soma a área segura do aparelho (barra de gestos do Android/iOS)
   pra nunca ficar escondida atrás dela. */
.leitor-bar {
  position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 25;
  display: flex; align-items: center; gap: 8px;
  padding: 7px 8px;
  background: var(--fundo-painel-transl);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--borda);
  border-radius: 9999px;
  box-shadow: 0 6px 20px rgba(0,0,0,.25);
  width: max-content;
  max-width: calc(100vw - 24px);
  transition: transform .12s linear;
}
.leitor-bar-titulo {
  font-weight: 700; color: var(--titulo); font-size: 13.5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: calc(100vw - 130px);
  background: none; border: none; padding: 4px 6px; cursor: pointer; border-radius: 8px;
}
.leitor-bar-titulo:hover { background: var(--fundo-suave); }
.leitor-bar-seta {
  width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0; border: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--laranja); color: #171717; font-size: 12px; font-weight: 700;
}
.leitor-bar-seta:hover { background: var(--laranja-hover); }

/* Botões flutuantes de retorno — só o ícone, discretos */
.voltar-flutuante {
  position: fixed; right: 16px; bottom: calc(70px + env(safe-area-inset-bottom, 0px)); z-index: 26;
  width: 38px; height: 38px; border-radius: 50%; padding: 0;
  display: flex; align-items: center; justify-content: center;
  background: #1d4ed8; color: #fff; border: none; font-size: 16px; font-weight: 700;
  box-shadow: 0 4px 14px rgba(0,0,0,.3);
}
.voltar-flutuante-2 { bottom: calc(118px + env(safe-area-inset-bottom, 0px)); }
html[data-theme="escuro"] .voltar-flutuante { background: #2563eb; }

/* Caixinha de prévia de referência (toque num link dentro de estudos/anotações) */
.ref-preview {
  display: block; margin: 6px 0 10px; padding: 10px 12px;
  background: var(--fundo-suave); border: 1px solid var(--borda); border-radius: 10px;
  font-size: 13.5px;
}
.ref-preview-ref { font-weight: 700; color: var(--titulo); margin-bottom: 4px; }
.ref-preview-texto { color: var(--texto-suave); font-style: italic; line-height: 1.5; margin-bottom: 8px; }
.ref-preview-acoes { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.ref-preview-ir { background: var(--laranja); color: #171717; border: none; padding: 6px 12px; border-radius: 8px; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.ref-preview-fechar { background: none; border: none; color: var(--texto-suave); font-size: 20px; line-height: 1; cursor: pointer; padding: 0 4px; }

/* Editor de texto rico */
.editor-toolbar { display: flex; flex-wrap: wrap; gap: 4px; border: 1px solid var(--borda); border-bottom: none; border-radius: 8px 8px 0 0; padding: 6px; background: var(--fundo-suave); }
.editor-toolbar button { min-width: 34px; padding: 5px 8px; border-radius: 6px; font-size: 13px; font-weight: 700; color: var(--titulo); }
.editor-toolbar button:hover { background: rgba(255,146,0,.18); }
.editor-area { min-height: 300px; border: 1px solid var(--borda); border-radius: 0 0 8px 8px; padding: 12px; font-family: 'DM Sans', sans-serif; font-size: 16px; line-height: 1.7; outline: none; background: var(--fundo-cartao); color: var(--texto); overflow-y: auto; }
.editor-area:focus { box-shadow: 0 0 0 2px rgba(255,146,0,.4); }
.editor-area ul { list-style: disc; padding-left: 22px; }
.editor-area ol { list-style: decimal; padding-left: 22px; }
#lt-conteudo ul { list-style: disc; padding-left: 22px; }
#lt-conteudo ol { list-style: decimal; padding-left: 22px; }
.editor-area:empty::before { content: attr(data-placeholder); color: #9ca3af; pointer-events: none; }

/* ============================================================
   MENU LATERAL (sanduíche)
   ============================================================ */
#menu-painel {
  background: var(--fundo-painel);
  transform: translateX(100%);
  transition: transform .25s ease;
  z-index: 51;
}
#menu-painel.aberto { transform: translateX(0); }
.menu-item {
  display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
  padding: 13px 20px; font-size: 14px; font-weight: 500; color: var(--texto-suave);
  border-left: 3px solid transparent; background: none; cursor: pointer;
}
.menu-item:hover { background: var(--fundo-suave); }
.menu-item.active { color: var(--acento); font-weight: 700; border-left-color: var(--acento); background: var(--fundo-suave); }
.menu-item svg { flex-shrink: 0; }
@media (prefers-reduced-motion: reduce) {
  #menu-painel { transition: none; }
}
/* sem moldura clara: painéis apenas com sombra suave no escuro */
html[data-theme="escuro"] .painel { box-shadow: 0 2px 10px rgba(0,0,0,.4); border: none !important; }
html[data-theme="escuro"] .shadow-lg { box-shadow: 0 2px 10px rgba(0,0,0,.4) !important; }
/* cartões internos: fundo levemente mais claro, borda mínima */
html[data-theme="escuro"] .painel .bg-white,
html[data-theme="escuro"] .painel [class*="bg-amber-5"],
html[data-theme="escuro"] .painel [class*="bg-green-5"],
html[data-theme="escuro"] .painel [class*="bg-blue-5"],
html[data-theme="escuro"] .painel [class*="bg-yellow-5"] { border-color: transparent !important; }
html[data-theme="escuro"] .est-card { border-color: transparent; }
html[data-theme="escuro"] .leitor-bar { border-color: transparent; box-shadow: 0 4px 14px rgba(0,0,0,.5); }
html[data-theme="escuro"] .timeline-line { background: #3a3a3a; }
html[data-theme="escuro"] .est-badge.estudo { background: #1e3a8a; color: #bfdbfe; }
html[data-theme="escuro"] .est-badge.devocional { background: #14532d; color: #bbf7d0; }
details summary { color: var(--acento); }
.bg-amber-900, .bg-amber-950\/90 { background-color: #161616 !important; }
html[data-theme="escuro"] .editor-toolbar { border-color: var(--borda); }
html[data-theme="escuro"] .editor-area { border-color: var(--borda); }

/* ============================================================
   PROGRESSO DE LEITURA
   ============================================================ */
.prog-box { border-radius: 10px; padding: 10px 14px; background: var(--fundo-suave); border: 1px solid var(--borda); }
.prog-barra { height: 8px; border-radius: 4px; background: rgba(255,146,0,.16); overflow: hidden; }
html[data-theme="escuro"] .prog-barra { background: rgba(255,146,0,.14); }
.prog-preenchido { height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--laranja), var(--laranja-hover)); transition: width .4s; }
.cap-lido-btn.ativo { background: #16a34a !important; color: #fff !important; }

/* Mini-gráficos de barra da aba Minha Conta (sem lib — divs simples) */
.mini-chart { display: flex; align-items: flex-end; gap: 3px; height: 110px; }
.mini-chart-col { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.mini-chart-barra { width: 100%; max-width: 22px; border-radius: 4px 4px 0 0; min-height: 3px; transition: height .3s ease; }
.mini-chart-rotulo { font-size: 9px; color: var(--texto-suave); margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

/* ============================================================
   SELETOR DE LIVRO / CAPÍTULO / VERSÍCULO (blocos)
   ============================================================ */
.sel-bloco {
  padding: 10px 8px; border-radius: 10px; border: 1px solid var(--borda);
  background: var(--fundo-cartao); color: var(--texto); font-size: 13px; font-weight: 600;
  text-align: center; cursor: pointer; transition: background .15s, border-color .15s;
}
.sel-bloco:hover { background: var(--fundo-suave); border-color: var(--acento); }
.sel-bloco-num { padding: 10px 4px; }
.sel-bloco-atual { border-color: var(--acento); background: var(--fundo-suave); color: var(--acento); }
.sel-bloco-lido { background: #dcfce7; border-color: #86efac; color: #166534; }
html[data-theme="escuro"] .sel-bloco-lido { background: #14301f; border-color: #1f4a30; color: #86efac; }
.sel-bloco-marcado { background: var(--acento) !important; border-color: var(--acento) !important; color: #fff !important; }

/* Barra de ações do modo "marcar vários capítulos" no seletor */
.sel-acao {
  padding: 8px 12px; border-radius: 8px; border: 1px solid var(--borda);
  background: var(--fundo-cartao); color: var(--texto); font-size: 12.5px; font-weight: 600; cursor: pointer;
}
.sel-acao:disabled { opacity: .45; cursor: default; }
.sel-acao-primaria { background: var(--laranja); color: #171717; border-color: var(--laranja); }

/* Sublinhado dos versículos clicáveis garantido em todo o app */
a.ref-link, .ref-link {
  text-decoration: underline !important;
  text-decoration-color: var(--laranja) !important;
  text-underline-offset: 2px;
  cursor: pointer;
  font-weight: 600;
}

/* Tema escuro: eliminar de vez qualquer moldura clara nos cartões internos,
   preservando o contorno apenas em campos de digitação */
html[data-theme="escuro"] .painel [class*="border"] { border-color: transparent !important; }
html[data-theme="escuro"] .painel input,
html[data-theme="escuro"] .painel select,
html[data-theme="escuro"] .painel textarea,
html[data-theme="escuro"] .painel .editor-area,
html[data-theme="escuro"] .painel .editor-toolbar { border-color: var(--borda) !important; }
html[data-theme="escuro"] .prog-box { border-color: transparent; }

/* ============================================================
   HARMONIA DOS BOTÕES — mesmo raio, sombra e resposta ao toque
   em todo o app. Mira nas classes Tailwind que já existem (não
   precisa trocar a lista de classes de cada botão): um seletor
   elemento+classe (ex.: button.rounded) tem mais especificidade
   que a própria classe do Tailwind, então vence sem !important.
   ============================================================ */
button.rounded, button.rounded-lg,
a.rounded, a.rounded-lg,
label.rounded, label.rounded-lg { border-radius: 10px; }

button, label.cursor-pointer {
  transition: background-color .15s ease, box-shadow .15s ease, border-color .15s ease, transform .08s ease;
}
button:not(.menu-item):not(:disabled):active,
label.cursor-pointer:active { transform: translateY(1px); }

button:focus-visible, a:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--acento);
  outline-offset: 2px;
}

/* Botões de ação principal: leve elevação, um pouco mais forte e "levanta"
   no hover — igual ao botão sólido do portal. */
button.bg-amber-700, button.bg-green-700 {
  box-shadow: 0 1px 2px rgba(0,0,0,.12), 0 1px 3px rgba(255,146,0,.18);
}
button.bg-amber-700:hover, button.bg-green-700:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(255,146,0,.28);
}

/* ---------- Referências cruzadas junto dos versículos ---------- */
.verse-refs { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0 2px 18px; font-family: 'DM Sans', sans-serif; }
.vref { font-size: 11.5px; line-height: 1; font-weight: 600; padding: 5px 9px; border-radius: 999px; border: 1px solid var(--borda); background: transparent; color: var(--acento); cursor: pointer; transition: border-color .15s, background .15s; }
.vref:hover { border-color: var(--acento); background: color-mix(in srgb, var(--acento) 10%, transparent); }
.vref-mais { color: var(--texto-suave); font-weight: 700; }
.vref-painel { font-size: 13px; padding: 7px 11px; }
.verse-refs .ref-preview { flex-basis: 100%; }
.bib-refs-btn { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--borda); color: var(--texto-suave); background: transparent; }
.bib-refs-btn.ativo { border-color: var(--laranja); color: #171717; background: var(--laranja); }

/* ---------- Painel do versículo: abas ---------- */
.vm-abas { display: flex; gap: 6px; margin: 4px 0 10px; }
.vm-abas button { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 8px; border-radius: 10px; border: 1px solid var(--borda); background: transparent; color: var(--texto-suave); font: 700 12.5px 'DM Sans', sans-serif; cursor: pointer; }
.vm-abas button.ativo { background: var(--laranja); border-color: var(--laranja); color: #171717; }
.vm-abas b { font-weight: 800; opacity: .75; }

/* ---------- Original · Strong organizado ---------- */
.orig-lista { display: flex; flex-direction: column; gap: 6px; }
.orig-linha { display: grid; grid-template-columns: minmax(84px, auto) 1fr; gap: 10px; align-items: center; width: 100%; text-align: left; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--borda); background: var(--fundo-cartao, #fff); color: var(--texto); cursor: pointer; transition: border-color .15s; }
.orig-linha:hover { border-color: var(--acento); }
.orig-linha:disabled { opacity: .55; cursor: default; }
.orig-palavra { font-family: 'Source Serif Pro', 'SBL Hebrew', 'Times New Roman', serif; font-size: 20px; line-height: 1.2; }
.orig-info { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; }
.orig-translit { font-style: italic; font-size: 13px; color: var(--texto-suave); }
.orig-num { font: 700 11px ui-monospace, monospace; color: var(--acento); padding: 2px 6px; border-radius: 6px; background: color-mix(in srgb, var(--acento) 12%, transparent); }
.orig-def { flex-basis: 100%; font-size: 13px; line-height: 1.4; color: var(--texto); }

/* ---------- Abertura no padrão dos apps do portal ---------- */
#splash { cursor: pointer; }
.splash-app { width: 128px; height: 128px; display: block; margin: 0 auto 24px; border-radius: 30px; filter: drop-shadow(0 0 40px rgba(255,146,0,.35)); animation: splash-logo-surge .6s cubic-bezier(.22,.75,.3,1) both; }
#splash .splash-titulo { font-size: 2.1rem; min-height: 1.3em; }
#splash .splash-saudacao { opacity: 1; animation: none; min-height: 1.5em; font-size: 1.02rem; }
#splash .splash-portal { display: inline-flex; align-items: center; gap: 10px; animation: none; opacity: 0; transform: translateY(6px); transition: opacity .7s ease, transform .7s ease; }
#splash .splash-portal.visivel { opacity: 1; transform: none; }
.splash-portal-logo { width: 28px; height: 28px; object-fit: cover; object-position: 0% center; border-radius: 7px; }
.digitando::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 3px; vertical-align: -.12em; background: #ff9200; animation: cursor-pisca .8s steps(1) infinite; }
@keyframes cursor-pisca { 50% { opacity: 0; } }

/* ---------- Cartão "parte do portal" (padrão) ---------- */
.om-portal-card { display: flex; flex-direction: column; gap: 14px; padding: 18px 20px; border-radius: 16px; background: #161616; border: 1px solid rgba(255,255,255,.14); color: #d2d2d2; text-decoration: none; position: relative; overflow: hidden; transition: transform .25s ease, border-color .25s ease; }
.om-portal-card::after { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 90% at 100% 0%, rgba(255,146,0,.14), transparent 60%); pointer-events: none; }
.om-portal-card:hover { transform: translateY(-2px); border-color: rgba(255,146,0,.75); }
@media (min-width: 640px) { .om-portal-card { flex-direction: row; align-items: center; gap: 18px; } }
.om-portal-logo { width: 42px; height: 42px; object-fit: cover; object-position: 0% center; border-radius: 10px; flex-shrink: 0; }
.om-portal-nome { margin: 0; font-weight: 700; font-size: 16px; line-height: 1.15; font-family: 'DM Sans', sans-serif; }
.om-portal-nome span:first-child { color: #fff; }
.om-portal-nome span:last-child { color: #ff9200; }
.om-portal-texto { margin: 0; font-size: 13.5px; line-height: 1.55; font-family: 'DM Sans', sans-serif; }
.om-portal-texto b { color: #fff; font-weight: 600; }
.om-portal-link { margin: 6px 0 0; font-size: 12px; font-weight: 700; color: #ff9200; font-family: 'DM Sans', sans-serif; }

/* Rodapé */
.rodape-om { background: var(--fundo-pagina); border-top: 1px solid var(--borda); }
.rodape-linha { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; margin-top: 16px; font: 500 12px 'DM Sans', sans-serif; color: var(--texto-suave); }
.rodape-linha a { text-decoration: underline; text-underline-offset: 3px; }
.rodape-lema { display: inline-flex; align-items: center; gap: 6px; color: var(--laranja); font-weight: 700; }

/* Contato WhatsApp — acompanha o tema */
.contato-whats { border: 1px solid rgba(37, 211, 102, .45); background: rgba(37, 211, 102, .08); color: var(--texto); }
.contato-whats h4 { color: var(--texto); }
.contato-whats h4 svg { color: #25d366; }
.contato-whats-btn { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 10px; background: #25d366; color: #fff !important; font: 700 14px 'DM Sans', sans-serif; text-decoration: none !important; }
.contato-whats-btn:hover { filter: brightness(1.06); }

/* Dúvidas e contato */
.ajuda-fundo { position: fixed; inset: 0; z-index: 70; display: flex; align-items: flex-end; justify-content: center; background: rgba(0,0,0,.5); }
@media (min-width: 640px) { .ajuda-fundo { align-items: center; } }
.ajuda-card { width: min(420px, 100%); border-radius: 20px 20px 0 0; padding: 22px; background: var(--fundo-painel); color: var(--texto); border: 1px solid var(--borda); font-family: 'DM Sans', sans-serif; }
@media (min-width: 640px) { .ajuda-card { border-radius: 20px; } }
.ajuda-card h3 { margin: 0 0 4px; font-size: 18px; font-weight: 700; }
.ajuda-card ul { margin: 10px 0 14px; padding-left: 18px; list-style: disc; color: var(--texto-suave); font-size: 14px; line-height: 1.6; }
.ajuda-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ajuda-acoes a, .ajuda-acoes button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 11px 8px; border-radius: 12px; border: 1px solid var(--borda); background: transparent; color: var(--texto); font: 700 13.5px 'DM Sans', sans-serif; text-decoration: none; cursor: pointer; }
.ajuda-acoes .wa { background: #25d366; border-color: #25d366; color: #fff; }
.ajuda-acoes .larga { grid-column: 1 / -1; background: var(--laranja); border-color: var(--laranja); color: #171717; }

/* ---------- Tags coloridas (tons de laranja da identidade) ---------- */
.tag { --tg-bg:#fff1df; --tg-tx:#b35900; --tg-bd:#ffd29a;
  display:inline-flex; align-items:center; gap:3px; font-size:11.5px; font-weight:700; line-height:1;
  padding:4px 9px; border-radius:999px; background:var(--tg-bg); color:var(--tg-tx); border:1px solid var(--tg-bd); white-space:nowrap; }
button.tag { cursor:pointer; transition:transform .12s, box-shadow .12s; }
button.tag:hover { transform:translateY(-1px); box-shadow:0 3px 10px rgba(255,146,0,.18); }
.tag-c0 { --tg-bg:#fff1df; --tg-tx:#b35900; --tg-bd:#ffd29a; } /* laranja */
.tag-c1 { --tg-bg:#fef3c7; --tg-tx:#92400e; --tg-bd:#fcd98a; } /* âmbar */
.tag-c2 { --tg-bg:#fde6dc; --tg-tx:#9a3412; --tg-bd:#f5b9a0; } /* terracota */
.tag-c3 { --tg-bg:#fbf3d5; --tg-tx:#7c5e05; --tg-bd:#ead08a; } /* mel */
.tag-c4 { --tg-bg:#f3e7da; --tg-tx:#6b3f1d; --tg-bd:#dcc0a2; } /* canela */
.tag-c5 { --tg-bg:#ffe5d6; --tg-tx:#b23c00; --tg-bd:#ffb98f; } /* coral */
.tag-c6 { --tg-bg:#f6eedf; --tg-tx:#7a5c3a; --tg-bd:#e2d0b1; } /* areia */
.tag-c7 { --tg-bg:#fbe3c8; --tg-tx:#8a4b0f; --tg-bd:#efbf8a; } /* caramelo */
html[data-theme="escuro"] .tag-c0 { --tg-bg:rgba(255,146,0,.16); --tg-tx:#ffb45c; --tg-bd:rgba(255,146,0,.38); }
html[data-theme="escuro"] .tag-c1 { --tg-bg:rgba(245,158,11,.15); --tg-tx:#fcd34d; --tg-bd:rgba(245,158,11,.35); }
html[data-theme="escuro"] .tag-c2 { --tg-bg:rgba(194,65,12,.22); --tg-tx:#fdba8c; --tg-bd:rgba(234,88,12,.42); }
html[data-theme="escuro"] .tag-c3 { --tg-bg:rgba(212,160,23,.15); --tg-tx:#f0d37a; --tg-bd:rgba(212,160,23,.35); }
html[data-theme="escuro"] .tag-c4 { --tg-bg:rgba(160,104,58,.22); --tg-tx:#e3bf98; --tg-bd:rgba(160,104,58,.45); }
html[data-theme="escuro"] .tag-c5 { --tg-bg:rgba(232,89,12,.18); --tg-tx:#ffa477; --tg-bd:rgba(232,89,12,.4); }
html[data-theme="escuro"] .tag-c6 { --tg-bg:rgba(214,190,150,.12); --tg-tx:#e6d3b3; --tg-bd:rgba(214,190,150,.3); }
html[data-theme="escuro"] .tag-c7 { --tg-bg:rgba(200,120,40,.2); --tg-tx:#f2b77a; --tg-bd:rgba(200,120,40,.42); }
.tag-sug { background:transparent; border-style:dashed; opacity:.85; }
.tag-ativa { box-shadow:0 0 0 2px var(--fundo-cartao), 0 0 0 4px var(--laranja); }
.tags-box { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:8px; min-height:4px; }
.tags-sug-rot { font-size:11px; color:var(--texto-suave); margin-left:4px; }
.tags-barra { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:-4px 0 14px; }
.tags-limpar { font-size:11px; color:var(--texto-suave); text-decoration:underline; padding:2px 4px; }

/* ---------- Meus Estudos: lista / grade / cartões ---------- */
.vista-btns { display:inline-flex; border:1px solid var(--borda); border-radius:8px; overflow:hidden; }
.vista-btns button { padding:7px 10px; color:var(--texto-suave); background:var(--fundo-cartao); }
.vista-btns button + button { border-left:1px solid var(--borda); }
.vista-btns button.ativo { background:rgba(255,146,0,.14); color:var(--acento); }
.est-lista.vista-cards { display:grid; gap:12px; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); }
.est-lista.vista-grade { display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); }
.est-lista.vista-lista { display:flex; flex-direction:column; gap:6px; }
.est-titulo { font-weight:700; color:var(--acento); display:inline-flex; align-items:center; gap:5px; min-width:0; }
.est-titulo svg { width:14px; height:14px; flex-shrink:0; }
.est-resumo { font-size:12.5px; color:var(--texto-suave); margin-top:6px; line-height:1.45; }
.est-rodape { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; margin-top:10px; }
.est-data { font-size:11px; color:var(--texto-suave); white-space:nowrap; }
.est-card.est-grade { padding:10px 12px; display:flex; flex-direction:column; }
.est-card.est-grade .est-titulo { font-size:14px; }
.est-card.est-grade .est-rodape { margin-top:auto; padding-top:8px; flex-direction:column; align-items:flex-start; }
.est-card.est-grade .flex.items-start { flex-direction:column-reverse; align-items:flex-start; gap:4px; }
.est-card.est-lista { display:flex; align-items:center; gap:10px; padding:9px 12px; border-left-width:3px; }
.est-card.est-lista .est-titulo { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; }
.est-card.est-lista .est-titulo svg { display:inline; vertical-align:-2px; margin-right:4px; }
.est-lista-tags { display:flex; gap:4px; flex-wrap:nowrap; overflow:hidden; max-width:40%; }
.est-card.est-nota { border-left-style:dashed; }
.est-badge.anotacao { background:rgba(255,146,0,.10); color:var(--texto-suave); border:1px dashed rgba(255,146,0,.5); }
.est-vazio { text-align:center; padding:40px 10px; color:var(--texto-suave); font-size:14px; grid-column:1/-1; }
@media (max-width:520px) {
  .est-card.est-lista .est-lista-tags, .est-card.est-lista .est-data { display:none; }
  .est-lista.vista-grade { grid-template-columns:1fr 1fr; }
}

/* ---------- Selecionar vários versículos ---------- */
.verse-sel { background:rgba(255,146,0,.16) !important; box-shadow:inset 3px 0 0 var(--laranja); }
body.modo-multi .verse { user-select:none; }
body.modo-multi .verse .verse-num { color:var(--laranja); }
.multi-barra { position:fixed; left:50%; transform:translateX(-50%); bottom:calc(16px + env(safe-area-inset-bottom)); z-index:45;
  display:flex; align-items:center; gap:6px; padding:8px 8px 8px 16px; border-radius:999px; max-width:calc(100vw - 32px);
  background:#1c1c1c; color:#fff; border:1px solid rgba(255,146,0,.45); box-shadow:0 14px 40px rgba(0,0,0,.35); }
.multi-n { font-size:13px; font-weight:700; margin-right:4px; white-space:nowrap; }
.multi-barra button { display:inline-flex; align-items:center; gap:5px; font-size:13px; font-weight:700; padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.08); color:#fff; }
.multi-barra button.multi-pri { background:#ff9200; color:#1a1205; }
.multi-barra button:disabled { opacity:.4; }
.vm-sup { font-size:.7em; font-weight:700; color:var(--laranja); margin:0 3px 0 6px; vertical-align:super; }
.vm-sup:first-child { margin-left:0; }
.vm-outras { display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:12px; color:var(--texto-suave); margin:-4px 0 12px; }
.vm-outras button { font-weight:700; color:var(--acento); background:rgba(255,146,0,.1); border:1px solid rgba(255,146,0,.35); border-radius:999px; padding:3px 10px; }
.verse.verse-sel { outline:2px solid var(--laranja); outline-offset:-2px; }
body.modo-multi #copy-toast { bottom:calc(90px + env(safe-area-inset-bottom)); }

/* ---------- Mapa da Bíblia (aba Lugares) ---------- */
.mapa-btn-jerusalem { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px; font-size:13px; font-weight:700;
  background:rgba(255,146,0,.12); color:var(--acento); border:1px solid rgba(255,146,0,.4); }
.mapa-btn-jerusalem:hover { background:rgba(255,146,0,.2); }
.mapa-resultados { position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:500; background:var(--fundo-cartao); border:1px solid var(--borda);
  border-radius:10px; box-shadow:0 12px 30px rgba(0,0,0,.18); overflow:hidden; }
.mapa-resultados button { display:flex; justify-content:space-between; gap:8px; width:100%; text-align:left; padding:9px 12px; font-size:14px; font-weight:600; color:var(--texto); }
.mapa-resultados button + button { border-top:1px solid var(--borda); }
.mapa-resultados button:hover { background:rgba(255,146,0,.08); }
.mapa-resultados small { color:var(--texto-suave); font-weight:500; }
.mapa-resultados p { padding:10px 12px; font-size:13px; color:var(--texto-suave); }
.mapa-eras { display:flex; gap:6px; overflow-x:auto; padding-bottom:6px; margin-bottom:8px; scrollbar-width:none; }
.mapa-eras::-webkit-scrollbar { display:none; }
.era-chip { flex-shrink:0; font-size:12px; font-weight:700; padding:6px 12px; border-radius:999px; white-space:nowrap;
  background:var(--fundo-cartao); color:var(--texto-suave); border:1px solid var(--borda); }
.era-chip:hover { border-color:rgba(255,146,0,.5); color:var(--acento); }
.era-chip.ativo { background:#ff9200; border-color:#ff9200; color:#1a1205; }
.mapa-era-info { font-size:13px; line-height:1.5; padding:10px 14px; margin-bottom:10px; border-radius:10px; color:var(--texto);
  background:rgba(255,146,0,.08); border:1px solid rgba(255,146,0,.3); border-left:4px solid #ff9200; }
.mapa-era-info b { color:var(--acento); font-size:14px; }
.mapa-era-info > div span { font-size:12px; color:var(--texto-suave); font-weight:600; }
.mapa-era-info p { margin:3px 0 6px; color:var(--texto-suave); }
.mapa-era-info ul { display:grid; gap:2px; }
.mapa-era-info li span { display:inline-block; min-width:92px; font-weight:700; color:var(--acento); font-size:12px; }
.mapa-layout { display:grid; gap:14px; }
@media (min-width:1024px) { .mapa-layout:has(.mapa-ficha:not(.hidden)) { grid-template-columns:minmax(0,1fr) 360px; } }
.mapa-wrap { min-width:0; }
.mapa { height:min(68vh,620px); min-height:360px; border-radius:14px; overflow:hidden; border:1px solid var(--borda); background:#e9e2d4; z-index:0; isolation:isolate; }
.mapa-aviso { font-size:13px; color:var(--texto-suave); margin-top:6px; }
.mapa-aviso:empty { display:none; }
.mapa-legenda { display:flex; flex-wrap:wrap; gap:4px 12px; align-items:center; font-size:11.5px; color:var(--texto-suave); margin-top:8px; }
.mapa-legenda #mapa-contagem { font-weight:700; color:var(--acento); margin-right:4px; }
.mapa-legenda i { display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--c); margin-right:4px; vertical-align:-1px; border:1px solid #fff; }
.mapa-legenda i.reg { background:color-mix(in srgb, var(--c) 18%, transparent); border:1.5px dashed var(--c); width:12px; height:12px; }
.mapa-legenda i.inc { background:rgba(255,146,0,.45); border:1px dashed #ff9200; }
.leaflet-tooltip.mapa-rotulo { background:transparent; border:0; box-shadow:none; padding:0 2px; font:700 11.5px/1.1 "DM Sans",system-ui,sans-serif; color:#3b2408;
  text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 2px #fff; }
.leaflet-tooltip.mapa-rotulo.regiao { font-weight:800; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#8a4b0f; opacity:.85; }
.leaflet-tooltip.mapa-rotulo::before { display:none; }
.leaflet-container { font-family:"DM Sans",system-ui,sans-serif; }
.leaflet-control-attribution { font-size:10px; }
.mapa-ficha { background:var(--fundo-cartao); border:1px solid var(--borda); border-top:4px solid #ff9200; border-radius:14px; padding:14px 16px;
  max-height:min(68vh,620px); overflow-y:auto; scrollbar-width:thin; }
.mapa-ficha-topo { display:flex; justify-content:space-between; gap:8px; }
.mapa-ficha h3 { font-size:20px; font-weight:800; color:var(--texto); line-height:1.15; }
.mapa-ficha h4 { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--acento); margin:14px 0 6px; }
.mapa-ficha h4 span { text-transform:none; letter-spacing:0; font-weight:600; color:var(--texto-suave); }
.mapa-sub { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:4px; font-size:12px; color:var(--texto-suave); }
.mapa-tipo { font-weight:700; font-size:11px; padding:2px 8px; border-radius:999px; color:var(--c); background:color-mix(in srgb, var(--c) 14%, transparent); border:1px solid color-mix(in srgb, var(--c) 40%, transparent); }
.mapa-en { font-style:italic; }
.mapa-conf { font-size:11px; padding:1px 7px; border-radius:999px; border:1px dashed rgba(255,146,0,.6); }
.mapa-fechar { font-size:24px; line-height:1; color:var(--texto-suave); padding:0 4px; align-self:flex-start; }
.mapa-wiki { margin-top:10px; font-size:13.5px; line-height:1.55; color:var(--texto); }
.mapa-wiki img { width:100%; max-height:190px; object-fit:cover; object-position:center 15%; border-radius:10px; margin-bottom:8px; }
.mapa-wiki a { display:inline-block; margin-top:6px; font-weight:700; color:var(--acento); }
.mapa-wiki small { display:block; margin-top:4px; font-size:10.5px; color:var(--texto-suave); }
.mapa-carregando { font-size:12.5px; color:var(--texto-suave); }
.mapa-eras-lugar { display:flex; flex-wrap:wrap; gap:5px; }
.mapa-eras-lugar .era-chip { font-size:11px; padding:4px 10px; }
.vref-todos { font-style:italic; }
.mapa-ver-btn { display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:700; padding:5px 12px; border-radius:999px;
  color:var(--acento); background:rgba(255,146,0,.1); border:1px solid rgba(255,146,0,.35); }
html[data-theme="escuro"] .mapa { background:#1f1c18; border-color:var(--borda); }
html[data-theme="escuro"] .leaflet-tile-pane { filter:brightness(.62) contrast(1.15) saturate(.7) sepia(.25); }
html[data-theme="escuro"] .leaflet-tooltip.mapa-rotulo { color:#ffe2bd; text-shadow:0 0 3px #000, 0 0 3px #000, 0 0 2px #000; }
html[data-theme="escuro"] .leaflet-tooltip.mapa-rotulo.regiao { color:#ffb45c; }
html[data-theme="escuro"] .leaflet-bar a, html[data-theme="escuro"] .leaflet-control-layers { background:#262626; color:#eee; border-color:#3a3a3a; }
html[data-theme="escuro"] .leaflet-control-attribution { background:rgba(20,20,20,.7); color:#aaa; }
html[data-theme="escuro"] .leaflet-control-attribution a { color:#ffb45c; }
@media (max-width:1023px) { .mapa-ficha { max-height:none; overflow:visible; } }
@media (min-width:768px) { .mapa-eras { flex-wrap:wrap; overflow:visible; } }
html[data-theme="escuro"] .mapa-tipo { filter:brightness(1.9); }

/* ---------- Personagens ---------- */
.vista-btns button[data-sexo] { font-size:12.5px; font-weight:700; padding:7px 11px; }
.pes-avatar { flex-shrink:0; width:38px; height:38px; border-radius:12px; display:inline-grid; place-items:center; font-weight:800; font-size:17px;
  background:var(--tg-bg); color:var(--tg-tx); border:1px solid var(--tg-bd); }
.pes-topo { display:flex; gap:10px; align-items:center; }
.pes-sub { font-size:12px; color:var(--texto-suave); margin-top:2px; line-height:1.35; }
.pes-eras { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; }
.pes-era { font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:999px; background:rgba(255,146,0,.1); color:var(--acento); }
.pes-wiki { font:800 11px/1 Georgia,serif; width:20px; height:20px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--borda); color:var(--texto-suave); }
.pes-card.est-lista .pes-avatar { width:30px; height:30px; font-size:14px; border-radius:9px; }
.pes-sub-lista { font-size:12px; color:var(--texto-suave); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:45%; }
.pes-card.est-grade .pes-topo { flex-direction:column; align-items:flex-start; }
.pes-card.est-grade .est-rodape { flex-direction:row; align-items:center; }
.pes-card .est-titulo { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:520px) { .pes-card.est-lista .pes-sub-lista { display:none; } }
.pes-ficha { max-height:88vh; overflow-y:auto; border-top-width:4px; }
.pes-ficha h3 small, .pes-chip small { font-size:.62em; font-weight:600; color:var(--texto-suave); }
.pes-ficha .pes-avatar { width:48px; height:48px; font-size:22px; border-radius:14px; }
.pes-familia { display:grid; gap:8px; }
.pes-familia > div { display:grid; grid-template-columns:78px 1fr; gap:8px; align-items:start; }
.pes-familia > div > span { font-size:12px; font-weight:700; color:var(--texto-suave); padding-top:5px; }
.pes-familia > div > div { display:flex; flex-wrap:wrap; gap:5px; }
.pes-chip { font-size:12.5px; font-weight:700; padding:4px 10px; border-radius:999px; color:var(--acento); background:rgba(255,146,0,.08); border:1px solid rgba(255,146,0,.35); text-align:left; }
.pes-chip:hover { background:rgba(255,146,0,.16); }
.pes-fonte { font-size:10.5px; color:var(--texto-suave); margin-top:14px; }
#mapa-pessoas:empty { display:none; }
.mapa-sat .leaflet-tooltip.mapa-rotulo { color:#fff; text-shadow:0 0 3px #000, 0 0 3px #000, 0 1px 2px #000; }
.mapa-sat .leaflet-tooltip.mapa-rotulo.regiao { color:#ffcf8f; }
html[data-theme="escuro"] .mapa-sat .leaflet-tile-pane { filter:brightness(.85); }

/* ---------- Destaques dos versículos (tons de laranja) ---------- */
:root { --hl0:rgba(255,146,0,.26); --hl1:rgba(250,204,21,.34); --hl2:rgba(253,164,104,.36); --hl3:rgba(194,65,12,.18); --hl4:rgba(214,186,140,.42); --hl5:rgba(139,90,43,.22); }
html[data-theme="escuro"] { --hl0:rgba(255,146,0,.24); --hl1:rgba(250,204,21,.2); --hl2:rgba(253,164,104,.22); --hl3:rgba(234,88,12,.26); --hl4:rgba(214,186,140,.2); --hl5:rgba(180,120,60,.3); }
.verse[data-hl] { border-radius:6px; }
.verse[data-hl="0"] { background:var(--hl0); } .verse[data-hl="1"] { background:var(--hl1); } .verse[data-hl="2"] { background:var(--hl2); }
.verse[data-hl="3"] { background:var(--hl3); } .verse[data-hl="4"] { background:var(--hl4); } .verse[data-hl="5"] { background:var(--hl5); }
.cor-dest { width:28px; height:28px; border-radius:50%; border:2px solid var(--fundo-cartao); box-shadow:0 0 0 1px var(--borda); flex-shrink:0; transition:transform .12s; }
.cor-dest:hover { transform:scale(1.12); }
.cor-dest.ativa { box-shadow:0 0 0 2px #ff9200; }
.cor-dest[data-cor="0"] { background:#ffb554; } .cor-dest[data-cor="1"] { background:#fbd84a; } .cor-dest[data-cor="2"] { background:#fcb98a; }
.cor-dest[data-cor="3"] { background:#d9764a; } .cor-dest[data-cor="4"] { background:#dcc49a; } .cor-dest[data-cor="5"] { background:#a8754a; }
.cor-tirar { background:var(--fundo-cartao); color:var(--texto-suave); font-size:16px; line-height:1; display:grid; place-items:center; }
.vm-cores { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 12px; }
.vm-cores > span { font-size:12px; font-weight:700; color:var(--texto-suave); margin-right:2px; }
.multi-cores { position:fixed; left:50%; transform:translateX(-50%); bottom:calc(78px + env(safe-area-inset-bottom)); z-index:45; display:flex; gap:10px;
  padding:10px 14px; border-radius:999px; background:#1c1c1c; border:1px solid rgba(255,146,0,.45); box-shadow:0 14px 40px rgba(0,0,0,.35); }
.multi-cores .cor-dest { border-color:#1c1c1c; box-shadow:0 0 0 1px #444; }
.multi-cores .cor-tirar { background:#2a2a2a; color:#ccc; }
@media (max-width:420px) { .multi-barra .multi-rot { display:none; } .multi-barra { gap:4px; padding-left:12px; } }

/* ---------- Cartão de compartilhar / link recebido ---------- */
.cartao-painel, .recebido-painel { background:var(--fundo-cartao); color:var(--texto); padding:18px 18px calc(18px + env(safe-area-inset-bottom)); max-height:92vh; overflow-y:auto; border-top:4px solid #ff9200; }
.cartao-previa { position:relative; border-radius:14px; overflow:hidden; background:#161616; aspect-ratio:1080/1350; max-height:52vh; margin:0 auto; display:grid; place-items:center; }
.cartao-previa img { width:100%; height:100%; object-fit:contain; }
.cartao-previa img:not([src]) { display:none; }
.cartao-previa p { position:absolute; color:#bbb; font-size:13px; }
.cartao-previa p:empty { display:none; }
.cartao-acoes { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; }
.cartao-acoes button { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:11px 12px; border-radius:12px; font-size:14px; font-weight:700;
  background:rgba(255,146,0,.08); color:var(--acento); border:1px solid rgba(255,146,0,.3); }
.cartao-acoes button:hover { background:rgba(255,146,0,.15); }
.cartao-acoes .cartao-pri { grid-column:1/-1; background:#ff9200; color:#1a1205; border-color:#ff9200; }
.cartao-acoes button.hidden { display:none; }
.recebido-topo { display:flex; align-items:center; gap:12px; padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid var(--borda); }
.recebido-topo img { width:46px; height:46px; border-radius:12px; }
.recebido-topo div { flex:1; min-width:0; }
.recebido-topo b { display:block; font-size:17px; }
.recebido-topo span { font-size:12px; color:var(--texto-suave); }
.recebido-topo button { font-size:26px; line-height:1; color:var(--texto-suave); padding:0 4px; }
.rec-tipo { font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#ff9200; }
.rec-titulo { font-size:22px; font-weight:800; margin-top:4px; }
.rec-ref { font-size:22px; font-weight:800; color:var(--acento); margin-top:4px; }
.rec-verso { font-family:'Source Serif Pro',Georgia,serif; font-size:18px; line-height:1.6; margin:12px 0; padding:12px 14px; border-left:4px solid #ff9200;
  background:rgba(255,146,0,.07); border-radius:0 10px 10px 0; }
.rec-verso sup { color:#ff9200; font-weight:700; margin:0 2px 0 4px; }
.rec-nota { font-size:15px; line-height:1.6; margin-top:6px; }
.rec-nota span { display:block; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--texto-suave); margin-bottom:4px; }
.rec-data { font-size:12px; color:var(--texto-suave); margin-top:14px; }

/* ---------- Início: atalhos e "Conhecer o app" ---------- */
.ini-atalhos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:0 0 14px; text-align:left; }
@media (max-width:640px) { .ini-atalhos { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.ini-atalho { display:flex; align-items:center; gap:10px; padding:12px; border-radius:14px; background:var(--fundo-cartao); border:1px solid var(--borda);
  transition:transform .15s, box-shadow .15s, border-color .15s; min-width:0; }
.ini-atalho:hover { transform:translateY(-2px); border-color:rgba(255,146,0,.5); box-shadow:0 8px 20px rgba(255,146,0,.14); }
.ini-atalho svg { width:22px; height:22px; flex-shrink:0; color:#ff9200; padding:7px; box-sizing:content-box; border-radius:10px; background:rgba(255,146,0,.12); }
.ini-atalho span { min-width:0; }
.ini-atalho b { display:block; font-size:14px; color:var(--texto); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ini-atalho small { display:block; font-size:11.5px; color:var(--texto-suave); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ini-continuar { grid-column:1/-1; background:linear-gradient(120deg, rgba(255,146,0,.16), rgba(255,146,0,.05)); border-color:rgba(255,146,0,.45); }
.ini-continuar small { color:var(--acento); font-weight:700; font-size:13px; }
.ini-tour { width:100%; display:flex; align-items:center; gap:12px; padding:12px 14px; margin-bottom:26px; border-radius:14px; color:#fff;
  background:#1c1c1c; border:1px solid rgba(255,146,0,.45); background-image:radial-gradient(60% 120% at 100% 0%, rgba(255,146,0,.28), transparent 70%); }
.ini-tour b { display:block; font-size:15px; }
.ini-tour small { display:block; font-size:12px; color:#cfc6bb; }
.ini-tour-icone svg { width:22px; height:22px; color:#ff9200; padding:8px; box-sizing:content-box; border-radius:12px; background:rgba(255,146,0,.15); }
.ini-tour .ini-tour-play { margin-left:auto; width:28px; height:28px; color:#ff9200; flex-shrink:0; }

.ini-atalho span { text-align:left; }
@media (max-width:640px) {
  .ini-atalho:not(.ini-continuar) { flex-direction:column; align-items:flex-start; gap:8px; }
  .ini-atalho b, .ini-atalho small { white-space:normal; }
}

/* ---------- Janela do versículo: ampla, em colunas (texto · anotação · ligações) ---------- */
.vm-janela { width:100%; max-height:92vh; overflow-y:auto; padding:6px 18px 20px; border-radius:16px 16px 0 0; }
.vm-topo { display:flex; align-items:center; justify-content:space-between; position:sticky; top:-6px; z-index:2; background:inherit; padding:12px 0 8px; margin-bottom:6px; border-bottom:1px solid var(--borda); }
.vm-colunas { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
.vm-col { min-width:0; }
.vm-titulo { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--acento); margin:4px 0 10px; }
.vm-titulo svg { width:15px; height:15px; }
@media (min-width:640px) { .vm-janela { width:min(1500px,96vw); max-height:94vh; border-radius:16px; padding:6px 24px 24px; } }
@media (min-width:860px) { .vm-colunas { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .vm-col-lig { grid-column:1 / -1; } .vm-col-lig #vm-ligacoes { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:14px; } }
@media (min-width:1200px) { .vm-colunas { grid-template-columns:minmax(0,1.05fr) minmax(0,1.15fr) minmax(0,.9fr); } .vm-col-lig { grid-column:auto; } .vm-col-lig #vm-ligacoes { display:block; } .vm-col + .vm-col { border-left:1px solid var(--borda); padding-left:20px; } #vm-nota { min-height:220px; } }
.vm-mais { margin-top:18px; padding-top:14px; border-top:1px dashed var(--borda); }
.vm-mais h5 { font-size:13px; font-weight:800; color:var(--acento); }
.vm-dica { font-size:12px; color:var(--texto-suave); margin:2px 0 10px; }
.vm-mais-linha { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px; }
.vm-mais-linha > span { font-size:12px; font-weight:700; color:var(--texto-suave); flex:0 0 100%; }
.vm-mais-linha select { flex:1 1 180px; min-width:0; }
.vm-mais-linha button { display:inline-flex; align-items:center; gap:6px; padding:8px 12px; border-radius:10px; border:1px solid rgba(255,146,0,.4); background:rgba(255,146,0,.1); color:var(--acento); font-size:13px; font-weight:700; }
.vm-mais-linha button:hover { background:var(--laranja); border-color:var(--laranja); color:#171717; }
.vm-mais-linha button svg { width:15px; height:15px; }
.lig-grupo { margin-bottom:16px; }
.lig-grupo h5 { font-size:13px; font-weight:800; margin-bottom:6px; display:flex; align-items:center; gap:6px; }
.lig-grupo h5 b { font-weight:800; color:var(--acento); }
.lig-vazio { font-size:12px; color:var(--texto-suave); }
.lig-item { display:block; width:100%; text-align:left; border:1px solid var(--borda); border-left:3px solid var(--laranja); background:var(--fundo-cartao); border-radius:10px; padding:8px 10px; margin-bottom:6px; }
.lig-item:hover { background:var(--fundo-suave); }
.lig-item strong { display:block; font-size:13px; }
.lig-item small { display:block; font-size:12px; color:var(--texto-suave); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lig-item em { font-style:normal; font-size:11px; font-weight:700; color:var(--acento); }
.lig-fato { border:1px solid var(--borda); background:var(--fundo-suave); border-radius:10px; padding:8px 10px; margin-bottom:6px; font-size:13px; }
.lig-fato span { display:block; font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--acento); margin-bottom:2px; }
.vm-mais-linha.hidden { display:none; }
a.lig-item { text-decoration:none; color:inherit; }

/* Janela do versículo em tela cheia (pedido do Tiago, 13/10/2026) */
@media (min-width:640px) { .vm-janela { width:100vw; height:100vh; max-height:none; border-radius:0; padding:8px 32px 28px; } }
@media (max-width:639px) { .vm-janela { height:100dvh; max-height:none; border-radius:0; } }

/* ---------- Oficina de pregação (tela cheia, em colunas) ---------- */
html.com-preg { overflow:hidden; }
.preg-janela { position:fixed; inset:0; z-index:60; overflow-y:auto; background:var(--fundo-cartao); color:inherit; }
.preg-janela.hidden { display:none; }
.preg-topo { position:sticky; top:0; z-index:3; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding:12px 28px; background:var(--fundo-cartao); border-bottom:1px solid var(--borda); }
.preg-topo h2 { display:flex; align-items:center; gap:8px; font-size:18px; font-weight:800; color:var(--acento); }
.preg-topo h2 svg { width:20px; height:20px; }
.preg-status { font-size:12px; color:var(--texto-suave); flex:1; }
.preg-acoes { display:flex; flex-wrap:wrap; gap:8px; }
.preg-topo button, .preg-mais { display:inline-flex; align-items:center; gap:6px; padding:8px 13px; border-radius:10px; border:1px solid var(--borda); background:var(--fundo-suave); font-size:13px; font-weight:700; }
.preg-topo button:hover, .preg-mais:hover { border-color:var(--laranja); color:var(--acento); }
.preg-topo button svg, .preg-mais svg { width:15px; height:15px; }
.preg-topo button.cheio { background:var(--laranja); border-color:var(--laranja); color:#171717; }
.preg-colunas { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; padding:20px 28px 90px; }
.preg-col { min-width:0; }
@media (min-width:900px) { .preg-colunas { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); } .preg-col-esboco { grid-column:1 / -1; } }
@media (min-width:1300px) { .preg-colunas { grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr) minmax(0,.95fr); } .preg-col-esboco { grid-column:auto; position:sticky; top:74px; align-self:start; max-height:calc(100vh - 96px); overflow-y:auto; } }
.preg-estilos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.preg-estilos button { display:flex; align-items:center; justify-content:center; gap:6px; padding:10px 6px; border-radius:10px; border:1px solid var(--borda); background:var(--fundo-suave); font-size:13px; font-weight:700; }
.preg-estilos button svg { width:15px; height:15px; }
.preg-estilos button.ativo { background:var(--laranja); border-color:var(--laranja); color:#171717; }
.preg-dica { font-size:12.5px; line-height:1.5; color:var(--texto-suave); margin:10px 0 14px; padding:10px 12px; border-left:3px solid var(--laranja); background:var(--fundo-suave); border-radius:0 10px 10px 0; }
.preg-campo { display:block; margin-bottom:12px; }
.preg-campo > span { display:block; font-size:12px; font-weight:700; color:var(--acento); margin-bottom:4px; }
.preg-janela input[type=text], .preg-janela textarea { width:100%; border:1px solid var(--borda); border-radius:10px; padding:9px 12px; font-size:14px; background:var(--fundo-cartao); color:inherit; }
.preg-janela textarea { resize:vertical; line-height:1.5; }
.preg-janela input:focus, .preg-janela textarea:focus { outline:2px solid var(--laranja); outline-offset:0; border-color:var(--laranja); }
.preg-dupla { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px; }
.preg-passagem { font-family:'Source Serif Pro',serif; font-size:14px; line-height:1.6; padding:10px 12px; margin:-4px 0 12px; border:1px solid var(--borda); border-radius:10px; background:var(--fundo-suave); max-height:180px; overflow-y:auto; }
.preg-passagem sup, .preg-slides sup { color:var(--laranja); font-weight:700; font-size:.65em; }
.preg-ponto { border:1px solid var(--borda); border-left:4px solid var(--laranja); border-radius:12px; padding:12px; margin-bottom:12px; display:grid; gap:8px; }
.preg-ponto-topo { display:flex; align-items:center; gap:6px; }
.preg-ponto-topo > b { flex:0 0 30px; height:30px; display:grid; place-items:center; border-radius:50%; background:var(--laranja); color:#171717; font-weight:800; }
.preg-ponto-topo input { flex:1; font-weight:700; }
.preg-ponto-topo button { flex:0 0 32px; height:32px; display:grid; place-items:center; border-radius:8px; border:1px solid var(--borda); }
.preg-ponto-topo button:disabled { opacity:.3; }
.preg-ponto-topo button svg { width:15px; height:15px; }
.preg-mais { margin-bottom:16px; }
.preg-medidor { font-size:12.5px; color:var(--texto-suave); margin-bottom:6px; }
.preg-falta, .preg-pronto { display:flex; gap:6px; align-items:flex-start; font-size:12.5px; margin-bottom:12px; }
.preg-falta { color:var(--acento); } .preg-pronto { color:#15803d; }
.preg-falta svg, .preg-pronto svg { width:15px; height:15px; flex:0 0 15px; margin-top:2px; }
.preg-esboco { border:1px solid var(--borda); border-radius:12px; padding:16px 18px; background:var(--fundo-suave); font-size:14px; line-height:1.55; }
.preg-esboco h4 { font-size:18px; font-weight:800; }
.preg-esboco-ref { color:var(--acento); font-weight:700; margin-bottom:8px; }
.preg-esboco h3 { font-size:14px; font-weight:800; color:var(--acento); margin:14px 0 4px; }
.preg-esboco p { margin-bottom:6px; }

/* Slides da pregação: sempre escuros, no desenho do portal */
.preg-slides { position:fixed; inset:0; z-index:90; background:#171717; color:#f5f5f4; font-family:'DM Sans',sans-serif; cursor:pointer; user-select:none;
  background-image:radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px), radial-gradient(ellipse at 80% 0%, rgba(255,146,0,.22), transparent 55%); background-size:28px 28px, 100% 100%; }
.preg-slides.hidden { display:none; }
.preg-slides .sl { position:absolute; inset:0; display:grid; place-items:center; padding:6vh 8vw 12vh; overflow:hidden; }
.sl-miolo { width:100%; max-width:1500px; animation:slEntra .35s ease; }
@keyframes slEntra { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.preg-slides small { display:block; font-size:clamp(14px,1.6vw,26px); font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#ff9200; margin-bottom:2.5vh; }
.preg-slides h1 { font-size:clamp(34px,6.4vw,112px); font-weight:800; line-height:1.05; letter-spacing:-.02em; }
.preg-slides h2 { font-size:clamp(26px,4.2vw,72px); font-weight:800; line-height:1.12; }
.preg-slides .capa .sl-miolo, .preg-slides .ideia .sl-miolo { text-align:center; }
.sl-ref { font-size:clamp(18px,2.4vw,40px); font-weight:700; color:#ff9200; margin-top:2vh; }
.sl-sub { font-size:clamp(14px,1.5vw,24px); color:#a8a29e; margin-top:3vh; }
.preg-slides blockquote { font-family:'Source Serif Pro',serif; font-size:clamp(20px,3vw,50px); line-height:1.45; border-left:6px solid #ff9200; padding-left:3vw; }
.preg-slides blockquote.curto { font-size:clamp(16px,2vw,32px); margin:2.5vh 0; color:#e7e5e4; }
.preg-slides ul, .preg-slides ol { margin-top:1vh; display:grid; gap:1.6vh; }
.preg-slides li { font-size:clamp(18px,2.5vw,42px); line-height:1.3; padding-left:1.4em; position:relative; }
.preg-slides ul li::before { content:''; position:absolute; left:.2em; top:.5em; width:.4em; height:.4em; border-radius:50%; background:#ff9200; }
.preg-slides ol.sl-mapa { counter-reset:mapa; }
.preg-slides ol.sl-mapa li { counter-increment:mapa; padding-left:1.9em; font-weight:700; }
.preg-slides ol.sl-mapa li::before { content:counter(mapa); position:absolute; left:0; top:.05em; width:1.35em; height:1.35em; display:grid; place-items:center; border-radius:50%; background:#ff9200; color:#171717; font-size:.75em; font-weight:800; }
.sl-num { display:inline-grid; place-items:center; width:clamp(40px,4.6vw,78px); height:clamp(40px,4.6vw,78px); border-radius:50%; background:#ff9200; color:#171717; font-size:clamp(20px,2.6vw,44px); font-weight:800; margin-bottom:2vh; }
.sl-aplica { margin-top:3vh; padding:1.6vh 1.6vw; border-radius:14px; background:rgba(255,146,0,.14); border:1px solid rgba(255,146,0,.45); font-size:clamp(16px,2vw,34px); line-height:1.35; }
.sl-aplica b { display:block; font-size:.6em; letter-spacing:.12em; text-transform:uppercase; color:#ff9200; margin-bottom:.3em; }
.sl-barra { position:absolute; left:50%; bottom:2.2vh; transform:translateX(-50%); display:flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.12); opacity:.35; transition:opacity .2s; cursor:default; }
.sl-barra:hover { opacity:1; }
.sl-barra button { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:#f5f5f4; }
.sl-barra button:hover { background:rgba(255,146,0,.25); }
.sl-barra button svg { width:18px; height:18px; }
.sl-barra span { font-size:13px; font-weight:700; min-width:54px; text-align:center; color:#d6d3d1; }
.sl-progresso { position:absolute; left:0; right:0; bottom:0; height:4px; background:rgba(255,255,255,.08); }
.sl-progresso i { display:block; height:100%; background:#ff9200; transition:width .3s; }

/* Salvar com ênfase: botão que chama quando há alteração e faixa de confirmação */
.vm-salvar.pendente, .preg-topo button.cheio.pendente { animation:salvarChama 1.4s ease-in-out infinite; }
@keyframes salvarChama { 0%,100% { box-shadow:0 0 0 0 rgba(255,146,0,.65); } 50% { box-shadow:0 0 0 9px rgba(255,146,0,0); } }
.vm-salvar.salvo { background:#15803d !important; }
.aviso-salvo { position:fixed; left:50%; top:22px; z-index:120; transform:translate(-50%,-140%); display:flex; align-items:center; gap:14px; min-width:min(420px,92vw); max-width:92vw; padding:16px 22px; border-radius:16px; background:#15803d; color:#fff; box-shadow:0 18px 50px rgba(0,0,0,.35); opacity:0; transition:transform .35s cubic-bezier(.2,.9,.3,1.2), opacity .25s; pointer-events:none; }
.aviso-salvo.excluido, .aviso-salvo.erro { background:#b91c1c; }
.aviso-salvo.mostra { transform:translate(-50%,0); opacity:1; }
.aviso-salvo svg { width:34px; height:34px; flex:0 0 34px; padding:6px; border-radius:50%; background:rgba(255,255,255,.2); }
.aviso-salvo b { display:block; font-size:17px; font-weight:800; }
.aviso-salvo span { display:block; font-size:13px; opacity:.9; }
.lig-linha { display:flex; gap:6px; align-items:stretch; margin-bottom:6px; }
.lig-linha .lig-item { margin-bottom:0; min-width:0; }
.lig-excluir { flex:0 0 38px; display:grid; place-items:center; border:1px solid var(--borda); border-radius:10px; color:#b91c1c; }
.lig-excluir:hover { background:#fee2e2; border-color:#fca5a5; }
.lig-excluir svg { width:16px; height:16px; }
.preg-topo button.perigo { color:#b91c1c; }
.preg-topo button.perigo:hover { border-color:#b91c1c; background:#fee2e2; color:#b91c1c; }

.preg-estilos.tres { grid-template-columns:repeat(3,minmax(0,1fr)); }
.preg-aviso { grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; padding:12px 16px; border-radius:12px; border:1px solid rgba(255,146,0,.5); background:rgba(255,146,0,.1); font-size:13.5px; }
.preg-aviso > svg { width:20px; height:20px; flex:0 0 20px; color:var(--acento); }
.preg-aviso > div { flex:1 1 320px; }
.preg-aviso button { padding:8px 13px; border-radius:10px; border:1px solid var(--borda); background:var(--fundo-cartao); font-size:13px; font-weight:700; }

/* ---------- Planos de leitura em grupo ---------- */
.plano-topo { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:16px; }
.plano-sub { font-size:13px; color:var(--texto-suave); margin-top:2px; }
.plano-msg { font-size:13px; color:var(--acento); }
.plano-btn { display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border-radius:10px; border:1px solid var(--borda); background:var(--fundo-suave); font-size:13px; font-weight:700; }
.plano-btn svg { width:15px; height:15px; }
.plano-btn:hover { border-color:var(--laranja); color:var(--acento); }
.plano-btn.cheio { background:var(--laranja); border-color:var(--laranja); color:#171717; }
.plano-btn.perigo { color:#b91c1c; }
.plano-grade { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
.plano-cartao { text-align:left; border:1px solid var(--borda); border-left:4px solid var(--laranja); background:var(--fundo-cartao); border-radius:12px; padding:14px 16px; }
.plano-cartao:hover { background:var(--fundo-suave); }
.plano-cartao b { display:block; font-size:16px; } .plano-cartao span { display:block; font-size:12.5px; color:var(--texto-suave); margin:2px 0 8px; } .plano-cartao em { font-style:normal; font-size:13px; font-weight:700; color:var(--acento); }
.plano-vazio { text-align:center; padding:34px 16px; border:1px dashed var(--borda); border-radius:14px; }
.plano-vazio > svg { width:38px; height:38px; color:var(--laranja); margin:0 auto 10px; }
.plano-vazio h3 { font-size:18px; font-weight:800; } .plano-vazio p { font-size:14px; color:var(--texto-suave); max-width:520px; margin:6px auto 16px; }
.plano-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; }
.plano-form .largo { grid-column:1 / -1; }
.plano-form label > span, .plano-atalhos > span { display:block; font-size:12px; font-weight:700; color:var(--acento); margin-bottom:4px; }
.plano-form input, .plano-form select { width:100%; border:1px solid var(--borda); border-radius:10px; padding:9px 12px; font-size:14px; background:var(--fundo-cartao); color:inherit; }
.plano-atalhos button { margin:0 6px 6px 0; padding:6px 12px; border-radius:999px; border:1px solid rgba(255,146,0,.4); background:rgba(255,146,0,.1); color:var(--acento); font-size:12.5px; font-weight:700; }
.plano-resumo { font-size:14px; padding:10px 14px; border-radius:10px; background:var(--fundo-suave); }
.plano-colunas { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; }
@media (min-width:980px) { .plano-colunas { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); } }
.plano-barra { height:8px; border-radius:99px; background:var(--fundo-suave); border:1px solid var(--borda); overflow:hidden; }
.plano-barra i { display:block; height:100%; background:var(--laranja); border-radius:99px; transition:width .3s; }
.plano-dia { display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid var(--borda); border-left:4px solid var(--borda); border-radius:12px; padding:12px 14px; margin-top:10px; }
.plano-dia.hoje { border-left-color:var(--laranja); background:var(--fundo-suave); }
.plano-dia.feito { border-left-color:#15803d; }
.plano-dia small { display:block; font-size:11.5px; font-weight:700; color:var(--texto-suave); text-transform:uppercase; letter-spacing:.05em; }
.plano-dia b { display:block; font-size:16px; margin:2px 0 6px; }
.plano-caps button { margin:0 5px 4px 0; padding:3px 10px; border-radius:999px; border:1px solid rgba(255,146,0,.35); background:rgba(255,146,0,.1); color:var(--acento); font-size:12px; font-weight:700; }
.plano-h4 { font-size:13px; font-weight:800; margin-top:18px; }
.plano-pessoa { display:grid; grid-template-columns:1fr auto; gap:2px 10px; align-items:center; padding:9px 0; border-bottom:1px solid var(--borda); }
.plano-pessoa b { font-size:14px; } .plano-pessoa small { font-weight:500; color:var(--texto-suave); }
.plano-pessoa span { font-size:12px; font-weight:700; } .plano-pessoa .emdia { color:#15803d; } .plano-pessoa .atras { color:var(--acento); }
.plano-pessoa .plano-barra { grid-column:1 / -1; height:6px; }
.plano-acoes { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }

.plano-ja-rapido { display:flex; flex-wrap:wrap; gap:10px 24px; justify-content:space-between; padding:12px 14px; border:1px solid var(--borda); border-radius:12px; background:var(--fundo-suave); margin-bottom:14px; }
.plano-ja-rapido > div { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.plano-ja-rapido span { font-size:13px; font-weight:700; }
.plano-ja-rapido select { border:1px solid var(--borda); border-radius:10px; padding:8px 10px; font-size:14px; background:var(--fundo-cartao); color:inherit; }
.plano-ja-livro { border:1px solid var(--borda); border-radius:12px; margin-bottom:8px; padding:0 14px; }
.plano-ja-livro summary { display:flex; align-items:center; gap:12px; padding:11px 0; cursor:pointer; list-style:none; }
.plano-ja-livro summary b { flex:1; font-size:15px; } .plano-ja-livro summary span { font-size:12.5px; color:var(--texto-suave); }
.plano-ja-livro summary button { padding:5px 11px; border-radius:999px; border:1px solid rgba(255,146,0,.4); background:rgba(255,146,0,.1); color:var(--acento); font-size:12px; font-weight:700; }
.plano-ja-caps { display:flex; flex-wrap:wrap; gap:6px; padding:0 0 14px; }
.plano-ja-caps button { width:40px; height:36px; border-radius:9px; border:1px solid var(--borda); background:var(--fundo-cartao); font-size:13px; font-weight:700; }
.plano-ja-caps button.lido { background:#15803d; border-color:#15803d; color:#fff; }
.plano-ja-pe { position:sticky; bottom:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding:12px 0 2px; margin-top:10px; background:var(--fundo-cartao); border-top:1px solid var(--borda); font-size:13.5px; }

.plano-semana > span { display:block; font-size:12px; font-weight:700; color:var(--acento); margin-bottom:6px; }
.plano-semana #pl-dias { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.plano-semana label { display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border:1px solid var(--borda); border-radius:10px; font-size:13px; font-weight:700; text-transform:capitalize; cursor:pointer; }
.plano-semana label:has(input:checked) { background:rgba(255,146,0,.14); border-color:var(--laranja); }
.plano-semana input { width:auto; accent-color:#ff9200; }
.plano-semana > button { margin:0 6px 6px 0; padding:6px 12px; border-radius:999px; border:1px solid rgba(255,146,0,.4); background:rgba(255,146,0,.1); color:var(--acento); font-size:12.5px; font-weight:700; }

/* ---------- Panorama Bíblico (períodos e temas) ---------- */
.pan-grupo { font-size:16px; font-weight:800; margin:18px 0 10px; } .pan-grupo small { display:block; font-size:12.5px; font-weight:500; color:var(--texto-suave); }
.pan-grade { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.pan-cartao { text-align:left; display:grid; gap:4px; align-content:start; padding:16px; border:1px solid var(--borda); border-radius:14px; background:var(--fundo-cartao); transition:transform .15s, border-color .15s; }
.pan-cartao:hover { border-color:var(--laranja); transform:translateY(-2px); }
.pan-icone { font-size:26px; line-height:1; } .pan-icone.grande { font-size:44px; }
.pan-cartao b { font-size:16px; } .pan-cartao small { font-size:12.5px; line-height:1.45; color:var(--texto-suave); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pan-cartao em { font-style:normal; font-size:11.5px; font-weight:700; color:var(--acento); margin-top:4px; }
.pan-painel { margin-bottom:6px; }
.pan-capa { display:flex; flex-wrap:wrap; gap:16px; align-items:flex-start; padding:18px; border:1px solid var(--borda); border-radius:16px; background:var(--fundo-suave); }
.pan-capa > div { flex:1 1 320px; } .pan-capa small { font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--acento); }
.pan-capa h3 { font-size:26px; font-weight:800; line-height:1.15; } .pan-capa p { font-size:14px; line-height:1.55; margin-top:4px; max-width:900px; }
.pan-numeros { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.pan-numeros span { display:grid; padding:7px 12px; border:1px solid var(--borda); border-radius:10px; background:var(--fundo-cartao); font-size:11px; color:var(--texto-suave); text-transform:uppercase; letter-spacing:.05em; }
.pan-numeros b { font-size:16px; color:var(--acento); text-transform:none; letter-spacing:0; }
.pan-acoes { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:14px 0 6px; }
.pan-acoes > span { font-size:12px; font-weight:800; color:var(--texto-suave); margin-right:4px; }
.pan-acoes button { display:inline-flex; align-items:center; gap:6px; padding:8px 13px; border-radius:10px; border:1px solid rgba(255,146,0,.4); background:rgba(255,146,0,.1); color:var(--acento); font-size:13px; font-weight:700; }
.pan-acoes button:hover { background:var(--laranja); border-color:var(--laranja); color:#171717; } .pan-acoes svg { width:15px; height:15px; }
.pan-colunas { display:grid; grid-template-columns:minmax(0,1fr); gap:0 28px; }
@media (min-width:980px) { .pan-colunas { grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); } }
.pan-sec { margin-top:20px; } .pan-sec:empty { display:none; }
.pan-sec h4, .pan-conexoes { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--acento); margin-bottom:10px; }
.pan-sec h4 svg, .pan-conexoes svg { width:15px; height:15px; } .pan-conexoes { margin:26px 0 12px; padding-top:18px; border-top:1px solid var(--borda); }
.pan-era { border-left:3px solid var(--laranja); padding:2px 0 2px 14px; margin-bottom:14px; }
.pan-era-topo { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px; } .pan-era-topo b { font-size:15px; } .pan-era-topo span { font-size:12px; font-weight:700; color:var(--acento); }
.pan-era p { font-size:13px; color:var(--texto-suave); margin:2px 0 6px; } .pan-era li { display:grid; grid-template-columns:110px 1fr; gap:10px; font-size:13px; padding:3px 0; } .pan-era li span { font-weight:700; color:var(--texto-suave); font-size:12px; }
.pan-livros { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:8px; }
.pan-livro { display:flex; justify-content:space-between; gap:10px; border:1px solid var(--borda); border-radius:12px; padding:10px 12px; background:var(--fundo-cartao); }
.pan-livro b { display:block; font-size:14.5px; } .pan-livro small { display:block; font-size:11.5px; color:var(--texto-suave); } .pan-livro p { font-size:12.5px; margin-top:3px; }
.pan-livro span { display:grid; gap:4px; align-content:start; } .pan-livro button { padding:4px 10px; border-radius:8px; border:1px solid var(--borda); font-size:12px; font-weight:700; } .pan-livro button:hover { border-color:var(--laranja); color:var(--acento); }
.pan-cristo { font-size:13.5px; line-height:1.55; padding:9px 12px; border-radius:10px; background:var(--fundo-suave); margin-bottom:6px; } .pan-cristo b { color:var(--acento); margin-right:4px; }
.pan-chips { display:flex; flex-wrap:wrap; gap:6px; } .pan-chips button { padding:5px 11px; border-radius:999px; border:1px solid var(--borda); background:var(--fundo-cartao); font-size:12.5px; font-weight:600; } .pan-chips button:hover { border-color:var(--laranja); color:var(--acento); }

.pan-nav { display:flex; gap:8px; margin-bottom:16px; }
.pan-nav button { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 10px; border-radius:12px; border:1px solid var(--borda); background:var(--fundo-suave); font-size:14px; font-weight:800; }
.pan-nav button svg { width:17px; height:17px; }
.pan-nav button.ativo { background:var(--laranja); border-color:var(--laranja); color:#171717; }
.pan-fichas { display:flex; flex-wrap:wrap; gap:6px; }
.pan-fichas button { padding:5px 11px; border-radius:999px; border:1px solid var(--borda); background:var(--fundo-cartao); font-size:12px; font-weight:700; }
.pan-fichas button:hover { border-color:var(--laranja); color:var(--acento); }

/* ---------- Buscar: tudo sobre a palavra ---------- */
.bp { position:relative; --bp-at:#d97706; --bp-nt:#0284c7; }
.bp-tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
.bp-tile { border:1px solid var(--borda); border-radius:14px; padding:14px 16px; background:var(--fundo-cartao); }
.bp-tile b { display:block; font-size:30px; font-weight:800; line-height:1.1; color:var(--texto); }
.bp-tile span { font-size:12.5px; font-weight:700; color:var(--texto-suave); } .bp-tile small { display:block; font-size:11.5px; color:var(--texto-suave); }
.bp-nav { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:14px 0 4px; position:sticky; top:64px; z-index:3; padding:8px 0; background:var(--fundo-painel); }
.bp-nav > span { font-size:12px; font-weight:800; color:var(--texto-suave); margin-right:2px; }
.bp-nav button { padding:6px 12px; border-radius:999px; border:1px solid var(--borda); background:var(--fundo-cartao); font-size:12.5px; font-weight:700; } .bp-nav button:hover { border-color:var(--laranja); }
.bp-nav button b, .bp-sec h3 b { font-weight:800; color:var(--acento); }
.bp-graficos { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; margin-top:8px; }
@media (min-width:980px) { .bp-graficos { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); } }
.bp-graficos figure { border:1px solid var(--borda); border-radius:14px; padding:16px 18px; background:var(--fundo-cartao); min-width:0; }
.bp-graficos figcaption { font-size:14.5px; font-weight:800; color:var(--texto); margin-bottom:10px; } .bp-graficos figcaption small { display:block; font-size:12px; font-weight:500; color:var(--texto-suave); }
.bp-legenda { display:flex; flex-wrap:wrap; gap:6px 18px; font-size:12.5px; color:var(--texto-suave); margin-bottom:10px; }
.bp-legenda i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; } .bp-legenda i.at, .bp .at > i, .bp .at > div > i { background:var(--bp-at); } .bp-legenda i.nt, .bp .nt > i, .bp .nt > div > i { background:var(--bp-nt); }
.bp-cols-caixa { position:relative; padding-left:34px; }
.bp-max { position:absolute; left:0; top:-6px; font-size:11px; color:var(--texto-suave); }
.bp-cols { display:flex; align-items:flex-end; gap:2px; height:170px; border-bottom:1px solid var(--borda); border-top:1px dashed var(--borda); }
.bp-col { flex:1 1 0; min-width:0; height:100%; display:flex; align-items:flex-end; padding:0; border-radius:4px 4px 0 0; }
.bp-col > i { display:block; width:100%; border-radius:4px 4px 0 0; transition:opacity .15s; }
.bp-col.divisa { margin-left:8px; }
.bp-col:hover, .bp-col:focus-visible { background:var(--fundo-suave); outline:none; } .bp-cols:has(.escolhido) .bp-col:not(.escolhido) > i { opacity:.35; }
.bp-eixo { display:flex; justify-content:space-between; font-size:11px; color:var(--texto-suave); margin-top:5px; }
.bp-barras { display:grid; gap:7px; }
.bp-barra { display:grid; grid-template-columns:118px 1fr 44px; align-items:center; gap:10px; text-align:left; padding:2px 0; border-radius:6px; }
.bp-barra span { font-size:13px; color:var(--texto); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .bp-barra b { font-size:13px; font-weight:800; color:var(--texto); text-align:right; }
.bp-barra div { height:14px; } .bp-barra div > i { display:block; height:100%; border-radius:0 4px 4px 0; }
.bp-barra:hover, .bp-barra.escolhido { background:var(--fundo-suave); }
.bp-tabela { margin-top:10px; font-size:13px; } .bp-tabela summary { cursor:pointer; font-weight:700; color:var(--acento); }
.bp-tabela table { width:100%; border-collapse:collapse; margin-top:8px; } .bp-tabela th, .bp-tabela td { text-align:left; padding:6px 10px; border-bottom:1px solid var(--borda); } .bp-tabela td:nth-child(n+3), .bp-tabela th:nth-child(n+3) { text-align:right; font-variant-numeric:tabular-nums; }
.bp-tabela td button { font-weight:700; text-decoration:underline; text-decoration-color:var(--laranja); }
.bp-sec { margin-top:24px; scroll-margin-top:170px; }
.bp-sec h3 { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:800; margin-bottom:10px; } .bp-sec h3 svg { width:17px; height:17px; color:var(--acento); }
.bp-chips { display:flex; flex-wrap:wrap; gap:8px; }
.bp-chips button { text-align:left; padding:8px 13px; border:1px solid var(--borda); border-radius:12px; background:var(--fundo-cartao); font-size:13.5px; font-weight:700; max-width:320px; }
.bp-chips button:hover { border-color:var(--laranja); } .bp-chips small { display:block; font-size:11.5px; font-weight:500; color:var(--texto-suave); }
.bp-conexao { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 14px; align-items:center; border:1px solid var(--borda); border-left:3px solid var(--laranja); border-radius:10px; padding:8px 12px; margin-bottom:6px; background:var(--fundo-cartao); }
.bp-conexao p { font-size:13.5px; flex:1 1 320px; } .bp-conexao button { font-size:12px; font-weight:700; color:var(--acento); white-space:nowrap; }
.bp-filtro { font-size:13px; margin-bottom:10px; padding:8px 12px; border-radius:10px; background:var(--fundo-suave); } .bp-filtro button { margin-left:8px; font-weight:700; color:var(--acento); text-decoration:underline; }
.bp-dica { position:absolute; z-index:5; pointer-events:none; padding:6px 10px; border-radius:8px; background:#1c1917; color:#fafaf9; font-size:12.5px; font-weight:600; white-space:nowrap; box-shadow:0 6px 20px rgba(0,0,0,.25); }

/* Porção diária do plano: lista, grade e cartões */
.porcao { margin-top:26px; padding-top:18px; border-top:1px solid var(--borda); }
.porcao-legenda { display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; font-size:12px; color:var(--texto-suave); margin-bottom:10px; }
.porcao-legenda span { display:inline-block; width:11px; height:11px; border-radius:3px; margin-left:10px; border:1px solid var(--borda); }
.porcao-legenda span:first-child { margin-left:0; }
.porcao-legenda .feito, .porcao-grade .feito { background:#15803d; border-color:#15803d; color:#fff; }
.porcao-legenda .hoje, .porcao-grade .hoje { background:var(--laranja); border-color:var(--laranja); color:#171717; }
.porcao-legenda .pendente, .porcao-grade .pendente { background:rgba(255,146,0,.16); border-color:var(--laranja); }
.porcao-grade { display:grid; grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); gap:6px; }
.porcao-grade button { display:grid; gap:1px; justify-items:center; padding:8px 2px; border:1px solid var(--borda); border-radius:10px; background:var(--fundo-cartao); }
.porcao-grade button:hover { outline:2px solid var(--laranja); }
.porcao-grade b { font-size:15px; } .porcao-grade small { font-size:10.5px; opacity:.8; }
.porcao-lista > div { display:grid; grid-template-columns:38px 120px 1fr auto auto; align-items:center; gap:10px; padding:8px 10px; border-bottom:1px solid var(--borda); border-left:3px solid transparent; }
.porcao-lista > div.feito { border-left-color:#15803d; } .porcao-lista > div.hoje { border-left-color:var(--laranja); background:var(--fundo-suave); } .porcao-lista > div.pendente { border-left-color:rgba(255,146,0,.6); }
.porcao-lista .n { font-weight:800; font-size:15px; text-align:center; } .porcao-lista .q { font-size:12.5px; color:var(--texto-suave); } .porcao-lista .q::first-letter { text-transform:uppercase; }
.porcao-lista .t button { margin:0 5px 3px 0; padding:3px 10px; border-radius:999px; border:1px solid rgba(255,146,0,.35); background:rgba(255,146,0,.1); color:var(--acento); font-size:12px; font-weight:700; }
.porcao-lista em { font-style:normal; font-size:11.5px; font-weight:700; color:var(--texto-suave); } .porcao-lista .plano-btn { padding:6px 12px; }
@media (max-width:640px) { .porcao-lista > div { grid-template-columns:30px 1fr auto; } .porcao-lista .q { grid-column:2; } .porcao-lista .t { grid-column:2 / -1; grid-row:2; } .porcao-lista em { display:none; } }
.porcao-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:0 12px; }

.plano-escolha span { display:block; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--acento); }
.plano-escolha select { font-size:19px; font-weight:800; border:1px solid var(--borda); border-radius:10px; padding:6px 10px; background:var(--fundo-cartao); color:inherit; max-width:min(560px,82vw); }
.plano-faixa { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px; padding:14px 16px; border:1px solid var(--borda); border-radius:14px; background:var(--fundo-suave); }
.plano-faixa > div { flex:1 1 320px; } .plano-faixa b { display:block; font-size:15px; margin-bottom:8px; }
.porcao.primeira { border-top:0; margin-top:18px; padding-top:0; }

/* ---------- Memorizar versículos ---------- */
.mem-novo { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.mem-novo input { flex:1 1 260px; border:1px solid var(--borda); border-radius:10px; padding:9px 12px; font-size:14px; background:var(--fundo-cartao); color:inherit; }
.mem-sug { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:16px; font-size:12.5px; } .mem-sug span { font-weight:700; color:var(--texto-suave); }
.mem-sug button { padding:5px 11px; border-radius:999px; border:1px solid rgba(255,146,0,.4); background:rgba(255,146,0,.1); color:var(--acento); font-weight:700; }
.mem-lista { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:10px; }
.mem-item { display:flex; justify-content:space-between; gap:12px; border:1px solid var(--borda); border-left:4px solid var(--laranja); border-radius:12px; padding:12px 14px; background:var(--fundo-cartao); }
.mem-item b { font-size:15px; } .mem-item p { font-family:'Source Serif Pro',serif; font-size:13.5px; line-height:1.5; color:var(--texto-suave); margin:3px 0 8px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.mem-nivel { font-size:12px; color:var(--texto-suave); } .mem-nivel i { display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:3px; border:1px solid var(--borda); } .mem-nivel i.on { background:var(--laranja); border-color:var(--laranja); }
.mem-nivel em { font-style:normal; font-weight:700; } .mem-nivel em.hoje { color:var(--acento); }
.mem-botoes { display:grid; gap:6px; align-content:start; justify-items:end; } .mem-botoes .lig-excluir { width:38px; height:36px; }
.mem-treino { position:fixed; inset:0; z-index:70; overflow-y:auto; background:var(--fundo-painel); display:grid; place-items:center; padding:20px; }
.mem-treino.hidden { display:none; }
.mem-palco { width:min(900px,100%); text-align:center; }
.mem-cabeca { display:flex; justify-content:space-between; align-items:center; font-size:13px; color:var(--texto-suave); margin-bottom:28px; } .mem-cabeca button { font-size:28px; line-height:1; padding:0 8px; }
.mem-palco small { font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--acento); }
.mem-palco h2 { font-size:clamp(26px,4vw,40px); font-weight:800; margin:4px 0 6px; }
.mem-instrucao { font-size:14px; color:var(--texto-suave); margin-bottom:18px; }
.mem-palco blockquote { font-family:'Source Serif Pro',serif; font-size:clamp(19px,2.6vw,28px); line-height:1.7; padding:22px 26px; border:1px solid var(--borda); border-radius:16px; background:var(--fundo-suave); text-align:left; }
.mem-palco blockquote.oculto { text-align:center; letter-spacing:.5em; color:var(--texto-suave); }
.mem-palco mark { background:rgba(21,128,61,.18); color:inherit; border-radius:4px; padding:0 3px; }
.mem-buraco { color:var(--texto-suave); letter-spacing:.05em; } .mem-buraco.vez { color:var(--acento); font-weight:700; }
.mem-banco { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:20px; }
.mem-banco button { padding:10px 16px; border-radius:12px; border:1px solid var(--borda); background:var(--fundo-cartao); font-size:17px; font-weight:700; }
.mem-banco button:hover { border-color:var(--laranja); } .mem-banco button.errada { background:#fee2e2; border-color:#b91c1c; color:#b91c1c; animation:memTreme .35s; }
@keyframes memTreme { 25% { transform:translateX(-5px); } 75% { transform:translateX(5px); } }
.mem-erros { font-size:13px; color:var(--texto-suave); margin-top:10px; }
.mem-acoes { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:22px; } .mem-acoes .plano-btn { padding:12px 20px; font-size:15px; }
.mem-fim > svg { width:54px; height:54px; color:var(--laranja); margin:0 auto 10px; } .mem-fim p { color:var(--texto-suave); margin:6px 0 20px; }
.mem-treinar { padding:12px 18px; font-size:15px; }

.perg-memorizar { display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:6px 14px; border-radius:999px; border:1px solid rgba(255,146,0,.5); background:rgba(255,146,0,.12); color:var(--acento); font-size:12.5px; font-weight:700; }
.perg-memorizar:hover { background:var(--laranja); border-color:var(--laranja); color:#171717; } .perg-memorizar.na-lista { border-color:#15803d; color:#15803d; background:rgba(21,128,61,.1); }
.mem-para-voce { border:1px solid var(--borda); border-radius:14px; padding:14px 16px; margin-bottom:14px; background:var(--fundo-suave); }
.mem-para-voce h3 { font-size:14px; font-weight:800; margin-bottom:8px; }
.mem-linha { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:6px 0; }
.mem-linha > span { display:inline-flex; align-items:center; gap:6px; flex:0 0 250px; font-size:12.5px; font-weight:700; color:var(--texto-suave); } .mem-linha > span svg { width:15px; height:15px; color:var(--acento); }
.mem-linha button { display:inline-flex; align-items:center; gap:5px; padding:6px 12px; border-radius:999px; border:1px solid rgba(255,146,0,.4); background:var(--fundo-cartao); color:var(--acento); font-size:12.5px; font-weight:700; } .mem-linha button svg { width:13px; height:13px; }
.mem-linha button:hover { background:var(--laranja); border-color:var(--laranja); color:#171717; } .mem-linha em { font-style:normal; font-size:12.5px; font-weight:700; color:#15803d; }