/* ==========================================================================
   Superapp da igreja — sistema visual único
   Tudo usa os tokens abaixo; nenhuma cor fica fixa nos módulos.
   Tema: claro, escuro ou automático (data-theme em <html>; sem atributo = segue o aparelho).
   ========================================================================== */

@font-face{ font-family:"Atkinson Hyperlegible"; font-weight:400; font-display:swap; src:url(/fonts/atkinson-400-latin.woff2) format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:"Atkinson Hyperlegible"; font-weight:400; font-display:swap; src:url(/fonts/atkinson-400-latin-ext.woff2) format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+20A0-20AB,U+20AD-20C4,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:"Atkinson Hyperlegible"; font-weight:700; font-display:swap; src:url(/fonts/atkinson-700-latin.woff2) format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:"Atkinson Hyperlegible"; font-weight:700; font-display:swap; src:url(/fonts/atkinson-700-latin-ext.woff2) format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+20A0-20AB,U+20AD-20C4,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:"Bricolage Grotesque"; font-weight:600 800; font-display:swap; src:url(/fonts/bricolage-latin.woff2) format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:"Bricolage Grotesque"; font-weight:600 800; font-display:swap; src:url(/fonts/bricolage-latin-ext.woff2) format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+20A0-20AB,U+20AD-20C4,U+2C60-2C7F,U+A720-A7FF; }

:root{
  color-scheme:light;
  --bg:#F4F6F1; --surface:#FFFFFF; --surface-2:#EEF1EA; --ink:#1B2420; --muted:#4F5F55; --line:#D5DCD0;
  --accent:#1D5FA6; --accent-ink:#FFFFFF; --accent-soft:#E4EEF9; /* azul = destaque padrão; contraste AA conferido: texto accent sobre surface, bg, surface-2 e accent-soft */
  --danger:#A3262B; --danger-soft:#F8E3E3; --ok:#2E6B3A; --ok-soft:#E2F0E5; --warn:#6B4A00; --warn-soft:#FFF3D6;
  --overlay:rgba(10,14,9,.55); --shadow:0 1px 2px rgba(27,36,32,.06); --shadow-alto:0 6px 24px rgba(10,14,9,.18);
  --r:12px; --r-sm:10px; --r-lg:20px; --nav-h:64px; --nav-w:220px;
  --esp-1:4px; --esp-2:8px; --esp-3:12px; --esp-4:16px; --esp-5:24px; --esp-6:32px;
  /* movimento: durações e curva em um só lugar */
  --t-rapido:.15s; --t-medio:.24s; --t-lento:.4s; --ease:cubic-bezier(.2,.7,.2,1);
  /* telão (TV da igreja): tema próprio, sempre escuro */
  --telao-bg:#0B100D; --telao-ink:#F2F0EA; --telao-muted:#A9B5AC; --telao-botao:#2A362F;
  --font:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-titulo:"Bricolage Grotesque","Atkinson Hyperlegible",system-ui,sans-serif;
  /* cores de departamento/voz (mesma paleta nos dois temas; texto sempre ao lado, nunca só cor) */
  --c1:#2F6FB5; --c2:#B53F7A; --c3:#2E8B63; --c4:#7A52B3; --c5:#1E8A92; --c6:#6F8F1E; --c7:#C0642B; --c8:#5A6B7A;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#121416; --surface:#1B1E21; --surface-2:#24282C; --ink:#ECEEF0; --muted:#A8B0B7; --line:#34393E;
    --accent:#7FB4F2; --accent-ink:#0A1A2E; --accent-soft:#17263A;
    --danger:#FF9A9F; --danger-soft:#3A1E20; --ok:#86D395; --ok-soft:#1C3324; --warn:#F5D78A; --warn-soft:#3A2F10;
    --overlay:rgba(0,0,0,.65); --shadow:none;
    --c1:#6FA8F0; --c2:#F08AB8; --c3:#62D1A0; --c4:#B397EE; --c5:#5DD0D8; --c6:#B3D45F; --c7:#F2A06A; --c8:#9FB2C2;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#121416; --surface:#1B1E21; --surface-2:#24282C; --ink:#ECEEF0; --muted:#A8B0B7; --line:#34393E;
  --accent:#7FB4F2; --accent-ink:#0A1A2E; --accent-soft:#17263A;
  --danger:#FF9A9F; --danger-soft:#3A1E20; --ok:#86D395; --ok-soft:#1C3324; --warn:#F5D78A; --warn-soft:#3A2F10;
  --overlay:rgba(0,0,0,.65); --shadow:none;
  --c1:#6FA8F0; --c2:#F08AB8; --c3:#62D1A0; --c4:#B397EE; --c5:#5DD0D8; --c6:#B3D45F; --c7:#F2A06A; --c8:#9FB2C2;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{ margin:0; background:var(--bg); color:var(--ink); font:16px/1.5 var(--font); }
/* A página nunca rola para o lado (ex.: durante a entrada deslizante das ferramentas). "clip" não cria área de rolagem,
   então os cabeçalhos fixos (sticky) continuam funcionando; "hidden" fica de reserva para navegadores antigos. */
html,body{ overflow-x:hidden; overflow-x:clip; }
[hidden]{ display:none !important; }
h1,h2,h3{ font-family:var(--font-titulo); letter-spacing:-.01em; }
h1{ font-size:24px; margin:8px 0 12px; line-height:1.2; }
h2{ font-size:19px; margin:0 0 8px; line-height:1.25; }
h3{ font-size:16px; margin:16px 0 8px; }
a{ color:var(--accent); }
.wrap{ max-width:640px; margin:0 auto; padding:16px; }
.tela-simples{ max-width:520px; }
.muted{ color:var(--muted); font-size:14px; }
.link-suave{ color:var(--accent); font-weight:700; }
/* ação secundária de saída/remoção: tocável (44px), mas sem o peso de um botão */
button.link-acao{ width:auto; min-height:44px; margin:4px 0 0; padding:8px 4px; background:none; border:0; color:var(--muted); font-weight:700; font-size:14px; text-decoration:underline; text-underline-offset:3px; }
button.link-acao:hover:not(:disabled){ color:var(--danger); }
.nota-rodape{ margin-top:24px; font-size:13px; line-height:1.45; }
:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }

/* ----- formulários ----- */
label{ display:block; font-weight:700; margin:10px 0 4px; }
input,select,textarea,.caixa{ width:100%; font:inherit; padding:12px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); color:var(--ink); }
input::placeholder,textarea::placeholder{ color:var(--muted); opacity:.8; }
input[type=checkbox],input[type=radio]{ width:auto; accent-color:var(--accent); }
.login-modo{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-top:6px; }
.login-modo .link-acao{ margin:0; }
.campo-senha{ position:relative; }
.campo-senha input{ padding-right:52px; }
.campo-senha .olho{ position:absolute; top:50%; right:2px; transform:translateY(-50%); width:44px; min-height:44px; margin:0; padding:0; background:none; border:0; color:var(--muted); display:inline-flex; align-items:center; justify-content:center; }
.campo-senha .olho:hover{ color:var(--ink); }
.campo-senha .olho:active:not(:disabled){ transform:translateY(-50%) scale(.94); }
.chk{ display:flex; align-items:center; gap:8px; margin-top:12px; font-weight:400; }
.chk input{ width:auto; min-height:auto; }

/* ----- botões ----- */
button{ font:inherit; font-weight:700; min-height:48px; padding:10px 16px; border-radius:var(--r-sm); border:1px solid transparent; background:var(--accent); color:var(--accent-ink); cursor:pointer; width:100%; margin-top:12px; transition:background-color .15s,color .15s,transform .08s,opacity .15s,border-color .15s; }
button.sec{ background:transparent; color:var(--ink); border-color:var(--line); }
button.sec:hover:not(:disabled){ background:var(--surface-2); }
button.perigo{ background:var(--danger-soft); color:var(--danger); border-color:transparent; }
button:disabled{ opacity:.55; cursor:default; }
button:active:not(:disabled){ transform:scale(.97); }
.btn-link{ display:inline-block; background:var(--accent); color:var(--accent-ink); padding:14px 22px; border-radius:var(--r); font-weight:700; text-decoration:none; }
.actions{ display:flex; gap:8px; }
.actions button{ margin-top:6px; }
.row{ display:flex; align-items:center; gap:8px; }
button.mini{ width:auto; min-height:36px; padding:4px 12px; margin:0; font-size:14px; }

/* ----- mensagens ----- */
.msg{ padding:10px 12px; border-radius:var(--r-sm); margin:10px 0; font-size:15px; }
.msg.erro{ background:var(--danger-soft); color:var(--danger); }
.msg.ok{ background:var(--ok-soft); color:var(--ok); }
.msg.aviso{ background:var(--warn-soft); color:var(--warn); }

