/* Modo escuro (padrão): fundo preto, texto bege dourado desbotado.
   Modo claro: papel reciclado amarelado, texto sépia escuro. */
/* Regra de cor: toda cor "colorida" (destaques, alertas, ícones) é desbotada —
   saturação baixa, nada vivo. Vale para qualquer livro novo. */
:root {
  --fundo: #0e0d0b;       /* quase preto: evita o "vazamento" da letra clara no preto puro */
  --texto: #c4b89e;          /* cor única de leitura */
  --texto-lido: #958b77;     /* páginas anteriores */
  --sutil: #8b8377;
  --apagado: #6f685d;
  --acento: #8fa5b8;         /* cor do livro: só capa e detalhes, nunca o texto */
  --linha: #2b2722;
  --painel: #0c0b09;
  --selecao: #3a3326;
  --falha: #9a6a60;
  --erro: #c3958b;
  color-scheme: dark;
}
:root[data-tema="claro"] {
  --fundo: #ede4cf;
  --texto: #3b3328;          /* cor única de leitura */
  --texto-lido: #6b6153;     /* páginas anteriores */
  --sutil: #7a6f5d;
  --apagado: #968a75;
  --acento: #4d6478;         /* cor do livro: só capa e detalhes, nunca o texto */
  --linha: #d6c8aa;
  --painel: #f4ecdb;
  --selecao: #dccb9f;
  --falha: #8a5d52;
  --erro: #8f5a4e;
  color-scheme: light;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
html { --escala: 1; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: 'EB Garamond', Georgia, 'Times New Roman', serif;
  font-size: calc(clamp(1.2rem, 1.05rem + 0.5vw, 1.35rem) * var(--escala));
  line-height: 1.62;
  min-height: 100dvh;
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: none;
  transition: background-color 0.35s, color 0.35s;
}
::selection { background: var(--selecao); }

/* ---------- topo ---------- */
.topo {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 5;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: calc(env(safe-area-inset-top) + 10px) 16px 10px;
  background: linear-gradient(var(--fundo) 55%, transparent);
  pointer-events: none;
}
.topo > * { pointer-events: auto; }
.topo-esq { display: flex; align-items: center; gap: 8px; }
.topo-dir { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.link.icone { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 8px; }
#btn-fonte span { font-size: 1rem; letter-spacing: 0; }
#btn-fonte small { font-size: 0.72em; }
#btn-compartilhar:hover, #btn-compartilhar:focus-visible { color: #8fa898; }
.link {
  background: none; border: 0; padding: 6px 2px;
  color: var(--sutil); font: inherit; font-size: 0.85rem;
  letter-spacing: 0.04em; cursor: pointer;
}
.link:hover, .link:focus-visible { color: var(--texto); }

/* ---------- palco ---------- */
.palco {
  max-width: 560px;
  margin: 0 auto;
  padding: calc(env(safe-area-inset-top) + 52px) 16px calc(env(safe-area-inset-bottom) + 84px);
}
.moldura {
  position: relative;
  width: min(100%, 50vh, 460px);
  aspect-ratio: 1 / 1;
  margin: 0 auto 30px;
  overflow: hidden;
}
.camada {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  will-change: opacity, filter, transform;
}
img.camada:not([src]) { visibility: hidden; }

.titulo-livro {
  display: grid; place-items: center;
  text-align: center;
  padding: 24px;
}
.titulo-livro h1 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(2.4rem, 11vw, 3.4rem);
  letter-spacing: 0.06em;
  line-height: 1.05;
  color: var(--texto);
}
.titulo-livro p {
  margin: 10px 0 0;
  font-style: italic;
  font-size: clamp(1.1rem, 4.6vw, 1.4rem);
  color: var(--acento);
  letter-spacing: 0.03em;
}
/* Capa com foto: escurecida por cima para o título ler bem nos dois temas. */
.titulo-livro.com-foto {
  background:
    radial-gradient(ellipse at center, rgba(12,11,10,0) 30%, rgba(12,11,10,.45) 100%),
    linear-gradient(rgba(12,11,10,.35), rgba(12,11,10,.05) 45%, rgba(12,11,10,.1) 70%, rgba(12,11,10,.65)),
    var(--foto) center / cover, #121110;
  text-shadow: 0 2px 14px rgba(0,0,0,.85), 0 0 3px rgba(0,0,0,.6);
  place-items: start center;
  padding-top: 13%; /* título acima do centro: a foto (o carro na curva) aparece embaixo */
}
.titulo-livro.com-foto h1 { color: #ece4d6; }
:root[data-tema="claro"] .titulo-livro.com-foto p:not(.ficha), :root[data-tema="claro"] .titulo-livro.com-foto .orn { color: color-mix(in srgb, var(--acento) 45%, #ece4d6); }
.titulo-livro.com-foto p.ficha { position: absolute; left: 0; right: 0; bottom: 18px; margin: 0; color: #b5ac9d; }
/* A ficha só aparece na tela de abertura; durante a leitura a capa mostra só o título. */
.titulo-livro:not(.na-abertura) p.ficha { display: none; }
.titulo-livro p.ficha {
  margin-top: 18px;
  font-style: normal;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  color: var(--sutil);
}
.titulo-livro .orn {
  display: block;
  color: var(--acento);
  font-size: 0.9rem;
  margin-bottom: 18px;
  opacity: 0.8;
}
/* Ornamento de terminal: >_ com o cursor piscando */
.titulo-livro .orn.prompt {
  font-family: ui-monospace, 'Cascadia Mono', Consolas, Menlo, monospace;
  font-size: 1.05rem;
  letter-spacing: 0.08em;
  opacity: 0.9;
}
.titulo-livro .orn.prompt i { font-style: normal; animation: cursor-piscar 1.1s steps(1) infinite; }
@keyframes cursor-piscar { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .titulo-livro .orn.prompt i { animation: none; }
}

/* ---------- texto ---------- */
.texto {
  min-height: 3em;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures;
  text-rendering: optimizeLegibility;
}
/* Claro: Garamond 500 (a 400 fica fina demais no papel). Escuro: traço suavizado. */
:root[data-tema="claro"] .texto { font-weight: 500; }
:root:not([data-tema="claro"]) body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.texto p {
  margin: 0 0 1.05em;
  letter-spacing: 0.005em;
  text-wrap: pretty;
  hyphens: manual;
}
.pergunta { margin: 0 0 12px; font-style: italic; color: var(--texto); }
body.em-historia .moldura { width: 100%; height: 168px; aspect-ratio: auto; margin-bottom: 24px; }
body.em-historia .titulo-livro { padding: 18px; place-items: center; }
body.em-historia .titulo-livro.com-foto { padding-top: 18px; background-position: center 38%; }
body.em-historia .titulo-livro h1 { font-size: 2.15rem; }
body.em-historia .titulo-livro p { font-size: 1.1rem; margin-top: 5px; }
body.em-historia .titulo-livro .orn { margin-bottom: 7px; font-size: .7rem; }
@media (max-width: 600px) {
  .topo { padding-left: 12px; padding-right: 12px; }
  .topo-esq { gap: 2px; }
  .rotulo-voltar { display: none; }
  #btn-voltar { min-width: 40px; min-height: 44px; font-size: 1.6rem; padding: 0; }
  #btn-conta { min-height: 44px; max-width: 85px; line-height: 1.1; }
  .palco { padding-top: calc(env(safe-area-inset-top) + 66px); padding-left: 20px; padding-right: 20px; }
  body.em-historia .moldura { height: 136px; margin-bottom: 20px; }
  body.em-historia .titulo-livro h1 { font-size: 1.9rem; }
  .dialogo { max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px); overflow-y: auto; }
  .fechar { min-width: 44px; min-height: 44px; top: 0; right: 0; }
  .dialogo-corpo { padding-top: 40px; }
}
.cursor {
  display: inline-block;
  width: 0.5ch; height: 1.05em;
  margin-left: 2px;
  vertical-align: -0.15em;
  background: var(--acento);
  opacity: 0.7;
  animation: piscar 1.05s steps(1) infinite;
}
@keyframes piscar { 50% { opacity: 0; } }

/* ---------- opções ---------- */
.opcoes { margin-top: 26px; }
.opcoes button {
  display: block;
  width: 100%;
  margin: 0 0 10px;
  padding: 13px 16px;
  text-align: left;
  font: inherit;
  font-size: 1.02em;
  line-height: 1.4;
  color: var(--texto);
  background: transparent;
  border: 1px solid var(--linha);
  border-radius: 2px;
  cursor: pointer;
  transition: border-color 0.25s, background 0.25s, color 0.25s;
}
.opcoes button:hover, .opcoes button:focus-visible {
  border-color: var(--acento);
  background: color-mix(in srgb, var(--acento) 7%, transparent);
  outline: none;
}
.opcoes button:disabled { opacity: 0.45; cursor: default; }
.opcoes button.discreta {
  border-color: transparent;
  text-align: center;
  font-style: italic;
  color: var(--sutil);
}
.opcoes button.discreta:hover, .opcoes button.discreta:focus-visible { color: var(--texto); background: none; }

.selo {
  text-align: center;
  font-size: 0.78rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--acento);
  margin: 0 0 18px;
}
.selo.falha { color: var(--falha); }

.paywall {
  border-top: 1px solid var(--linha);
  padding-top: 22px;
  margin-bottom: 18px;
  text-align: center;
  color: var(--sutil);
}
.paywall p { margin: 0 0 10px; }
.paywall strong { color: var(--texto); font-weight: 500; }

/* ---------- rodapé ---------- */
.rodape {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 5;
  display: flex; justify-content: center; gap: 8px;
  padding: 16px 16px calc(env(safe-area-inset-bottom) + 8px);
  background: linear-gradient(transparent, var(--fundo) 45%);
  color: var(--apagado);
  font-size: 0.95rem;
  letter-spacing: 0.04em;
  white-space: nowrap;
  overflow: hidden;
  pointer-events: none;
}
.rodape span, .rodape a { flex-shrink: 0; }
.rodape a { color: inherit; text-decoration: none; pointer-events: auto; }
.rodape a:hover, .rodape a:focus-visible { color: var(--texto); }
/* Celular: some "progresso salvo" para caber numa linha; o link Novumodu (volta ao catálogo) fica. */
@media (max-width: 560px) {
  .rodape { gap: 8px; }
  .rodape span:nth-child(2), .rodape span:nth-child(3) { display: none; }
}

/* ---------- aviso ---------- */
.aviso {
  position: fixed;
  left: 50%; bottom: calc(env(safe-area-inset-bottom) + 52px);
  transform: translateX(-50%);
  width: max-content; max-width: calc(100% - 32px);
  padding: 10px 16px;
  background: var(--painel);
  border: 1px solid var(--linha);
  color: var(--texto);
  font-size: 0.92rem;
  text-align: center;
  z-index: 20;
}

/* ---------- diálogos ---------- */
.dialogo {
  width: calc(100% - 32px);
  max-width: 400px;
  padding: 0;
  background: var(--painel);
  color: var(--texto);
  border: 1px solid var(--linha);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
}
.dialogo::backdrop { background: rgba(0, 0, 0, 0.82); }
.dialogo-corpo { position: relative; padding: 28px 22px 22px; display: grid; gap: 10px; }
.dialogo h2 { margin: 0; font-weight: 400; font-size: 1.6rem; }
.sutil { color: var(--sutil); margin: 0 0 6px; font-size: 0.95rem; }
.fechar {
  position: absolute; top: 6px; right: 10px;
  background: none; border: 0; color: var(--sutil);
  font-size: 1.6rem; cursor: pointer; line-height: 1;
}
.dialogo input, .dialogo button:not(.fechar):not(.link) {
  width: 100%;
  font: inherit; font-size: 1rem;
  padding: 11px 14px;
  border-radius: 2px;
}
.dialogo input {
  background: var(--fundo); color: var(--texto);
  border: 1px solid var(--linha);
}
.dialogo input:focus { outline: none; border-color: var(--acento); }
.dialogo button:not(.fechar):not(.link) {
  background: var(--texto); color: var(--fundo);
  border: 1px solid var(--texto);
  cursor: pointer;
}
.dialogo button.btn-provedor:not(.x), .dialogo button.secundario:not(.x) {
  background: transparent; color: var(--texto);
  border-color: var(--linha);
}
.dialogo button.btn-provedor:hover, .dialogo button.secundario:hover { border-color: var(--acento); }
.linha { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.separador {
  display: flex; align-items: center; gap: 12px;
  color: var(--sutil); font-size: 0.85rem; margin: 6px 0;
}
.separador::before, .separador::after { content: ''; flex: 1; height: 1px; background: var(--linha); }
.aceite { font-size: 0.82rem; margin: 4px 0 0; text-align: center; }
.aceite a, .ck-meios a { color: var(--acento); }
.erro { color: var(--erro); font-size: 0.92rem; margin: 0; }

.bib-lista { list-style: none; margin: 4px 0 8px; padding: 0; display: grid; gap: 12px; }
.bib-lista li {
  border: 1px solid var(--linha);
  padding: 14px;
  display: grid; gap: 4px;
}
.bib-lista li span { font-style: italic; color: var(--acento); }
.bib-lista small { color: var(--sutil); font-size: 0.85rem; }
.bib-lista button { margin-top: 8px; }

/* ---------- capítulos ---------- */
.caps-lista { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 8px; }
.dialogo .caps-lista button.cap-item {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  background: transparent; color: var(--texto);
  border: 1px solid var(--linha); text-align: left;
}
.dialogo .caps-lista button.cap-item:hover:not(:disabled) { border-color: var(--acento); }
.dialogo .caps-lista button.cap-item.atual { border-color: var(--acento); }
.dialogo .caps-lista button.cap-item:disabled { color: var(--sutil); opacity: 0.55; cursor: default; }
.cap-item small { color: var(--sutil); font-size: 0.82rem; white-space: nowrap; }
.cap-item.atual small { color: var(--acento); }
.caps-nota { font-size: 0.82rem; margin: 6px 0 0; }
.caps-catalogo {
  display: block;
  margin: 18px 0 0; padding-top: 14px;
  border-top: 1px solid var(--linha);
  color: var(--sutil); text-decoration: none;
  font-style: italic; text-align: center;
  transition: color 0.25s;
}
.caps-catalogo:hover, .caps-catalogo:focus-visible { color: var(--acento); outline: none; }

@media (prefers-reduced-motion: reduce) {
  .cursor { animation: none; }
}

/* ---------- compra ---------- */
.ck-etapa { display: grid; gap: 12px; }
.ck-etapa[hidden] { display: none; }
.ck-centro { text-align: center; justify-items: center; padding: 8px 0; }
.ck-itens { margin: 4px 0; padding: 0; list-style: none; display: grid; gap: 6px; color: var(--sutil); font-size: 0.98rem; }
.ck-itens li::before { content: '>'; font-family: ui-monospace, 'Cascadia Mono', Consolas, Menlo, monospace; color: var(--acento); font-size: 0.85em; margin-right: 10px; }
.ck-total {
  display: flex; justify-content: space-between; align-items: baseline;
  border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha);
  padding: 12px 0; margin: 4px 0;
}
.ck-total strong { font-size: 1.5rem; font-weight: 500; }
.ck-meios { margin: 0; font-size: 0.85rem; text-align: center; }
.ck-faixa {
  margin: 0; padding: 8px 10px;
  border: 1px dashed var(--acento); color: var(--acento);
  font-size: 0.8rem; text-align: center; letter-spacing: 0.02em;
}
.ck-girando {
  width: 28px; height: 28px; border-radius: 50%;
  border: 2px solid var(--linha); border-top-color: var(--acento);
  animation: girar 0.9s linear infinite;
}
@keyframes girar { to { transform: rotate(360deg); } }

/* ---------- livro-jogo (abertura) ---------- */
.faixa-livro {
  text-align: center;
  margin: 0 auto 6px;
  max-width: 30em;
}
.faixa-livro .selo { margin-bottom: 8px; }
.faixa-livro p:not(.selo) { margin: 0; color: var(--sutil); font-style: italic; }

/* ---------- páginas anteriores ---------- */
.lendo .texto { color: var(--texto-lido); }
.escolha-feita {
  margin: 0 0 18px;
  padding: 12px 16px;
  border-left: 2px solid var(--acento);
  color: var(--sutil);
  font-size: 0.95em;
}
.escolha-feita em { color: var(--texto); font-style: normal; }
.navegacao { display: flex; gap: 10px; }
.navegacao button { flex: 1; text-align: center; }
.indicador-pagina {
  text-align: center; color: var(--sutil);
  font-size: 0.8rem; letter-spacing: 0.2em; text-transform: uppercase;
  margin: 0 0 14px;
}

/* ---------- botão de tema ---------- */
#btn-tema svg { display: block; }
:root[data-tema="claro"] .dialogo::backdrop { background: rgba(60, 50, 35, 0.45); }

/* ---------- oferta de outro livro (fim da história) ---------- */
.oferta { margin-top: 26px; }
.oferta em { color: var(--texto); }
.botao-oferta {
  display: block; margin: 14px 0 0; padding: 13px 16px;
  border: 1px solid var(--acento); color: var(--texto);
  text-decoration: none; text-align: center;
}
.botao-oferta:hover, .botao-oferta:focus-visible { background: color-mix(in srgb, var(--acento) 7%, transparent); outline: none; }

/* ---------- seta: o texto continua abaixo ---------- */
.seta-mais {
  position: fixed;
  left: 50%; bottom: calc(env(safe-area-inset-bottom) + 44px);
  z-index: 6;
  width: 36px; height: 36px;
  display: grid; place-items: center;
  padding: 0;
  background: var(--fundo);
  color: var(--sutil);
  border: 1px solid var(--linha);
  border-radius: 50%;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 8px);
  transition: opacity 0.45s ease, transform 0.45s ease, color 0.2s;
}
.seta-mais.visivel { opacity: 0.9; pointer-events: auto; transform: translate(-50%, 0); }
.seta-mais:hover, .seta-mais:focus-visible { color: var(--texto); outline: none; }
.seta-mais svg { display: block; }
@media (prefers-reduced-motion: reduce) { .seta-mais { transition: opacity 0.2s; } }

/* ---------- combo e "segundo livro" ---------- */
.paywall .combo-linha { margin-top: 14px; font-size: 0.95em; }
.paywall .combo-linha em { color: var(--texto); }
.link-oferta {
  display: block; margin: 10px 0 0; text-align: center;
  color: var(--sutil); font-size: 0.92em; text-decoration: underline; text-underline-offset: 3px;
}
.link-oferta:hover, .link-oferta:focus-visible { color: var(--texto); }
button.botao-oferta { width: 100%; background: none; font: inherit; cursor: pointer; }

/* ---------- fim da história: indicar ---------- */
.indicar {
  margin: 30px 0 0; padding: 22px 8px 24px;
  border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha);
  text-align: center;
}
.indicar h3 { margin: 0 0 8px; font-weight: 400; font-size: 1.45rem; color: var(--texto); }
.indicar p { margin: 0 auto 16px; max-width: 30em; color: var(--sutil); font-size: 0.97em; }
.indicar-botoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.opcoes .indicar-botoes button {
  width: auto; margin: 0; padding: 10px 18px; text-align: center;
  border: 1px solid var(--linha); background: none; color: var(--texto); font-size: 0.95em;
}
.opcoes .indicar-botoes button.principal { border-color: var(--acento); }

/* ---------- fim da história: estante de livros ---------- */
.estante-sec { margin-top: 34px; }
.estante-sec > .selo { margin-bottom: 16px; }
.estante {
  display: grid; grid-auto-flow: column; grid-auto-columns: min(86%, 340px);
  gap: 14px; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; padding: 2px 2px 12px; scrollbar-width: thin;
}
.estante:has(> .livro-card:only-child) { grid-auto-columns: 100%; overflow: visible; }
.livro-card {
  --a: var(--a-escuro, var(--acento));
  scroll-snap-align: start;
  display: grid; grid-template-columns: 92px 1fr; gap: 16px;
  padding: 14px; text-align: left;
  border: 1px solid var(--linha);
  background: color-mix(in srgb, var(--a) 4%, transparent);
}
:root[data-tema="claro"] .livro-card { --a: var(--a-claro, var(--acento)); }
.mini-capa {
  align-self: start; aspect-ratio: 2 / 3;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 6px; text-align: center; text-decoration: none;
  background: var(--fundo); color: var(--texto);
  border: 1px solid color-mix(in srgb, var(--a) 60%, transparent);
  box-shadow: inset 0 0 0 4px var(--fundo), inset 0 0 0 5px color-mix(in srgb, var(--a) 28%, transparent);
}
.mini-capa.com-foto {
  --a: var(--a-escuro, var(--acento));
  background: linear-gradient(rgba(12,11,10,.2), rgba(12,11,10,.45)), var(--foto) center / cover, #121110;
  color: #ece4d6; text-shadow: 0 1px 8px rgba(0,0,0,.9);
  box-shadow: inset 0 0 0 4px rgba(18,17,16,.55), inset 0 0 0 5px color-mix(in srgb, var(--a) 40%, transparent);
}
.mini-capa.com-foto small { color: var(--a); }
.mini-capa .orn { color: var(--a); font-size: 0.72rem; }
.mini-capa .orn.prompt { font-family: ui-monospace, 'Cascadia Mono', Consolas, Menlo, monospace; letter-spacing: 0.06em; }
.mini-capa .orn.prompt i { font-style: normal; animation: cursor-piscar 1.1s steps(1) infinite; }
.mini-capa strong { font-weight: 400; font-size: 1.1rem; line-height: 1.05; letter-spacing: 0.04em; overflow-wrap: anywhere; }
.mini-capa small { font-style: italic; font-size: 0.66rem; line-height: 1.2; color: var(--sutil); }
.mini-capa small:empty { display: none; }
.livro-card-texto { display: flex; flex-direction: column; min-width: 0; }
.livro-card h3 { margin: 0 0 6px; font-weight: 400; font-size: 1.08rem; line-height: 1.25; color: var(--texto); }
.livro-card .chamada { margin: 0 0 8px; font-size: 0.93em; line-height: 1.45; }
.livro-card .chamada:empty { display: none; }
.livro-card .detalhe { margin: 0; font-size: 0.8rem; letter-spacing: 0.03em; color: var(--sutil); }
.livro-card-acoes { margin-top: auto; padding-top: 12px; }
.livro-card .botao-oferta { margin: 0; padding: 10px 12px; border-color: var(--a); font-size: 0.95em; }
.livro-card .botao-oferta + .link-oferta { margin-top: 8px; }
@media (max-width: 360px) { .livro-card { grid-template-columns: 74px 1fr; gap: 12px; } }
@media (prefers-reduced-motion: reduce) { .mini-capa .orn.prompt i { animation: none; } }

/* ---------- login: Google em destaque ---------- */
.dialogo button.btn-google:not(.x) {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  background: var(--texto); color: var(--fundo); border-color: var(--texto);
}
.dialogo button.btn-google:not(.x):hover, .dialogo button.btn-google:not(.x):focus-visible { opacity: 0.92; border-color: var(--texto); }
.g-icone {
  display: inline-grid; place-items: center;
  width: 26px; height: 26px; border-radius: 50%; background: #fff; flex: none;
}
.g-icone svg { display: block; }

/* ---------- boas-vindas (primeira página de quem acabou de chegar) ---------- */
.boas-vindas {
  margin: 0 0 22px;
  padding: 0 0 14px;
  border-bottom: 1px solid var(--linha);
  font-size: .95rem;
  color: var(--texto);
}
.boas-vindas .selo { margin: 0 0 6px; }
.boas-vindas p { margin: 0; }
.boas-vindas .dica { margin-top: 6px; font-size: 0.85rem; font-style: italic; color: var(--sutil); }

/* ---------- convite para instalar (Android) ---------- */
.instalar {
  position: fixed;
  left: 16px; right: 16px; bottom: 66px;
  max-width: 440px; margin: 0 auto;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 10px 10px 14px;
  background: var(--painel);
  color: var(--texto);
  border: 1px solid var(--linha);
  z-index: 30;
  font-size: 0.95rem;
}
.instalar span { flex: 1; }
.instalar button { font: inherit; cursor: pointer; }
.instalar .sim { padding: 7px 12px; background: var(--acento); color: #14120f; border: 0; border-radius: 2px; }
.instalar .x { background: none; border: 0; color: var(--sutil); font-size: 1.3rem; line-height: 1; padding: 4px 6px; }