/* ----- cartões e painéis ----- */
.card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px; margin-bottom:12px; box-shadow:var(--shadow); }
.card.destaque{ border-color:var(--accent); }
.painel{ margin-top:12px; padding:12px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface-2); }
.painel h3{ margin:0 0 4px; }
.lista{ padding:0; margin:0; list-style:none; }
.lista li{ padding:10px 0; border-bottom:1px solid var(--line); }
.lista li:last-child{ border-bottom:0; }
.acao{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.acao button{ width:auto; margin:0; flex:none; }
.acao-txt{ min-width:0; }
.saud h1{ margin-bottom:0; }
.saud p{ margin:0 0 12px; }
.badge{ display:inline-block; padding:2px 10px; border-radius:99px; font-size:13px; font-weight:700; background:var(--accent-soft); color:var(--accent); }
.badge.ok{ background:var(--ok-soft); color:var(--ok); }
.badge.erro{ background:var(--danger-soft); color:var(--danger); }
.badge.cor{ background:transparent; border:1px solid currentColor; }
.chip{ display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:4px 12px; border-radius:99px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font-weight:700; font-size:14px; width:auto; margin:4px 4px 0 0; }
.chip[aria-pressed="true"],.chip.ativo{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
/* ----- cartão tocável (UI.cartaoTocavel) e menu "⋯" (UI.menuAcoes) ----- */
.ct{ position:relative; display:flex; align-items:stretch; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); margin-bottom:10px; box-shadow:var(--shadow); transition:border-color var(--t-rapido), transform var(--t-rapido) var(--ease); }
.ct::before{ content:""; position:absolute; left:-1px; top:12px; bottom:12px; width:4px; border-radius:0 4px 4px 0; background:var(--cor, transparent); }
.ct-principal{ flex:1; min-width:0; display:flex; align-items:center; gap:12px; padding:14px 16px; margin:0; text-align:left; background:none; border:0; border-radius:var(--r); color:var(--ink); font-weight:400; min-height:64px; width:auto; }
button.ct-principal:hover:not(:disabled){ background:var(--surface-2); }
.ct-acao:active{ transform:scale(.985); }
.ct-ico{ width:40px; height:40px; flex:none; border-radius:12px; background:color-mix(in srgb, var(--cor, var(--accent)) 16%, transparent); color:var(--cor, var(--accent)); display:flex; align-items:center; justify-content:center; }
.ct-txt{ min-width:0; flex:1; }
.ct-linha{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ct-titulo{ font-family:var(--font-titulo); font-size:16px; overflow-wrap:anywhere; }
.ct-sub{ color:var(--muted); font-size:14px; margin-top:2px; }
.ct-meta{ color:var(--muted); font-size:13px; margin-top:4px; }
.ct > .menu-acoes{ align-self:flex-start; margin:10px 8px 0 0; }
.menu-acoes{ width:44px; min-height:44px; padding:0; margin:0; flex:none; display:inline-flex; align-items:center; justify-content:center; border-color:transparent; color:var(--muted); }
.menu-acoes:hover:not(:disabled){ color:var(--ink); }
.menu-lista{ display:flex; flex-direction:column; gap:2px; margin:0 -8px; }
.menu-item{ display:flex; align-items:center; gap:14px; width:100%; margin:0; min-height:52px; padding:10px 12px; background:none; border:0; color:var(--ink); text-align:left; font-weight:700; border-radius:var(--r-sm); }
.menu-item:hover:not(:disabled){ background:var(--surface-2); }
.menu-item .ico{ color:var(--muted); }
.menu-item.perigo{ color:var(--danger); margin-top:6px; border-top:1px solid var(--line); border-radius:0 0 var(--r-sm) var(--r-sm); }
.menu-item.perigo .ico{ color:var(--danger); }
.avatar{ width:40px; height:40px; flex:none; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-family:var(--font-titulo); font-weight:800; font-size:15px; letter-spacing:.02em; color:var(--ink); background:color-mix(in srgb, var(--cor) 22%, var(--surface)); border:2px solid color-mix(in srgb, var(--cor) 70%, transparent); }
.avatar.p{ width:32px; height:32px; font-size:12px; }

/* ----- Ajustes: perfil e grupos de linhas ----- */
.ajustes-perfil{ display:flex; align-items:center; gap:14px; }
.ajustes-perfil h2{ margin:0; }
.ajustes-perfil p{ margin:2px 0 0; }
.ajustes-avatar .avatar{ width:56px; height:56px; font-size:20px; }
.ajustes-titulo{ font-size:13px; text-transform:uppercase; letter-spacing:.12em; color:var(--muted); font-family:var(--font); margin:20px 4px 8px; }
.ajustes-grupo{ padding:0; overflow:hidden; }
.ajustes-grupo > div[hidden]{ display:none; }
.ajustes-grupo details.linha,.ajustes-grupo > div > details.linha{ border-top:1px solid var(--line); }
.ajustes-grupo > details.linha:first-child,.ajustes-grupo > div:first-child > details.linha{ border-top:0; }
details.rec.linha > summary{ list-style:none; display:flex; align-items:center; gap:12px; padding:12px 16px; min-height:64px; font-family:var(--font); font-size:16px; margin:0; }
details.rec.linha > summary::-webkit-details-marker{ display:none; }
details.rec.linha > summary:hover{ background:var(--surface-2); }
details.rec.linha[open] > summary{ margin:0; border-bottom:1px solid var(--line); }
details.rec.linha > :not(summary){ margin-left:16px; margin-right:16px; }
details.rec.linha[open]{ padding-bottom:16px; }
.aj-ico{ width:36px; height:36px; flex:none; border-radius:10px; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; }
.aj-ico .ico{ width:20px; height:20px; }
.aj-txt{ flex:1; min-width:0; display:flex; flex-direction:column; }
.aj-titulo{ font-weight:700; }
.aj-sub{ font-size:13px; color:var(--muted); font-weight:400; }
.aj-seta{ color:var(--muted); transition:transform var(--t-medio) var(--ease); }
details[open] > summary .aj-seta{ transform:rotate(180deg); }
.ajustes-sair{ display:block; margin:20px auto 0; }

/* ----- sino: lista de avisos ----- */
.sino-lista{ display:flex; flex-direction:column; gap:6px; }
.sino-lista > .link-acao{ align-self:center; }
.sino-item{ margin:0; display:flex; align-items:flex-start; gap:12px; text-align:left; padding:12px; min-height:64px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r-sm); font-weight:400; }
.sino-item:hover:not(:disabled){ background:var(--surface-2); }
.sino-item.nova{ border-color:color-mix(in srgb, var(--accent) 55%, transparent); background:color-mix(in srgb, var(--accent-soft) 55%, var(--surface)); }
.sino-ico{ width:36px; height:36px; flex:none; border-radius:10px; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; }
.sino-ico .ico{ width:20px; height:20px; }
.sino-txt{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.sino-txt strong{ font-family:var(--font-titulo); }
.sino-texto{ color:var(--muted); font-size:14px; }
.sino-quando{ color:var(--muted); font-size:12px; }
.sino-item.nova .sino-quando{ color:var(--accent); font-weight:700; }
.logo-igreja{ width:32px; height:32px; flex:none; border-radius:8px; overflow:hidden; display:inline-flex; }
.logo-igreja img{ width:100%; height:100%; object-fit:cover; }
header.top .row > .logo-igreja + strong{ margin-right:auto; }

/* ----- Harpa: hino cadastrado pela igreja e ações ----- */
.harpa-abrir{ margin:8px 0 0; display:flex; align-items:center; justify-content:flex-start; gap:12px; text-align:left; padding:12px 14px; background:var(--accent-soft); color:var(--ink); border:1px solid color-mix(in srgb, var(--accent) 40%, transparent); border-radius:var(--r-sm); font-weight:400; }
.harpa-abrir .ico{ color:var(--accent); }
.harpa-abrir span{ display:flex; flex-direction:column; }
.harpa-abrir strong{ font-family:var(--font-titulo); }
.harpa-abrir small{ color:var(--muted); font-size:13px; }

/* ----- Louvor: opções da busca de letra pelo nome ----- */
.lv-busca-opcoes{ display:flex; flex-direction:column; gap:6px; margin-top:8px; }
.lv-busca-opcoes:empty{ display:none; }
.lv-busca-op{ margin:0; display:flex; flex-direction:column; align-items:flex-start; gap:2px; text-align:left; padding:10px 14px; min-height:56px; background:var(--surface-2); color:var(--ink); border:1px solid var(--line); border-radius:var(--r-sm); font-weight:400; }
.lv-busca-op:hover:not(:disabled){ border-color:var(--accent); }
.lv-busca-op strong{ font-family:var(--font-titulo); }
.lv-busca-op span{ font-size:14px; color:var(--muted); }
.lv-busca-op em{ font-size:13px; color:var(--muted); font-style:normal; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }

/* ----- painel de visão geral do administrador ----- */
.painel-cab{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:10px; }
.painel-cab h2{ margin:0; }
.painel-adm{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.pa-bloco{ margin:0; min-height:112px; padding:12px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto auto; column-gap:8px; align-content:start; text-align:left; background:var(--surface-2); color:var(--ink); border:1px solid var(--line); border-radius:var(--r); font-weight:400; }
.pa-bloco:hover:not(:disabled){ border-color:var(--accent); }
.pa-ico{ grid-row:1; grid-column:1; width:32px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:var(--surface); color:var(--muted); }
.pa-ico .ico{ width:18px; height:18px; }
.pa-num{ grid-row:1; grid-column:2; align-self:center; justify-self:end; font-family:var(--font-titulo); font-size:28px; line-height:1; }
.pa-rot{ grid-row:2; grid-column:1 / -1; font-weight:700; margin-top:10px; line-height:1.25; }
.pa-det{ grid-row:3; grid-column:1 / -1; font-size:13px; color:var(--muted); margin-top:2px; line-height:1.3; overflow-wrap:anywhere; }
.pa-bloco[aria-busy="true"] .pa-num{ color:var(--muted); }
.pa-bloco[data-estado="atencao"]{ background:var(--warn-soft); border-color:color-mix(in srgb, var(--warn) 35%, transparent); }
.pa-bloco[data-estado="atencao"] .pa-ico{ color:var(--warn); }
.pa-bloco[data-estado="atencao"] .pa-num{ color:var(--warn); }
.pa-bloco[data-estado="ok"] .pa-ico{ color:var(--ok); }
.pa-bloco[data-estado="info"] .pa-ico{ color:var(--accent); }
@media (min-width:640px){ .painel-adm{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

/* ----- puxar para atualizar (celular); no toque, o botão do cabeçalho sai ----- */
.puxar{ --p:0; position:fixed; left:50%; top:calc(64px + env(safe-area-inset-top)); z-index:30; width:40px; height:40px; margin-left:-20px; border-radius:50%; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-alto); color:var(--accent); display:flex; align-items:center; justify-content:center; opacity:0; transform:translateY(calc(var(--p) * 24px - 24px)) rotate(calc(var(--p) * 270deg)); pointer-events:none; transition:opacity var(--t-rapido); }
.puxar.visivel{ opacity:calc(.4 + var(--p) * .6); }
.puxar.pronto{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.puxar.girando .ico{ animation:girar .6s linear infinite; }
@keyframes girar{ to{ transform:rotate(360deg); } }
@media (hover:none) and (pointer:coarse){ #btnAtualizar{ display:none; } }

/* convite para instalar o app */
.convite-instalar{ position:relative; padding-right:56px; border-color:var(--accent); background:linear-gradient(135deg,var(--accent-soft),var(--surface) 70%); }
.convite-instalar strong{ display:block; font-family:var(--font-titulo); font-size:17px; margin-top:8px; }
.convite-instalar p{ margin:4px 0 0; }
.convite-ico{ width:40px; height:40px; border-radius:12px; background:var(--accent); color:var(--accent-ink); display:flex; align-items:center; justify-content:center; }
.convite-fechar{ position:absolute; top:8px; right:8px; width:44px; min-height:44px; margin:0; padding:0; border:0; background:none; display:inline-flex; align-items:center; justify-content:center; color:var(--muted); }
/* presença no culto: três escolhas que cabem numa linha até 320px */
.presenca-titulo{ font-size:22px; margin:4px 0 10px; }
.presenca-opcoes{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.presenca-chip{ margin:0; min-height:48px; justify-content:center; white-space:nowrap; padding:4px 8px; font-size:15px; display:flex; }
.presenca-chip .ico{ width:18px; height:18px; }
.presenca-chip[aria-pressed="true"]{ animation:marca var(--t-medio) var(--ease); }
@keyframes marca{ 0%{ transform:scale(.94); } 60%{ transform:scale(1.04); } 100%{ transform:none; } }
.ponto{ display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--cor,var(--c8)); flex:none; }
.vazio{ text-align:center; padding:28px 16px; color:var(--muted); display:flex; flex-direction:column; align-items:center; gap:4px; }
.vazio strong{ display:block; color:var(--ink); font-family:var(--font-titulo); font-size:17px; }
.vazio .ico-vazio{ width:64px; height:64px; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; margin-bottom:8px; }
.vazio .ico-vazio svg{ width:30px; height:30px; stroke-width:1.5; }
.vazio button{ width:auto; margin-top:12px; }
.vazio.erro .ico-vazio{ background:var(--danger-soft); color:var(--danger); }
.vazio.offline .ico-vazio{ background:var(--warn-soft); color:var(--warn); }

/* ----- controle segmentado (abas internas) ----- */
.seg{ display:flex; gap:4px; padding:4px; background:var(--surface-2); border-radius:var(--r); margin-bottom:12px; overflow-x:auto; scrollbar-width:none; }
.seg::-webkit-scrollbar{ display:none; }
/* barra que não cabe: esmaece a borda onde ainda há opções */
.seg.rola-dir{ -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent); }
.seg.rola-esq{ -webkit-mask-image:linear-gradient(90deg,transparent,#000 36px); mask-image:linear-gradient(90deg,transparent,#000 36px); }
.seg.rola-dir.rola-esq{ -webkit-mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent); mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent); }
.seg{ scroll-behavior:smooth; }
/* botão com ícone do conjunto (UI.rotular) */
button.com-ico,a.com-ico,.chip.com-ico{ display:inline-flex; align-items:center; justify-content:center; gap:8px; }
button.com-ico{ display:flex; }
button.mini.com-ico,.chip.com-ico{ display:inline-flex; gap:6px; }
button.com-ico .ico,a.com-ico .ico{ width:20px; height:20px; }
button.mini.com-ico .ico,.chip .ico{ width:18px; height:18px; }
.seg button{ margin:0; min-height:40px; flex:1 0 auto; width:auto; background:transparent; color:var(--muted); border:0; padding:6px 14px; }
.seg button[aria-pressed="true"],.seg button[aria-selected="true"]{ background:var(--surface); color:var(--ink); box-shadow:var(--shadow); }
/* telas estreitas: menos respiro lateral para as abas caberem sem rolar */
@media (max-width:400px){ .seg > button{ padding:6px 10px; } }

/* ----- recolhíveis ----- */
details.rec > summary{ font-weight:700; font-size:18px; cursor:pointer; min-height:32px; font-family:var(--font-titulo); }
details.rec[open] > summary{ margin-bottom:8px; }

/* ----- cabeçalho do app e navegação ----- */
header.top{ position:sticky; top:0; z-index:15; background:var(--surface); border-bottom:1px solid var(--line); padding:10px 16px; padding-top:calc(10px + env(safe-area-inset-top)); }
header.top .row{ justify-content:space-between; }
header.top strong{ font-family:var(--font-titulo); font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
header.top .row{ gap:8px; }
header.top .acoes{ display:flex; gap:6px; align-items:center; }
header.top select{ width:auto; padding:8px; min-width:0; flex:1 1 90px; max-width:190px; text-overflow:ellipsis; }
header.top .acoes{ min-width:0; flex:0 1 auto; }
/* com o seletor de igreja visível, o nome já aparece nele: o título repetido sai e o seletor ocupa o espaço */
header.top .row:has(select:not([hidden])) > strong{ display:none; }
header.top .row:has(select:not([hidden])) > .acoes{ flex:1 1 auto; }
header.top .row:has(select:not([hidden])) select{ max-width:none; }
header.top .acoes button{ flex:none; }
header.top .acoes button{ width:44px; min-height:44px; margin:0; padding:0; display:inline-flex; align-items:center; justify-content:center; }
header.top svg,.ico{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.sino{ position:relative; }
.sino .pontinho{ position:absolute; top:6px; right:6px; min-width:18px; height:18px; padding:0 4px; border-radius:99px; background:var(--danger); color:#fff; font-size:11px; font-weight:700; line-height:18px; text-align:center; }
nav.tabs{ position:fixed; bottom:0; left:0; right:0; z-index:20; display:grid; grid-template-columns:repeat(4,1fr); background:var(--surface); border-top:1px solid var(--line); padding-bottom:env(safe-area-inset-bottom); }
nav.tabs button{ background:none; color:var(--muted); border:0; border-radius:0; margin:0; min-height:var(--nav-h); font-size:13px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; position:relative; }
nav.tabs svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
nav.tabs button[aria-current="page"]{ color:var(--accent); font-weight:700; }
nav.tabs button[aria-current="page"]::before{ content:""; position:absolute; top:0; left:25%; right:25%; height:3px; border-radius:0 0 3px 3px; background:var(--accent); }
nav.tabs button[aria-current="page"] svg{ transform:translateY(-1px) scale(1.08); }
/* o conteúdo nunca fica atrás da barra: altura da barra + área segura + folga */
main.wrap{ padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 28px); } /* .wrap sozinho vence "main": por isso main.wrap */
.sticky-base{ position:sticky; bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 8px); z-index:5; }

/* ----- páginas de ferramenta (abrem inteiras, com voltar) ----- */
.pagina-topo{ display:flex; align-items:center; gap:8px; margin:0 0 12px; position:sticky; top:calc(58px + env(safe-area-inset-top)); z-index:6; background:var(--bg); padding:6px 0; }
.pagina-topo h1{ margin:0; flex:1; font-size:21px; }
.pagina-topo button{ width:44px; min-height:44px; margin:0; padding:0; display:inline-flex; align-items:center; justify-content:center; flex:none; }
.pagina-topo h1{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pagina-topo .extra{ display:flex; gap:6px; }
.grade-tiles{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.tile{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; text-align:left; margin:0; padding:14px; min-height:112px; background:var(--surface); color:var(--ink); border:1px solid var(--line); box-shadow:var(--shadow); }
.tile{ transition:border-color var(--t-rapido), transform var(--t-rapido) var(--ease), box-shadow var(--t-rapido); }
.tile:hover:not(:disabled){ border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow-alto); }
.tile:active:not(:disabled){ transform:scale(.97); }
.tile .ico-caixa{ width:40px; height:40px; border-radius:12px; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; }
.tile strong{ font-family:var(--font-titulo); font-size:16px; }
.tile span.d{ font-weight:400; font-size:13px; color:var(--muted); line-height:1.3; }

/* ----- toast, folha inferior, esqueleto ----- */
#toasts{ position:fixed; left:0; right:0; bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 12px); z-index:80; display:flex; flex-direction:column; align-items:center; gap:8px; pointer-events:none; padding:0 16px; }
.toast{ pointer-events:auto; max-width:480px; width:100%; background:var(--ink); color:var(--bg); padding:12px 16px; border-radius:var(--r); box-shadow:0 6px 24px rgba(0,0,0,.25); font-weight:700; animation:subir .22s ease-out; }
.toast.erro{ background:var(--danger); color:#fff; }
.folha-fundo{ position:fixed; inset:0; z-index:70; background:var(--overlay); display:flex; align-items:flex-end; justify-content:center; animation:aparecer .18s ease-out; }
.folha{ width:100%; max-width:560px; max-height:88vh; overflow:auto; background:var(--surface); border-radius:20px 20px 0 0; padding:16px 16px calc(16px + env(safe-area-inset-bottom)); animation:subirFolha .24s ease-out; }
.folha h2{ margin-bottom:12px; }
@media (min-width:900px){ .folha-fundo{ align-items:center; } .folha{ border-radius:20px; } #toasts{ bottom:24px; } }
.skel{ height:16px; border-radius:8px; background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2)); background-size:200% 100%; animation:brilho 1.2s linear infinite; margin:8px 0; }
.skel.alto{ height:72px; border-radius:var(--r); }
.skel-cartao{ border:1px solid var(--line); border-radius:var(--r); padding:16px; margin-bottom:12px; background:var(--surface); }
.skel-cartao .skel:first-child{ width:45%; height:20px; margin-top:0; }
.skel-cartao .skel:nth-child(2){ width:90%; }
.skel-cartao .skel:last-child{ width:65%; margin-bottom:0; }
@keyframes brilho{ from{ background-position:200% 0; } to{ background-position:-200% 0; } }

/* ----- galeria e álbum ----- */
.grade-albuns{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:12px; }
.capa.sem-capa{ background:linear-gradient(135deg,var(--accent-soft),var(--surface-2)); color:var(--accent); }
.capa.sem-capa svg{ width:36px; height:36px; stroke-width:1.5; }
.badge.com-ico{ display:inline-flex; align-items:center; gap:4px; }
.badge .ico{ width:14px; height:14px; stroke-width:2.2; }
.capa{ aspect-ratio:4/3; border-radius:var(--r-sm); background:var(--line) center/cover no-repeat; display:flex; align-items:center; justify-content:center; font-size:32px; color:var(--muted); }
.imersivo{ position:fixed; inset:0; z-index:90; background:rgba(10,14,9,.92); display:flex; align-items:center; justify-content:center; padding:20px; }
.cartao-link{ display:block; text-decoration:none; color:inherit; }

/* ----- cifras (acordes acima das sílabas) ----- */
.letra{ line-height:1.5; }
.letra-linha{ white-space:pre-wrap; min-height:1.2em; }
.cp{ display:inline-flex; flex-direction:column; vertical-align:bottom; }
.cp .ch{ font-size:.75em; font-weight:700; color:var(--accent); line-height:1.15; white-space:pre; }
.cp .cp-t{ white-space:pre; }
.letra:has(.cp) .letra-linha{ line-height:1.35; margin-top:.2em; }

/* ----- aviso de conexão ----- */
#semConexao{ position:sticky; top:0; z-index:25; margin:0; border-radius:0; text-align:center; background:var(--warn-soft); color:var(--warn); }

/* ----- modo imersivo (Louvor ao vivo etc.): esconde cabeçalho e barra ----- */
body.imersivo-tela header.top,body.imersivo-tela nav.tabs{ display:none; }
body.imersivo-tela main{ padding:0; max-width:none; margin:0; }

/* ----- desktop: barra lateral ----- */
@media (min-width:900px){
  header.top{ margin-left:var(--nav-w); }
  nav.tabs{ top:0; bottom:auto; right:auto; width:var(--nav-w); height:100vh; grid-template-columns:1fr; grid-auto-rows:56px; align-content:start; border-top:0; border-right:1px solid var(--line); padding:72px 12px 0; gap:4px; }
  nav.tabs button{ flex-direction:row; justify-content:flex-start; gap:12px; padding:0 14px; border-radius:var(--r-sm); font-size:16px; min-height:0; }
  nav.tabs button[aria-current="page"]{ background:var(--accent-soft); }
  nav.tabs button[aria-current="page"]::before{ top:12px; bottom:12px; left:0; right:auto; width:3px; height:auto; border-radius:0 3px 3px 0; }
  main.wrap{ max-width:none; margin:0 0 0 var(--nav-w); padding:24px max(24px, calc((100vw - var(--nav-w) - 920px) / 2)); }
  .grade-2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 16px; align-items:start; }
  .grade-2 > .largo{ grid-column:1 / -1; }
  .actions{ flex-wrap:wrap; }
  .pagina-topo{ top:58px; }
  .grade-tiles{ grid-template-columns:repeat(3,1fr); }
  .sticky-base{ bottom:12px; }
  body.imersivo-tela main.wrap{ margin:0; padding:0; }
}

/* ----- movimento (discreto; desligado com "reduzir movimento") ----- */
/* a entrada nunca parte do invisível: o conteúdo já aparece legível no primeiro quadro */
@keyframes subir{ from{ opacity:.35; transform:translateY(6px); } to{ opacity:1; transform:none; } }
@keyframes subirFolha{ from{ transform:translateY(24px); opacity:.6; } to{ transform:none; opacity:1; } }
@keyframes aparecer{ from{ opacity:0; } to{ opacity:1; } }
@keyframes abrir{ from{ opacity:0; transform:translateY(-6px) scale(.985); } to{ opacity:1; transform:none; } }
@keyframes entraDireita{ from{ opacity:.35; transform:translateX(18px); } to{ opacity:1; transform:none; } }
@keyframes pulsa{ 0%,100%{ box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 50%, transparent); } 50%{ box-shadow:0 0 0 6px transparent; } }
[data-pagina]:not([hidden]){ animation:subir var(--t-medio) var(--ease); }
[data-pagina]:not([hidden]) > .card,.ini-col > .card,.ini-col > .ct{ animation:subir .3s var(--ease) backwards; }
[data-pagina]:not([hidden]) > .card:nth-of-type(2){ animation-delay:.04s; }
[data-pagina]:not([hidden]) > .card:nth-of-type(3){ animation-delay:.08s; }
[data-pagina]:not([hidden]) > .card:nth-of-type(4){ animation-delay:.12s; }
.painel{ animation:abrir .18s var(--ease); }
.msg{ animation:aparecer .2s ease-out; }
[role=dialog]{ animation:aparecer .2s ease-out; }
.pagina-ferramenta:not([hidden]){ animation:entraDireita var(--t-medio) var(--ease); }
details.rec[open] > summary ~ *{ animation:aparecer .2s ease-out; }
.ponto-vivo{ animation:pulsa 1.8s ease-out infinite; }
.grade-tiles .tile{ animation:subir .3s var(--ease) backwards; }
.grade-tiles .tile:nth-child(2){ animation-delay:.04s; } .grade-tiles .tile:nth-child(3){ animation-delay:.08s; }
.grade-tiles .tile:nth-child(4){ animation-delay:.12s; } .grade-tiles .tile:nth-child(5){ animation-delay:.16s; }
/* "reduzir movimento": pelo aparelho ou pela escolha da pessoa (data-movimento="reduzido" em <html>) */
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
:root[data-movimento="reduzido"] *,:root[data-movimento="reduzido"] *::before,:root[data-movimento="reduzido"] *::after{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }

/* ----- telão (TV): tema próprio por tokens ----- */
.telao{ position:fixed; inset:0; z-index:95; background:var(--telao-bg); color:var(--telao-ink); overflow:auto; padding:24px 32px; font-family:var(--font); }
.telao-topo{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:20px; }
.telao-titulo{ font-family:var(--font-titulo); font-weight:800; font-size:clamp(28px,4vw,52px); line-height:1.1; }
.telao-sub{ color:var(--telao-muted); font-size:clamp(16px,2vw,26px); margin-top:4px; }
.telao-acoes{ display:flex; gap:8px; align-items:center; }
.telao-acoes button{ width:auto; margin:0; background:var(--telao-botao); color:var(--telao-ink); }
.telao-acoes button.so-icone{ width:48px; }
.telao-vazio{ font-size:28px; color:var(--telao-muted); margin-top:40px; }
.telao-erro{ font-size:20px; color:#FF9A9F; }
.telao-dia{ background:#18211C; border:1px solid #2E3A33; border-radius:16px; padding:16px; }
.telao-dia-titulo{ font-family:var(--font-titulo); font-weight:700; font-size:clamp(18px,2vw,26px); margin-bottom:8px; color:var(--telao-ink); }
.telao-dia-titulo.hoje{ color:#E3A951; }
.telao-item{ padding:8px 0; border-top:1px solid #2E3A33; }
.telao-item-titulo{ font-size:clamp(18px,2vw,26px); font-weight:700; }
.telao-item-meta{ color:var(--telao-muted); font-size:clamp(14px,1.5vw,20px); display:flex; gap:8px; align-items:center; }

/* ==========================================================================
   Palco (Louvor ao vivo): tela cheia com tema próprio (escuro por padrão)
   ========================================================================== */
body.palco-aberto{ overflow:hidden; }
.palco{ --escala:1; position:fixed; inset:0; z-index:60; display:flex; flex-direction:column; background:var(--bg); color:var(--ink); }
.palco[data-tema="escuro"]{ color-scheme:dark; --bg:#0A0E14; --surface:#111823; --surface-2:#18212E; --ink:#EEEBE5; --muted:#A4AEBC; --line:#26303D; --accent:#F5B84A; --accent-ink:#1B1304; --accent-soft:#2B2417;
  --c1:#6FA8F0; --c2:#F08AB8; --c3:#62D1A0; --c4:#B397EE; --c5:#5DD0D8; --c6:#B3D45F; --c7:#F2A06A; --c8:#9FB2C2; --warn-soft:#3A2F10; --warn:#F5D78A; }
.palco[data-tema="claro"]{ color-scheme:light; --bg:#F6F7F9; --surface:#FFFFFF; --surface-2:#EEF0F4; --ink:#121923; --muted:#4A5668; --line:#D5DAE2; --accent:#8A5600; --accent-ink:#FFFFFF; --accent-soft:#F3E9D8;
  --c1:#2F6FB5; --c2:#B53F7A; --c3:#2E8B63; --c4:#7A52B3; --c5:#1E8A92; --c6:#6F8F1E; --c7:#C0642B; --c8:#5A6B7A; --warn-soft:#FFF3D6; --warn:#6B4A00; }
.palco-barra{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:calc(8px + env(safe-area-inset-top)) 12px 8px; border-bottom:1px solid var(--line); background:var(--surface); }
.palco-barra button{ margin:0; }
.palco-barra > button,.palco-ferr button{ width:44px; min-height:44px; padding:0; display:inline-flex; align-items:center; justify-content:center; }
.palco-titulo{ flex:1; min-width:120px; display:flex; flex-direction:column; line-height:1.2; }
.palco-titulo strong{ font-family:var(--font-titulo); font-size:17px; }
.palco-titulo span{ font-size:13px; color:var(--muted); }
.palco-modo{ margin:0; padding:3px; }
.palco-modo button{ min-height:36px; padding:4px 12px; font-size:14px; width:auto; }
.palco-ferr{ display:flex; gap:6px; }
.palco-faixa{ flex-basis:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 10px; border-radius:var(--r-sm); background:var(--surface-2); font-size:14px; }
.palco-faixa.conduz{ background:var(--accent); color:var(--accent-ink); font-weight:700; }
.palco-faixa.segue{ background:var(--accent-soft); color:var(--accent); font-weight:700; }
.palco-faixa.aviso{ background:var(--warn-soft); color:var(--warn); }
.palco-faixa button{ width:auto; }
.palco-corpo{ flex:1; overflow:auto; padding:16px 16px 12px; -webkit-overflow-scrolling:touch; }
.palco-nav{ display:flex; gap:10px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:var(--surface); }
.palco-nav button{ margin:0; min-height:64px; font-size:18px; flex:1; }
.palco.foco .palco-barra{ display:none; }
.palco-sair-foco{ display:none; position:absolute; top:calc(8px + env(safe-area-inset-top)); right:8px; width:44px; min-height:44px; padding:0; margin:0; opacity:.7; z-index:2; }
.palco.foco .palco-sair-foco{ display:inline-flex; align-items:center; justify-content:center; }
.palco-vazio{ text-align:center; padding:48px 16px; }
.eyebrow{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:700; }
.vtag{ display:inline-flex; align-items:center; gap:6px; padding:2px 10px; border-radius:99px; font-size:14px; font-weight:700; color:var(--vc); background:color-mix(in srgb, var(--vc) 16%, transparent); border:1px solid color-mix(in srgb, var(--vc) 45%, transparent); }
.vtag .ponto{ background:var(--vc); }
.vtag-g{ font-size:18px; padding:4px 14px; }
.repete{ display:inline-block; padding:1px 10px; border-radius:99px; background:var(--surface-2); border:1px solid var(--line); font-weight:700; font-size:14px; }
.avs{ display:flex; gap:8px; align-items:flex-start; padding:8px 12px; border-radius:var(--r-sm); margin:8px 0; font-weight:700; }
.avs .ico{ margin-top:2px; }
.avs-tom{ background:var(--accent); color:var(--accent-ink); }
.avs-instr{ background:transparent; border:2px solid var(--accent); color:var(--accent); }
.avs-nota{ background:var(--surface-2); border:1px solid var(--line); font-weight:400; }
.vlinha{ display:flex; gap:4px; margin-bottom:14px; }
.vlinha button{ margin:0; min-height:14px; height:14px; padding:0; border-radius:99px; border:0; background:color-mix(in srgb, var(--vc) 40%, transparent); }
.vlinha button.feito{ opacity:.45; }
.vlinha button.agora{ background:var(--vc); box-shadow:0 0 0 2px var(--bg), 0 0 0 4px var(--vc); }
.vlinha button.tem-tom{ background-image:repeating-linear-gradient(45deg, transparent 0 4px, rgba(255,255,255,.35) 4px 7px); }
.agora{ border-left:6px solid var(--vc); padding:6px 0 6px 14px; margin-bottom:14px; }
.agora-nome{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:2px 0 6px; font-family:var(--font-titulo); font-weight:800; font-size:calc(1.7rem * var(--escala)); line-height:1.1; }
.agora-nome .eyebrow{ font-family:var(--font); }
.agora .letra{ font-size:calc(clamp(1.6rem, 6.2vw, 2.6rem) * var(--escala)); line-height:1.35; font-weight:700; }
.instr-grande{ display:flex; align-items:center; gap:12px; font-size:calc(1.8rem * var(--escala)); font-weight:800; color:var(--accent); padding:16px 0; }
.instr-grande .ico{ width:36px; height:36px; }
.seguinte{ border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; background:var(--surface); }
.seguinte.destaque{ border:2px solid var(--accent); background:var(--accent-soft); }
.seguinte .espia{ margin:6px 0 0; color:var(--muted); }
.parte{ border-left:6px solid color-mix(in srgb, var(--vc) 50%, transparent); padding:4px 0 4px 14px; margin-bottom:22px; opacity:.72; }
.parte.atual{ opacity:1; border-left-color:var(--vc); }
.parte .letra{ font-size:calc(clamp(1.3rem, 5vw, 2rem) * var(--escala)); line-height:1.4; }
.letra-cab h1{ margin:0; font-size:calc(1.8rem * var(--escala)); }
.palco .cp .ch{ font-size:.62em; }
@media (min-width:900px){ .palco-corpo{ padding:24px max(24px, calc((100vw - 900px) / 2)); } .palco-nav{ padding-left:max(12px, calc((100vw - 900px) / 2)); padding-right:max(12px, calc((100vw - 900px) / 2)); } }

/* ----- Bíblia ----- */
.bib-topo{ display:flex; align-items:center; gap:6px; }
.bib-topo > button.sec:not(.bib-titulo){ flex:none; width:44px; min-height:44px; margin:0; padding:0; display:inline-flex; align-items:center; justify-content:center; }
.bib-topo .bib-titulo{ flex:1; min-width:0; }
.bib-titulo{ display:flex; justify-content:space-between; align-items:center; width:100%; margin:0; min-height:56px; font-family:var(--font-titulo); font-size:22px; font-weight:800; text-align:left; }
.bib-v{ margin:0 0 8px; line-height:1.6; padding:2px 6px; border-radius:var(--r-sm); cursor:pointer; }
.bib-v sup{ color:var(--accent); font-weight:700; margin-right:6px; font-size:.6em; }
.bib-v.sel{ background:var(--accent-soft); box-shadow:inset 3px 0 0 var(--accent); }
.bib-sel{ margin:12px 0 0; padding:10px; }

/* ----- Devocional ----- */
.devo{ position:relative; overflow:hidden; border-color:var(--accent); }
.devo .versiculo{ font-family:var(--font-titulo); font-size:21px; line-height:1.4; font-weight:700; margin:6px 0; }
.devo .ref{ color:var(--accent); font-weight:700; font-size:14px; margin:0 0 10px; }
.devo .reflexao{ margin:0 0 10px; }

/* >>> modulo:inicio (etapa media) */
/* ===== Início (inicio.js) e Devocional compacto (devocional.js) — prefixos .ini- e .devo- ===== */

/* ----- grade: uma coluna no celular; duas no desktop (ação à esquerda, leitura à direita) ----- */
.ini-grade{ display:block; }
.ini-col{ min-width:0; }
@media (min-width:900px){
  .ini-grade{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 20px; align-items:start; }
}
.ini-bloco{ margin-bottom:16px; }
.ini-titulo{ font-size:16px; margin:4px 0 8px; color:var(--ink); }

/* ----- avisos ----- */
.ini-aviso{ display:flex; gap:12px; align-items:flex-start; }
.ini-aviso-ico{ width:36px; height:36px; flex:none; border-radius:10px; background:var(--surface-2); color:var(--muted); display:flex; align-items:center; justify-content:center; }
.ini-aviso.destaque .ini-aviso-ico{ background:var(--accent-soft); color:var(--accent); }
.ini-aviso-txt{ min-width:0; }
.ini-aviso-txt .eyebrow{ display:block; color:var(--accent); }
.ini-aviso-txt p{ margin:4px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; }

/* ----- presença ----- */
.ini-presenca .eyebrow{ display:block; }
.ini-acolhida{ display:flex; gap:10px; align-items:flex-start; margin-top:12px; padding:12px; border-radius:var(--r-sm); background:var(--surface-2); color:var(--ink); }
.ini-acolhida-vou{ background:var(--ok-soft); }
.ini-acolhida-vou .ini-acolhida-ico{ color:var(--ok); }
.ini-acolhida-ico{ flex:none; color:var(--accent); display:flex; padding-top:1px; }
.ini-acolhida strong{ color:var(--ink); }
.ini-entra{ animation:iniEntra var(--t-lento) var(--ease) both; }
.ini-celebra .ini-acolhida-ico{ animation:iniBrilho .7s var(--ease) .12s both; }
.ini-celebra{ animation:iniEntra var(--t-lento) var(--ease) both, iniHalo 1.1s ease-out .1s 1; }
@keyframes iniEntra{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
@keyframes iniBrilho{ 0%{ transform:scale(.6) rotate(-20deg); opacity:.4; } 60%{ transform:scale(1.18) rotate(8deg); opacity:1; } 100%{ transform:none; } }
@keyframes iniHalo{ 0%{ box-shadow:0 0 0 0 color-mix(in srgb, var(--ok) 40%, transparent); } 100%{ box-shadow:0 0 0 12px transparent; } }
.ini-lideranca{ margin-top:12px; }

/* ----- "Para você agora" ----- */
.ini-lista{ list-style:none; margin:0; padding:0; }
.ini-item{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; border-top:1px solid var(--line); }
.ini-item:first-child{ border-top:0; }
.ini-item-principal{ flex:1 1 180px; min-width:0; display:flex; align-items:center; gap:12px; padding:10px 0; min-height:56px; }
button.ini-item-principal{ width:auto; margin:0; padding:10px 6px; background:none; border:0; border-radius:var(--r-sm); color:var(--ink); font-weight:400; text-align:left; }
button.ini-item-principal:hover:not(:disabled){ background:var(--surface-2); }
.ini-ico{ width:40px; height:40px; flex:none; border-radius:12px; display:flex; align-items:center; justify-content:center; color:var(--cor, var(--accent)); background:color-mix(in srgb, var(--cor, var(--accent)) 16%, transparent); }
.ini-item-txt{ min-width:0; flex:1; display:flex; flex-direction:column; }
.ini-item-txt strong{ overflow-wrap:anywhere; }
.ini-item-apoio{ color:var(--muted); font-size:14px; line-height:1.4; }
.ini-seta{ color:var(--muted); width:18px; height:18px; }
.ini-item-acao{ width:auto; flex:none; margin:0 0 8px auto; min-height:44px; padding:8px 14px; font-size:14px; white-space:nowrap; }
.ini-tocavel{ transition:background-color var(--t-rapido), transform var(--t-rapido) var(--ease); }
.ini-tocavel:active:not(:disabled){ transform:scale(.985); }

/* ----- atalhos: faixa rolável de pílulas ----- */
.ini-atalhos{ display:flex; gap:8px; overflow-x:auto; padding:2px 2px 6px; margin:0 -2px; scrollbar-width:none; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; }
.ini-atalhos::-webkit-scrollbar{ display:none; }
.ini-pilula{ flex:none; width:auto; margin:0; display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 16px 8px 12px; border-radius:99px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font-size:15px; white-space:nowrap; scroll-snap-align:start; }
.ini-pilula .ico{ width:20px; height:20px; color:var(--accent); }
.ini-pilula:hover:not(:disabled){ border-color:var(--accent); background:var(--surface); }
.ini-pilula:active:not(:disabled){ transform:scale(.97); }
.ini-pilula-escala{ background:var(--accent-soft); border-color:color-mix(in srgb, var(--accent) 40%, var(--line)); }

/* ----- próximo evento ----- */
.ini-evento{ position:relative; display:flex; align-items:stretch; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); overflow:hidden; }
.ini-evento::before{ content:""; position:absolute; left:0; top:12px; bottom:12px; width:4px; border-radius:0 4px 4px 0; background:var(--cor, var(--accent)); }
.ini-evento-principal{ flex:1; min-width:0; width:auto; margin:0; display:flex; align-items:center; gap:14px; padding:12px 12px 12px 16px; background:none; border:0; border-radius:0; color:var(--ink); font-weight:400; text-align:left; min-height:72px; }
.ini-evento-principal:hover:not(:disabled){ background:var(--surface-2); }
.ini-data{ width:56px; flex:none; border-radius:12px; background:var(--accent-soft); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:6px 0; line-height:1; }
.ini-data-dia{ font-family:var(--font-titulo); font-weight:800; font-size:24px; color:var(--ink); }
.ini-data-mes{ font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--accent); margin-top:4px; }
.ini-evento-txt{ min-width:0; flex:1; display:flex; flex-direction:column; gap:2px; }
.ini-evento-txt strong{ font-family:var(--font-titulo); font-size:17px; overflow-wrap:anywhere; }
.ini-evento-meta{ color:var(--muted); font-size:14px; }
button.ini-evento-mapa{ width:48px; min-height:48px; margin:12px 12px 12px 0; padding:0; align-self:center; flex:none; display:flex; align-items:center; justify-content:center; border-radius:12px; }

/* ----- último comunicado ----- */
.ini-com{ width:100%; margin:0; display:flex; align-items:flex-start; gap:12px; padding:14px 12px 14px 16px; text-align:left; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); font-weight:400; }
.ini-com:hover:not(:disabled){ background:var(--surface-2); }
.ini-com .ini-seta{ align-self:center; }
.ini-com-txt{ min-width:0; flex:1; }
.ini-com-topo{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; }
.ini-com-quando{ color:var(--muted); font-size:13px; }
.ini-com-resumo{ margin:4px 0 0; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; }

/* ----- esqueletos com forma ----- */
.ini-skel .skel{ margin:6px 0; }
.ini-skel-curta{ width:45%; }
.ini-skel-titulo{ height:24px; width:70%; }
.ini-skel-chips{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.ini-skel-chips .skel{ height:48px; border-radius:99px; }
.ini-skel-item{ display:flex; gap:12px; align-items:center; padding:8px 0; }
.ini-skel-ico{ width:40px; height:40px; flex:none; border-radius:12px; margin:0; }
.ini-skel-ico.redondo{ border-radius:50%; }
.ini-skel-data{ width:56px; height:56px; flex:none; border-radius:12px; margin:0; }
.ini-skel-txt{ flex:1; min-width:0; }
.ini-skel-evento,.ini-skel-comunicado{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:8px 16px; }

/* ----- devocional compacto ----- */
.devo-compacto{ padding:14px 16px 8px; }
.devo-topo{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:32px; }
.devo-topo .menu-acoes{ width:44px; min-height:44px; margin:-8px -8px -8px 0; padding:0; display:flex; align-items:center; justify-content:center; background:none; border:0; flex:none; }
.devo.devo-compacto .devo-versiculo{ font-size:19px; line-height:1.45; margin:8px 0 6px; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.devo.devo-compacto.aberto .devo-versiculo{ display:block; -webkit-line-clamp:unset; overflow:visible; }
.devo.devo-compacto .devo-sem-texto{ font-size:18px; }
.devo.devo-compacto .ref{ margin:0 0 4px; }
.devo-reflexao{ animation:iniEntra var(--t-medio) var(--ease) both; }
.devo-reflexao .reflexao{ margin:8px 0 4px; }
.devo-acoes{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-top:4px; }
.devo-acoes-dir{ display:flex; align-items:center; gap:4px; margin-left:auto; }
.devo-acoes button{ width:auto; margin:0; min-height:44px; }
.devo-mais{ display:inline-flex; align-items:center; gap:4px; padding:8px 4px; background:none; border:0; color:var(--accent); font-size:15px; }
.devo-mais .ico{ width:18px; height:18px; transition:transform var(--t-rapido) var(--ease); }
.devo-mais[aria-expanded="true"] .ico{ transform:rotate(180deg); }
.devo-mais:hover:not(:disabled){ background:none; text-decoration:underline; text-underline-offset:3px; }
.devo-ler{ padding:8px 12px; font-size:14px; flex:none; }
.devo-acoes-dir > .devo-ico{ width:44px; padding:0; display:flex; align-items:center; justify-content:center; }
.devo-acoes-dir > button[aria-busy="true"]{ opacity:.6; cursor:progress; }
.devo-skel .skel{ margin:10px 0; }
.devo-skel-curta{ width:40%; }
/* prévia da imagem compartilhável */
.devo-img-previa{ display:block; width:100%; max-width:320px; height:auto; aspect-ratio:1080 / 1350; margin:0 auto; border-radius:var(--r); border:1px solid var(--line); box-shadow:var(--shadow-alto); }
.devo-img-acoes{ flex-wrap:wrap; }
@media (max-width:360px){ .devo-ler span{ display:none; } .devo-ler{ width:44px; padding:0; justify-content:center; } }
/* <<< modulo:inicio */

/* >>> modulo:comunidade (etapa media) */
/* ==========================================================================
   Comunidade — Mural (.mural-), Oração (.or-) e Galeria (.gal-)
   Só tokens; seletores com "button.sec." onde é preciso vencer o estilo base de botão.
   ========================================================================== */

/* ---------- Mural: publicação ---------- */
button.mural-novo{ margin:0 0 16px; }
.mural-pub{ padding:14px 16px 4px; }
.mural-oficial{ border-color:color-mix(in srgb, var(--accent) 55%, var(--line)); }
.mural-cab{ display:flex; align-items:center; gap:10px; min-width:0; }
.mural-quem{ flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.25; }
.mural-autor{ font-size:15px; overflow-wrap:anywhere; }
.mural-quando{ color:var(--muted); font-size:13px; }
.mural-selo{ flex:none; align-self:flex-start; font-size:12px; }
.mural-texto{ margin:10px 0 6px; font-size:17px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.mural-rodape{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin:4px -8px 0; padding-top:2px; border-top:1px solid var(--line); }
.mural-comentar{ width:auto; min-height:44px; margin:0; padding:6px 10px; display:inline-flex; align-items:center; gap:8px; background:none; border:0; color:var(--muted); font-size:14px; font-weight:700; }
.mural-comentar .ico{ width:20px; height:20px; }
.mural-comentar:hover:not(:disabled),.mural-comentar[aria-expanded="true"]{ color:var(--accent); }
.mural-qtd{ font-weight:400; }
.mural-secao{ margin:20px 0 8px; }
.mural-form .actions button{ margin-top:12px; }
.mural-cont{ text-align:right; font-size:13px; color:var(--muted); margin-top:4px; }

/* ---------- Mural: comunicados fixados (bloco compacto no topo) ---------- */
.mural-fixados{ margin:0 0 8px; padding:10px; border-radius:var(--r); background:var(--accent-soft); border:1px solid color-mix(in srgb, var(--accent) 30%, transparent); }
.mural-fixados-tit{ display:flex; align-items:center; gap:6px; margin:2px 4px 8px; font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--accent); }
.mural-fixados-tit .ico{ width:16px; height:16px; }
.mural-fix{ margin-bottom:8px; padding:12px 12px 2px; box-shadow:none; }
.mural-fix:last-child{ margin-bottom:0; }
.mural-fix .mural-texto{ font-size:16px; margin:8px 0 0; }
.mural-fix .mural-rodape{ margin-top:2px; }
.mural-resumo{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; line-clamp:3; overflow:hidden; }
.mural-resumo.aberto{ display:block; -webkit-line-clamp:unset; line-clamp:none; overflow:visible; }
.mural-ler-mais{ width:auto; min-height:44px; margin:0; padding:4px 0; background:none; border:0; color:var(--accent); font-size:14px; font-weight:700; text-decoration:underline; text-underline-offset:3px; }

/* ---------- Mural: comentários ---------- */
.mural-coments{ margin:0 -16px -4px; padding:12px 16px; background:var(--surface-2); border-top:1px solid var(--line); border-radius:0 0 var(--r) var(--r); animation:abrir var(--t-rapido) var(--ease); }
.mural-fix > .mural-coments{ margin:0 -12px -2px; padding:12px; }
.mural-carregando{ margin:4px 0; }
.mural-com-lista{ list-style:none; margin:0 0 10px; padding:0; display:flex; flex-direction:column; gap:10px; }
.mural-com{ display:flex; align-items:flex-start; gap:8px; }
.mural-com-corpo{ flex:1; min-width:0; padding:8px 12px; background:var(--surface); border-radius:4px 14px 14px 14px; }
.mural-com-cab{ display:flex; flex-wrap:wrap; align-items:baseline; gap:0 8px; }
.mural-com-cab strong{ font-size:14px; overflow-wrap:anywhere; }
.mural-com-cab .mural-quando{ font-size:12px; }
.mural-com-texto{ font-size:15px; white-space:pre-wrap; overflow-wrap:anywhere; }
button.sec.mural-com-apagar{ width:44px; min-height:44px; margin:0; padding:0; flex:none; display:inline-flex; align-items:center; justify-content:center; background:none; border-color:transparent; color:var(--muted); }
button.sec.mural-com-apagar:hover:not(:disabled){ background:none; color:var(--danger); }
.mural-com-apagar .ico{ width:18px; height:18px; }
.mural-com-form{ display:flex; align-items:center; gap:8px; }
.mural-com-form input{ flex:1; min-width:0; min-height:44px; padding:10px 14px; border-radius:99px; }
.mural-com-form button{ width:44px; height:44px; min-height:44px; margin:0; padding:0; flex:none; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; }

/* ---------- Oração: sorteio da semana (destaque) ---------- */
.or-sorteio{ padding:18px 18px 10px; border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); background:linear-gradient(160deg, var(--accent-soft), var(--surface) 72%); }
.or-sobre{ display:flex; align-items:center; gap:6px; margin:0; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.or-sobre .ico{ width:16px; height:16px; }
.or-sorteio h2{ margin:8px 0 4px; font-size:20px; }
.or-sorteio h2.or-pre{ margin:10px 0 0; font-family:var(--font); font-size:16px; font-weight:700; color:var(--muted); }
.or-explica{ margin:4px 0 0; color:var(--muted); font-size:15px; }
.or-alvo{ display:flex; align-items:center; gap:14px; margin:10px 0 6px; min-width:0; }
.or-alvo .avatar{ width:56px; height:56px; font-size:20px; }
.or-alvo-nome{ min-width:0; font-family:var(--font-titulo); font-size:26px; line-height:1.15; overflow-wrap:anywhere; }
.or-frase{ margin:8px 0 2px; font-size:16px; }
.or-semana{ margin:0; font-size:13px; color:var(--muted); }
button.or-orei{ margin-top:14px; }
.or-feito{ display:flex; align-items:center; gap:10px; margin-top:14px; padding:12px 14px; border-radius:var(--r-sm); background:var(--ok-soft); color:var(--ok); font-weight:700; }
.or-feito .ico{ width:22px; height:22px; stroke-width:2.4; }
.or-feito.novo{ animation:marca var(--t-medio) var(--ease); }
.or-feito.novo .ico{ animation:or-check var(--t-lento) var(--ease) backwards; animation-delay:var(--t-rapido); }
@keyframes or-check{ from{ opacity:0; transform:scale(.4) rotate(-20deg); } to{ opacity:1; transform:none; } }
.or-sorteio .link-acao{ display:block; margin-top:8px; }
.or-novo{ margin-bottom:4px; }
.or-secao{ margin:22px 0 8px; }

/* ---------- Oração: pedidos da igreja ---------- */
.or-pedido{ padding:14px 16px 10px; }
.or-cab{ display:flex; align-items:center; gap:10px; min-width:0; }
.or-quem{ flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.25; }
.or-autor{ font-size:15px; overflow-wrap:anywhere; }
.or-quando{ font-size:13px; color:var(--muted); }
.or-selo{ flex:none; align-self:flex-start; max-width:50%; font-size:12px; }
.or-anon .ico{ width:20px; height:20px; color:var(--muted); }
.or-texto{ margin:10px 0 6px; font-size:16px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.or-rodape{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:8px; border-top:1px solid var(--line); }
.or-orando{ width:auto; min-height:44px; margin:0; padding:6px 16px 6px 12px; display:inline-flex; align-items:center; gap:8px; border-radius:99px; background:transparent; color:var(--ink); border:1px solid var(--line); font-size:14px; }
.or-orando .ico{ width:20px; height:20px; }
.or-orando:hover:not(:disabled){ background:var(--surface-2); }
.or-orando[aria-pressed="true"],.or-orando[aria-pressed="true"]:hover:not(:disabled){ background:var(--accent-soft); color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent); }
.or-orando.pulso{ animation:marca var(--t-medio) var(--ease); }
.or-cont{ font-size:13px; color:var(--muted); }

/* ---------- Oração: meus pedidos ---------- */
.or-meu{ padding:8px 6px 10px 16px; }
.or-meu-cab{ display:flex; align-items:center; gap:8px; }
.or-meu-meta{ flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; font-size:13px; color:var(--muted); }
.or-meu .or-texto{ margin:4px 10px 4px 0; }
.or-encerrado .or-texto{ color:var(--muted); }
.badge.or-status-fim{ background:var(--surface-2); color:var(--muted); }
.or-meu-rod{ display:flex; align-items:center; gap:6px; font-size:13px; color:var(--muted); }
.or-meu-rod .ico{ width:16px; height:16px; }

/* ---------- Galeria ---------- */
.gal-grade{ gap:12px; }
.gal-album{ position:relative; min-width:0; }
.gal-abrir{ width:100%; height:100%; margin:0; padding:8px; display:flex; flex-direction:column; align-items:stretch; gap:8px; text-align:left; font-weight:400; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); transition:border-color var(--t-rapido), transform var(--t-rapido) var(--ease); }
.gal-abrir:hover:not(:disabled){ border-color:color-mix(in srgb, var(--accent) 50%, var(--line)); }
.gal-capa{ width:100%; }
.gal-titulo{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; padding:0 4px 4px; font-family:var(--font-titulo); font-weight:700; font-size:15px; line-height:1.3; overflow-wrap:anywhere; }
button.sec.menu-acoes.gal-menu{ position:absolute; top:12px; right:12px; border-radius:50%; background:color-mix(in srgb, var(--surface) 88%, transparent); color:var(--ink); box-shadow:var(--shadow-alto); }
button.sec.menu-acoes.gal-menu:hover:not(:disabled){ background:var(--surface); }

/* visualizador do álbum: sempre escuro (tokens do telão), independente do tema */
.gal-vis{ position:fixed; inset:0; z-index:90; overflow:auto; display:flex; align-items:center; justify-content:center; padding:20px 16px calc(20px + env(safe-area-inset-bottom)); background:color-mix(in srgb, var(--telao-bg) 94%, transparent); color:var(--telao-ink); animation:aparecer var(--t-medio) var(--ease); }
.gal-vis-caixa{ width:100%; max-width:520px; margin:auto; text-align:center; animation:subir var(--t-medio) var(--ease); }
.gal-vis-capa{ display:block; max-width:100%; max-height:55vh; margin:0 auto; border-radius:14px; object-fit:contain; }
.gal-vis-sem-capa{ width:96px; height:96px; margin:0 auto; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--telao-botao); color:var(--telao-muted); }
.gal-vis-sem-capa .ico{ width:44px; height:44px; stroke-width:1.5; }
.gal-vis-titulo{ margin:16px 0 12px; font-size:22px; color:var(--telao-ink); overflow-wrap:anywhere; }
.gal-vis-link .ico{ width:20px; height:20px; }
.gal-vis-nota{ margin:14px 0 0; font-size:14px; color:var(--telao-muted); }
button.sec.gal-vis-fechar{ display:block; max-width:320px; margin:18px auto 0; background:transparent; color:var(--telao-ink); border-color:color-mix(in srgb, var(--telao-ink) 40%, transparent); }
button.sec.gal-vis-fechar:hover:not(:disabled){ background:var(--telao-botao); }
/* <<< modulo:comunidade */

/* >>> modulo:programacao (etapa media) */
/* ===== Programação (agenda, mês, detalhe do culto, escalas) — só tokens ===== */

/* Bloco de data: dia da semana, dia grande, mês abreviado (lista, detalhe e escalas) */
.prog-data{ width:48px; flex:none; align-self:center; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:6px 0; border-radius:12px; background:var(--surface-2); line-height:1; }
.prog-data-sem,.prog-data-mes{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.prog-data-dia{ font-family:var(--font-titulo); font-size:24px; font-weight:800; color:var(--ink); margin:3px 0; }
.prog-data.hoje{ background:var(--accent-soft); }
.prog-data.hoje .prog-data-dia,.prog-data.hoje .prog-data-sem,.prog-data.hoje .prog-data-mes{ color:var(--accent); }
.prog-data.g{ width:60px; padding:8px 0; background:var(--surface); border:1px solid var(--line); }
.prog-data.g .prog-data-dia{ font-size:30px; }

/* Linha de evento (usa .ct do ui.js para faixa lateral, toque e "⋯") */
.prog-ev .ct-principal{ gap:12px; padding:12px 14px 12px 16px; }
.prog-ev .ct-titulo{ font-size:16px; }
.prog-ev-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin-top:6px; font-size:13px; color:var(--muted); }
.prog-tipo,.prog-dep{ display:inline-flex; align-items:center; gap:6px; min-width:0; }
.prog-tipo .ico{ width:16px; height:16px; }
.prog-dep .ponto{ width:8px; height:8px; }
.prog-dep-forte{ color:var(--ink); }
.prog-ev.prog-proximo{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent), var(--shadow); }
.prog-selo-proximo{ font-size:12px; padding:1px 8px; }
.prog-dia-cab{ font-family:var(--font-titulo); font-size:14px; font-weight:800; letter-spacing:.02em; color:var(--muted); margin:18px 2px 8px; }
.prog-dia-cab.hoje{ color:var(--accent); }
.prog-novo{ margin:0 0 4px; }

/* Visão Mês */
.prog-mes-nav{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin:4px 0 8px; }
.prog-mes-nav button.prog-nav{ width:44px; min-height:44px; padding:0; margin:0; flex:none; display:inline-flex; align-items:center; justify-content:center; }
.prog-mes-meio{ flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:2px; }
.prog-mes-titulo{ font-family:var(--font-titulo); font-size:19px; margin:0; text-align:center; }
.prog-mes-hoje.chip{ min-height:32px; margin:0; padding:2px 10px; font-size:13px; }
.prog-mes-cartao{ padding:8px; }
.prog-grade{ display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:3px; }
.prog-grade-sem{ text-align:center; font-size:12px; font-weight:700; color:var(--muted); padding:4px 0 6px; }
.prog-grade button.prog-celula{ width:100%; min-width:0; min-height:44px; margin:0; padding:3px 0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; background:transparent; color:var(--ink); border:1px solid transparent; border-radius:10px; font-weight:400; }
.prog-grade button.prog-celula:hover:not(:disabled){ background:var(--surface-2); }
.prog-celula.tem{ background:var(--surface-2); }
.prog-celula.passado{ color:var(--muted); }
.prog-celula.passado .ponto{ opacity:.55; }
.prog-celula-num{ width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:15px; font-variant-numeric:tabular-nums; }
.prog-celula.hoje .prog-celula-num{ background:var(--accent); color:var(--accent-ink); font-weight:800; }
.prog-celula.hoje{ border-color:var(--accent); }
.prog-pontos{ display:flex; gap:2px; height:6px; }
.prog-pontos .ponto{ width:6px; height:6px; }
.prog-mes-lista-tit{ font-size:16px; margin:20px 2px 0; }
.prog-folha-dia > button{ margin-top:4px; }

/* Detalhe: cabeçalho */
.prog-cab{ position:relative; overflow:hidden; padding:16px 16px 18px; background:linear-gradient(180deg, color-mix(in srgb, var(--cor, var(--accent)) 14%, var(--surface)) 0, var(--surface) 140px); }
.prog-cab-topo{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; margin:-6px -8px 0 0; }
.prog-eyebrow{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); }
.prog-eyebrow .ico{ width:18px; height:18px; }
.prog-cab-titulo{ font-family:var(--font-titulo); font-size:clamp(24px, 7vw, 32px); line-height:1.12; margin:4px 0 14px; overflow-wrap:anywhere; }
.prog-cab-quando{ display:flex; align-items:center; gap:12px; }
.prog-cab-dia{ font-family:var(--font-titulo); font-weight:800; font-size:17px; line-height:1.25; }
.prog-cab-hora{ display:flex; align-items:center; gap:6px; margin-top:2px; font-size:16px; font-weight:700; color:var(--accent); font-variant-numeric:tabular-nums; }
.prog-cab-hora .ico{ width:18px; height:18px; }
.prog-cab-linha{ display:flex; align-items:center; gap:8px; margin-top:12px; font-size:15px; color:var(--ink); }
.prog-cab-linha > .ico{ width:18px; height:18px; color:var(--muted); }
.prog-cab-desc{ white-space:pre-wrap; margin:12px 0 0; }
.prog-visit-end .row{ margin-top:4px; }

/* Pessoas (avatar + texto) */
.prog-membro{ display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:3px 10px 3px 3px; border-radius:99px; background:var(--surface-2); font-size:14px; }
.prog-membro .avatar.p,.prog-pessoa-linha .avatar.p{ width:26px; height:26px; font-size:10px; border-width:1.5px; }
.prog-membro-txt{ display:inline-flex; align-items:baseline; gap:4px; min-width:0; flex-wrap:wrap; }
.prog-membro-nome{ font-weight:700; overflow-wrap:anywhere; }
.prog-membro-papel{ color:var(--muted); font-size:13px; }
.prog-pessoa-cab,.prog-pessoa-linha{ display:flex; align-items:center; gap:8px; min-width:0; }
.prog-pessoa-cab .prog-membro-txt,.prog-pessoa-linha .prog-membro-txt{ flex-direction:column; align-items:flex-start; gap:0; }
.prog-pessoa-cab .prog-membro-papel{ font-size:12px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; order:-1; }
.prog-equipe{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }

/* Seções do detalhe */
.prog-secao-cab{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px; }
.prog-secao-cab h2{ margin:0; font-size:18px; }
.vazio.prog-vazio{ padding:16px 8px 8px; }
.vazio.prog-vazio .ico-vazio{ width:52px; height:52px; }
.vazio.prog-vazio .ico-vazio svg{ width:26px; height:26px; }
.prog-nota{ display:flex; align-items:center; gap:6px; margin-top:6px; font-size:14px; color:var(--muted); }
.prog-nota .ico{ width:16px; height:16px; }
.prog-equipe-bloco{ padding:12px 0; border-top:1px solid var(--line); }
.prog-secao-cab + .prog-equipe-bloco{ border-top:0; padding-top:4px; }
button.prog-btn-rep{ margin-top:10px; min-height:44px; }

/* Ordem do culto: linha do tempo */
.prog-tl{ list-style:none; margin:10px 0 0; padding:0; }
.prog-tl-item{ display:grid; grid-template-columns:44px 14px minmax(0, 1fr); column-gap:10px; padding-bottom:16px; }
.prog-tl-item:last-child{ padding-bottom:2px; }
.prog-tl-hora{ text-align:right; font-size:14px; font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums; padding-top:1px; }
.prog-tl-marca{ position:relative; }
.prog-tl-marca::before{ content:""; position:absolute; left:1px; top:4px; width:12px; height:12px; border-radius:50%; box-sizing:border-box; background:var(--surface); border:3px solid var(--accent); z-index:1; }
.prog-tl-marca::after{ content:""; position:absolute; left:6px; top:16px; bottom:-20px; width:2px; background:var(--line); }
.prog-tl-item:last-child .prog-tl-marca::after{ display:none; }
.prog-tl-titulo{ display:block; font-size:16px; line-height:1.3; overflow-wrap:anywhere; }
.prog-tl-resp{ margin-top:6px; font-size:14px; }
.prog-tl-obs{ margin-top:4px; font-size:14px; color:var(--muted); white-space:pre-wrap; }

/* Oportunidades */
.prog-op{ padding:12px 0; border-top:1px solid var(--line); }
.prog-secao-op .prog-secao-cab + .prog-op{ border-top:0; padding-top:4px; }
.prog-op-topo{ display:flex; align-items:flex-start; justify-content:space-between; gap:6px 8px; flex-wrap:wrap; }
.prog-op-titulo{ font-size:16px; overflow-wrap:anywhere; }
.prog-op-desc{ margin-top:4px; color:var(--muted); font-size:14px; }
.prog-op-info{ display:flex; align-items:center; gap:6px; margin-top:6px; font-size:14px; color:var(--muted); }
.prog-op-info .ico{ width:16px; height:16px; }
button.prog-op-btn{ width:auto; min-height:44px; margin-top:10px; padding:8px 16px; }
button.prog-op-geral{ margin-top:12px; }
.prog-selo-cheia{ background:var(--warn-soft); color:var(--warn); }
.prog-selo-neutro{ background:var(--surface-2); color:var(--muted); }
.prog-interessado{ padding:10px 0; border-top:1px solid var(--line); }
.prog-secao-cab + .prog-interessado{ border-top:0; padding-top:4px; }
.prog-interessado-msg{ margin:4px 0 0 34px; font-size:14px; color:var(--muted); white-space:pre-wrap; }

/* Avisos */
.prog-aviso-topo{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.prog-aviso-tit{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 8px; min-width:0; padding-top:10px; }
.prog-aviso .menu-acoes{ margin:-4px -8px 0 0; }

/* Escalas */
.esc-filtro{ margin-bottom:8px; }
.esc-filtro label{ margin-top:0; }
.esc-novo{ margin:4px 0 12px; }
.esc-cartao .ct-principal{ align-items:flex-start; gap:12px; padding:12px 8px 12px 16px; }
.esc-cartao .prog-data{ align-self:flex-start; }
.esc-cartao .prog-dep{ margin-top:2px; font-size:13px; color:var(--muted); }
.esc-ninguem{ margin-top:8px; font-size:14px; color:var(--muted); font-style:italic; }

@media (max-width:360px){
  .prog-data{ width:44px; }
  .prog-ev .ct-principal{ gap:10px; padding:12px 10px 12px 14px; }
  .prog-celula-num{ width:26px; height:26px; font-size:14px; }
  .prog-tl-item{ grid-template-columns:40px 14px minmax(0, 1fr); column-gap:8px; }
}
/* <<< modulo:programacao */

/* >>> modulo:ferramentas (etapa media) */
/* ===== Ferramentas menores: Estoque (.est-), Bíblia (.bib2-), Harpa (.harpa-) ===== */
/* Só tokens; nenhuma cor fixa. Sobrescritas de classes já existentes estão anotadas. */

/* ---------- Estoque ---------- */
.badge.est-warn{ background:var(--warn-soft); color:var(--warn); }
.est-secao{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }

/* empréstimos em aberto */
.card.est-emp{ padding:12px; border-left:4px solid var(--line); }
.card.est-emp.vencido{ border-color:var(--danger); }
.est-emp-topo{ display:flex; align-items:flex-start; gap:12px; }
.est-emp-txt{ flex:1; min-width:0; }
.est-emp-item{ display:block; font-family:var(--font-titulo); font-size:16px; overflow-wrap:anywhere; }
.est-emp-quem{ font-size:15px; }
.est-emp-prazo{ color:var(--muted); font-size:14px; margin-top:2px; overflow-wrap:anywhere; }
.est-emp-topo > .badge{ flex:none; }
.est-dev{ margin-top:10px; }
@media (max-width:360px){ .est-emp-topo{ flex-wrap:wrap; } .est-emp-topo > .badge{ margin-left:52px; } }

/* busca + categorias */
.est-busca-caixa{ position:relative; }
.est-busca-caixa > .ico{ position:absolute; left:12px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--muted); pointer-events:none; }
.est-busca-caixa > input.est-busca{ padding-left:42px; min-height:48px; }
.est-chips{ display:flex; gap:6px; overflow-x:auto; padding:6px 0 4px; margin:0 0 8px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.est-chips::-webkit-scrollbar{ display:none; }
.est-chips .chip{ flex:none; margin:0; min-height:44px; }
.est-lista{ margin-top:4px; }

/* barra de saldo x mínimo (texto sempre junto; cor nunca é o único sinal) */
.est-saldo{ display:flex; align-items:center; gap:10px; margin-top:6px; }
.est-barra{ position:relative; flex:1; max-width:140px; height:6px; border-radius:99px; background:var(--surface-2); border:1px solid var(--line); overflow:hidden; }
.est-barra-fill{ position:absolute; left:0; top:0; bottom:0; border-radius:99px; background:var(--ok); transition:width var(--t-medio) var(--ease); }
.est-barra-min{ position:absolute; left:50%; top:-1px; bottom:-1px; width:2px; background:var(--muted); opacity:.6; }
.est-saldo.baixo .est-barra-fill{ background:var(--danger); }
.est-saldo-txt{ font-size:13px; color:var(--muted); white-space:nowrap; }
.est-saldo.baixo .est-saldo-txt{ color:var(--danger); font-weight:700; }

/* folha do item */
.est-folha-sub{ margin:-6px 0 8px; }
.est-resumo{ padding:12px; border-radius:var(--r); background:var(--surface-2); }
.est-resumo-num{ display:flex; align-items:baseline; gap:2px; }
.est-num{ font-family:var(--font-titulo); font-size:40px; line-height:1; }
.est-resumo .est-barra{ max-width:none; height:8px; }
.est-rapidos{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.est-rapidos .est-rapido{ margin:0; min-height:72px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; }
.est-rapido-n{ font-family:var(--font-titulo); font-size:30px; line-height:1; font-variant-numeric:tabular-nums; }
.est-rapido-r{ font-size:13px; font-weight:700; opacity:.85; }
.est-acoes{ display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; }
.est-acoes button{ margin-top:10px; padding:10px 6px; }
.est-estado{ display:flex; align-items:center; gap:8px; margin:4px 0 0; font-weight:700; color:var(--warn); }
.est-estado.ok{ color:var(--ok); }
.est-estado .ico{ width:20px; height:20px; }
.est-folha .card.est-emp{ margin:0; }
.est-folha-pe{ display:flex; gap:8px; }
.est-hist-linha{ border-top:1px solid var(--line); padding:6px 0; }

/* ---------- Bíblia ---------- */
/* (.bib-titulo, .bib-v, .bib-sel, .bib-topo, .bib-cab, .bib-texto continuam em estilo.css; aqui só classes novas .bib2-) */
.bib2-ferr{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-top:6px; }
.bib2-tipo{ display:flex; align-items:center; gap:6px; }
button.bib2-mini{ min-height:44px; min-width:44px; padding:4px 10px; }
.bib2-tam{ min-width:52px; text-align:center; font-weight:700; font-variant-numeric:tabular-nums; }

/* fonte e espaçamento (preferências salvas no aparelho) */
.bib2-serifa .bib-v{ font-family:Georgia, "Times New Roman", serif; }
.bib2-amplo .bib-v{ line-height:1.95; margin-bottom:12px; }

/* versículo procurado pela referência */
.bib-v.bib2-alvo{ background:var(--warn-soft); box-shadow:inset 3px 0 0 var(--warn); scroll-margin:96px; }
.bib-v.bib2-alvo.sel{ background:var(--accent-soft); box-shadow:inset 3px 0 0 var(--accent); }
.bib-v.bib2-alvo{ animation:bib2Pulso var(--t-medio) var(--ease) 2; }
@keyframes bib2Pulso{ 50%{ background:var(--accent-soft); } }

/* rodapé com o nome do capítulo vizinho */
.bib2-nav{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:16px; }
.bib2-nav button{ margin:0; min-height:52px; overflow-wrap:anywhere; }
.bib2-nav button:only-child{ grid-column:1 / -1; }

/* folha "Ir para…": referência digitada */
.bib2-ref{ margin-bottom:8px; }
.bib2-ref-linha{ display:flex; gap:8px; align-items:stretch; }
.bib2-ref-linha input{ flex:1; min-width:0; }
.bib2-ref-linha button{ width:52px; min-height:48px; margin:0; padding:0; flex:none; display:inline-flex; align-items:center; justify-content:center; }
.bib2-ajuda{ font-size:13px; margin:6px 0 0; }
button.bib2-atual{ border-color:var(--accent); color:var(--accent); }

/* folha "Aa" */
.bib2-pref{ display:flex; flex-direction:column; gap:8px; }
.bib2-pref-linha{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.bib2-pref-rot{ margin-top:8px; }
.bib2-amostra{ cursor:default; margin:0; padding:10px 12px; background:var(--surface-2); }

/* ---------- Harpa ---------- */
/* busca única (mesmo campo do Louvor: .lv-busca-caixa + input.lv-busca), presa logo abaixo do título da ferramenta */
.harpa-topo{ position:sticky; top:calc(var(--cab-h) + 56px); z-index:5; background:var(--bg); padding:2px 0 8px; margin-top:-4px; }
.harpa-topo input.lv-busca{ padding-right:48px; font-size:17px; }
.harpa-topo input.lv-busca::-webkit-search-cancel-button{ -webkit-appearance:none; appearance:none; }
button.harpa-limpar{ position:absolute; right:2px; top:50%; transform:translateY(-50%); width:44px; min-width:44px; min-height:44px; margin:0; padding:0; background:transparent; color:var(--muted); border:0; display:flex; align-items:center; justify-content:center; }
button.harpa-limpar:hover:not(:disabled){ color:var(--ink); background:transparent; }
button.harpa-limpar .ico{ width:20px; height:20px; }
button.harpa-tema-btn{ flex:none; width:48px; min-width:48px; min-height:48px; margin:0; padding:0; display:flex; align-items:center; justify-content:center; color:var(--muted); }
button.harpa-tema-btn .ico{ width:20px; height:20px; }
button.harpa-tema-btn[aria-expanded="true"]{ color:var(--ink); border-color:var(--ink); }
button.harpa-tema-btn.ativo{ color:var(--accent-ink); background:var(--accent); border-color:var(--accent); }
.harpa-temas{ display:flex; gap:6px; overflow-x:auto; padding:8px 0 0; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.harpa-temas::-webkit-scrollbar{ display:none; }
.harpa-temas .chip{ flex:none; margin:0; white-space:nowrap; font-weight:600; min-height:40px; padding:4px 12px; }
.harpa-tema-qtd{ font-size:12px; font-weight:400; opacity:.7; font-variant-numeric:tabular-nums; }
.harpa-info{ font-size:13px; margin:0 0 6px; min-height:1em; }
.harpa-info:empty{ display:none; }
.harpa-sr{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* linhas de hino (busca e favoritos): número grande + título + autor/tom ou o trecho achado na letra */
.harpa-lista{ display:grid; gap:6px; }
button.harpa-item{ margin:0; min-height:60px; display:flex; align-items:center; gap:14px; padding:10px 14px; text-align:left; justify-content:flex-start; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r-sm); font-weight:400; }
button.harpa-item:hover:not(:disabled){ background:var(--surface-2); border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); }
.harpa-item-n{ flex:none; min-width:3ch; font-family:var(--font-titulo); font-size:22px; font-weight:800; line-height:1; color:var(--accent); font-variant-numeric:tabular-nums; text-align:right; }
.harpa-item-txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.harpa-item-tit{ font-family:var(--font-titulo); font-weight:700; font-size:16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.harpa-item-sub{ font-size:13px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.harpa-trecho{ font-size:13px; color:var(--muted); line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.harpa-trecho-rot{ font-weight:700; color:var(--ink); opacity:.75; }
mark.harpa-marca{ background:var(--accent-soft); color:var(--ink); font-weight:700; border-radius:3px; padding:0 1px; }
.harpa-item-fav{ flex:none; color:var(--warn); display:flex; }
.harpa-item-fav .ico{ width:18px; height:18px; }
.harpa-item-fav .ico path{ fill:currentColor; }
.harpa-mais{ text-align:center; font-size:13px; margin:8px 0 0; }

/* ocioso: recentes (faixa de chips) e favoritos */
.harpa-sec{ margin-top:10px; display:grid; gap:6px; }
.harpa-sec + .harpa-sec{ margin-top:18px; }
.harpa-sec-cab{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.harpa-sec-cab h3{ margin:0; font-size:15px; }
.harpa-sec-cab button.link-acao{ margin:0; }
.harpa-recentes{ display:flex; gap:6px; overflow-x:auto; padding:2px 0 4px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.harpa-recentes::-webkit-scrollbar{ display:none; }
.harpa-recentes .chip{ flex:none; margin:0; white-space:nowrap; font-weight:400; }
.harpa-recentes .chip strong{ font-family:var(--font-titulo); font-variant-numeric:tabular-nums; }
.harpa-rodape{ margin-top:20px; text-align:center; }
.harpa-rodape button.link-acao{ margin:0 auto; color:var(--muted); }
.folha .harpa-ger{ margin:0; border:0; padding:0; background:none; box-shadow:none; }
.folha .harpa-ger h3{ display:none; }
/* ---------- Transmitir (controle da TV) ---------- */
.tx-intro{ margin:0 0 12px; }
.tx-bloco{ display:grid; gap:10px; margin-bottom:12px; }
.tx-bloco h3{ margin:0; font-size:16px; }
.tx-bloco button{ margin:0; }
button.tx-cast{ min-height:56px; font-size:17px; }
button.tx-cast .ico{ width:24px; height:24px; }
.tx-dica{ font-size:14px; margin:0; }
.tx-codigo-linha{ display:flex; gap:8px; align-items:stretch; }
.tx-codigo-linha button{ width:auto; flex:none; padding:0 20px; }
input.tx-codigo{ flex:1; min-width:0; text-align:center; font-family:var(--font-titulo); font-size:32px; font-weight:800; letter-spacing:.3em; padding:6px 0 6px .3em; font-variant-numeric:tabular-nums; }
.tx-volta{ text-align:center; margin-top:4px; }

.tx-topo{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.tx-topo button.link-acao{ margin:0; }
.tx-status{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14px; }
.tx-status::before{ content:""; width:10px; height:10px; border-radius:50%; background:var(--muted); }
.tx-status.ok::before{ background:var(--ok); box-shadow:0 0 0 4px color-mix(in srgb, var(--ok) 25%, transparent); }
.tx-status.aviso::before{ background:var(--warn); }
.tx-previa{ width:100%; aspect-ratio:16 / 9; border-radius:var(--r-sm); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow, 0 4px 14px rgba(0,0,0,.18)); }
.tx-seguinte{ font-size:13px; margin:6px 0 0; min-height:1.3em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tx-controles{ display:grid; grid-template-columns:64px 1fr 1fr 64px; gap:8px; margin:10px 0 14px; }
.tx-controles button{ margin:0; min-height:56px; padding:0 6px; }
button.tx-nav{ display:flex; align-items:center; justify-content:center; }
button.tx-nav .ico{ width:28px; height:28px; }
button.tx-acao[aria-pressed="true"]{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.tx-painel{ margin-top:12px; display:grid; gap:8px; }
.tx-painel > button{ margin:0; }
.tx-res{ margin-top:4px; }
.tx-sub{ font-family:var(--font-titulo); font-weight:700; margin:4px 0 0; }
.tx-cab{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.tx-cab strong{ font-family:var(--font-titulo); font-size:17px; }
.tx-cab button.link-acao{ margin:0; }
.tx-musicas{ display:grid; gap:14px; }
.tx-musica{ display:grid; gap:6px; }
.tx-musica h4{ margin:0; font-size:15px; font-family:var(--font-titulo); }
.tx-musica button.link-acao{ justify-self:start; margin:0; }
button.tx-slide{ margin:0; display:flex; flex-direction:column; align-items:flex-start; gap:2px; text-align:left; padding:10px 14px; min-height:52px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r-sm); font-weight:400; }
button.tx-slide strong{ font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--accent); }
button.tx-slide span{ font-size:14px; color:var(--muted); max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
button.tx-slide[aria-current="true"]{ border-color:var(--accent); background:var(--accent-soft); box-shadow:inset 4px 0 0 var(--accent); }
button.tx-slide[aria-current="true"] span{ color:var(--ink); }
@media (min-width:900px){
  [data-ferr="transmitir"]{ display:grid; grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr); gap:0 24px; align-items:start; }
  [data-ferr="transmitir"][hidden]{ display:none; }
  [data-ferr="transmitir"] > .tx-intro, [data-ferr="transmitir"] > .tx-bloco, [data-ferr="transmitir"] > .tx-volta{ grid-column:1 / -1; max-width:560px; }
  [data-ferr="transmitir"] > .tx-topo, [data-ferr="transmitir"] > .tx-previa, [data-ferr="transmitir"] > .tx-seguinte, [data-ferr="transmitir"] > .tx-controles{ grid-column:1; }
  [data-ferr="transmitir"] > .seg, [data-ferr="transmitir"] > .tx-painel{ grid-column:2; }
  [data-ferr="transmitir"] > .seg{ grid-row:1; }
  [data-ferr="transmitir"] > .tx-painel{ grid-row:2 / span 4; max-height:70vh; overflow:auto; margin-top:8px; }
}
/* <<< modulo:ferramentas */

/* >>> modulo:louvor (etapa media) */
/* ==========================================================================
   Louvor — refinamento (etapa de mudanças médias)
   .lv-*  = gestão (louvor.js)     .pc-* = palco / ao vivo (palco.js)
   Só tokens; nada de cor fixa. Movimento curto; o global já desliga com "reduzir movimento".
   ========================================================================== */

/* ----- seletor único de departamento ----- */
.lv-topo{ display:flex; align-items:center; gap:8px; margin:0 0 10px; }
button.chip.lv-dep{ min-height:44px; margin:0; padding:6px 12px 6px 14px; gap:8px; font-size:14px; letter-spacing:.06em; text-transform:uppercase; }
.lv-dep .ico{ width:18px; height:18px; color:var(--muted); }
.lv-dep-unico{ margin:0 0 10px; font-size:14px; }
.lv-dep-item .ponto{ width:12px; height:12px; }
.lv-dep-item > .ico:last-child{ margin-left:auto; color:var(--accent); }
.lv-dep-item.atual{ background:var(--accent-soft); color:var(--accent); }

/* ----- busca e lista de músicas ----- */
.lv-busca-linha{ display:flex; align-items:center; gap:8px; }
.lv-busca-caixa{ position:relative; flex:1; min-width:0; }
.lv-busca-caixa > .ico{ position:absolute; left:12px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--muted); pointer-events:none; }
input.lv-busca{ padding-left:42px; min-height:48px; }
button.lv-nova{ width:auto; flex:none; margin:0; min-height:48px; padding:10px 14px; }
.lv-contagem{ margin:6px 2px 8px; font-size:13px; }
.lv-selos{ display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap; }
.badge.lv-tom{ font-variant-numeric:tabular-nums; white-space:nowrap; }
.lv-vozes{ display:inline-flex; align-items:center; gap:3px; }
.lv-vozes .ponto{ width:10px; height:10px; box-shadow:0 0 0 1.5px var(--surface); }
.lv-vozes-mais{ font-size:12px; font-weight:700; color:var(--muted); margin-left:2px; }
.lv-carregando{ opacity:.6; pointer-events:none; cursor:progress; }
.badge.lv-rascunho{ color:var(--muted); }

/* ----- aba Ao vivo: destaque do próximo culto ----- */
.lv-destaque{ background:var(--accent-soft); border:1px solid color-mix(in srgb, var(--accent) 35%, transparent); border-radius:var(--r-lg); padding:18px 16px 16px; margin:0 0 18px; }
.lv-destaque .eyebrow{ color:var(--accent); }
.lv-destaque-titulo{ font-family:var(--font-titulo); font-size:24px; line-height:1.15; margin:6px 0 10px; overflow-wrap:anywhere; }
.lv-destaque-meta{ display:flex; flex-wrap:wrap; gap:6px 18px; font-size:15px; color:var(--ink); }
.lv-destaque-meta .com-ico{ display:inline-flex; align-items:center; gap:6px; }
.lv-destaque-meta .ico{ width:18px; height:18px; color:var(--accent); }
.lv-destaque-notas{ margin:10px 0 0; color:var(--muted); }
button.lv-destaque-abrir{ min-height:56px; margin-top:16px; font-size:18px; border-radius:var(--r); gap:10px; }
.lv-destaque-abrir .ico{ width:22px; height:22px; fill:currentColor; }
.lv-destaque.lv-carregando{ opacity:1; }
.lv-destaque.lv-carregando .lv-destaque-abrir{ opacity:.6; }
.lv-secao{ margin:6px 2px 8px; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }

/* ----- editor: partes com faixa da voz e subir/descer ----- */
.card.lv-parte{ padding:12px 12px 12px 16px; border-left:6px solid var(--cor, var(--line)); }
.lv-parte-topo{ display:flex; align-items:center; gap:8px; }
.lv-parte-n{ flex:none; min-width:28px; text-align:center; }
.lv-mover{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.lv-mover button{ width:44px; min-height:44px; margin:0; padding:0; display:inline-flex; align-items:center; justify-content:center; }
.lv-movida{ animation:lv-movida var(--t-medio) var(--ease); }
@keyframes lv-movida{ from{ box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 45%, transparent); } to{ box-shadow:var(--shadow); } }
.card.lv-item-pl{ padding:12px; }
.lv-item-pl input{ margin-top:8px; }

/* ==========================================================================
   Palco (ao vivo) — sobrescreve partes da seção "Palco" do estilo.css com especificidade maior
   ========================================================================== */

/* barra: linha 1 = fechar · título (mapa) · ferramentas; linha 2 = modo · tom · conduzir */
.palco-barra > button.pc-titulo{ flex:1 1 140px; width:auto; min-width:0; min-height:44px; margin:0; padding:2px 6px; display:flex; align-items:center; justify-content:flex-start; gap:6px;
  background:none; border:0; border-radius:var(--r-sm); color:var(--ink); text-align:left; font-weight:400; }
.palco-barra > button.pc-titulo:hover:not(:disabled){ background:var(--surface-2); }
.pc-titulo-txt{ display:flex; flex-direction:column; min-width:0; line-height:1.2; }
.pc-titulo-txt strong{ font-family:var(--font-titulo); font-size:17px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pc-titulo-txt span{ font-size:13px; color:var(--muted); }
.pc-titulo > .ico{ width:18px; height:18px; color:var(--muted); }
.pc-ctrl{ order:5; flex-basis:100%; min-width:0; display:flex; align-items:center; gap:8px; }
.pc-ctrl .palco-modo{ flex:none; }
.palco-barra .pc-tom,.palco-barra .pc-conduz{ width:auto; min-height:44px; margin:0; padding:6px 12px; display:inline-flex; align-items:center; gap:6px; font-size:15px; white-space:nowrap; }
.palco-barra .pc-tom{ flex:none; font-weight:800; font-variant-numeric:tabular-nums; }
.pc-tom .ico{ width:16px; height:16px; }
.palco-barra .pc-tom.pc-tom-mudado{ border:2px solid var(--accent); color:var(--accent); }
.palco-barra .pc-conduz{ flex:0 1 auto; min-width:44px; margin-left:auto; overflow:hidden; }
.pc-conduz-txt{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pc-conduz .ico{ width:18px; height:18px; flex:none; }
.palco-barra .pc-conduz.ativo{ background:var(--accent-soft); color:var(--accent); border:2px solid var(--accent); }
.palco-barra .pc-conduz.segue{ background:var(--accent-soft); color:var(--accent); border-color:transparent; }
.palco-barra .pc-conduz.solto{ background:var(--accent); color:var(--accent-ink); border-color:transparent; }
.pc-ponto{ --cor:var(--accent); width:10px; height:10px; }
/* faixa fina de estado (≤ 28 px) */
.palco-barra .palco-faixa.pc-faixa{ order:6; justify-content:flex-start; gap:6px; min-height:0; max-height:28px; padding:3px 10px; font-size:13px; line-height:1.2; overflow:hidden; white-space:nowrap; }
.pc-faixa span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.pc-faixa .ico{ width:16px; height:16px; }
.palco-barra .palco-faixa.aviso.pc-faixa{ order:7; }
@media (min-width:760px){
  .pc-ctrl{ order:0; flex-basis:auto; }
  .palco-barra .pc-conduz{ margin-left:0; }
}

/* folha de tom */
.pc-tom-atual{ display:block; text-align:center; font-family:var(--font-titulo); font-size:34px; font-weight:800; color:var(--accent); margin:2px 0 4px; }
.pc-tom-passos{ display:flex; gap:8px; }
.pc-tom-passos button{ flex:1; min-height:56px; margin-top:8px; font-size:20px; font-variant-numeric:tabular-nums; }

/* mapa do repertório */
.pc-mapa{ display:flex; flex-direction:column; gap:4px; }
button.pc-mapa-musica{ display:flex; align-items:center; gap:12px; width:100%; min-height:56px; margin:0; padding:10px; text-align:left; background:none; border:1px solid transparent; color:var(--ink); font-weight:400; }
button.pc-mapa-musica:hover:not(:disabled){ background:var(--surface-2); }
button.pc-mapa-musica.atual{ background:var(--accent-soft); border-color:color-mix(in srgb, var(--accent) 40%, transparent); }
.pc-mapa-n{ flex:none; width:30px; height:30px; border-radius:50%; background:var(--surface-2); display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:14px; }
.pc-mapa-musica.atual .pc-mapa-n{ background:var(--accent); color:var(--accent-ink); }
.pc-mapa-txt{ display:flex; flex-direction:column; min-width:0; }
.pc-mapa-txt strong{ overflow-wrap:anywhere; }
.pc-mapa-txt span{ font-size:13px; color:var(--muted); }
.pc-mapa-partes{ display:flex; flex-direction:column; gap:4px; margin:2px 0 8px 24px; padding-left:10px; border-left:2px solid var(--line); }
button.pc-mapa-parte{ position:relative; display:flex; align-items:center; flex-wrap:wrap; gap:6px 8px; width:100%; min-height:48px; margin:0; padding:8px 10px 8px 16px; text-align:left; background:none; border:1px solid transparent; color:var(--ink); font-weight:400; }
button.pc-mapa-parte::before{ content:""; position:absolute; left:2px; top:8px; bottom:8px; width:5px; border-radius:4px; background:var(--vc); }
button.pc-mapa-parte:hover:not(:disabled){ background:var(--surface-2); }
button.pc-mapa-parte.atual{ background:var(--surface-2); border-color:var(--accent); }
.pc-mapa-nome{ flex:1 1 auto; font-weight:800; }
.pc-mapa .vtag{ font-size:13px; color:var(--ink); }
.pc-mapa .repete{ font-size:13px; }
.pc-mapa-tom{ padding:1px 8px; border-radius:99px; font-size:13px; font-weight:700; background:var(--accent); color:var(--accent-ink); }

/* cifras legíveis a ~1,5 m: maiores, mais pesadas e com respiro acima da sílaba */
.palco .cp .ch.pc-ch{ font-size:.78em; font-weight:800; color:var(--accent); line-height:1.1; padding-bottom:.08em; letter-spacing:.01em; }
.palco .letra:has(.pc-ch) .letra-linha{ margin-top:.5em; line-height:1.3; }
.palco .letra:has(.pc-ch) .letra-linha:first-child{ margin-top:.15em; }

/* troca de parte: deslize + esmaecimento curtos (≤ 220 ms) */
.palco .agora.pc-entra{ animation:pc-entra-frente 200ms var(--ease) both; }
.palco .agora.pc-entra.pc-de-tras{ animation-name:pc-entra-tras; }
.palco .seguinte.pc-entra-suave{ animation:aparecer 200ms var(--ease) both; }
@keyframes pc-entra-frente{ from{ opacity:0; transform:translateX(18px); } to{ opacity:1; transform:none; } }
@keyframes pc-entra-tras{ from{ opacity:0; transform:translateX(-18px); } to{ opacity:1; transform:none; } }
/* <<< modulo:louvor */

/* >>> modulo:comunidade (etapa grande) */
/* ==========================================================================
   Comunidade viva (etapa grande) — juntar DEPOIS de .refino/css/comunidade.css
   Mural (.mural-), Oração (.or-), Galeria (.gal-). Só tokens; nada de cor fixa.
   ========================================================================== */

/* ---------- Mural: links no texto ---------- */
.mural-link{ color:var(--accent); font-weight:700; text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; word-break:break-word; }
.mural-dica{ margin:4px 0 0; font-size:13px; color:var(--muted); }

/* ---------- Mural: reações (3 colunas iguais; texto sempre visível) ---------- */
.mural-reacoes{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px; margin:8px 0 6px; }
button.mural-reacao{ width:auto; min-width:0; min-height:52px; margin:0; padding:6px 4px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  background:var(--surface-2); color:var(--ink); border:1px solid transparent; border-radius:var(--r-sm); font-weight:700; line-height:1.2; }
button.mural-reacao:hover:not(:disabled){ background:color-mix(in srgb, var(--accent) 10%, var(--surface-2)); }
.mural-reacao-topo{ display:inline-flex; align-items:center; gap:4px; }
.mural-reacao .ico{ width:20px; height:20px; }
.mural-reacao-n{ font-size:14px; font-variant-numeric:tabular-nums; min-width:0; }
.mural-reacao-rot{ font-size:13px; text-align:center; overflow-wrap:anywhere; }
button.mural-reacao[aria-pressed="true"],button.mural-reacao[aria-pressed="true"]:hover:not(:disabled){ background:var(--accent-soft); color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent); }
button.mural-reacao[aria-pressed="true"] .ico{ stroke-width:2.4; }
button.mural-reacao.pulso{ animation:marca var(--t-medio) var(--ease); }
.mural-fix .mural-reacoes{ margin-top:10px; }

/* ---------- Mural: rodapé com Compartilhar (comunicado) ---------- */
.mural-rodape-dir{ display:inline-flex; align-items:center; gap:2px; }
button.mural-compartilhar{ width:auto; min-height:44px; margin:0; padding:6px 10px; display:inline-flex; align-items:center; gap:6px; background:none; border:0; color:var(--accent); font-size:14px; font-weight:700; }
button.mural-compartilhar .ico{ width:20px; height:20px; }
button.mural-compartilhar:hover:not(:disabled){ background:var(--accent-soft); }
@media (max-width:359px){ button.mural-compartilhar span{ display:none; } }

/* ---------- Mural: moderação (oculto) ---------- */
.mural-oculta{ border-style:dashed; border-color:var(--warn); background:color-mix(in srgb, var(--warn-soft) 45%, var(--surface)); }
.mural-oculta .mural-texto{ color:var(--muted); }
.badge.mural-selo-oculto{ background:var(--warn-soft); color:var(--warn); }
.mural-aviso-oculto{ margin:0 0 6px; font-size:13px; color:var(--warn); }
.mural-com-oculto .mural-com-corpo{ border:1px dashed var(--warn); }
.mural-com-oculto .mural-com-texto{ color:var(--muted); }
.mural-com-cab .badge{ font-size:12px; }
button.sec.menu-acoes.mural-com-menu{ flex:none; }
.mural-qr-tit{ display:flex; align-items:center; gap:6px; margin:12px 0 6px; }
.mural-qr-tit .ico{ width:18px; height:18px; color:var(--accent); }
.mural-qr-lista{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.mural-qr-lista li{ display:flex; align-items:center; gap:8px; overflow-wrap:anywhere; }
.mural-detalhe .mural-pub{ margin-bottom:0; }

/* ---------- Mural: boas-vindas (mural vazio) ---------- */
.mural-bv{ text-align:center; padding:24px 18px 18px; background:linear-gradient(165deg, var(--accent-soft), var(--surface) 70%); border-color:color-mix(in srgb, var(--accent) 35%, var(--line)); }
.mural-bv-arte{ position:relative; width:150px; height:84px; margin:0 auto 10px; }
.mural-bv-bolha{ position:absolute; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--surface); border:2px solid color-mix(in srgb, var(--accent) 45%, var(--line)); color:var(--accent); box-shadow:var(--shadow); animation:subir var(--t-lento) var(--ease) backwards; }
.mural-bv-bolha .ico{ stroke-width:1.8; }
.mural-bv-bolha.b1{ width:64px; height:64px; left:43px; top:10px; z-index:2; }
.mural-bv-bolha.b1 .ico{ width:30px; height:30px; }
.mural-bv-bolha.b2{ width:44px; height:44px; left:4px; top:30px; animation-delay:.08s; border-color:color-mix(in srgb, var(--c2) 55%, var(--line)); }
.mural-bv-bolha.b3{ width:44px; height:44px; right:4px; top:30px; animation-delay:.16s; border-color:color-mix(in srgb, var(--c3) 55%, var(--line)); }
.mural-bv-bolha.b2 .ico,.mural-bv-bolha.b3 .ico{ width:22px; height:22px; color:var(--ink); }
.mural-bv-tit{ margin:4px 0 6px; font-size:21px; }
.mural-bv-txt{ margin:0 auto 14px; max-width:34ch; color:var(--muted); font-size:15px; }
.mural-bv-ideias{ display:flex; flex-direction:column; gap:8px; }
button.mural-bv-ideia{ margin:0; min-height:48px; display:flex; align-items:center; justify-content:flex-start; gap:10px; text-align:left; background:var(--surface); color:var(--ink); border:1px solid var(--line); }
button.mural-bv-ideia .ico{ width:22px; height:22px; color:var(--accent); flex:none; }
button.mural-bv-ideia:hover:not(:disabled){ border-color:var(--accent); background:var(--surface-2); }

/* ---------- Oração: escolha do público (cartões de rádio, nada marcado) ---------- */
fieldset.or-publico{ margin:12px 0 0; padding:0; border:0; min-width:0; }
.or-publico legend{ padding:0; margin:0 0 6px; font-weight:700; }
label.or-op{ display:flex; align-items:center; gap:10px; margin:0 0 8px; padding:10px 12px; min-height:56px; font-weight:400; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm); cursor:pointer; transition:border-color var(--t-rapido), background-color var(--t-rapido); }
label.or-op:hover{ border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); }
label.or-op:has(input:checked){ border-color:var(--accent); background:var(--accent-soft); box-shadow:inset 0 0 0 1px var(--accent); }
label.or-op:has(input:focus-visible){ outline:3px solid var(--accent); outline-offset:2px; }
input.or-op-radio{ width:22px; height:22px; margin:0; flex:none; }
.or-op-ico{ width:36px; height:36px; flex:none; border-radius:10px; display:flex; align-items:center; justify-content:center; background:var(--surface-2); color:var(--accent); }
.or-op-ico .ico{ width:20px; height:20px; }
.or-op-txt{ display:flex; flex-direction:column; min-width:0; line-height:1.3; }
.or-op-txt strong{ font-size:15px; }
.or-op-txt span{ font-size:13px; color:var(--muted); }
label.chk.or-anonimo{ margin:-2px 0 10px 12px; min-height:44px; }
.or-aviso-nome{ margin:4px 0 0; }

/* ---------- Oração: pedidos (respondido, oculto, moderação) ---------- */
.or-selos{ display:inline-flex; flex-wrap:wrap; justify-content:flex-end; gap:4px; flex:none; max-width:50%; align-self:flex-start; }
.or-selos .or-selo{ max-width:100%; }
.or-cab > .menu-acoes{ align-self:flex-start; margin:-6px -8px 0 0; }
.badge.or-selo-oculto{ background:var(--warn-soft); color:var(--warn); }
.or-oculto{ border-style:dashed; border-color:var(--warn); }
.or-respondido{ border-color:color-mix(in srgb, var(--ok) 45%, var(--line)); }
.or-testemunho{ margin:4px 0 8px; padding:10px 12px; border-radius:var(--r-sm); background:var(--ok-soft); border-left:4px solid var(--ok); }
.or-testemunho-tit{ display:flex; align-items:center; gap:6px; margin:0; font-weight:700; color:var(--ok); }
.or-testemunho-tit .ico{ width:18px; height:18px; }
.or-testemunho-txt{ margin:4px 0 0; font-size:16px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--ink); }
.or-participantes{ margin:6px 0 0; font-size:14px; font-weight:700; color:var(--accent); }
.or-destaque{ animation:or-destaque 2.2s var(--ease); }
@keyframes or-destaque{ 0%,40%{ box-shadow:0 0 0 3px var(--accent); } 100%{ box-shadow:var(--shadow); } }

/* ---------- Oração: meus pedidos (validade, encerrado automaticamente) ---------- */
.badge.or-status-auto{ background:var(--warn-soft); color:var(--warn); }
.or-validade{ margin:2px 10px 6px 0; font-size:13px; color:var(--muted); }
.or-auto{ margin:4px 10px 8px 0; padding:10px 12px; border-radius:var(--r-sm); background:var(--warn-soft); color:var(--warn); font-size:14px; }
.or-auto p{ margin:0; }
button.sec.or-reabrir{ width:auto; min-height:44px; margin:8px 0 0; background:var(--surface); color:var(--ink); }
.or-resp-intro{ margin:0 0 8px; color:var(--muted); font-size:15px; }

/* ---------- Galeria ---------- */
.gal-vis-data{ margin:-4px 0 14px; }
/* <<< modulo:comunidade-g */

/* >>> modulo:visitante (etapa grande) */
/* ==========================================================================
   Visitante e identidade da igreja (etapa grande) — prefixos .vis-, .marca-, .adm-vc- e .logo-igreja
   Só tokens; nenhuma cor fixa. Toque mínimo 44 px; funciona em 320 px.
   ========================================================================== */

/* ----- logo da igreja no cabeçalho (o <span id="logoIgreja"> vem antes do nome) ----- */
.logo-igreja{ display:inline-flex; flex:none; width:32px; height:32px; border-radius:8px; overflow:hidden; background:var(--surface-2); align-items:center; justify-content:center; }
.logo-igreja img{ display:block; width:100%; height:100%; object-fit:contain; }
header.top .row > .logo-igreja + strong{ flex:1 1 auto; } /* nome fica junto do logo, ações à direita */

/* ----- página do visitante ----- */
.vis-hero{ text-align:center; padding:24px 16px 20px; background:linear-gradient(180deg, var(--accent-soft), var(--surface) 72%); }
.vis-logo{ display:flex; width:72px; height:72px; margin:0 auto 10px; border-radius:18px; object-fit:contain; background:var(--surface); border:1px solid var(--line); }
.vis-logo-ini{ align-items:center; justify-content:center; font-family:var(--font-titulo); font-size:26px; font-weight:800; color:var(--accent); background:var(--surface); }
.vis-ola{ margin:0; font-size:14px; font-weight:700; color:var(--accent); letter-spacing:.02em; }
.vis-nome{ margin:2px 0 8px; font-size:27px; line-height:1.15; overflow-wrap:anywhere; }
.vis-boas{ margin:0 auto; max-width:46ch; font-size:17px; line-height:1.5; color:var(--ink); white-space:pre-line; }
.vis-atalhos{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:14px; }
.chip.vis-atalho{ margin:0; padding:6px 14px; }

.vis-sec{ padding:16px; }
.vis-cab{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.vis-cab h2{ margin:0; font-size:19px; }
.vis-cab h2:focus{ outline:none; }
.vis-cab h2:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }
.vis-cab-ico{ width:36px; height:36px; flex:none; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; }
.vis-cab-ico .ico{ width:20px; height:20px; }

.vis-horarios{ list-style:none; margin:0; padding:0; }
.vis-horarios li{ display:flex; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--line); font-weight:700; font-size:17px; }
.vis-horarios li:first-child{ border-top:0; padding-top:2px; }
.vis-horarios .ico{ width:20px; height:20px; color:var(--accent); }

.vis-endereco{ margin:0; font-size:16px; overflow-wrap:anywhere; }
.vis-links{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.chip.vis-link{ margin:0; text-decoration:none; padding:6px 14px; }

.vis-agenda .ct{ margin-bottom:8px; }
button.vis-mais{ margin-top:4px; }
.vis-ev{ display:flex; flex-direction:column; padding:10px 0; border-top:1px solid var(--line); }

.vis-albuns{ display:grid; grid-template-columns:repeat(auto-fill, minmax(136px, 1fr)); gap:10px; }
.vis-alb{ display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--surface); color:var(--ink); text-decoration:none; transition:border-color var(--t-rapido) var(--ease), transform var(--t-rapido) var(--ease); }
.vis-alb:hover{ border-color:var(--accent); }
.vis-alb:active{ transform:scale(.98); }
.vis-alb-capa{ display:block; width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--surface-2); }
.vis-alb-sem{ display:flex; align-items:center; justify-content:center; color:var(--muted); }
.vis-alb-sem .ico{ width:30px; height:30px; }
.vis-alb-txt{ display:flex; flex-direction:column; gap:2px; padding:8px 10px 10px; min-height:44px; }
.vis-alb-txt strong{ font-size:15px; line-height:1.3; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.vis-alb-sub{ display:inline-flex; align-items:center; gap:4px; color:var(--accent); font-size:13px; font-weight:700; }
.vis-alb-sub .ico{ width:14px; height:14px; }

.vis-intro{ margin:0 0 4px; color:var(--muted); font-size:15px; }
.vis-caminhos{ display:flex; flex-direction:column; gap:8px; margin-top:8px; }
button.vis-caminho{ display:grid; grid-template-columns:44px minmax(0,1fr) 22px; align-items:center; gap:12px; width:100%; min-height:68px; margin:0; padding:10px 12px; text-align:left;
  background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r); font-weight:400; }
button.vis-caminho:hover:not(:disabled){ background:var(--surface-2); border-color:var(--accent); }
.vis-caminho-ico{ width:44px; height:44px; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; }
.vis-caminho-txt{ display:flex; flex-direction:column; min-width:0; }
.vis-caminho-txt strong{ font-family:var(--font-titulo); font-size:16px; line-height:1.25; }
.vis-caminho-txt span{ color:var(--muted); font-size:14px; }
.vis-caminho-seta{ color:var(--muted); }
.vis-ou{ margin:14px 0 0; }

.vis-parte p{ margin:0 0 4px; }
.vis-rodape{ text-align:center; margin:4px 0 16px; }

/* formulário de contato (folha) */
.vis-form label{ margin-top:12px; }
.vis-form .vis-campo:first-child label{ margin-top:0; }
.vis-dica{ margin:4px 0 0; font-size:13px; }
.vis-conta{ display:block; text-align:right; font-size:13px; margin-top:2px; }
.vis-privado{ display:flex; align-items:flex-start; gap:6px; margin:10px 0 0; }
.vis-privado .ico{ width:16px; height:16px; margin-top:2px; }
.vis-passos{ margin:8px 0 12px; padding-left:22px; }
.vis-passos li{ margin:6px 0; }
.vis-obrigado{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; padding:8px 4px 4px; }
.vis-obrigado strong{ font-family:var(--font-titulo); font-size:21px; }
.vis-obrigado p{ margin:0; max-width:36ch; }
.vis-obrigado-ico{ width:64px; height:64px; border-radius:50%; background:var(--ok-soft); color:var(--ok); display:flex; align-items:center; justify-content:center; animation:aparecer var(--t-medio) var(--ease); }
.vis-obrigado-ico .ico{ width:30px; height:30px; }
.vis-obrigado button{ max-width:280px; }

@media (max-width:359px){
  .vis-nome{ font-size:23px; }
  .vis-hero{ padding:20px 12px 16px; }
  button.vis-caminho{ grid-template-columns:40px minmax(0,1fr) 18px; gap:10px; padding:10px; }
  .vis-caminho-ico{ width:40px; height:40px; }
}

/* ----- administrador: identidade (logo, cor com prévia nos dois temas) ----- */
.marca-dica{ margin:4px 0 8px; font-size:13px; }
.marca-logo{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:4px; }
.marca-logo-prev{ width:72px; height:72px; flex:none; border-radius:16px; border:1px dashed var(--line); background:var(--surface-2); color:var(--muted); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.marca-logo-prev img{ width:100%; height:100%; object-fit:contain; }
.marca-logo-prev .ico{ width:28px; height:28px; }
.marca-logo-acoes{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; }
.marca-logo-acoes button.mini{ min-height:44px; padding:6px 14px; }
.marca-logo-acoes .link-acao{ margin:0; }
.marca-cor-linha{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
input.marca-cor{ width:64px; height:48px; padding:3px; flex:none; cursor:pointer; }
.marca-cor-linha .link-acao{ margin:0; }
.marca-prevs{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; margin-top:10px; }
.marca-prev{ display:flex; flex-direction:column; gap:8px; padding:10px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface); color:var(--ink); }
.marca-prev-tema{ font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.marca-prev-btn{ display:block; padding:8px; border-radius:var(--r-sm); background:var(--accent); color:var(--accent-ink); font-weight:700; text-align:center; transition:background-color var(--t-rapido); }
.marca-prev-linha{ display:flex; align-items:center; justify-content:space-between; gap:6px; flex-wrap:wrap; }
.marca-prev-link{ color:var(--accent); font-weight:700; font-size:14px; text-decoration:underline; text-underline-offset:3px; }
.marca-aviso{ display:flex; align-items:flex-start; gap:6px; margin:8px 0 4px; font-size:14px; color:var(--muted); }
.marca-aviso .ico{ width:18px; height:18px; color:var(--accent); margin-top:1px; }
.marca-conta{ display:block; text-align:right; font-size:13px; margin-top:2px; }
@media (max-width:359px){ .marca-prevs{ grid-template-columns:1fr; } }

/* ----- administrador: contatos de visitantes ----- */
.adm-vc-resumo{ margin:0 0 8px; }
.card.adm-vc{ position:relative; padding:12px 12px 12px 16px; border-left:5px solid var(--cor, var(--line)); }
.card.adm-vc.atendido{ border-left-color:var(--line); background:var(--surface-2); }
.adm-vc-topo{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.adm-vc-topo .menu-acoes{ margin:0 0 0 auto; }
.adm-vc-motivo{ max-width:100%; }
.adm-vc-nome{ display:block; margin-top:6px; font-family:var(--font-titulo); font-size:17px; overflow-wrap:anywhere; }
.adm-vc-msg{ margin:8px 0 0; padding:8px 10px; border-radius:var(--r-sm); background:var(--surface-2); white-space:pre-wrap; overflow-wrap:anywhere; }
.card.adm-vc.atendido .adm-vc-msg{ background:var(--surface); }
.adm-vc-meta{ margin-top:6px; font-size:13px; }
.adm-vc-acoes{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:8px; }
.adm-vc-acoes .chip{ margin:0; text-decoration:none; }
.adm-vc-acoes button.mini{ width:auto; min-height:44px; margin:0; padding:6px 14px; }
/* <<< modulo:visitante-g */

/* >>> modulo:programacao (etapa grande) */
/* ===== Programação — etapa grande: escala com confirmação, pedidos com resposta, data cancelada, agenda/compartilhar ===== */
/* Só tokens. Estado sempre com ícone + texto (cor nunca é o único sinal). Complementa .refino/css/programacao.css. */

/* ---------- Data cancelada (lista, mês, detalhe) ---------- */
.prog-cancelado{ border-style:dashed; box-shadow:none; }
.prog-cancelado::before{ background:var(--line); }
.prog-cancelado .ct-titulo{ text-decoration:line-through; text-decoration-thickness:2px; color:var(--muted); }
.prog-cancelado .prog-data{ opacity:.7; }
.badge.prog-selo-cancelado{ background:var(--danger-soft); color:var(--danger); font-size:12px; padding:1px 8px; }
.prog-cab-cancelado .prog-cab-titulo{ text-decoration:line-through; text-decoration-thickness:3px; color:var(--muted); }
.prog-cancel-aviso{ display:flex; align-items:flex-start; gap:10px; margin:8px 0 4px; padding:10px 12px; border-radius:var(--r-sm); background:var(--danger-soft); color:var(--danger); font-size:15px; }
.prog-cancel-aviso .ico{ width:20px; height:20px; flex:none; margin-top:2px; }
.prog-cancel-aviso strong{ display:block; }
.prog-interno{ font-size:14px; color:var(--muted); }
.prog-interno > .ico{ width:16px; height:16px; }
.prog-chk-publico{ margin-top:16px; }

/* ---------- Detalhe: agenda do celular e compartilhar ---------- */
.prog-cab-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
button.prog-cab-btn{ flex:1 1 180px; width:auto; min-height:44px; margin:0; padding:8px 14px; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-size:15px; }
button.prog-cab-btn .ico{ width:18px; height:18px; flex:none; }

/* ---------- Oportunidades: meu pedido e a resposta de quem organiza ---------- */
.badge.prog-selo-aguarda{ background:var(--warn-soft); color:var(--warn); }
.prog-op-resp{ display:flex; align-items:flex-start; gap:8px; margin-top:8px; padding:8px 10px; border-radius:var(--r-sm); background:var(--surface-2); font-size:14px; color:var(--ink); overflow-wrap:anywhere; }
.prog-op-resp .ico{ width:16px; height:16px; flex:none; margin-top:3px; color:var(--muted); }
.prog-op-meu-geral{ margin-top:4px; }

/* ---------- Pedidos para participar (quem organiza) ---------- */
.prog-int-topo{ display:flex; align-items:flex-start; justify-content:space-between; gap:6px 8px; flex-wrap:wrap; }
.prog-int-resp{ font-style:italic; }
.prog-contato{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; margin:8px 0 0 34px; }
.prog-contato-tel{ font-weight:700; font-variant-numeric:tabular-nums; margin-right:4px; }
a.chip.prog-contato-link{ text-decoration:none; margin:0; padding:4px 14px; }
.prog-int-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 0 34px; }
button.prog-int-btn{ flex:1 1 140px; width:auto; min-height:44px; margin:0; padding:8px 14px; }
.prog-interessado > .link-acao{ margin-left:34px; }

/* ---------- Estado na escala: Confirmado / Pendente / Não pode ---------- */
.esc-st{ display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:700; padding:1px 8px; border-radius:99px; white-space:nowrap; }
.esc-st .ico{ width:13px; height:13px; stroke-width:2.4; }
.esc-st-ok{ background:var(--ok-soft); color:var(--ok); }
.esc-st-pend{ background:var(--warn-soft); color:var(--warn); }
.esc-st-nao{ background:var(--danger-soft); color:var(--danger); }
.prog-membro.esc-membro .prog-membro-txt{ align-items:center; }
.prog-membro.esc-membro-nao .prog-membro-nome{ text-decoration:line-through; text-decoration-thickness:1.5px; }
.esc-resumo{ display:flex; align-items:center; gap:6px; margin-top:6px; font-size:14px; color:var(--muted); }
.esc-resumo .ico{ width:16px; height:16px; }
.esc-resumo.tem-nao{ color:var(--danger); font-weight:700; }
.esc-motivos{ list-style:none; margin:8px 0 0; padding:8px 10px; border-radius:var(--r-sm); background:var(--danger-soft); color:var(--danger); font-size:14px; }
.esc-motivos li + li{ margin-top:4px; }
.esc-aviso-cancelado{ display:flex; align-items:center; gap:6px; margin-top:6px; font-size:14px; font-weight:700; color:var(--danger); }
.esc-aviso-cancelado .ico{ width:16px; height:16px; }

/* ---------- Suas próximas escalas (responder) ---------- */
.esc-sec-tit{ font-size:16px; margin:12px 2px 8px; }
.esc-minhas:empty{ display:none; }
.esc-minha .ct-linha{ justify-content:space-between; }
.esc-resp-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
button.esc-resp-btn{ flex:1 1 120px; width:auto; min-height:44px; margin:0; padding:8px 14px; }
button.link-acao.esc-resp-troca{ margin:0; padding-left:0; }
.esc-destaque{ border-color:var(--accent); box-shadow:0 0 0 2px var(--accent), var(--shadow); }

/* ---------- Formulário da escala ---------- */
.esc-dica{ margin:4px 0 0; }
.esc-pessoa-form .chk{ flex-wrap:wrap; }
input.esc-papel{ margin:6px 0 4px 28px; width:calc(100% - 28px); }

@media (max-width:360px){
  .prog-contato,.prog-int-acoes{ margin-left:0; }
  .prog-interessado > .link-acao{ margin-left:0; }
  input.esc-papel{ margin-left:0; width:100%; }
}
/* <<< modulo:programacao-g */

/* >>> modulo:louvor (etapa grande) */
/* ==========================================================================
   Louvor — etapa grande (ciclo do ministério: publicar → avisar → ensaiar → tocar)
   .lv-* = gestão (louvor.js)     .pc-* = palco / ensaio (palco.js)
   Só tokens; nada de cor fixa. Complementa .refino/css/louvor.css (não substitui).
   ========================================================================== */

/* ----- músicas: filtro rápido pela memória do repertório ----- */
.lv-chips{ display:flex; gap:6px; overflow-x:auto; padding:6px 0 4px; margin:0 0 2px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.lv-chips::-webkit-scrollbar{ display:none; }
.lv-chips .chip{ flex:none; margin:0; min-height:44px; white-space:nowrap; }
/* "Tocada há 3 semanas" / "Nunca tocada" no cartão */
.ct-meta.lv-memoria{ display:flex; align-items:center; gap:5px; }
.lv-memoria .ico{ width:14px; height:14px; flex:none; }
.lv-memoria.nunca{ font-style:italic; }
/* aviso discreto ao montar a playlist: tocada nas 2 semanas antes do culto */
.lv-recente{ display:inline-flex; align-items:center; gap:4px; margin:2px 0; color:var(--warn); font-size:13px; font-weight:700; }
.lv-recente .ico{ width:15px; height:15px; flex:none; }
.lv-item-pl > .lv-recente{ display:flex; }

/* ----- repertório (destaque do Ao vivo e tela do aviso "playlist:ID") ----- */
.lv-dica{ display:flex; align-items:flex-start; gap:8px; margin:12px 0 0; padding:8px 12px; border-radius:var(--r-sm); background:var(--surface); border-left:3px solid var(--accent); color:var(--ink); font-size:14px; line-height:1.35; }
.lv-dica .ico{ width:18px; height:18px; flex:none; margin-top:1px; color:var(--accent); }
.lv-rep-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
button.lv-rep-acao{ flex:1 1 140px; width:auto; margin:0; min-height:48px; background:var(--surface); }
.lv-rep-lista{ list-style:none; margin:14px 0 0; padding:0; }
.lv-rep-item{ display:flex; align-items:flex-start; gap:10px; padding:8px 0; border-top:1px solid color-mix(in srgb, var(--accent) 25%, transparent); }
.lv-rep-n{ flex:none; width:28px; height:28px; margin-top:8px; border-radius:50%; background:var(--surface); display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; font-variant-numeric:tabular-nums; }
.lv-rep-corpo{ flex:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; }
button.lv-rep-musica{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; min-height:44px; margin:0; padding:6px 8px; border:0; border-radius:var(--r-sm); background:none; color:var(--ink); text-align:left; font-weight:400; }
button.lv-rep-musica:hover:not(:disabled){ background:color-mix(in srgb, var(--surface) 70%, transparent); }
.lv-rep-musica strong{ font-family:var(--font-titulo); font-size:16px; overflow-wrap:anywhere; }
.lv-rep-tom{ font-size:14px; font-weight:700; color:var(--accent); font-variant-numeric:tabular-nums; }
.lv-rep-nota{ font-size:13px; color:var(--muted); }
a.chip.lv-ouvir{ margin:2px 0 2px 8px; text-decoration:none; color:var(--ink); background:var(--surface); }
.lv-ouvir .ico{ fill:currentColor; }
.lv-rep-vazio{ padding:10px 0; border-top:1px solid color-mix(in srgb, var(--accent) 25%, transparent); }
.lv-rep-vazio button{ margin-top:8px; }

/* ----- compartilhar ----- */
.lv-partilha-previa{ margin:0 0 4px; padding:12px; max-height:40vh; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; font-size:14px; line-height:1.45; background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-sm); color:var(--ink); }
.lv-fora-da-tela{ position:fixed; top:-1000px; left:0; width:1px; height:1px; opacity:0; }

/* ----- editor de playlist ----- */
.lv-avisada{ display:flex; align-items:center; gap:6px; margin:6px 0 0; font-size:13px; color:var(--muted); }
.lv-avisada .ico{ width:16px; height:16px; flex:none; }
.lv-add-status{ min-height:1.3em; margin:6px 2px; font-size:13px; }
.lv-add-lista{ max-height:55vh; overflow:auto; margin:0 -4px; padding:0 4px; }
button.lv-add-op{ display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:56px; margin:0 0 8px; padding:10px 12px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r-sm); text-align:left; font-weight:400; }
button.lv-add-op:hover:not(:disabled){ background:var(--surface-2); }
button.lv-add-op.na-lista{ border-color:color-mix(in srgb, var(--ok) 55%, transparent); }
.lv-add-txt{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.lv-add-txt strong{ overflow-wrap:anywhere; }
.lv-add-txt .muted{ font-size:13px; }
.lv-add-op > .ico{ width:22px; height:22px; flex:none; color:var(--accent); }
.lv-add-op > .badge{ flex:none; white-space:nowrap; }

/* ==========================================================================
   Palco — modo Ensaio (sem líder) e "Estudo" (música inteira)
   ========================================================================== */
.palco-barra .palco-faixa.pc-faixa.pc-faixa-ensaio{ background:var(--accent-soft); color:var(--accent); font-weight:700; }
.pc-estudo-cab{ margin-bottom:6px; }
.pc-estudo-cab .eyebrow{ display:block; margin-bottom:2px; }
.pc-estudo-info{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:8px 0 4px; }
.pc-estudo-tom{ display:inline-flex; align-items:center; min-height:36px; padding:4px 12px; border-radius:99px; background:var(--accent-soft); color:var(--accent); font-weight:800; font-size:calc(1rem * var(--escala)); font-variant-numeric:tabular-nums; }
a.chip.pc-ouvir{ margin:0; text-decoration:none; color:var(--ink); }
.pc-ouvir .ico{ fill:currentColor; }
.eyebrow.pc-roteiro-tit{ margin:16px 0 6px; font-family:var(--font); }
.pc-roteiro{ list-style:none; margin:0 0 24px; padding:0; display:grid; gap:4px; }
button.pc-roteiro-parte{ position:relative; display:flex; align-items:center; gap:10px; width:100%; min-height:48px; margin:0; padding:6px 10px 6px 18px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r-sm); text-align:left; font-weight:400; }
button.pc-roteiro-parte::before{ content:""; position:absolute; left:5px; top:8px; bottom:8px; width:5px; border-radius:4px; background:var(--vc); }
button.pc-roteiro-parte:hover:not(:disabled){ background:var(--surface-2); }
.pc-roteiro-n{ flex:none; width:26px; height:26px; border-radius:50%; background:var(--surface-2); display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; font-variant-numeric:tabular-nums; }
.pc-roteiro-txt{ display:flex; flex-direction:column; min-width:0; line-height:1.25; }
.pc-roteiro-txt strong{ font-size:15px; overflow-wrap:anywhere; }
.pc-roteiro-txt span{ font-size:13px; color:var(--muted); }
@media (min-width:760px){ .pc-roteiro{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
/* <<< modulo:louvor-g */

/* >>> modulo:louvor-d (repetição em destaque, projeção em tela cheia, acompanhar ao vivo, ver tudo) */
/* Repetição marcada por número: cor de destaque e tamanho maior (na letra e no chip da parte) */
.rep-num{ color:var(--accent); font-weight:900; font-size:1.25em; padding:0 .12em; font-variant-numeric:tabular-nums; }
.palco .repete{ color:var(--accent); border-color:var(--accent); font-size:18px; font-weight:800; line-height:1.2; }
.palco .pc-mapa .repete{ font-size:15px; }
.palco-barra .palco-faixa.pc-faixa.pc-faixa-leitura{ background:var(--accent-soft); color:var(--accent); font-weight:700; }

/* Projeção: a letra ocupa a tela (o tamanho é calculado em palco.js), sem rolagem. Só ficam os indicadores e o botão de sair. */
.pc-rep-proj,.pc-proj-musicas,.pc-zona{ display:none; }
.palco.foco .palco-nav,.palco.foco .seguinte,.palco.foco .agora > .eyebrow,.palco.foco .agora-nome,.palco.foco .agora .avs{ display:none; }
.palco.foco .palco-corpo{ overflow:hidden; display:flex; flex-direction:column; padding:clamp(12px,3vh,36px) clamp(16px,5vw,96px); }
.palco.foco .vlinha{ flex:none; margin:0 0 clamp(8px,2vh,24px); pointer-events:none; }
.palco.foco .vlinha button{ height:18px; min-height:18px; }
.palco.foco section.agora{ position:relative; flex:1 1 0; min-height:0; overflow:hidden; display:flex; align-items:center; justify-content:center; border-left:0; padding:0; margin:0; text-align:center; animation:none; }
.palco.foco .agora .letra{ width:auto; max-width:100%; font-size:5vh; line-height:1.22; font-weight:800; text-align:center; text-wrap:balance; overflow-wrap:break-word; }
.palco.foco .agora .instr-grande{ font-size:8vh; }
.palco.foco .pc-rep-proj{ display:block; position:absolute; top:0; left:0; font-size:clamp(28px,7vh,90px); font-weight:900; line-height:1; color:var(--accent); }
.palco.foco .pc-proj-musicas{ display:flex; flex:none; justify-content:center; gap:10px; margin:0 0 clamp(6px,1.5vh,16px); }
.pc-proj-musicas span{ width:10px; height:10px; border-radius:50%; background:var(--line); }
.pc-proj-musicas span.feito{ background:var(--muted); opacity:.6; }
.pc-proj-musicas span.atual{ background:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.palco.foco .pc-zona{ display:block; position:absolute; top:0; bottom:0; z-index:1; min-height:0; margin:0; padding:0; border:0; background:transparent; opacity:0; -webkit-tap-highlight-color:transparent; }
.pc-zona-volta{ left:0; width:28%; }
.pc-zona-avanca{ left:28%; right:0; }
.palco.foco .palco-sair-foco{ opacity:.85; width:52px; min-height:52px; }
.palco.foco .letra .rep-num{ font-size:1.15em; }

/* Acompanhar ao vivo (quem não é do departamento) e "Ver tudo" */
.lv-dep-rotulo{ display:inline-block; margin-right:6px; padding:1px 8px; border-radius:99px; background:var(--surface-2); border:1px solid var(--line); font-size:12px; font-weight:700; color:var(--muted); }
.lv-transmissoes{ margin-bottom:14px; }
.lv-vertudo-aviso{ margin:0 0 10px; }
/* <<< modulo:louvor-d */

/* >>> modulo:inicio (etapa grande) */
/* >>> modulo:inicio-g (etapa grande) */
/* ===== Início (.ini-), Devocional (.devo-) e Preferências (.pref- e atributos em <html>) — só tokens ===== */

/* ---------- presença: "Vou" já marcado; as três opções cabem em 320 px e com texto grande ---------- */
.ini-presenca{ container-type:inline-size; }
.presenca-opcoes.ini-pres-opcoes{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.presenca-chip.ini-pres-chip{ min-width:0; white-space:normal; line-height:1.15; text-align:center; overflow-wrap:anywhere; }
@container (max-width:300px){
  .presenca-chip.ini-pres-chip{ flex-direction:column; gap:2px; padding:6px 4px; font-size:14px; }
}
.ini-acolhida-presumida{ background:var(--ok-soft); }

/* liderança: números transparentes (presumidos à parte) e nomes */
details.rec.ini-lideranca > summary{ font-size:16px; line-height:1.3; }
.ini-lid-numeros{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:4px 0 10px; }
.ini-lid-num{ display:flex; flex-direction:column; padding:8px 10px; border-radius:var(--r-sm); background:var(--surface-2); min-width:0; }
.ini-lid-num strong{ font-family:var(--font-titulo); font-size:22px; line-height:1.1; font-variant-numeric:tabular-nums; }
.ini-lid-num span{ font-size:13px; color:var(--muted); line-height:1.3; }
.ini-lid-lista{ margin:6px 0; overflow-wrap:anywhere; }
.ini-lid-regra{ margin:8px 0 0; }
button.link-acao.ini-lid-ver{ display:block; color:var(--accent); }
button.link-acao.ini-lid-ver:hover:not(:disabled){ color:var(--accent); }

/* ---------- "Para você agora": selo de estado, botões da escala e menu "⋯" ---------- */
.ini-selo{ align-self:flex-start; margin:4px 0 2px; font-size:12px; }
.ini-selo-ok{ background:var(--ok-soft); color:var(--ok); }
.ini-selo-aviso{ background:var(--warn-soft); color:var(--warn); }
.ini-selo-neutro{ background:var(--surface-2); color:var(--muted); }
.ini-item-acoes{ flex-basis:100%; display:flex; flex-wrap:wrap; gap:8px; padding:0 0 12px 52px; }
.ini-item-acoes .ini-item-acao{ margin:0; }
.ini-item > .menu-acoes.ini-item-menu{ align-self:center; }
.ini-motivo-ajuda{ margin:6px 0 0; }
@media (max-width:360px){
  .ini-item-acoes{ padding-left:0; }
  .ini-item-acoes .ini-item-acao{ flex:1 1 auto; }
}
.ini-endereco{ margin:0; }

/* ---------- Organizar o Início ---------- */
.ini-organizar-caixa{ display:flex; justify-content:center; margin:8px 0 4px; }
button.ini-organizar{ width:auto; margin:0; display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 16px; font-size:15px; }
.ini-organizar .ico{ width:20px; height:20px; }
@media (min-width:900px){ .ini-organizar-caixa{ justify-content:flex-start; } }
.ini-org-intro{ margin:-4px 0 4px; }
.ini-org{ list-style:none; margin:4px 0 0; padding:0; }
.ini-org-item{ display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid var(--line); }
.ini-org-item:first-child{ border-top:0; }
.ini-org-txt{ flex:1; min-width:0; display:flex; flex-direction:column; }
.ini-org-txt strong{ overflow-wrap:anywhere; }
.ini-org-txt span{ font-size:13px; color:var(--muted); line-height:1.3; }
.ini-org-item.oculto .ini-org-txt strong{ color:var(--muted); }
.ini-org-mover{ display:flex; gap:4px; flex:none; }
.ini-org-mover button{ width:44px; min-height:44px; margin:0; padding:0; display:inline-flex; align-items:center; justify-content:center; }
/* chave liga/desliga (role="switch"): área de toque 52x44, trilho 40x24; estado também no texto (cinza = escondido) */
button.ini-org-chave{ width:52px; min-height:44px; margin:0; padding:0; flex:none; background:none; border:0; display:inline-flex; align-items:center; justify-content:center; }
.ini-org-trilho{ position:relative; width:40px; height:24px; border-radius:99px; background:var(--surface-2); border:2px solid var(--muted); transition:background-color var(--t-rapido), border-color var(--t-rapido); }
.ini-org-trilho::after{ content:""; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:var(--muted); transition:transform var(--t-rapido) var(--ease), background-color var(--t-rapido); }
.ini-org-chave[aria-checked="true"] .ini-org-trilho{ background:var(--accent); border-color:var(--accent); }
.ini-org-chave[aria-checked="true"] .ini-org-trilho::after{ transform:translateX(16px); background:var(--accent-ink); }
button.ini-org-chave:disabled{ opacity:.55; }
.ini-org-nota{ margin:10px 0 0; }
.ini-org-anuncio{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.ini-org-acoes{ flex-wrap:wrap; margin-top:12px; }

/* ---------- devocional: reflexão sempre à vista (até ~4 linhas, "Continuar lendo" no fim dela) ---------- */
.devo.devo-compacto .devo-reflexao{ margin:8px 0 2px; padding-left:12px; border-left:3px solid color-mix(in srgb, var(--accent) 45%, transparent); animation:none; }
.devo-reflexao-rot{ display:block; margin-bottom:2px; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); }
.devo-reflexao-txt{ margin:0; font-size:16px; line-height:1.55; color:var(--ink); white-space:pre-wrap; overflow-wrap:anywhere;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; line-clamp:4; overflow:hidden; }
.devo.aberto .devo-reflexao-txt{ display:block; -webkit-line-clamp:unset; line-clamp:none; overflow:visible; }
button.devo-continuar{ width:auto; min-height:44px; margin:0; padding:4px 0; background:none; border:0; color:var(--accent); font-size:15px; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
button.devo-anteriores{ width:auto; margin:0; min-height:44px; padding:8px 4px; display:inline-flex; align-items:center; gap:6px; background:none; border:0; color:var(--accent); font-size:15px; }
button.devo-anteriores .ico{ width:18px; height:18px; }
button.devo-anteriores:hover:not(:disabled){ background:none; text-decoration:underline; text-underline-offset:3px; }
.devo-form-ajuda{ margin:6px 0 0; }
button.link-acao.devo-usar-auto{ display:block; margin:2px 0 0; color:var(--accent); }
button.link-acao.devo-usar-auto:hover:not(:disabled){ color:var(--accent); }

/* dias anteriores (folha) */
.devo-ant-intro{ margin:-4px 0 8px; }
.devo-ant-nota{ margin:0 0 8px; }
.devo-ant{ display:flex; flex-direction:column; gap:8px; }
.devo-ant-item{ border:1px solid var(--line); border-radius:var(--r); background:var(--surface); }
.devo-ant-item.aberto{ border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); }
button.devo-ant-cab{ width:100%; min-height:56px; margin:0; padding:12px 12px 12px 14px; display:flex; align-items:flex-start; gap:10px; background:none; border:0; border-radius:var(--r); color:var(--ink); font-weight:400; text-align:left; }
button.devo-ant-cab:hover:not(:disabled){ background:var(--surface-2); }
.devo-ant-txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.devo-ant-dia{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.devo-ant-ref{ font-family:var(--font-titulo); font-size:16px; overflow-wrap:anywhere; }
.devo-ant-resumo{ font-size:14px; color:var(--muted); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; }
.devo-ant-item.aberto .devo-ant-resumo{ display:none; }
.devo-ant-seta{ width:20px; height:20px; flex:none; margin-top:2px; color:var(--muted); transition:transform var(--t-rapido) var(--ease); }
.devo-ant-cab[aria-expanded="true"] .devo-ant-seta{ transform:rotate(180deg); }
.devo-ant-corpo{ padding:0 14px 12px; }
.devo-ant-vers{ margin:0 0 8px; font-family:var(--font-titulo); font-size:18px; font-weight:700; line-height:1.45; }
.devo-ant-vers.devo-sem-texto{ font-size:16px; color:var(--muted); }
.devo-ant-refl{ margin:0 0 8px; padding-left:12px; border-left:3px solid color-mix(in srgb, var(--accent) 45%, transparent); white-space:pre-wrap; overflow-wrap:anywhere; }
.devo-ant-acoes{ display:flex; align-items:center; gap:8px; }
.devo-ant-acoes button{ width:auto; margin:0; min-height:44px; }
.devo-ant-acoes .devo-ico{ width:44px; padding:0; display:flex; align-items:center; justify-content:center; }

/* ---------- Preferências: painel em Ajustes > Aparência ---------- */
.pref{ display:flex; flex-direction:column; margin-top:8px; }
.pref-grupo{ padding:12px 0 6px; border-top:1px solid var(--line); }
h3.pref-titulo{ margin:0 0 2px; font-size:16px; }
.pref-ajuda{ margin:0 0 8px; font-size:13px; }
.pref-seg{ margin-bottom:4px; }
.pref-cores{ display:grid; grid-template-columns:repeat(auto-fill, minmax(76px, 1fr)); gap:8px; }
button.pref-cor{ width:100%; min-width:0; min-height:88px; margin:0; padding:8px 4px; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:4px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--r); font-weight:400; }
button.pref-cor:hover:not(:disabled){ border-color:var(--muted); }
button.pref-cor[aria-checked="true"]{ border:2px solid var(--ink); padding:7px 3px; }
.pref-cor-bola{ width:36px; height:36px; flex:none; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--amostra, var(--accent)); color:var(--amostra-ink, var(--accent-ink)); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 18%, transparent); }
.pref-cor-bola .ico{ width:20px; height:20px; stroke-width:2.6; }
.pref-cor-nome{ font-size:14px; font-weight:700; line-height:1.2; text-align:center; overflow-wrap:anywhere; }
.pref-cor-sub{ font-size:12px; color:var(--muted); }
.pref-previa{ padding:12px; border-radius:var(--r); background:var(--surface-2); border:1px solid var(--line); }
.pref-previa .eyebrow{ display:block; }
.pref-previa-tit{ display:block; margin-top:2px; font-family:var(--font-titulo); font-size:18px; }
.pref-previa-txt{ margin:4px 0 10px; }
.pref-previa-link{ color:var(--accent); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.pref-previa-linha{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.pref-previa-botao{ display:inline-flex; align-items:center; min-height:40px; padding:8px 16px; border-radius:var(--r-sm); background:var(--accent); color:var(--accent-ink); font-weight:700; }
.pref-previa-chip{ display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:4px 12px; border-radius:99px; background:var(--accent); color:var(--accent-ink); font-weight:700; font-size:14px; }
.pref-previa-chip .ico{ width:18px; height:18px; }
button.pref-padrao{ width:auto; margin:12px 0 0; }

/* ---------- Preferências: tamanho do texto ----------
   O CSS do app usa px em quase tudo, então "aumentar a fonte" não alcançaria botões e ícones. Usamos zoom no body:
   tudo cresce junto (texto, ícones, áreas de toque). Efeitos: a largura útil diminui (360 px de tela viram 320 no
   "Grande" e 288 no "Muito grande"), a barra fixa de baixo também fica mais alta. Onde não há zoom, a reserva aumenta
   só a letra base. */
html[data-texto="grande"] body{ zoom:1.125; }
html[data-texto="mgrande"] body{ zoom:1.25; }
@supports not (zoom:1.1){
  html[data-texto="grande"] body{ font-size:18px; }
  html[data-texto="mgrande"] body{ font-size:20px; }
}
/* folha: limite pela altura real da tela (88% do fundo fixo), e não por vh, que o zoom pode multiplicar */
html[data-texto] .folha{ max-height:88%; }
/* barra lateral do desktop: presa em cima e embaixo, ocupa a tela inteira com qualquer zoom */
@media (min-width:900px){ html[data-texto] nav.tabs{ height:auto; bottom:0; } }

/* ---------- Preferências: densidade compacta (menos espaço vertical; o toque continua com 44 px) ---------- */
html[data-densidade="compacta"] .card{ margin-bottom:8px; }
html[data-densidade="compacta"] .card:not(.ajustes-grupo):not(.mural-pub):not(.mural-fix):not(.devo-compacto):not(.or-sorteio):not(.or-pedido):not(.or-meu):not(.prog-mes-cartao):not(.lv-parte):not(.lv-item-pl){ padding-top:12px; padding-bottom:12px; }
html[data-densidade="compacta"] .devo-compacto{ padding-top:10px; }
html[data-densidade="compacta"] .ct{ margin-bottom:6px; }
html[data-densidade="compacta"] .ct-principal{ min-height:52px; padding-top:10px; padding-bottom:10px; }
html[data-densidade="compacta"] .lista li{ padding:6px 0; }
html[data-densidade="compacta"] .ini-bloco{ margin-bottom:10px; }
html[data-densidade="compacta"] .ini-item-principal{ min-height:48px; padding-top:6px; padding-bottom:6px; }
html[data-densidade="compacta"] .ini-evento-principal{ min-height:60px; padding-top:8px; padding-bottom:8px; }
html[data-densidade="compacta"] .ini-com{ padding-top:10px; padding-bottom:10px; }
html[data-densidade="compacta"] details.rec.linha > summary{ min-height:52px; padding-top:8px; padding-bottom:8px; }
html[data-densidade="compacta"] .menu-item{ min-height:44px; padding-top:8px; padding-bottom:8px; }
html[data-densidade="compacta"] .grade-tiles{ gap:8px; }
html[data-densidade="compacta"] .tile{ min-height:96px; padding:12px; }
html[data-densidade="compacta"] h1{ margin:4px 0 8px; }
html[data-densidade="compacta"] .saud p{ margin-bottom:8px; }
html[data-densidade="compacta"] .prog-dia-cab{ margin-top:12px; }
html[data-densidade="compacta"] .devo-ant{ gap:6px; }
html[data-densidade="compacta"] .ini-org-item{ padding:2px 0; }
/* <<< modulo:inicio-g */
/* <<< modulo:inicio-g */

/* >>> modulo:presenca-discreta */
.ini-presenca{ padding:12px 14px; }
.ini-presenca .eyebrow{ font-size:12px; margin:0; }
.ini-presenca .presenca-titulo{ font-size:16px; font-weight:600; margin:2px 0 8px; }
.presenca-opcoes.ini-pres-opcoes{ gap:6px; }
.presenca-chip.ini-pres-chip{ min-height:40px; padding:4px 8px; font-size:14px; font-weight:500; flex-direction:row; gap:6px; background:transparent; border:1px solid var(--line); color:var(--ink-soft, var(--ink)); box-shadow:none; }
.presenca-chip.ini-pres-chip .ico{ width:16px; height:16px; }
.presenca-chip.ini-pres-chip[aria-pressed="true"]{ background:var(--surface-2); border-color:var(--accent); color:var(--ink); font-weight:600; }
.ini-presenca .ini-acolhida{ margin-top:8px; padding:0; background:none; font-size:13px; color:var(--muted); }
.ini-presenca .ini-acolhida-vou, .ini-presenca .ini-acolhida-presumida{ background:none; }
.ini-presenca .ini-acolhida strong{ color:var(--muted); font-weight:600; }
.ini-presenca .ini-celebra .ini-acolhida-ico{ animation:none; }
/* <<< modulo:presenca-discreta */
/* >>> modulo:planejamento */
.prog-plan-intro{ margin:4px 0 12px; }
.prog-plan-pessoas{ display:grid; gap:2px; max-height:40vh; overflow:auto; margin-top:8px; }
.prog-plan-pessoa{ display:flex; align-items:center; gap:12px; min-height:44px; padding:0 4px; }
.prog-plan-pessoa input{ width:22px; height:22px; margin:0; flex:none; }
/* <<< modulo:planejamento */
/* >>> modulo:toque-44 */
.seg button{ min-height:44px; }
button.mini{ min-height:44px; }
.prog-mes-hoje{ min-height:44px; }
/* <<< modulo:toque-44 */
/* >>> modulo:refino-botoes */
/* Botões dentro de listas e cartões não precisam ocupar a linha toda: só a ação principal do formulário é cheia. */
.prog-novo, .prog-op button, .prog-op-acoes button, .prog-folha-dia > button{ width:auto; min-width:44px; }
.prog-novo{ margin:0 0 12px; }
.prog-grade-sem{ font-size:11px; letter-spacing:.02em; text-transform:lowercase; }
.chk span a{ color:var(--accent); text-decoration:underline; }
/* <<< modulo:refino-botoes */
/* >>> modulo:movimento-refino */
/* Saídas: folha e toast somem com fade + leve descida (antes: corte seco). O JS remove no fim ou por timeout. */
@keyframes sair{ to{ opacity:0; } }
@keyframes descerFolha{ to{ transform:translateY(24px); opacity:0; } }
@keyframes descerToast{ to{ transform:translateY(6px); opacity:0; } }
.folha-fundo{ animation:aparecer var(--t-rapido) var(--ease); }
.folha{ animation:subirFolha var(--t-medio) var(--ease); }
.folha-fundo.saindo{ animation:sair var(--t-rapido) var(--ease) forwards; pointer-events:none; }
.folha-fundo.saindo .folha{ animation:descerFolha var(--t-rapido) var(--ease) forwards; }
.toast{ animation:subir var(--t-medio) var(--ease); }
.toast.saindo{ animation:descerToast var(--t-rapido) var(--ease) forwards; }
/* Entrada de página: só os cartões animam (o contêiner não soma opacidade nem deslocamento). */
[data-pagina]:not([hidden]){ animation:none; }
[data-pagina]:not([hidden]) > .card,.ini-col > .card,.ini-col > .ct,.grade-tiles .tile{ animation:subir var(--t-medio) var(--ease) backwards; }
/* Entradas curtas com o mesmo easing do app; o fundo da folha tem uma só animação. */
.painel{ animation:abrir var(--t-rapido) var(--ease); }
.msg, details.rec[open] > summary ~ *{ animation:aparecer var(--t-rapido) var(--ease); }
[role=dialog]:not(.folha-fundo){ animation:aparecer var(--t-rapido) var(--ease); }
/* "Ler mais": o texto revelado entra com fade em vez de saltar. */
.mural-resumo.aberto, .devo.aberto .devo-reflexao-txt, .devo.aberto .devo-versiculo{ animation:aparecer var(--t-medio) var(--ease); }
/* Presença: o pulso só no toque (classe .pulso), não a cada vez que o cartão é desenhado. */
.presenca-chip[aria-pressed="true"]{ animation:none; }
.presenca-chip.pulso{ animation:marca var(--t-medio) var(--ease); }
/* Celebração do "Vou" mais sóbria: sem halo nem giro. */
.ini-celebra .ini-acolhida-ico{ animation:iniBrilhoSobrio var(--t-lento) var(--ease) .08s both; }
@keyframes iniBrilhoSobrio{ 0%{ transform:scale(.8); } 60%{ transform:scale(1.08); } 100%{ transform:none; } }
.ini-celebra{ animation:iniEntra var(--t-lento) var(--ease) both; }
/* Em tela de toque o :hover fica "grudado" depois do toque: sem levantar o cartão. */
@media (hover:none){ .tile:hover:not(:disabled){ transform:none; box-shadow:none; border-color:var(--line); } }
/* Botões: mesmos tokens e easing em tudo; a pílula do segmentado transiciona a sombra. */
button{ transition:background-color var(--t-rapido) var(--ease), color var(--t-rapido) var(--ease), border-color var(--t-rapido) var(--ease), opacity var(--t-rapido) var(--ease), box-shadow var(--t-rapido) var(--ease), transform var(--t-rapido) var(--ease); }
.btn-link, .cartao-link{ transition:transform var(--t-rapido) var(--ease); -webkit-tap-highlight-color:transparent; }
.btn-link:active, .cartao-link:active{ transform:scale(.98); }
/* Conteúdo que substitui o esqueleto entra suave; shimmer mais calmo. */
.entra{ animation:aparecer var(--t-medio) var(--ease); }
.skel{ animation-duration:1.6s; animation-timing-function:ease-in-out; }
/* Realce de oração mais curto. */
.or-destaque{ animation-duration:1.2s; }
/* <<< modulo:movimento-refino */
/* >>> modulo:mural-fotos */
.mural-fotos{ display:grid; gap:4px; margin:10px 0 4px; border-radius:var(--r-sm); overflow:hidden; }
.mural-fotos.n2{ grid-template-columns:1fr 1fr; }
.mural-fotos.n3{ grid-template-columns:2fr 1fr; grid-template-rows:1fr 1fr; }
.mural-fotos.n3 .mural-foto:first-child{ grid-row:1 / 3; }
.mural-fotos.n4{ grid-template-columns:1fr 1fr; }
button.mural-foto{ margin:0; padding:0; min-height:0; width:100%; border:0; border-radius:0; background:var(--surface-2); display:block; overflow:hidden; }
button.mural-foto:active:not(:disabled){ transform:none; }
.mural-foto img{ display:block; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity var(--t-medio) var(--ease); }
.mural-foto img.carregou{ opacity:1; }
.mural-fotos.n1 img{ max-height:70vh; height:auto; aspect-ratio:4 / 3; }
.mural-fotos.n2 .mural-foto, .mural-fotos.n4 .mural-foto{ aspect-ratio:1; }
.mural-fotos.n3 .mural-foto{ min-height:0; aspect-ratio:auto; }
.mural-fotos.n3{ aspect-ratio:4 / 3; }

.mural-previas{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; margin:8px 0 0; }
.mural-previas:empty{ display:none; }
.mural-previa{ position:relative; aspect-ratio:1; border-radius:var(--r-sm); overflow:hidden; background:var(--surface-2); animation:abrir var(--t-rapido) var(--ease); }
.mural-previa img{ width:100%; height:100%; object-fit:cover; display:block; }
button.mural-previa-tirar{ position:absolute; top:4px; right:4px; width:32px; min-width:32px; min-height:32px; height:32px; padding:0; margin:0; border-radius:50%; background:rgba(0,0,0,.6); color:#fff; display:flex; align-items:center; justify-content:center; }
button.mural-previa-tirar .ico{ width:16px; height:16px; }
button.mural-add-foto{ width:auto; display:inline-flex; align-items:center; gap:8px; margin-top:10px; }
.mural-autorizo{ align-items:flex-start; }
.mural-autorizo input{ margin-top:3px; }
.mural-regra{ margin:0 0 12px; font-size:14px; color:var(--muted); }

.mural-aguardando, .mural-denunciada{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:8px 0 0; padding:8px 10px; border-radius:var(--r-sm); font-size:14px; }
.mural-aguardando{ background:var(--warn-soft); color:var(--warn); }
.mural-denunciada{ background:var(--danger-soft); color:var(--danger); }
.mural-aguardando .ico, .mural-denunciada .ico{ width:18px; height:18px; flex:none; }
.mural-aguardando span, .mural-denunciada span{ flex:1 1 180px; }
button.mural-aprovar{ width:auto; margin:0; min-height:40px; padding:6px 14px; font-size:14px; }
.mural-motivos{ display:grid; gap:2px; }

/* Visualizador em tela cheia: desliza entre as fotos. */
.mural-visor{ position:fixed; inset:0; z-index:95; background:rgba(8,10,8,.96); display:flex; flex-direction:column; animation:aparecer var(--t-rapido) var(--ease); }
.mural-visor.saindo{ animation:sair var(--t-rapido) var(--ease) forwards; pointer-events:none; }
.mural-visor-trilho{ flex:1; display:flex; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior:contain; }
.mural-visor-trilho::-webkit-scrollbar{ display:none; }
.mural-visor-item{ flex:0 0 100%; margin:0; scroll-snap-align:center; display:flex; align-items:center; justify-content:center; padding:12px; }
.mural-visor-item img{ max-width:100%; max-height:100%; object-fit:contain; border-radius:4px; }
.mural-visor-barra{ display:flex; align-items:center; justify-content:space-between; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); color:#fff; }
.mural-visor-cont{ font-weight:700; font-variant-numeric:tabular-nums; }
button.mural-visor-fechar{ width:48px; min-width:48px; margin:0; padding:0; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; display:flex; align-items:center; justify-content:center; }
/* <<< modulo:mural-fotos */
/* >>> modulo:foto-perfil */
.avatar{ position:relative; overflow:hidden; }
.avatar .avatar-foto{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity var(--t-medio) var(--ease); }
.avatar.com-foto .avatar-foto{ opacity:1; }
.perfil-foto-acoes{ display:flex; gap:16px; margin-top:4px; }
.perfil-foto-acoes button.link-acao{ width:auto; margin:0; min-height:44px; padding:0; }
/* <<< modulo:foto-perfil */
/* >>> modulo:design-v2 */
/* Tokens novos: cor sólida de erro (texto branco legível nos dois temas), borda de campo com 3:1, altura real do cabeçalho. */
:root{ --danger-solid:#A3262B; --on-danger:#FFFFFF; --campo-borda:#7D8C82; --cab-h:calc(65px + env(safe-area-inset-top)); --sombra-cab:0 4px 12px rgba(10,14,9,.08); }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --danger-solid:#8E2A2F; --campo-borda:#6A7279; --sombra-cab:0 4px 12px rgba(0,0,0,.45); } }
:root[data-theme="dark"]{ --danger-solid:#8E2A2F; --campo-borda:#6A7279; --sombra-cab:0 4px 12px rgba(0,0,0,.45); }
.toast.erro, .sino .pontinho{ background:var(--danger-solid); color:var(--on-danger); }
input:not([type=checkbox]):not([type=radio]),select,textarea,.caixa{ border-color:var(--campo-borda); }

/* Cascatas que não faziam efeito: "Ir para hoje" com 44 px e o "⋯" sem borda. */
button.chip.prog-mes-hoje{ min-height:44px; }
button.sec.menu-acoes{ border-color:transparent; color:var(--muted); background:transparent; }

/* Cabeçalho: sombra ao rolar; barra da ferramenta encosta na altura real dele. */
header.top{ transition:box-shadow var(--t-rapido) var(--ease); }
header.top.rolado{ box-shadow:var(--sombra-cab); }
.pagina-topo{ top:var(--cab-h); }
@media (min-width:900px){ .pagina-topo{ top:65px; } .harpa-topo{ top:121px; } }
/* Aviso de sem conexão: cartão acima da barra de abas (não cobre mais o cabeçalho). */
#semConexao{ position:fixed; top:auto; left:12px; right:12px; bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 12px); z-index:60; border-radius:var(--r); box-shadow:var(--shadow-alto); animation:subir var(--t-medio) var(--ease); }
@media (min-width:900px){ #semConexao{ left:calc(var(--nav-w) + 24px); right:24px; bottom:24px; } }

/* Barra de abas: o indicador cresce do centro em vez de aparecer de repente. */
nav.tabs button::before{ content:""; position:absolute; top:0; left:25%; right:25%; height:3px; border-radius:0 0 3px 3px; background:var(--accent); transform:scaleX(0); transition:transform var(--t-medio) var(--ease); }
nav.tabs button[aria-current="page"]::before{ transform:scaleX(1); }
@media (min-width:900px){
  nav.tabs button::before{ top:12px; bottom:12px; left:0; right:auto; width:3px; height:auto; border-radius:0 3px 3px 0; transform:scaleY(0); }
  nav.tabs button[aria-current="page"]::before{ transform:scaleY(1); }
}
nav.tabs svg{ transition:transform var(--t-medio) var(--ease); }

/* Calendário: dia com evento bem marcado; células altas no computador; "hoje" visível também no detalhe. */
.prog-celula.tem{ border:1px solid var(--line); }
.prog-celula.tem .prog-celula-num{ font-weight:700; }
.prog-pontos{ height:7px; } .prog-pontos .ponto{ width:7px; height:7px; }
.prog-grade-sem{ font-size:12px; }
@media (min-width:900px){
  .prog-grade{ gap:6px; }
  .prog-grade button.prog-celula{ min-height:76px; justify-content:flex-start; padding:6px; }
}
.prog-data.g.hoje{ background:var(--accent-soft); border-color:var(--accent); }
.prog-plan-pessoas{ max-height:none; overflow:visible; }
.esc-destaque{ animation:pulsa 1.8s var(--ease) 2; }

/* Mural e Oração com largura de leitura no computador; Galeria em 3 colunas e com resposta ao toque. */
@media (min-width:900px){
  #muralRoot, #oracaoRoot{ max-width:640px; margin-inline:auto; }
  .gal-grade{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; }
}
.gal-abrir{ transition:transform var(--t-rapido) var(--ease), box-shadow var(--t-rapido) var(--ease), border-color var(--t-rapido) var(--ease); }
@media (hover:hover){ .gal-abrir:hover:not(:disabled){ transform:translateY(-2px); box-shadow:var(--shadow-alto); } }
.gal-abrir:active:not(:disabled){ transform:scale(.98); }
/* Comunicado se distingue de publicação comum por uma faixa no topo. */
.mural-oficial{ box-shadow:inset 0 3px 0 var(--accent), var(--shadow); }
/* Reação escolhida: ícone levemente preenchido. */
.mural-reacao .ico{ transition:fill-opacity var(--t-rapido) var(--ease); }
.mural-reacao[aria-pressed="true"] .ico{ fill:currentColor; fill-opacity:.18; }

/* Palco: letra de todas as partes em opacidade cheia (lida de longe); só o nome da parte não atual fica suave. */
.parte{ opacity:1; }
.parte:not(.atual) .agora-nome{ color:var(--muted); }
/* Palco com o celular deitado: barra e navegação mais baixas, mais espaço para a letra. */
@media (orientation:landscape) and (max-height:500px){
  .palco-barra{ padding:4px 8px; gap:6px; }
  .palco-barra > button, .palco-ferr button{ min-height:40px; width:40px; }
  .palco-nav{ padding:6px 10px calc(6px + env(safe-area-inset-bottom)); }
  .palco-nav button{ min-height:52px; font-size:17px; }
  .palco-corpo{ padding:10px 16px 8px; }
}

/* Bíblia: toque no versículo responde; Devocional com luz suave de fundo. */
.bib-v{ transition:background-color var(--t-rapido) var(--ease); border-radius:4px; }
.bib-v:active{ background:var(--surface-2); }
.devo{ background:radial-gradient(120% 100% at 100% 0%, var(--accent-soft), transparent 55%), var(--surface); }

/* Entrada: marca no topo, telas entram com suavidade, aceite alinhado ao texto longo. */
.entrar-marca{ display:flex; align-items:center; gap:12px; margin:8px 0 20px; }
.entrar-marca img{ border-radius:14px; flex:none; }
.entrar-marca strong{ display:block; font-family:var(--font-titulo); font-size:20px; }
.entrar-marca span{ display:block; font-size:14px; }
#telaEntrar:not([hidden]), #telaCadastro:not([hidden]), #telaTrocarPin:not([hidden]){ animation:subir var(--t-medio) var(--ease); }
#formVisitante:not([hidden]){ animation:abrir var(--t-rapido) var(--ease); }
#btnEsqueci{ margin-top:8px; }
label[for="cAceite"].chk{ align-items:flex-start; }
label[for="cAceite"].chk input{ margin-top:3px; }

/* Visitante: botão Sair no tamanho certo; títulos de seção não ficam sob o cabeçalho ao rolar até eles. */
header.top > .row > button{ width:auto; min-height:44px; margin:0; flex:none; }
.vis-sec, #visChegar, #visConversa{ scroll-margin-top:calc(var(--cab-h) + 8px); }

/* Painel do administrador: erro de carga visível; números entram com fade. */
.pa-bloco[data-estado="erro"] .pa-ico{ color:var(--danger); }
.pa-bloco[data-estado="erro"] .pa-det{ color:var(--danger); }

/* Ajustes: excluir conta separado do resto (zona de risco). */
#formExcluir{ margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }

/* Início: rótulo "Continuar: …" dos atalhos não empurra as outras pílulas para fora da tela. */
.ini-pilula span{ max-width:14ch; overflow:hidden; text-overflow:ellipsis; }
/* <<< modulo:design-v2 */
/* >>> modulo:galeria-incorporada */
.gal-qtd{ font-size:13px; color:var(--muted); padding:0 2px 2px; }
.alb{ position:fixed; inset:0; z-index:85; background:var(--bg); display:flex; flex-direction:column; animation:subir var(--t-medio) var(--ease); }
.alb.saindo{ animation:sair var(--t-rapido) var(--ease) forwards; pointer-events:none; }
.alb-cab{ display:flex; align-items:center; gap:8px; padding:8px 8px; padding-top:calc(8px + env(safe-area-inset-top)); background:var(--surface); border-bottom:1px solid var(--line); }
button.alb-fechar{ width:44px; min-width:44px; margin:0; padding:0; background:transparent; color:var(--ink); display:flex; align-items:center; justify-content:center; }
.alb-tit{ flex:1; min-width:0; display:grid; }
.alb-tit strong{ font-family:var(--font-titulo); font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.alb-info{ font-size:13px; color:var(--muted); }
.alb-google{ width:44px; height:44px; display:flex; align-items:center; justify-content:center; color:var(--muted); border-radius:var(--r-sm); }
.alb-aviso{ margin:8px 12px 0; font-size:14px; color:var(--warn); }
.alb-grade{ flex:1; overflow-y:auto; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:3px; padding:3px 3px calc(16px + env(safe-area-inset-bottom)); align-content:start; overscroll-behavior:contain; }
@media (min-width:640px){ .alb-grade{ grid-template-columns:repeat(4, minmax(0,1fr)); gap:4px; padding:8px; } }
@media (min-width:1100px){ .alb-grade{ grid-template-columns:repeat(6, minmax(0,1fr)); max-width:1400px; margin:0 auto; width:100%; } }
button.alb-foto, .alb-foto{ margin:0; padding:0; min-height:0; width:100%; aspect-ratio:1; border:0; border-radius:2px; background:var(--surface-2); display:block; overflow:hidden; }
button.alb-foto:active:not(:disabled){ transform:scale(.97); }
.alb-foto img{ width:100%; height:100%; object-fit:cover; display:block; opacity:0; transition:opacity var(--t-medio) var(--ease); }
.alb-foto img.carregou{ opacity:1; }
.alb-skel{ background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2)); background-size:200% 100%; animation:brilho 1.6s ease-in-out infinite; }
.alb-erro{ grid-column:1 / -1; padding:32px 16px; text-align:center; display:grid; gap:12px; justify-items:center; }
/* <<< modulo:galeria-incorporada */
/* >>> modulo:frase-culto */
.ini-presenca{ background:radial-gradient(140% 120% at 0% 0%, var(--accent-soft), transparent 60%), var(--surface); }
.ini-frase-culto{ font-family:var(--font-titulo); font-size:19px; line-height:1.35; font-weight:700; margin:6px 0 2px; color:var(--ink); text-wrap:pretty; }
/* <<< modulo:frase-culto */
/* >>> modulo:repaginada */
/* ===== Assinatura visual: luz, rótulo de seção e bloco de data ===== */
/* Um só gradiente de "luz" para as telas de destaque (antes: quatro gradientes quase iguais espalhados). */
:root{ --luz:radial-gradient(130% 120% at 0% 0%, var(--accent-soft), transparent 62%); --mola:cubic-bezier(.34,1.32,.5,1); }
.ini-presenca, .devo, .or-sorteio, .mural-bv, .vis-hero, .prog-cab{ background-image:var(--luz); background-color:var(--surface); }
/* Rótulo de seção oficial do app: caixa-alta pequena com espaçamento, em accent. */
.eyebrow, .ajustes-titulo, .or-secao, .mural-secao, .mural-fixados-tit, .prog-dia-cab{ font-family:var(--font); font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.mural-fixados-tit .ico{ width:16px; height:16px; }
/* Bloco de data unificado (Início, Programação, Escalas): dia grande em Bricolage, mês em accent. */
.prog-data, .ini-data{ background:var(--accent-soft); border:0; }
.prog-data .prog-data-mes, .ini-data-mes{ color:var(--accent); }
.prog-data.g{ background:var(--accent-soft); border:0; }

/* ===== Controle segmentado com indicador que desliza ===== */
.seg{ position:relative; }
.seg-ind{ position:absolute; left:0; top:0; border-radius:var(--r-sm); background:var(--surface); box-shadow:var(--shadow), 0 0 0 1px color-mix(in srgb, var(--line) 70%, transparent); pointer-events:none; z-index:0;
  transition:transform var(--t-medio) var(--mola), width var(--t-medio) var(--ease), opacity var(--t-rapido) var(--ease); }
.seg-sem-anim .seg-ind{ transition:none; }
.seg button{ position:relative; z-index:1; transition:color var(--t-medio) var(--ease); }
.seg button[aria-selected="true"]{ background:transparent; box-shadow:none; color:var(--ink); font-weight:700; }

/* ===== Navegação: ferramenta sai deslizando (espelho da entrada) ===== */
@keyframes saiDireita{ to{ opacity:0; transform:translateX(18px); } }
.pagina-ferramenta.saindo{ animation:saiDireita .17s var(--ease) forwards; pointer-events:none; }

/* ===== Listas com ritmo: os primeiros itens entram em cascata curta (no máx. 200 ms de atraso total) ===== */
.mural-lista > .mural-pub, .mural-fixados > .mural-pub, #oracaoRoot .or-pedido, .prog-plan-concluido, #programacaoRoot .ct, .gal-grade > .gal-album{ animation:subir var(--t-medio) var(--ease) backwards; }
.mural-lista > .mural-pub:nth-child(2), .gal-grade > .gal-album:nth-child(2){ animation-delay:.04s; }
.mural-lista > .mural-pub:nth-child(3), .gal-grade > .gal-album:nth-child(3){ animation-delay:.08s; }
.mural-lista > .mural-pub:nth-child(4), .gal-grade > .gal-album:nth-child(4){ animation-delay:.12s; }
.mural-lista > .mural-pub:nth-child(5), .gal-grade > .gal-album:nth-child(5){ animation-delay:.16s; }
.mural-lista > .mural-pub:nth-child(n+6), .gal-grade > .gal-album:nth-child(n+6){ animation-delay:.2s; }
/* Publicação recém-criada e comentário recém-enviado: entram com um "pouso" e um realce que se apaga. */
@keyframes pousar{ 0%{ opacity:0; transform:translateY(-10px) scale(.98); } 60%{ opacity:1; transform:translateY(2px) scale(1.005); } 100%{ transform:none; } }
@keyframes realceSome{ from{ box-shadow:0 0 0 2px var(--accent), var(--shadow); } to{ box-shadow:0 0 0 0 transparent, var(--shadow); } }
.mural-pub.novo{ animation:pousar var(--t-lento) var(--mola) both, realceSome 1.4s var(--ease) .3s both; }
.mural-com.novo{ animation:pousar var(--t-medio) var(--mola) both; }
.mural-com.novo .mural-com-corpo{ background:color-mix(in srgb, var(--accent-soft) 70%, transparent); border-radius:var(--r-sm); transition:background-color 1.2s var(--ease) .6s; }

/* ===== Microinterações de toque mais vivas (escala com mola, só em transform) ===== */
.ct-acao:active, .tile:active:not(:disabled), .ini-tocavel:active, .gal-abrir:active:not(:disabled), button.alb-foto:active:not(:disabled){ transform:scale(.975); transition:transform .08s var(--ease); }
.mural-reacao.pulso .ico{ animation:marca var(--t-medio) var(--mola); }

/* ===== Palco: faixa de partes com alvo de toque de 44 px (a barra visível continua fina) ===== */
.vlinha{ gap:4px; margin-bottom:6px; }
.vlinha button{ position:relative; height:44px; min-height:44px; background:none !important; box-shadow:none !important; }
.vlinha button::before{ content:""; position:absolute; left:0; right:0; top:50%; height:14px; transform:translateY(-50%); border-radius:99px;
  background:color-mix(in srgb, var(--vc) 40%, transparent); transition:background-color var(--t-rapido) var(--ease), box-shadow var(--t-medio) var(--ease); }
.vlinha button.agora::before{ background:var(--vc); box-shadow:0 0 0 2px var(--bg), 0 0 0 4px var(--vc); }
.vlinha button.tem-tom::before{ background-image:repeating-linear-gradient(45deg, transparent 0 4px, rgba(255,255,255,.35) 4px 7px); }

/* ===== Cabeçalho mais leve: vidro fosco quando há suporte (o conteúdo passa por baixo com profundidade) ===== */
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  header.top{ background:color-mix(in srgb, var(--surface) 82%, transparent); -webkit-backdrop-filter:saturate(1.4) blur(14px); backdrop-filter:saturate(1.4) blur(14px); }
  nav.tabs{ background:color-mix(in srgb, var(--surface) 86%, transparent); -webkit-backdrop-filter:saturate(1.4) blur(14px); backdrop-filter:saturate(1.4) blur(14px); }
}
/* Ícone da aba escolhida ganha um pequeno salto com mola. */
nav.tabs button[aria-current="page"] svg{ transition:transform var(--t-medio) var(--mola); }
/* <<< modulo:repaginada */

/* >>> modulo:abertura */
/* Abertura da marca IECBH, versão "Amanhecer" (módulo abertura; JavaScript em abertura.js).
   Estados: pendente (só o fundo do app, até o servidor dizer qual é a igreja), completo (4,25 s, primeira abertura),
   recorrente (330 ms), reduzido (estático, 560 ms) e neutro (outra igreja ou sem identificação: fade de 220 ms, sem marca).
   Sem JavaScript a camada nem aparece: ela só existe com html.ab-pendente ou com a classe .ativa.
   Estado de repouso = marca completa e visível; cada animação só existe dentro do modo completo. */

.abertura {
  --v: 1;                                  /* multiplicador de tempo: 1 = real; a prévia usa 2 e 4 para revisar */
  --ease-abre: cubic-bezier(.22, 1, .36, 1);
  --ease-sai: cubic-bezier(.7, 0, .84, 0);
  --fundo: radial-gradient(120% 85% at 50% 52%, #14395A 0%, #0B2135 52%, #06111B 100%);
  --c-main: #B8E5F2;
  --c-inner: #0B2135;
  --c-soft: #37677F;
  --c-text: #F1F7FB;
  --brilho: radial-gradient(circle, rgba(184, 229, 242, .42) 0, rgba(55, 103, 127, .20) 30%, transparent 62%);
  --raio: rgba(184, 229, 242, .17);
  --mota: #CDEFFA;
  --mota-luz: #B8E5F2;
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: none;
  place-items: center;
  overflow: hidden;
  background: var(--bg, #121416);          /* igual ao fundo do app: na espera e na saída neutra não há salto de cor */
  contain: layout paint;
  -webkit-tap-highlight-color: transparent;
}
html.ab-pendente .abertura, .abertura.ativa { display: grid; }
.abertura--contida { position: absolute; z-index: 5; }   /* só na prévia: contida na moldura do celular */
.abertura::before {                        /* o fundo azul da marca entra por cima do fundo do app */
  content: ""; position: absolute; inset: 0; background: var(--fundo); opacity: 0; pointer-events: none;
}
.abertura[data-tema="claro"] {
  background: var(--bg, #F4F6F1);
  --fundo: radial-gradient(120% 85% at 50% 52%, #FFFFFF 0%, #F2F7FA 55%, #E1ECF2 100%);
  --c-main: #254E6B;
  --c-inner: #FFFFFF;
  --c-soft: #ADE0EA;
  --c-text: #414452;
  --brilho: radial-gradient(circle, rgba(173, 224, 234, .75) 0, rgba(173, 224, 234, .28) 32%, transparent 62%);
  --raio: rgba(37, 78, 107, .09);
  --mota: #5AA7C2;
  --mota-luz: rgba(90, 167, 194, .7);
}
/* Espera e modo neutro: nada da marca aparece (a igreja ainda não foi confirmada, ou não é a IECBH). */
.abertura:not([data-modo]) .abertura__palco, .abertura:not([data-modo]) .abertura__brilho, .abertura:not([data-modo]) .abertura__raios,
.abertura[data-modo="neutro"] .abertura__palco, .abertura[data-modo="neutro"] .abertura__brilho, .abertura[data-modo="neutro"] .abertura__raios { visibility: hidden; }

.abertura__brilho, .abertura__raios {
  position: absolute; left: 50%; top: 56%; aspect-ratio: 1; translate: -50% -50%; pointer-events: none;
}
.abertura__brilho { width: 150%; background: var(--brilho); opacity: .55; }
.abertura__raios {
  width: 230%;
  background: repeating-conic-gradient(from 0deg, var(--raio) 0 3deg, transparent 3deg 11deg);
  -webkit-mask-image: radial-gradient(circle, #000 0, transparent 52%);
  mask-image: radial-gradient(circle, #000 0, transparent 52%);
  opacity: 0;
}
.abertura__motas { position: absolute; inset: 0; pointer-events: none; }   /* sem isto ocupava uma linha da grade e empurrava a marca para baixo */
.abertura__mota {
  position: absolute; border-radius: 50%; background: var(--mota); box-shadow: 0 0 7px var(--mota-luz); opacity: 0;
  animation: ab-mota calc(var(--t) * var(--v)) ease-out calc(var(--a) * var(--v)) both;
}

.abertura__palco {
  position: relative; z-index: 1; width: 100%; display: grid; place-items: center;
  container-type: inline-size;             /* a marca mede o palco, não a janela: serve também na moldura da prévia */
  padding: max(24px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
}
.abertura__camera { width: min(88vw, 460px); }
@supports (width: 1cqw) { .abertura__camera { width: min(88cqw, 460px); } }
.abertura__marca { display: block; width: 100%; height: auto; max-height: 72dvh; overflow: visible; }
.abertura__marca [id^="ab-"] { transform-box: fill-box; }
#ab-pagina-esquerda { transform-origin: 96% 86%; }
#ab-pagina-direita { transform-origin: 4% 86%; }
#ab-detalhes { transform-origin: 50% 100%; }
#ab-onda, #ab-igreja-evangelica, #ab-congregacional { transform-origin: 50% 50%; }

/* ---------- Modo completo (linha do tempo em ms, com --v = 1) ----------
   0 fundo azul e câmera recua · 150 páginas abrem em 3D · 200 raios e brilho · 500 igreja emerge
   1250 selo e onda · 1750 nome em foco · 3600 saída (repouso de ~0,9 s antes) */
.abertura[data-modo="completo"] { animation: ab-sai calc(650ms * var(--v)) var(--ease-sai) calc(3600ms * var(--v)) both; }
.abertura[data-modo="completo"]::before { animation: ab-fundo calc(350ms * var(--v)) ease-out both; }
.abertura[data-modo="completo"] .abertura__brilho { animation: ab-brilho calc(2600ms * var(--v)) ease-out calc(200ms * var(--v)) both; }
.abertura[data-modo="completo"] .abertura__raios { animation: ab-raios calc(3300ms * var(--v)) linear calc(350ms * var(--v)) both; }
.abertura[data-modo="completo"] .abertura__camera { animation: ab-camera calc(3300ms * var(--v)) var(--ease-abre) both; }
.abertura[data-modo="completo"] #ab-pagina-esquerda { animation: ab-pag-e calc(1000ms * var(--v)) var(--ease-abre) calc(150ms * var(--v)) both; }
.abertura[data-modo="completo"] #ab-pagina-direita { animation: ab-pag-d calc(1000ms * var(--v)) var(--ease-abre) calc(210ms * var(--v)) both; }
.abertura[data-modo="completo"] #ab-eleva { animation: ab-eleva calc(900ms * var(--v)) var(--ease-abre) calc(520ms * var(--v)) both; }
.abertura[data-modo="completo"] #ab-detalhes { animation: ab-luz calc(800ms * var(--v)) var(--ease-abre) calc(500ms * var(--v)) both; }
.abertura[data-modo="completo"] #ab-sigla { animation: ab-sigla calc(500ms * var(--v)) ease-out calc(1250ms * var(--v)) both; }
.abertura[data-modo="completo"] #ab-selo { animation: ab-selo calc(760ms * var(--v)) var(--ease-abre) calc(1250ms * var(--v)) both; }
.abertura[data-modo="completo"] #ab-onda { animation: ab-onda calc(1000ms * var(--v)) ease-out calc(1350ms * var(--v)) forwards; }   /* forwards: antes de começar a onda fica invisível (opacity 0 no SVG) */
.abertura[data-modo="completo"] #ab-igreja-evangelica { animation: ab-nome calc(800ms * var(--v)) var(--ease-abre) calc(1750ms * var(--v)) both; }
.abertura[data-modo="completo"] #ab-congregacional { animation: ab-nome calc(900ms * var(--v)) var(--ease-abre) calc(1820ms * var(--v)) both; }

@keyframes ab-fundo { from { opacity: 0; } to { opacity: 1; } }
@keyframes ab-brilho { 0% { opacity: 0; scale: .3; } 45% { opacity: 1; } 100% { opacity: .65; scale: 1.1; } }
@keyframes ab-raios { 0% { opacity: 0; rotate: 0deg; } 30% { opacity: .85; } 100% { opacity: .45; rotate: 28deg; } }
@keyframes ab-mota { 0% { opacity: 0; transform: translateY(0); } 25% { opacity: .85; } 100% { opacity: 0; transform: translateY(-210px); } }
@keyframes ab-camera { 0% { transform: scale(1.22) translateY(16px); } 100% { transform: none; } }
@keyframes ab-pag-e { 0% { opacity: 0; transform: perspective(620px) rotateY(82deg); } 18% { opacity: 1; } 100% { opacity: 1; transform: perspective(620px) rotateY(0); } }
@keyframes ab-pag-d { 0% { opacity: 0; transform: perspective(620px) rotateY(-82deg); } 18% { opacity: 1; } 100% { opacity: 1; transform: perspective(620px) rotateY(0); } }
@keyframes ab-eleva { 0% { opacity: 0; transform: translateY(130px); } 18% { opacity: 1; } 100% { opacity: 1; transform: none; } }
@keyframes ab-luz { 0% { opacity: 0; transform: scale(.85, .15); } 40% { opacity: 1; } 100% { opacity: 1; transform: none; } }
@keyframes ab-sigla { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes ab-selo { 0% { opacity: 0; transform: scale(.55); } 55% { opacity: 1; transform: scale(1.07); } 100% { opacity: 1; transform: scale(1); } }
@keyframes ab-onda { 0% { opacity: .85; transform: scale(1); } 100% { opacity: 0; transform: scale(2.7); } }
@keyframes ab-nome {
  0% { opacity: 0; filter: blur(7px); clip-path: inset(0 50% 0 50%); transform: translateY(8px) scaleX(.95); }
  35% { opacity: 1; }
  100% { opacity: 1; filter: blur(0); clip-path: inset(0 0 0 0); transform: none; }
}
@keyframes ab-sai { to { opacity: 0; transform: scale(1.22); } }

/* ---------- Recorrente: 120 ms para a marca entrar e 210 ms de fade (330 ms no total) ---------- */
.abertura[data-modo="recorrente"] { animation: ab-fade calc(210ms * var(--v)) ease-in calc(120ms * var(--v)) both; }
.abertura[data-modo="recorrente"]::before { animation: ab-fundo calc(120ms * var(--v)) ease-out both; }
.abertura[data-modo="recorrente"] .abertura__palco { animation: ab-entra calc(120ms * var(--v)) ease-out both; }
.abertura[data-modo="recorrente"] .abertura__raios { display: none; }

/* ---------- Reduzido: marca estática, sem câmera, páginas, raios, poeira nem onda ---------- */
.abertura[data-modo="reduzido"] { animation: ab-fade calc(160ms * var(--v)) linear calc(400ms * var(--v)) both; }
.abertura[data-modo="reduzido"]::before { opacity: 1; }
.abertura[data-modo="reduzido"] .abertura__raios, .abertura[data-modo="reduzido"] .abertura__brilho { display: none; }

/* ---------- Neutro: outra igreja ou sem identificação, só o fundo do app saindo ---------- */
.abertura[data-modo="neutro"] { animation: ab-fade 220ms ease-out both; }

@keyframes ab-fade { to { opacity: 0; } }
@keyframes ab-entra { from { opacity: 0; } to { opacity: 1; } }

/* Saída antecipada (toque, Esc, Enter ou Espaço): fade de 150 ms e a camada some. */
.abertura.pulando { transition: opacity 150ms linear; opacity: 0; animation: none !important; }
.abertura.pulando * { animation: none !important; }

/* Segurança dupla: com movimento reduzido no sistema, o modo completo nunca anima. */
@media (prefers-reduced-motion: reduce) {
  .abertura[data-modo="completo"], .abertura[data-modo="completo"] *, .abertura[data-modo="completo"]::before { animation: none !important; }
  .abertura[data-modo="completo"]::before { opacity: 1; }
  .abertura__mota, .abertura__raios { display: none; }
}
/* <<< modulo:abertura */

/* >>> modulo:galeria-correcao */
/* Correção: com aspect-ratio + min-height:0 + overflow:hidden, a linha da grade podia encolher a zero e as fotos se
   empilhavam. O quadrado agora é garantido pelo padding (não depende do aspect-ratio) e a imagem preenche por cima. */
.alb-grade{ grid-auto-rows:auto; align-items:start; min-height:0; }
button.alb-foto, .alb-foto{ position:relative; height:0 !important; min-height:0 !important; padding:0 0 100% 0 !important; aspect-ratio:auto; }
.alb-foto img{ position:absolute; inset:0; width:100%; height:100%; }
/* <<< modulo:galeria-correcao */
/* >>> modulo:foco-titulo */
/* Títulos recebem foco ao abrir a página (para leitores de tela), mas não são clicáveis: sem o retângulo de foco. */
h1[tabindex="-1"]:focus, h2[tabindex="-1"]:focus, [tabindex="-1"]:focus:not(:focus-visible){ outline:none; }
/* <<< modulo:foco-titulo */
/* >>> modulo:aniversarios-cadastro */
/* Aniversariantes no Início: escondido sem ninguém na semana; "hoje" ganha luz e o botão de parabéns. */
.ini-aniv.ini-vazio{ display:none !important; }
.ini-aniv{ background-image:var(--luz); background-color:var(--surface); }
.ini-aniv-lista{ list-style:none; margin:8px 0 0; padding:0; display:grid; gap:10px; }
.ini-aniv-item{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.ini-aniv-txt{ flex:1 1 140px; min-width:0; display:grid; }
.ini-aniv-txt strong{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ini-aniv-txt span{ font-size:14px; color:var(--muted); }
.ini-aniv-item.hoje .ini-aniv-txt span{ color:var(--accent); font-weight:700; }
.ini-aniv-item.hoje .avatar{ box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--accent); }
button.ini-aniv-parabens{ width:auto; margin:0; min-height:44px; padding:6px 14px; display:inline-flex; align-items:center; gap:8px; font-size:14px; }
button.ini-aniv-parabens.feito{ background:var(--ok-soft); color:var(--ok); }
button.ini-aniv-parabens .ico{ width:18px; height:18px; }
button.ini-aniv-parabens.pulso .ico{ animation:marca var(--t-medio) var(--mola); }
/* Ajustes: aniversário dentro de Meus dados. */
.aniv-box{ margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
.aniv-tit{ margin:0 0 2px; font-size:16px; }
.aniv-linha{ display:grid; grid-template-columns:1fr 2fr; gap:8px; margin-top:8px; }
/* Cadastro rápido de membros. */
button.adm-add-rapido{ margin:0 0 12px; }
.adm-rap-item{ display:grid; gap:2px; padding:10px 0; border-bottom:1px solid var(--line); }
.adm-rap-item span{ font-size:14px; color:var(--muted); }
.adm-rap-criado span{ color:var(--ok); font-weight:700; }
.adm-rap-erro span{ color:var(--danger); }
.adm-rap-item button.link-acao{ width:auto; justify-self:start; margin:4px 0 0; min-height:44px; }
/* Logo da igreja (ou ícone do app) no cabeçalho, ao lado do título. */
.logo-igreja{ display:inline-flex; flex:none; width:32px; height:32px; border-radius:9px; overflow:hidden; box-shadow:0 0 0 1px var(--line); }
.logo-igreja img{ width:100%; height:100%; object-fit:cover; display:block; }
header.top .row > .logo-igreja + strong{ margin-left:2px; }
/* <<< modulo:aniversarios-cadastro */
/* >>> modulo:cabecalho-logo */
header.top .row > strong{ flex:1 1 auto; }
/* <<< modulo:cabecalho-logo */

/* >>> modulo:abertura-sigla */
/* A sigla IECBH só aparece na abertura quando o servidor confirma que é a IECBH. */
#abertura[data-sigla="nao"] #ab-sigla{ display:none; }
/* <<< modulo:abertura-sigla */

/* >>> modulo:cabecalho-logo-maior */
.logo-igreja{ width:40px; height:40px; border-radius:11px; }
/* <<< modulo:cabecalho-logo-maior */
/* >>> modulo:frase-adm */
.ini-frase-adm{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-top:8px; padding-top:8px; border-top:1px dashed var(--line); }
.ini-frase-adm small{ font-size:13px; }
button.ini-frase-editar{ width:auto; margin:0; min-height:44px; display:inline-flex; align-items:center; gap:6px; }
button.ini-frase-editar .ico{ width:18px; height:18px; }
/* <<< modulo:frase-adm */
/* >>> modulo:harpa-leitor */
/* abaixo da prévia do Louvor (.palco, 60) e das folhas (70), para o "Aa" e a versão da igreja abrirem por cima */
.harpa-leitor{ position:fixed; inset:0; z-index:55; background:var(--bg); display:flex; flex-direction:column; animation:subir var(--t-medio) var(--ease); }
.harpa-leitor.saindo{ animation:sair var(--t-rapido) var(--ease) forwards; pointer-events:none; }
.harpa-leitor-cab{ display:flex; align-items:center; gap:6px; padding:8px; padding-top:calc(8px + env(safe-area-inset-top)); background:var(--surface); border-bottom:1px solid var(--line); }
.harpa-leitor-tit{ flex:1; min-width:0; display:grid; }
.harpa-leitor-titulo{ font-family:var(--font-titulo); font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.harpa-leitor-sub{ font-size:13px; }
button.harpa-leitor-btn{ width:44px; min-width:44px; margin:0; padding:0; background:transparent; color:var(--ink); display:flex; align-items:center; justify-content:center; font-size:15px; }
.harpa-leitor-corpo{ flex:1; overflow-y:auto; padding:20px 20px 24px; max-width:640px; width:100%; margin:0 auto; line-height:1.55; overscroll-behavior:contain; }
.harpa-estrofe{ display:grid; grid-template-columns:2ch 1fr; gap:10px; margin:0 0 .9em; }
.harpa-estrofe p, .harpa-coro p{ margin:0; white-space:pre-line; }
.harpa-est-num{ font-family:var(--font-titulo); font-weight:800; color:var(--accent); font-size:.8em; padding-top:.15em; }
.harpa-coro{ margin:0 0 1em 2ch; padding:10px 14px; border-left:4px solid var(--accent); background:var(--accent-soft); border-radius:0 var(--r-sm) var(--r-sm) 0; font-weight:700; }
.harpa-coro-rot{ display:block; font-size:.62em; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-bottom:2px; }
.harpa-coro-repete{ margin:-.4em 0 1em 2ch; font-size:.8em; color:var(--accent); font-weight:700; }
.harpa-leitor-fim{ text-align:center; margin-top:1.5em; font-size:14px; }
.harpa-leitor-rodape{ display:flex; gap:8px; padding:8px 12px calc(8px + env(safe-area-inset-bottom)); background:var(--surface); border-top:1px solid var(--line); }
.harpa-leitor-rodape.bib2-nav{ display:grid; margin-top:0; }
.harpa-leitor-rodape.bib2-nav button{ min-height:48px; font-family:var(--font-titulo); font-weight:800; font-variant-numeric:tabular-nums; }
.harpa-leitor-rodape.bib2-nav button:last-child{ grid-column:2; }
button.harpa-aa{ font-family:var(--font-titulo); font-weight:800; font-size:17px; }
button.harpa-fav-btn[aria-pressed="true"]{ color:var(--warn); }
button.harpa-fav-btn[aria-pressed="true"] .ico path{ fill:currentColor; }
.harpa-destaque{ border-radius:var(--r-sm); background:var(--warn-soft); box-shadow:0 0 0 6px var(--warn-soft); transition:background var(--t-medio) var(--ease), box-shadow var(--t-medio) var(--ease); }
.harpa-coro.harpa-destaque{ background:var(--warn-soft); }
.harpa-semletra{ text-align:center; padding:32px 8px; font-size:16px; }
.harpa-fallback{ display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-top:12px; }
.harpa-fallback a.chip{ margin:0; text-decoration:none; font-weight:700; }
.harpa-igreja{ display:grid; gap:8px; margin-top:1em; font-size:16px; }
.harpa-igreja:empty{ display:none; }
/* Painel do superadmin para enviar as letras. */
.harpa-ger{ margin-top:16px; border-style:dashed; }
.harpa-ger h3{ margin:0 0 4px; font-size:16px; }
.harpa-ger-resumo{ margin-top:12px; display:grid; gap:8px; }
.harpa-ger-consent{ align-items:flex-start; }
.harpa-ger-consent input{ margin-top:3px; }
/* <<< modulo:harpa-leitor */
/* >>> modulo:perfil-igreja */
/* Perfil da igreja (perfil.js): faixa fixa dentro de header.top, itens extras no menu, cartão em Ajustes; menu lateral ocultável no desktop. */
:root{ --faixa-h:52px; }
.faixa-igreja{ display:flex; align-items:center; gap:10px; min-height:calc(var(--faixa-h) + env(safe-area-inset-top)); margin:calc(-10px - env(safe-area-inset-top)) -16px 10px; padding:env(safe-area-inset-top) 16px 0; background:var(--accent); color:var(--accent-ink); }
.faixa-igreja-ico{ flex:none; width:22px; height:22px; }
.faixa-igreja-txt{ flex:1 1 auto; min-width:0; margin:0; font-size:13px; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.faixa-igreja-txt strong{ font-family:var(--font-titulo); font-size:14px; }
.faixa-igreja-longo{ display:none; }
button.faixa-igreja-voltar{ flex:none; width:auto; min-height:44px; margin:0; padding:0 12px; background:transparent; color:var(--accent-ink); border:2px solid var(--accent-ink); border-radius:var(--r-sm); font-size:13px; font-weight:700; }
button.faixa-igreja-voltar:hover:not(:disabled){ background:color-mix(in srgb, var(--accent-ink) 14%, transparent); }
button.faixa-igreja-voltar:focus-visible{ outline:3px solid var(--accent-ink); outline-offset:2px; }
@media (max-width:419px){ .faixa-igreja-ico{ display:none; } }
@media (min-width:700px){ .faixa-igreja-curto{ display:none; } .faixa-igreja-longo{ display:inline; } }
html[data-perfil="igreja"]{ --cab-h:calc(65px + var(--faixa-h) + env(safe-area-inset-top)); }
@media (min-width:900px){
  html[data-perfil="igreja"] .pagina-topo{ top:calc(65px + var(--faixa-h)); }
  html[data-perfil="igreja"] .harpa-topo{ top:calc(121px + var(--faixa-h)); }
}
/* Em Ajustes, no perfil da igreja, somem as áreas que são da pessoa (dados, PIN, privacidade, avisos do celular). */
html[data-perfil="igreja"] #detPerfil, html[data-perfil="igreja"] #detPin, html[data-perfil="igreja"] #detPriv, html[data-perfil="igreja"] #detPush{ display:none; }
.perfil-igreja-card.ativo{ border:2px solid var(--accent); }
.perfil-igreja-card h2{ margin-bottom:4px; }
.perfil-igreja-botao{ margin-top:8px; }
/* Itens extras do menu (ex.: Modo apresentação) vêm depois de Ajustes. Celular: rótulo curto e mais colunas. */
.tab-extra .tab-rotulo-longo{ display:none; }
@media (max-width:899px){
  nav.tabs[data-itens="5"]{ grid-template-columns:repeat(5, minmax(0, 1fr)); }
  nav.tabs[data-itens="6"]{ grid-template-columns:repeat(6, minmax(0, 1fr)); }
  nav.tabs[data-itens="5"] button, nav.tabs[data-itens="6"] button{ font-size:11px; padding-left:0; padding-right:0; }
  nav.tabs[data-itens="5"] button span, nav.tabs[data-itens="6"] button span{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
@media (min-width:900px){
  .tab-extra .tab-rotulo-longo{ display:inline; white-space:nowrap; text-align:left; }
  nav.tabs .tab-extra{ text-align:left; }
  .tab-extra .tab-rotulo-curto{ display:none; }
  nav.tabs button:not(.tab-extra) + .tab-extra{ margin-top:12px; }
}
/* Aparência: o seletor nativo de "Outra cor" fica escondido (a amostra abre ele). */
.pref-cor-entrada{ position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; pointer-events:none; }
/* Mural: logo da igreja como avatar e autor real (só a liderança vê). */
.avatar.avatar-igreja.com-foto{ background:var(--surface); border:1px solid var(--line); }
.avatar.avatar-igreja .avatar-foto{ object-fit:contain; }
.mural-real{ display:block; font-size:12px; }
.mural-como-igreja{ margin:0 0 8px; }
/* Início da igreja: cada evento da agenda ocupa a largura toda (no .ini-item flex ele encolhia ao tamanho do texto). */
.ini-agenda-igreja .ini-item > .ini-evento{ flex:1 1 100%; min-width:0; }
/* Menu lateral do desktop: botão no cabeçalho; oculto, o conteúdo ocupa a largura toda. */
.menu-lateral-btn{ display:none; }
@media (min-width:900px){
  header.top > .row > .menu-lateral-btn{ display:inline-flex; align-items:center; justify-content:center; width:44px; padding:0; }
  html[data-menu="oculto"]{ --nav-w:0px; }
  html[data-menu="oculto"] nav.tabs{ display:none; }
}
/* <<< modulo:perfil-igreja */
/* >>> modulo:projecao */
/* Telão com várias telas e Modo apresentação (projecao.js, transmitir.js, apresentacao.js). Só tokens do app. */
.tx-telas-painel{ display:grid; gap:0; }
.tx-telas-painel[hidden]{ display:none; }
.tx-extra{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:0 0 10px; }
.tx-extra button{ margin:0; min-height:44px; padding:0 8px; }
.tx-telas{ display:grid; gap:8px; }
.tx-tela{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.tx-tela > .muted{ flex:1; min-width:8ch; font-size:13px; }
.tx-tela button.link-acao{ margin:0; }
.tx-ponto{ flex:none; width:10px; height:10px; border-radius:50%; background:var(--muted); }
.tx-ponto.ok{ background:var(--ok); }
.tx-ponto.aviso{ background:var(--warn); }
.apr-bib-nav{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin:10px 0; }
.apr-bib-nav strong{ font-family:var(--font-titulo); text-align:center; flex:1; }
.apr-bib-nav button{ margin:0; width:auto; min-height:44px; padding:0 12px; }
.apr-bib-lista{ display:grid; gap:6px; }
.apr-fundos{ display:grid; gap:12px; }
.apr-previa{ width:100%; aspect-ratio:16 / 9; border-radius:var(--r-sm); overflow:hidden; border:1px solid var(--line); }
.apr-esc{ display:grid; gap:6px; font-size:14px; }
.apr-esc input[type="range"]{ width:100%; }
.apr-fundo-acoes{ display:flex; gap:12px; align-items:center; }
.apr-fundo-acoes button{ margin:0; width:auto; }
/* projeção em tela cheia neste aparelho: nada além do conteúdo; o botão de sair aparece ao mexer o mouse/tocar */
.proj-aqui{ position:fixed; inset:0; z-index:9999; background:#000; }
.proj-aqui-palco{ position:absolute; inset:0; }
.proj-aqui-sair{ position:absolute; right:16px; top:16px; width:auto; margin:0; min-height:44px; padding:0 18px; border-radius:99px; background:rgba(0,0,0,.6); color:#F4F6F1; border:1px solid rgba(255,255,255,.3); opacity:0; pointer-events:none; transition:opacity .2s; }
.proj-aqui.com-botao .proj-aqui-sair{ opacity:1; pointer-events:auto; }
@media (prefers-reduced-motion:reduce){ .proj-aqui-sair{ transition:none; } }
@media (min-width:900px){
  :is([data-ferr="transmitir"], [data-ferr="apresentacao"]) > .tx-telas-painel{ grid-column:1 / -1; max-width:560px; }
  [data-ferr="apresentacao"]{ display:grid; grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr); gap:0 24px; align-items:start; }
  [data-ferr="apresentacao"][hidden]{ display:none; }
  [data-ferr="apresentacao"] > .tx-intro, [data-ferr="apresentacao"] > .tx-bloco{ grid-column:1 / -1; max-width:560px; }
  [data-ferr="apresentacao"] > .tx-topo, [data-ferr="apresentacao"] > .tx-extra, [data-ferr="apresentacao"] > .tx-previa, [data-ferr="apresentacao"] > .tx-seguinte, [data-ferr="apresentacao"] > .tx-controles{ grid-column:1; }
  [data-ferr="apresentacao"] > .seg, [data-ferr="apresentacao"] > .tx-painel{ grid-column:2; }
  [data-ferr="apresentacao"] > .seg{ grid-row:2; }
  [data-ferr="apresentacao"] > .tx-painel{ grid-row:3 / span 5; max-height:70vh; overflow:auto; margin-top:8px; }
  [data-ferr="transmitir"] > .tx-extra{ grid-column:1; }
}
/* <<< modulo:projecao */
/* >>> modulo:programacao-isc */
/* ===== Programação no estilo Agenda ISC: cartão da semana, contagem, filtros e palco (tela cheia) — só tokens do app ===== */
body.isc-aberto{ overflow:hidden; }

/* ----- aba Agenda ----- */
.isc-topo{ display:grid; gap:12px; margin:0 0 12px; }
.isc-topo-esq{ display:flex; flex-direction:column; gap:8px; min-width:0; }
@media (min-width:900px){ .isc-topo{ grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); align-items:stretch; } }
.isc-eyebrow{ display:block; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); }
button.isc-cta{ position:relative; overflow:hidden; width:100%; min-height:0; margin:0; padding:20px 18px 20px 24px; display:flex; align-items:center; gap:16px; text-align:left; font-weight:400; color:var(--ink); border:1px solid var(--line); border-radius:var(--r-lg); background:radial-gradient(120% 160% at 88% 10%, var(--accent-soft), transparent 60%), var(--surface); box-shadow:var(--shadow); transition:transform var(--t-medio) var(--ease), box-shadow var(--t-medio) var(--ease), border-color var(--t-medio); }
button.isc-cta::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--accent); }
button.isc-cta:hover:not(:disabled){ transform:translateY(-2px); box-shadow:var(--shadow-alto); border-color:var(--accent); }
.isc-cta-corpo{ flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.isc-cta-titulo{ font-family:var(--font-titulo); font-size:clamp(21px,3.4vw,28px); font-weight:800; letter-spacing:-.02em; line-height:1.15; }
.isc-cta-meta{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; font-size:14px; color:var(--muted); }
.isc-pontos{ display:inline-flex; gap:4px; }
.isc-pontos span{ width:8px; height:8px; border-radius:50%; }
.isc-cta-ir{ flex:none; width:46px; height:46px; border-radius:50%; background:var(--accent); color:var(--accent-ink); display:flex; align-items:center; justify-content:center; }
.isc-cta-ir .ico{ width:22px; height:22px; }
.isc-atalhos{ display:flex; flex-wrap:wrap; gap:4px; }
.isc-atalhos .chip{ margin:0; }
.isc-atalho .ico{ width:16px; height:16px; }

.isc-contagem{ min-width:0; padding:18px 20px; border:1px solid var(--line); border-radius:var(--r-lg); background:linear-gradient(160deg, var(--accent-soft), var(--surface) 65%); display:flex; flex-direction:column; justify-content:center; }
.isc-nums{ display:flex; gap:16px; margin:10px 0 12px; }
.isc-un b{ display:block; font-size:30px; font-weight:800; line-height:1; font-variant-numeric:tabular-nums; }
.isc-un span{ font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.isc-hoje-grande{ font-family:var(--font-titulo); font-size:30px; font-weight:800; margin:8px 0; }
button.isc-contagem-abrir{ width:100%; min-height:44px; margin:0; padding:0; text-align:left; background:none; border:0; color:var(--ink); font-weight:400; border-radius:var(--r-sm); }
.isc-contagem-titulo{ font-family:var(--font-titulo); font-size:18px; font-weight:700; line-height:1.25; }
.isc-contagem-meta{ display:flex; flex-wrap:wrap; gap:2px 10px; margin-top:4px; font-size:14px; color:var(--muted); }
.isc-contagem-vazio{ margin:8px 0 0; color:var(--muted); }

.isc-filtros{ margin:4px 0 6px; }
.isc-chips{ display:flex; flex-wrap:wrap; gap:0; }
.isc-chips .chip .ponto{ width:9px; height:9px; }
.isc-busca-linha{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:8px; }
.isc-busca-linha input{ flex:1 1 200px; min-width:0; width:auto; }
.isc-busca-linha .seg{ flex:1 1 auto; }
@media (max-width:600px){
  .isc-chips{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
  .isc-chips::-webkit-scrollbar{ display:none; }
  .isc-chips .chip{ flex:none; white-space:nowrap; }
}

/* ----- palco (tela cheia) ----- */
.isc-stage{ --isc-tint:var(--accent); position:fixed; inset:0; z-index:60; display:flex; flex-direction:column; background:var(--bg); color:var(--ink); font-family:var(--font); animation:iscEntra .32s var(--ease) both; }
.isc-stage.saindo{ animation:iscSai .18s var(--ease) forwards; pointer-events:none; }
.isc-stage::before{ content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(90% 70% at 50% -10%, color-mix(in srgb, var(--isc-tint) 20%, transparent), transparent 62%), radial-gradient(60% 50% at 90% 100%, color-mix(in srgb, var(--isc-tint) 9%, transparent), transparent 70%); }
.isc-stage > *{ position:relative; z-index:1; }
.isc-stage [hidden]{ display:none !important; }
@keyframes iscEntra{ from{ opacity:0; transform:scale(.985); } to{ opacity:1; transform:none; } }
@keyframes iscSai{ to{ opacity:0; transform:scale(.99); } }

.isc-top{ flex:none; display:flex; align-items:center; gap:12px; padding:calc(12px + env(safe-area-inset-top)) 16px 8px; }
.isc-marca{ flex:1; min-width:0; display:flex; align-items:center; gap:11px; }
.isc-logo{ width:40px; height:40px; flex:none; border-radius:12px; background:var(--accent); color:var(--accent-ink); display:flex; align-items:center; justify-content:center; }
.isc-logo .ico{ width:22px; height:22px; }
.isc-titulos{ min-width:0; }
.isc-titulo{ font-family:var(--font-titulo); font-size:clamp(18px,2.6vw,24px); font-weight:800; letter-spacing:-.02em; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.isc-sub{ font-size:14px; color:var(--muted); margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
button.isc-fechar{ flex:none; width:44px; height:44px; min-height:0; margin:0; padding:0; border-radius:12px; border:1px solid var(--line); background:var(--surface); color:var(--ink); display:flex; align-items:center; justify-content:center; }
button.isc-fechar:hover{ background:var(--surface-2); }

.isc-corpo{ flex:1; min-height:0; position:relative; display:flex; }
.isc-car{ position:relative; flex:1; min-width:0; display:flex; align-items:center; gap:20px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; padding:16px calc(50% - min(230px, 39vw)) 22px; scrollbar-width:none; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; cursor:grab; }
.isc-car::-webkit-scrollbar{ display:none; }
.isc-car:focus-visible{ outline-offset:-4px; }
.isc-car.arrastando{ scroll-snap-type:none; cursor:grabbing; user-select:none; }
.isc-car.arrastando *{ pointer-events:none; }
.isc-car > .isc-nada, .isc-car > .vazio, .isc-car > div[aria-busy]{ flex:none; width:min(460px, 86vw); margin:0 auto; }
.isc-card{ flex:none; width:min(460px, 78vw); scroll-snap-align:center; display:flex; flex-direction:column; max-height:100%; min-height:min(520px, 100%); border-radius:26px; border:1px solid var(--line); overflow:hidden; background:linear-gradient(168deg, var(--surface), var(--surface-2)); box-shadow:var(--shadow); transition:box-shadow .35s ease, border-color .35s ease; will-change:transform, opacity, filter; }
.isc-card.em-foco{ border-color:color-mix(in srgb, var(--isc-tint) 55%, var(--line)); box-shadow:var(--shadow-alto), 0 0 0 1px color-mix(in srgb, var(--isc-tint) 30%, transparent) inset; }
.isc-cab{ position:relative; flex:none; padding:20px 22px 14px; border-bottom:1px solid var(--line); }
.isc-cab::after{ content:""; position:absolute; left:22px; bottom:-1px; width:46px; height:3px; border-radius:3px; background:var(--isc-tint); opacity:0; transition:opacity .35s ease; }
.isc-card.em-foco .isc-cab::after{ opacity:1; }
.isc-dow{ font-size:13px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:color-mix(in srgb, var(--isc-tint) 35%, var(--ink)); }
.isc-num{ margin-top:6px; font-family:var(--font-titulo); font-size:clamp(44px, 7vw, 60px); font-weight:800; letter-spacing:-.04em; line-height:.95; }
.isc-num em{ font-style:normal; font-size:.3em; font-weight:700; letter-spacing:.04em; color:var(--muted); margin-left:9px; text-transform:uppercase; }
.isc-hoje{ display:inline-block; vertical-align:middle; margin-left:10px; padding:3px 10px; border-radius:99px; background:var(--accent); color:var(--accent-ink); font-family:var(--font); font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; line-height:1.3; }
.isc-cont{ margin-top:8px; font-size:14px; color:var(--muted); font-variant-numeric:tabular-nums; }

.isc-evs{ flex:1; min-height:0; overflow-y:auto; padding:4px 0; overscroll-behavior:contain; scrollbar-width:thin; }
.isc-ev{ display:flex; align-items:flex-start; gap:14px; width:100%; min-height:0; margin:0; padding:14px 22px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; color:var(--ink); font-weight:400; text-align:left; box-shadow:inset 4px 0 0 var(--dc, transparent); }
button.isc-ev:hover{ background:var(--surface-2); }
.isc-ev:last-child{ border-bottom:0; }
.isc-hora{ flex:none; min-width:52px; display:flex; flex-direction:column; font-size:15px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1.25; padding-top:1px; }
.isc-hora-fim{ font-size:12px; font-weight:400; color:var(--muted); }
.isc-ev-corpo{ flex:1; min-width:0; }
.isc-ev-titulo{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; font-family:var(--font-titulo); font-size:17px; font-weight:700; line-height:1.25; overflow-wrap:anywhere; }
.isc-ev.cancelado .isc-ev-titulo > span:first-child{ text-decoration:line-through; color:var(--muted); }
.isc-ev.passou .isc-ev-titulo > span:first-child{ color:var(--muted); }
.isc-selo{ display:inline-flex; align-items:center; gap:4px; padding:1px 8px; border-radius:99px; border:1px solid var(--line); background:var(--surface-2); color:var(--muted); font-family:var(--font); font-size:12px; font-weight:700; line-height:1.4; }
.isc-selo .ico{ width:12px; height:12px; }
.isc-selo.cancelado{ background:var(--danger-soft); color:var(--danger); border-color:transparent; }
.isc-selo.agora{ background:var(--accent); color:var(--accent-ink); border-color:transparent; }
.isc-ev-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin-top:8px; font-size:13px; color:var(--muted); }
.isc-dept{ display:inline-flex; align-items:center; padding:2px 10px; border-radius:99px; border:1px solid var(--dc, var(--line)); background:var(--dc, var(--surface-2)); color:var(--dc-fg, var(--ink)); font-size:12px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; }
.isc-tipo,.isc-local{ display:inline-flex; align-items:center; gap:5px; min-width:0; }
.isc-tipo .ico,.isc-local .ico{ width:14px; height:14px; flex:none; }
.isc-desc{ margin:8px 0 0; font-size:14px; line-height:1.5; color:var(--muted); display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.isc-vazio-dia{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:32px 22px; text-align:center; color:var(--muted); }
.isc-vazio-dia .ico{ width:32px; height:32px; }
.isc-vazio-dia p{ margin:0; }
button.isc-criar{ width:auto; margin:6px 0 0; }
.isc-nada{ display:flex; flex-direction:column; align-items:center; gap:10px; padding:48px 20px; text-align:center; color:var(--muted); }
.isc-nada .ico{ width:36px; height:36px; }
.isc-nada strong{ color:var(--ink); font-size:18px; }

button.isc-seta{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:48px; height:48px; min-height:0; margin:0; padding:0; border-radius:50%; border:1px solid var(--line); background:color-mix(in srgb, var(--surface) 90%, transparent); color:var(--ink); display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-alto); backdrop-filter:blur(8px); }
button.isc-seta:hover:not(:disabled){ background:var(--surface-2); }
button.isc-seta:active:not(:disabled){ transform:translateY(-50%) scale(.96); }
button.isc-seta.esq{ left:18px; } button.isc-seta.dir{ right:18px; }
@media (max-width:900px){ button.isc-seta{ display:none; } }

.isc-dayview{ flex:1; min-width:0; overflow-y:auto; padding:10px 22px 26px; touch-action:pan-y; overscroll-behavior:contain; }
.isc-dv-inner{ max-width:760px; margin:0 auto; --isc-tint:var(--accent); }
.isc-dv-inner.vem-dir{ animation:iscDeDir .34s var(--ease) both; }
.isc-dv-inner.vem-esq{ animation:iscDeEsq .34s var(--ease) both; }
@keyframes iscDeDir{ from{ opacity:0; transform:translateX(44px); } to{ opacity:1; transform:none; } }
@keyframes iscDeEsq{ from{ opacity:0; transform:translateX(-44px); } to{ opacity:1; transform:none; } }
.isc-dv-cab{ padding:12px 0 18px; border-bottom:1px solid var(--line); margin-bottom:4px; }
.isc-dv-data{ margin:8px 0 0; font-family:var(--font-titulo); font-size:clamp(32px, 6.5vw, 52px); font-weight:800; letter-spacing:-.035em; line-height:1.05; }
.isc-dayview .isc-ev{ padding:22px 0 22px 18px; gap:18px; }
.isc-dayview .isc-hora{ min-width:68px; font-size:17px; }
.isc-dayview .isc-ev-titulo{ font-size:clamp(19px, 3vw, 25px); }
.isc-dayview .isc-ev-meta{ font-size:14px; margin-top:10px; }
.isc-dayview .isc-desc{ display:block; font-size:15px; max-width:62ch; }
.isc-car.troca, .isc-dayview.troca{ animation:iscTroca .38s var(--ease) both; }
@keyframes iscTroca{ from{ opacity:0; transform:translateY(12px) scale(.985); } to{ opacity:1; transform:none; } }

.isc-bar{ flex:none; border-top:1px solid var(--line); background:color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter:blur(14px); padding:10px 12px calc(10px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; gap:10px; }
.isc-trilho{ display:flex; gap:7px; overflow-x:auto; scrollbar-width:none; padding:2px; }
.isc-trilho::-webkit-scrollbar{ display:none; }
button.isc-pill{ flex:none; width:auto; min-width:54px; min-height:0; margin:0; padding:6px 12px; border-radius:12px; border:1px solid var(--line); background:var(--surface-2); color:var(--muted); font-weight:700; text-align:center; line-height:1.15; transition:background-color .18s ease, color .18s ease, border-color .18s ease; }
button.isc-pill:hover{ border-color:var(--accent); color:var(--ink); }
button.isc-pill b{ display:block; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
button.isc-pill span{ display:block; font-size:16px; font-weight:800; font-variant-numeric:tabular-nums; margin-top:1px; }
.isc-pill-ponto{ display:block; width:5px; height:5px; border-radius:50%; margin:3px auto 0; background:currentColor; opacity:.7; }
button.isc-pill.vazio{ border-style:dashed; }
button.isc-pill.vazio .isc-pill-ponto{ visibility:hidden; }
button.isc-pill.hoje{ border-color:var(--accent); }
button.isc-pill[aria-current="true"]{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.isc-controles{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.isc-linha2{ order:1; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.isc-seg.escopo{ order:2; }
.isc-seg{ display:flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2); }
.isc-seg button{ width:auto; min-height:44px; margin:0; padding:6px 14px; border:0; border-radius:9px; background:transparent; color:var(--muted); font-size:14px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; gap:6px; white-space:nowrap; }
.isc-seg button .ico{ width:18px; height:18px; }
.isc-seg button:hover:not(:disabled){ color:var(--ink); }
.isc-seg button[aria-pressed="true"]{ background:var(--accent); color:var(--accent-ink); }
.isc-semana-nav{ display:flex; align-items:center; gap:6px; }
.isc-semana-nav button{ width:auto; min-height:44px; margin:0; padding:6px 14px; border-radius:12px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink); font-size:14px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.isc-semana-nav button.isc-sem-nav{ width:44px; padding:0; }
.isc-semana-nav button:hover:not(:disabled){ border-color:var(--accent); }
@media (max-width:640px){
  .isc-seg.escopo{ order:0; flex:1 1 100%; }
  .isc-seg.escopo button{ flex:1; }
  .isc-linha2{ flex:1 1 100%; justify-content:space-between; }
  .isc-linha2 .isc-seg button .rot{ display:none; }
  .isc-linha2 .isc-seg button{ padding:6px 12px; }
  .isc-top{ padding-left:12px; padding-right:12px; }
  .isc-dayview{ padding:6px 16px 22px; }
}

.isc-flash{ position:absolute; inset:0; z-index:6; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; text-align:center; animation:iscFlash .72s cubic-bezier(.16,.9,.3,1) both; }
.isc-flash-dow{ font-family:var(--font-titulo); font-weight:800; text-transform:uppercase; letter-spacing:.14em; font-size:clamp(20px, 3.4vw, 44px); color:color-mix(in srgb, var(--isc-tint) 35%, var(--ink)); }
.isc-flash-num{ font-family:var(--font-titulo); font-weight:800; letter-spacing:-.05em; line-height:.9; font-size:clamp(120px, 26vw, 340px); color:var(--ink); }
@keyframes iscFlash{ 0%{ opacity:0; transform:scale(2.1); } 18%{ opacity:1; transform:scale(1.28); } 58%{ opacity:1; transform:scale(1); } 100%{ opacity:0; transform:scale(.94); } }

@media (prefers-reduced-motion: reduce){
  .isc-stage, .isc-stage *, button.isc-cta{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  button.isc-cta:hover:not(:disabled){ transform:none; }
}
/* <<< modulo:programacao-isc */

/* >>> modulo:notas */
.nt-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.nt-acoes button{ width:auto; margin:0; }
.nt-grupo-cab{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:14px; }
.nt-grupo-cab h3{ margin:0; flex:1 1 auto; }
.nt-selo{ font-size:12px; }
.nt-itens{ list-style:none; margin:12px 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.nt-item{ display:flex; flex-direction:column; gap:8px; padding:12px; }
.nt-item.feito input[type="text"], .nt-item.feito input:not([type]){ text-decoration:line-through; color:var(--muted); }
.nt-item-topo{ display:flex; align-items:center; gap:10px; }
.nt-item-topo input:not([type="checkbox"]){ flex:1; min-width:0; margin:0; }
.nt-chk{ display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; margin:0; }
.nt-chk input{ width:26px; height:26px; margin:0; accent-color:var(--accent); }
.nt-item-leitura{ flex-direction:row; align-items:flex-start; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); list-style:none; }
.nt-item-leitura.feito strong{ text-decoration:line-through; color:var(--muted); }
.nt-marca{ flex:none; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:7px; border:2px solid var(--muted); }
.nt-marca.on{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.nt-marca .ico{ width:18px; height:18px; }
.nt-item-txt{ display:flex; flex-direction:column; gap:2px; min-width:0; overflow-wrap:anywhere; }
/* <<< modulo:notas */
/* >>> modulo:projecao (ajuste abas) */
[data-ferr="apresentacao"] > .seg{ overflow-x:auto; scrollbar-width:thin; }
[data-ferr="apresentacao"] > .seg button{ flex:none; }
/* <<< modulo:projecao (ajuste abas) */