/* ============================================================================
   comunidade.css — feed social de TEXTO (v28)
   Tokens do feed ficam em .comunidade-modal / sheet / toast (escopo local, não
   mexem na paleta global do app). Claro = padrão; escuro segue o tema do app
   ([data-theme="dark"]) e também aceita a classe .dark.
   ========================================================================= */
.comunidade-modal,
.comunidade-sheet-scrim,
.comunidade-toast {
  /* v43: mesma paleta do resto do app (Jatobase): verde #235048, marrom #2E1F17, bege #F1E7DA */
  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --surface-alt: #F1E7DA;
  --text: #2E1F17;
  --text-muted: #6B5B4E;
  --border: rgba(46,31,23,0.10);
  --primary: #235048;
  --primary-soft: rgba(35,80,72,0.10);
  --primary-strong: #235048;
  --info: #235048;
  --success: #235048;
  --on-primary: #FFFFFF;
  --danger: #C1502E;
  --scrim: rgba(46,31,23,0.38);
  --gutter: 20px; /* margem lateral do conteúdo */
  --av: 40px;     /* avatar do post */
}
:root[data-theme="dark"] .comunidade-modal,
:root[data-theme="dark"] .comunidade-sheet-scrim,
:root[data-theme="dark"] .comunidade-toast,
.dark .comunidade-modal,
.dark .comunidade-sheet-scrim,
.dark .comunidade-toast {
  --bg: #2E1F17;
  --surface: #3A2A20;
  --surface-alt: #3A2A20;
  --text: #F5EFE6;
  --text-muted: #C9B9A6;
  --border: rgba(245,239,230,0.10);
  --primary: #F5EFE6;           /* no escuro o app usa creme como destaque (igual ao Histórico) */
  --primary-soft: rgba(245,239,230,0.10);
  --primary-strong: #F5EFE6;
  --info: #F5EFE6;
  --success: #235048;
  --on-primary: #2E1F17;
  --danger: #E0704A;
  --scrim: rgba(0,0,0,0.55);
}

/* ---------- Estrutura ---------- */
.comunidade-modal { position:fixed; inset:0; display:none; z-index:10030; align-items:stretch; justify-content:center; color:var(--text); background:var(--bg); }
.comunidade-modal.aberto { display:flex; }
.comunidade-painel { position:relative; display:flex; flex-direction:column; width:min(100%,640px); height:100dvh; overflow:hidden; background:var(--bg); }
:where(#modal-comunidade) *, :where(#modal-comunidade) *::before, :where(#modal-comunidade) *::after { box-sizing:border-box; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
body.comunidade-aberta { overflow:hidden; }
/* Login aberto por cima do chat: o véu escuro do popup (mesma cor e transparência de sempre, definidos em
   body.popup-aberto::before) sobe para ficar na frente da Comunidade e atrás do card de login. */
body.comunidade-aberta.popup-aberto::before { z-index:10040; }
body.comunidade-aberta .fab-instalar { display:none !important; }

/* O CSS global do app pinta todo <button> com a cor de destaque (!important).
   Aqui todo botão parte do zero e cada componente define o próprio visual. */
#modal-comunidade button,
#comunidade-sheet button {
  font:inherit; cursor:pointer; box-shadow:none !important;
  background-color:transparent !important; color:inherit !important; border:0 !important;
}
#modal-comunidade button:focus-visible,
#comunidade-sheet button:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
#modal-comunidade svg { display:block; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }

/* ---------- Cabeçalho ---------- */
.comunidade-topo { position:relative; z-index:5; display:flex; align-items:stretch; min-height:56px; padding-top:env(safe-area-inset-top); border-bottom:1px solid var(--border); background:var(--bg); }
.comunidade-abas { display:flex; flex:1 1 0; min-width:0; box-sizing:border-box; padding:0 54px 0 0; justify-content:stretch; gap:0; }
.comunidade-aba { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:5px; flex:1 1 0; min-width:0; min-height:56px; padding:0 3px; white-space:nowrap; font:600 13px/1 Inter,sans-serif; }
#modal-comunidade .comunidade-aba { font:600 12px/1 Inter,sans-serif; }
.comunidade-aba-icone { width:21px; height:21px; }
.comunidade-aba-label { display:none; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
#modal-comunidade .comunidade-aba-label { display:none !important; }
#modal-comunidade .comunidade-aba { color:var(--text-muted) !important; }
#modal-comunidade .comunidade-aba.ativa { color:var(--text) !important; font-weight:700; }
.comunidade-aba:last-child { margin-left:0; }
.comunidade-aba.ativa::after { position:absolute; bottom:0; left:calc(50% - 16px); width:32px; height:3px; border-radius:3px 3px 0 0; background:var(--primary); content:''; }
.comunidade-aba-badge { position:absolute; top:5px; left:calc(50% + 2px); right:auto; display:inline-grid; place-items:center; min-width:24px; height:18px; margin-left:0; padding:0 5px; border-radius:999px; background:var(--primary); color:var(--on-primary); font:700 10.5px/1 Inter,sans-serif; font-variant-numeric:tabular-nums; }
.comunidade-aba-badge[hidden] { display:none; }
.comunidade-fechar { position:absolute; z-index:7; top:env(safe-area-inset-top,0px); right:0; display:grid; place-items:center; width:54px; height:56px; }
#modal-comunidade .comunidade-fechar { color:var(--text) !important; }
.comunidade-fechar svg { width:22px; height:22px; }
.comunidade-conteudo { flex:1; overflow-y:auto; overscroll-behavior:contain; padding-bottom:calc(16px + env(safe-area-inset-bottom)); }

/* ---------- Login ---------- */
.comunidade-loginwall { position:absolute; z-index:6; inset:0; display:grid; place-items:center; padding:20px; background:color-mix(in srgb,var(--text) 34%,transparent); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.comunidade-loginwall[hidden] { display:none; }
#modal-comunidade.loginwall-aberto .comunidade-topo { border-bottom-color:transparent; }
.comunidade-loginwall-card { width:min(100%,380px); padding:26px 22px 22px; border:1px solid var(--border); border-radius:22px; background:var(--surface); color:var(--text); text-align:center; }
.comunidade-loginwall-icone { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 14px; border-radius:50%; color:var(--primary); background:var(--primary-soft); }
.comunidade-loginwall-icone svg { width:25px; height:25px; }
.comunidade-loginwall-card h3 { margin:0 0 8px; color:var(--text); font-size:20px; }
.comunidade-loginwall-card p { margin:0 0 20px; color:var(--text-muted); font-size:14px; line-height:1.5; }
#modal-comunidade .comunidade-loginwall-card button { min-height:46px; padding:11px 22px; border-radius:999px; background-color:var(--primary) !important; color:var(--on-primary) !important; font-weight:700; }
.comunidade-login-inline { display:flex; align-items:center; gap:12px; padding:14px var(--gutter); border-bottom:1px solid var(--border); }
.comunidade-login-inline[hidden] { display:none; }
#modal-comunidade .comunidade-login-inline button { flex:1; min-height:48px; padding:11px 18px; border:1px solid var(--border) !important; border-radius:999px; background-color:var(--surface) !important; color:var(--text-muted) !important; font-size:15px; text-align:left; }
#modal-comunidade .comunidade-login-inline button { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:clamp(13px,3.9vw,15px); }
#modal-comunidade .comunidade-thread-composer button.comunidade-thread-status { white-space:nowrap; }
.comunidade-aviso-admin { margin:0; padding:10px var(--gutter); border-bottom:1px solid var(--border); background:var(--primary-soft); color:var(--text-muted); font-size:12.5px; line-height:1.45; }
.comunidade-aviso-admin[hidden] { display:none; }

/* ---------- Avatares (foto de perfil; nunca imagem de conteúdo) ---------- */
.comunidade-avatar { display:grid; flex:0 0 var(--av); place-items:center; width:var(--av); height:var(--av); overflow:hidden; border-radius:50%; background:var(--primary-soft); color:var(--primary-strong); font-size:14px; font-weight:700; }
.comunidade-avatar img { display:block; width:100%; height:100%; border-radius:inherit; object-fit:cover; }
.comunidade-avatar-mini { flex:0 0 32px; width:32px; height:32px; font-size:11px; }

/* ---------- Composer (somente texto) ---------- */
.comunidade-cmp { display:flex; gap:12px; padding:16px var(--gutter); border-bottom:1px solid var(--border); }
.comunidade-cmp[hidden] { display:none; }
.comunidade-cc { flex:1; min-width:0; display:flex; flex-direction:column; gap:8px; }
.comunidade-bar { display:flex; align-items:flex-end; padding:3px 8px 3px 18px; border:1px solid var(--border); border-radius:26px; background:var(--surface); transition:border-color .15s; }
.comunidade-cmp:focus-within .comunidade-bar { border-color:var(--primary); }
.comunidade-bar textarea { flex:1; min-width:0; width:100%; height:44px; min-height:44px; max-height:150px; padding:11px 0; border:0; outline:0 !important; box-shadow:none; resize:none; overflow-y:auto; scrollbar-width:none; background:transparent; color:var(--text); font:16px/22px Inter,sans-serif; }
.comunidade-bar textarea::-webkit-scrollbar { display:none; }
.comunidade-bar textarea::placeholder { color:var(--text-muted); opacity:1; }
.comunidade-cfoot { display:none; align-items:center; justify-content:space-between; gap:10px; color:var(--text-muted); font-size:13px; }
.comunidade-status { color:var(--danger); font-size:12px; }
.comunidade-status:empty { display:none; }
.comunidade-cmp:focus-within .comunidade-cfoot,.comunidade-cmp.has-content .comunidade-cfoot { display:flex; }
#modal-comunidade .comunidade-publicar { min-height:40px; padding:9px 20px; border-radius:999px; background-color:var(--primary) !important; color:var(--on-primary) !important; font:700 14px Inter,sans-serif; }
#modal-comunidade .comunidade-publicar:disabled { opacity:.45; cursor:default; }

/* ---------- Feed: posts sem cartão, divisores sutis ---------- */
.comunidade-feed { display:block; }
/* ---------- Eventos: missões (segue o mock "Eventos com missões") ---------- */
.ev { --ev-accent:#235048; --ev-on-accent:#FFFFFF; --ev-accent-soft:rgba(35,80,72,.10); --ev-gold:#C98F1F; --ev-gold-soft:rgba(201,143,31,.14); --ev-card:#FFFFFF; --ev-card-alt:#F1E7DA; --ev-mute2:#9C8B7A; --ev-track:rgba(46,31,23,.09); --ev-urgent:#C1502E; --ev-ring:rgba(255,255,255,.22); --ev-shadow:0 1px 2px rgba(46,31,23,.06),0 6px 18px rgba(46,31,23,.06); padding-bottom:12px; }
:root[data-theme="dark"] .ev, .dark .ev { --ev-accent:#D9A441; --ev-on-accent:#2E1F17; --ev-accent-soft:rgba(217,164,65,.14); --ev-gold:#E8B95A; --ev-gold-soft:rgba(232,185,90,.16); --ev-card:#2E1F17; --ev-card-alt:#3A2A20; --ev-track:rgba(245,239,230,.12); --ev-urgent:#E0704A; --ev-ring:rgba(46,31,23,.25); --ev-shadow:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.25); }
.ev-resumo { display:flex; align-items:center; gap:14px; margin:16px 16px 4px; padding:14px 16px; border-radius:20px; background:var(--ev-accent); color:var(--ev-on-accent); }
.ev-anel { --p:0; display:grid; flex:none; width:52px; height:52px; place-items:center; border-radius:50%; background:conic-gradient(var(--ev-on-accent) calc(var(--p) * 1%), var(--ev-ring) 0); }
.ev-anel span { display:grid; width:40px; height:40px; place-items:center; border-radius:50%; background:var(--ev-accent); font-size:14px; font-weight:800; }
.ev-resumo strong { display:block; font-size:15px; font-weight:700; }
.ev-resumo small { font-size:12px; opacity:.85; }
.ev-filtros { display:flex; gap:8px; padding:14px 16px 4px; overflow-x:auto; scrollbar-width:none; }
.ev-filtros::-webkit-scrollbar { display:none; }
#modal-comunidade .ev-chip { flex:none; padding:7px 13px; border:1px solid var(--border) !important; border-radius:999px; background-color:var(--ev-card) !important; color:var(--text-muted) !important; font-size:12.5px; font-weight:600; }
#modal-comunidade .ev-chip[aria-pressed="true"] { border-color:var(--text) !important; background-color:var(--text) !important; color:var(--bg) !important; }
.ev-lista { display:grid; gap:14px; padding:10px 16px 12px; }
.ev-card { min-width:0; overflow:hidden; border:1px solid var(--border); border-radius:22px; background:var(--ev-card); box-shadow:var(--ev-shadow); }
.ev-status { flex:none; padding:4px 9px; border-radius:999px; background:var(--ev-card-alt); color:var(--text-muted); font-size:11px; font-weight:700; white-space:nowrap; }
.ev-status.urgente { background:rgba(193,80,46,.12); color:var(--ev-urgent); }
.ev-status.ok { background:var(--ev-gold-soft); color:var(--ev-gold); }
.ev-meu { padding:16px 16px 0; }
.ev-meu-linha { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:8px; }
.ev-num { color:var(--text); font-size:26px; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.ev-num small { color:var(--ev-mute2); font-size:14px; font-weight:600; letter-spacing:0; }
.ev-falta { color:var(--text-muted); font-size:12.5px; font-weight:500; text-align:right; }
.ev-entre { margin:0; padding:11px 12px; border-radius:12px; background:var(--ev-accent-soft); color:var(--ev-accent); font-size:12.5px; font-weight:700; line-height:1.45; }
.ev-barra { position:relative; height:12px; border-radius:999px; background:var(--ev-track); }
.ev-barra > i { position:absolute; inset:0 auto 0 0; width:0; border-radius:999px; background:var(--ev-accent); transition:width .7s cubic-bezier(.2,.8,.2,1); }
.ev-barra.completa > i { background:var(--ev-gold); }
.ev-seg { display:flex; gap:6px; }
.ev-seg i { flex:1; height:12px; border-radius:999px; background:var(--ev-track); }
.ev-seg i.on { background:var(--ev-accent); }
.ev-seg.completa i.on { background:var(--ev-gold); }
.ev-premio { display:flex; align-items:center; gap:8px; margin-top:12px; padding:9px 12px; border-radius:12px; background:var(--ev-gold-soft); color:var(--text); font-size:12.5px; font-weight:600; }
#modal-comunidade .ev-premio svg { width:18px; height:18px; stroke:var(--ev-gold); stroke-width:1.9; }
.ev-quem { margin-top:16px; padding:12px 16px 6px; border-top:1px solid var(--border); }
.ev-quem-cab { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:4px; color:var(--text-muted); font-size:12px; }
.ev-quem-cab b { color:var(--text); font-size:13px; font-weight:700; }
.ev-pessoa { display:grid; grid-template-columns:22px 34px minmax(0,1fr) auto; align-items:center; column-gap:10px; padding:8px 0; }
.ev-pessoa + .ev-pessoa { border-top:1px dashed var(--border); }
.ev-pos { color:var(--ev-mute2); font-size:12px; font-weight:700; text-align:center; font-variant-numeric:tabular-nums; }
.ev-pessoa.top .ev-pos { color:var(--ev-gold); }
.ev-av { display:grid; width:34px; height:34px; overflow:hidden; place-items:center; border-radius:50%; color:#fff; font-size:12px; font-weight:700; }
.ev-av img { width:100%; height:100%; object-fit:cover; }
.ev-info { min-width:0; }
.ev-nome { display:flex; align-items:center; gap:6px; min-width:0; margin-bottom:5px; color:var(--text); font-size:13.5px; font-weight:600; line-height:1.2; }
.ev-nome > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ev-tag-voce { flex:none; padding:2px 6px; border-radius:6px; background:var(--ev-accent); color:var(--ev-on-accent); font-size:10px; font-style:normal; font-weight:800; }
.ev-pedra { flex:none; color:var(--ev-mute2); font-size:11.5px; font-weight:500; }
.ev-mini { height:6px; overflow:hidden; border-radius:999px; background:var(--ev-track); }
.ev-mini i { display:block; width:0; height:100%; border-radius:999px; background:var(--ev-accent); opacity:.55; transition:width .7s cubic-bezier(.2,.8,.2,1); }
.ev-pessoa.eu .ev-mini i { opacity:1; }
.ev-pessoa.fim .ev-mini i { background:var(--ev-gold); opacity:1; }
.ev-valor { min-width:44px; color:var(--text); font-size:12.5px; font-weight:700; font-variant-numeric:tabular-nums; text-align:right; }
.ev-valor small { color:var(--ev-mute2); font-weight:500; }
.ev-valor.feito { display:inline-flex; align-items:center; justify-content:flex-end; gap:3px; color:var(--ev-gold); }
#modal-comunidade .ev-valor.feito svg { width:14px; height:14px; stroke-width:2.6; }
.ev-pessoa.eu { margin:4px -10px; padding:8px 10px; border-top-color:transparent; border-radius:12px; background:var(--ev-accent-soft); }
.ev-pessoa.eu + .ev-pessoa { border-top-color:transparent; }
.ev-gap { padding:2px 0; color:var(--ev-mute2); font-size:14px; letter-spacing:3px; line-height:.8; text-align:center; }
#modal-comunidade .ev-ver-todos { display:flex; align-items:center; justify-content:center; gap:6px; width:calc(100% + 32px); margin:6px -16px 0; padding:12px 16px; border-top:1px solid var(--border) !important; color:var(--ev-accent) !important; font-size:13px; font-weight:700; }
#modal-comunidade .ev-ver-todos svg { width:14px; height:14px; stroke-width:2.4; transition:transform .25s; }
#modal-comunidade .ev-card.aberta .ev-ver-todos svg { transform:rotate(180deg); }
.ev-nota { margin:4px 16px 16px; color:var(--ev-mute2); font-size:11.5px; text-align:center; }
@media (prefers-reduced-motion:reduce) { .ev-barra > i, .ev-mini i, .ev-ver-todos svg { transition:none; } }
@media (min-width:960px) {
  .ev { width:100%; max-width:none; }
  .ev-resumo { margin-left:0; margin-right:0; }
  .ev-filtros, .ev-lista { padding-left:0; padding-right:0; }
  .ev-nota { margin-left:0; margin-right:0; text-align:left; }
}
@media (min-width:1280px) {
  .ev-lista { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; column-gap:18px; row-gap:18px; }
}
/* O menu fica acima do modal somente enquanto a Comunidade está aberta. */
body.comunidade-aberta .hl-nav { z-index:2147483647 !important; }
html.usuario-logado.teclado-aberto body.comunidade-aberta .hl-nav { display:flex !important; }
/* O chat ocupa a tela inteira; o menu não pode cobrir a barra de escrita. */
body:has(#tela-resultado.active) .hl-nav { display:none !important; }
html.usuario-logado #modal-comunidade .comunidade-conteudo { padding-bottom:calc(84px + env(safe-area-inset-bottom)); }
.comunidade-grupo { padding-bottom:10px; border-bottom:1px solid var(--border); }
.comunidade-post { --post-pt:18px; position:relative; display:flex; gap:12px; padding:var(--post-pt) var(--gutter) 0; }
.comunidade-post-body { flex:1; min-width:0; }
.comunidade-post-topo { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.comunidade-meta { display:grid; gap:1px; min-width:0; }
.comunidade-meta-nome { display:flex; flex-wrap:wrap; align-items:center; gap:2px 8px; min-width:0; }
.comunidade-meta strong { color:var(--text); font-size:15px; font-weight:700; line-height:1.3; overflow-wrap:anywhere; }
.comunidade-meta > span { color:var(--text-muted); font-size:12px; line-height:1.3; }
.comunidade-tag { display:inline-flex; align-items:center; gap:5px; margin:8px 0 0; padding:3px 10px 3px 8px; border-radius:999px; background:var(--primary-soft); color:var(--primary-strong); font-size:11.5px; font-weight:600; line-height:1.4; }
.comunidade-tag svg { width:13px; height:13px; }
.comunidade-post-texto { margin:6px 0 8px; color:var(--text); font-size:15px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.comunidade-post-note { display:block; margin:4px 0; color:var(--text-muted); font-size:12px; }

/* Badge Admin */
.comunidade-admin-badge { display:inline-flex; align-items:center; gap:4px; padding:2px 8px 2px 6px; border-radius:999px; background:var(--primary-soft); color:var(--primary-strong); font-size:11.5px; font-weight:600; line-height:1.4; white-space:nowrap; }
.comunidade-admin-badge svg { width:13px; height:13px; color:var(--primary); }
.comunidade-admin-badge span { color:inherit; }

/* Aviso do administrador (aba Atualizações): card compacto, texto na largura toda */
/* o card começa na borda do avatar e termina na mesma margem do lado direito */
.comunidade-post.com-aviso .comunidade-aviso-card { margin-left:calc(-1 * (var(--av) + 12px)); }
.comunidade-post.com-aviso .comunidade-acoes { margin-left:calc(-1 * (var(--av) + 12px) - 10px); }
.comunidade-post.com-aviso .comunidade-toggle-respostas { margin-left:calc(-1 * (var(--av) + 12px) - 10px); }
.comunidade-aviso-card { margin:8px 0 10px; padding:12px 14px 13px; border-left:3px solid var(--primary); border-radius:16px; background:var(--primary-soft); }
.comunidade-aviso-titulo { display:flex; align-items:center; gap:6px; margin:0 0 5px; color:var(--primary-strong); font-size:12px; font-weight:700; letter-spacing:.01em; }
.comunidade-aviso-titulo svg { width:15px; height:15px; color:var(--primary); }
.comunidade-aviso-texto { margin:0; color:var(--text); font-size:14.5px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }

/* Ações: ♡ n · comentário Responder (discretas) */
.comunidade-acoes { display:flex; align-items:center; gap:4px; margin:0 0 0 -10px; }
.comunidade-action { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-width:36px; height:36px; padding:0 10px; border-radius:999px; font:500 12.5px/1 Inter,sans-serif; white-space:nowrap; transition:background-color .15s; }
#modal-comunidade .comunidade-action,
#modal-comunidade .comunidade-responder { color:var(--text-muted) !important; }
.comunidade-action svg, .comunidade-responder svg { width:18px; height:18px; }
#modal-comunidade .comunidade-action:hover,
#modal-comunidade .comunidade-responder:hover { background-color:var(--primary-soft) !important; }
#modal-comunidade .comunidade-action.liked svg { fill:var(--primary); stroke:var(--primary); }
.comunidade-action:disabled { opacity:.6; cursor:default; }
.comunidade-responder { display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 10px; border-radius:999px; font:500 12.5px/1 Inter,sans-serif; transition:background-color .15s; }
.comunidade-responder[hidden] { display:none; }
/* ⋯ no topo do post e das respostas */
.comunidade-more { flex:0 0 auto; width:36px; min-width:36px; height:36px; padding:0; margin:-6px -8px 0 0; }
#modal-comunidade .comunidade-more svg { width:20px; height:20px; fill:currentColor; stroke:none; }

/* Contador de respostas */
#modal-comunidade .comunidade-toggle-respostas { display:inline-flex; align-items:center; gap:4px; min-height:40px; margin:2px 0 4px -10px; padding:0 10px; border-radius:999px; color:var(--primary-strong) !important; font:700 13px/1 Inter,sans-serif; }
#modal-comunidade .comunidade-toggle-respostas:hover { background-color:var(--primary-soft) !important; }
.comunidade-toggle-respostas[hidden] { display:none !important; }
.comunidade-toggle-respostas svg { width:16px; height:16px; transition:transform .15s; }
.comunidade-toggle-respostas[aria-expanded="true"] svg { transform:rotate(180deg); }

/* ---------- Thread em árvore ----------
   Linha única: nasce embaixo do avatar do post, desce até a última resposta e
   faz uma curva de 90° até cada avatar. Tudo é desenhado pelo próprio item,
   então acompanha qualquer quantidade de respostas e qualquer altura de texto. */
.comunidade-post.com-lista::after { position:absolute; left:calc(var(--gutter) + var(--av) / 2 - 1px); top:calc(var(--post-pt) + var(--av) + 6px); bottom:0; width:2px; background:var(--border); content:''; }
.comunidade-thread { position:relative; display:block; min-width:0; margin:0 var(--gutter) 0 calc(var(--gutter) + var(--av) / 2 - 1px); padding:0; }
.comunidade-thread[hidden], .comunidade-thread-lista[hidden], .comunidade-thread-composer[hidden] { display:none; }
.comunidade-thread-lista { display:block; min-width:0; }
.comunidade-thread-item { position:relative; display:flex; align-items:flex-start; gap:10px; min-width:0; padding:0 0 18px 30px; }
.comunidade-thread-item:last-child { padding-bottom:6px; }
.comunidade-thread-item::before { position:absolute; left:0; top:0; width:24px; height:16px; border-left:2px solid var(--border); border-bottom:2px solid var(--border); border-bottom-left-radius:12px; content:''; }
.comunidade-thread-item:not(:last-child)::after { position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--border); content:''; }
.comunidade-thread-corpo { flex:1; min-width:0; }
.comunidade-thread-autor { display:flex; flex-wrap:wrap; align-items:center; gap:2px 8px; min-width:0; overflow-wrap:anywhere; }
.comunidade-thread-autor strong { color:var(--text); font-size:13.5px; font-weight:700; }
.comunidade-thread-autor small { color:var(--text-muted); font-size:11.5px; }
.comunidade-thread-texto { margin:2px 0 0; color:var(--text); font-size:14px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.comunidade-thread-item .comunidade-more { width:32px; min-width:32px; height:32px; margin:-4px -8px 0 0; }
.comunidade-thread-status { color:var(--text-muted); font-size:12px; }
.comunidade-thread-status[hidden] { display:none; }
.comunidade-thread-composer { display:grid; gap:8px; min-width:0; padding:0 0 16px; }
.comunidade-thread:has(.comunidade-thread-lista:not([hidden]) .comunidade-thread-item) .comunidade-thread-composer:not([hidden]) { padding-left:28px; border-left:2px solid var(--border); }
.comunidade-thread-form { display:grid; gap:8px; width:100%; min-width:0; }
.comunidade-thread-form input { width:100%; min-width:0; padding:10px 14px; border:1px solid var(--border); border-radius:999px; outline:0; background:var(--surface); color:var(--text); font:15px Inter,sans-serif; }
.comunidade-thread-form input:focus { border-color:var(--primary); }
.comunidade-thread-form input::placeholder { color:var(--text-muted); opacity:1; }
.comunidade-thread-form-acoes { display:flex; justify-content:flex-end; gap:8px; }
#modal-comunidade .comunidade-thread-form button { min-height:40px; padding:8px 18px; border-radius:999px; font:700 14px Inter,sans-serif; white-space:nowrap; }
#modal-comunidade .comunidade-thread-form button[type="submit"] { background-color:var(--primary) !important; color:var(--on-primary) !important; }
#modal-comunidade .comunidade-thread-form button[type="submit"]:disabled { opacity:.45; }
#modal-comunidade .comunidade-thread-form button.comunidade-cancelar { color:var(--text) !important; }
#modal-comunidade button.comunidade-thread-status { padding:6px 0; color:var(--primary-strong) !important; font-weight:600; text-align:left; }

/* ---------- Estados ---------- */
.comunidade-estado { padding:28px 18px; color:var(--text-muted); text-align:center; font-size:14px; }
.comunidade-feed-aviso { display:grid; justify-items:center; gap:10px; padding:24px 16px; color:var(--text-muted); text-align:center; }
.comunidade-feed-aviso p { margin:0; }
#modal-comunidade .comunidade-feed-aviso button { padding:8px 16px; border:1px solid var(--border) !important; border-radius:999px; background-color:var(--surface) !important; color:var(--primary-strong) !important; font-weight:700; }
.comunidade-empty { padding:34px 20px; color:var(--text-muted); text-align:center; }

/* ---------- Sheet e toast ---------- */
.comunidade-sheet-scrim { position:fixed; z-index:10050; inset:0; display:flex; align-items:flex-end; justify-content:center; background:var(--scrim); }
.comunidade-sheet-scrim[hidden] { display:none; }
.comunidade-sheet { width:min(100%,640px); padding:12px 20px calc(18px + env(safe-area-inset-bottom)); border-radius:20px 20px 0 0; background:var(--surface); color:var(--text); }
.comunidade-sheet-alca { width:38px; height:4px; margin:0 auto 18px; border-radius:4px; background:var(--text-muted); opacity:.45; }
.comunidade-sheet h3 { margin:0 0 5px; color:var(--text); font-size:17px; }
.comunidade-sheet p { margin:0 0 12px; color:var(--text-muted); font-size:14px; }
.comunidade-sheet-acoes { display:grid; gap:8px; }
#comunidade-sheet .comunidade-sheet-opcao,
#comunidade-sheet .comunidade-sheet-cancelar { display:flex; align-items:center; justify-content:center; width:100%; min-height:48px; margin:0; padding:12px 14px; border-radius:999px; background-color:var(--bg) !important; color:var(--text) !important; text-align:center; font-weight:600; }
#comunidade-sheet .comunidade-sheet-opcao.perigo { color:var(--danger) !important; background-color:color-mix(in srgb,var(--danger) 12%,var(--surface)) !important; }
#comunidade-sheet .comunidade-sheet-cancelar { margin-top:8px; }
.comunidade-sheet-scrim[data-variant="confirm"] .comunidade-sheet { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:10px; }
.comunidade-sheet-scrim[data-variant="confirm"] .comunidade-sheet-alca,
.comunidade-sheet-scrim[data-variant="confirm"] .comunidade-sheet h3,
.comunidade-sheet-scrim[data-variant="confirm"] .comunidade-sheet p { grid-column:1 / -1; }
.comunidade-sheet-scrim[data-variant="confirm"] .comunidade-sheet-acoes { display:contents; }
.comunidade-toast { position:fixed; z-index:10060; left:50%; bottom:calc(24px + env(safe-area-inset-bottom)); max-width:min(90vw,440px); padding:11px 16px; border-radius:999px; color:var(--bg); background:var(--text); text-align:center; font-size:14px; opacity:0; pointer-events:none; transform:translate(-50%,12px); transition:opacity .2s,transform .2s; }
.comunidade-toast.visivel { opacity:1; transform:translate(-50%,0); }

/* ---------- Desktop ---------- */
@media (min-width:700px) {
  .comunidade-modal { align-items:center; padding:3vh 18px; background:color-mix(in srgb,var(--text) 45%,transparent); }
  .comunidade-painel { height:min(860px,94dvh); border:1px solid var(--border); border-radius:22px; }
}

/* Bolinha verde piscante no balão da home: sinaliza que estamos "online" */
.fab-badge { position:absolute; top:5px; right:5px; width:14px; height:14px; border-radius:50%; background:#235048; box-shadow:0 0 0 2.5px var(--mountains-base,#F5EFE6),0 1px 4px rgba(0,0,0,.25); pointer-events:none; animation:fabOnlinePisca 1.6s ease-in-out infinite; }
.fab-badge::after { content:""; position:absolute; inset:0; border-radius:50%; background:#235048; opacity:.55; animation:fabOnlineOnda 1.6s ease-out infinite; }
.fab-badge[hidden] { display:none; }
@keyframes fabOnlinePisca { 0%,100% { opacity:1; } 50% { opacity:.45; } }
@keyframes fabOnlineOnda { 0% { transform:scale(1); opacity:.55; } 100% { transform:scale(2.4); opacity:0; } }
@media (prefers-reduced-motion:reduce) { .fab-badge, .fab-badge::after { animation:none; } .comunidade-toggle-respostas svg { transition:none; } }

/* ---- Mensagens do sistema (aba Atualizações): sem avatar, sem nome ---- */
.comunidade-post.com-sistema { padding-bottom:0; }
.comunidade-post.com-sistema .comunidade-aviso-card { margin-left:0; }
.comunidade-post.com-sistema .comunidade-acoes,
.comunidade-post.com-sistema .comunidade-toggle-respostas { margin-left:-10px; }
.comunidade-post.com-sistema.com-lista::after { display:none; }
.comunidade-sistema-titulo { flex:1; min-width:0; overflow-wrap:anywhere; }
.comunidade-sistema-data { flex-shrink:0; color:var(--text-muted); font-size:12px; font-weight:500; }

/* ---- Aba Ranking ---- */
.comunidade-ranking { padding:6px 0 18px; }
.comunidade-ranking-titulo { margin:0; padding:14px var(--gutter) 6px; color:var(--text-muted); font-size:13px; font-weight:500; }
.comunidade-ranking-cabecalho, .comunidade-ranking-item { display:grid; grid-template-columns:52px minmax(0,1fr) 72px 80px; align-items:center; column-gap:10px; padding-left:var(--gutter); padding-right:var(--gutter); }
.comunidade-ranking-cabecalho { padding-top:8px; padding-bottom:8px; color:var(--text-muted); font-size:10px; font-weight:600; }
.comunidade-ranking-cabecalho span:nth-child(3) { text-align:left; }
.comunidade-ranking-cabecalho span:nth-child(4) { text-align:right; }
.comunidade-ranking-item { padding-top:12px; padding-bottom:12px; border-bottom:1px solid var(--border); }
.comunidade-ranking-posicao { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; }
.comunidade-ranking-pos { color:var(--text-muted); font-size:17px; font-weight:700; text-align:center; font-variant-numeric:tabular-nums; }
.comunidade-ranking-item.top .comunidade-ranking-pos { color:var(--primary-strong); }
.comunidade-ranking-variacao { display:flex; align-items:center; justify-content:flex-end; }
.comunidade-ranking-movimento { padding:2px 4px; border-radius:999px; font-size:11px; font-weight:800; line-height:1.1; white-space:nowrap; font-variant-numeric:tabular-nums; }
.comunidade-ranking-movimento.subiu { color:#235048; background:rgba(35,80,72,.10); }
:root[data-theme="dark"] .comunidade-ranking-movimento.subiu { color:#8FD0BF; background:rgba(143,208,191,.14); }
.comunidade-ranking-movimento.desceu { color:var(--danger); background:color-mix(in srgb,var(--danger) 12%,transparent); }
.comunidade-ranking-foto { flex:0 0 44px; width:44px; height:44px; overflow:hidden; border-radius:50%; background:var(--primary-soft); }
.comunidade-ranking-foto img { display:block; width:100%; height:100%; object-fit:cover; }
.comunidade-ranking-foto.vazia { background:var(--primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'%3E%3Ccircle cx='22' cy='17' r='7' fill='%23b8b2a8'/%3E%3Cpath d='M8 38c1-8 7-12 14-12s13 4 14 12z' fill='%23b8b2a8'/%3E%3C/svg%3E") center/cover no-repeat; }
.comunidade-ranking-perfil { min-width:0; display:flex; align-items:center; gap:8px; }
.comunidade-ranking-info { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.comunidade-ranking-info strong { overflow:hidden; color:var(--text); font-size:15px; font-weight:600; white-space:nowrap; text-overflow:ellipsis; }
.comunidade-ranking-avaliacoes { color:var(--text-muted); font-size:12px; white-space:nowrap; }
.comunidade-ranking-diamantes { display:flex; align-items:center; justify-content:flex-end; gap:5px; }
.comunidade-ranking-valor { flex:0 0 auto; color:var(--text); font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }

@media (max-width: 420px) {
  .comunidade-ranking-cabecalho, .comunidade-ranking-item { grid-template-columns:46px minmax(0,1fr) 66px 76px; column-gap:8px; }
  .comunidade-ranking-cabecalho { font-size:9px; }
  .comunidade-ranking-foto { flex-basis:36px; width:36px; height:36px; }
  .comunidade-ranking-info strong { font-size:14px; }
  .comunidade-ranking-avaliacoes { font-size:11px; }
  .comunidade-ranking-valor { font-size:12px; }
}

/* As abas usam ícones compactos; só a selecionada mostra o rótulo. */
@media (max-width: 440px) {
  .comunidade-aba { gap:3px; padding:0 2px; }
  #modal-comunidade .comunidade-aba { font-size:11px; }
  .comunidade-aba-icone { width:20px; height:20px; }
}
@media (max-width: 350px) {
  .comunidade-aba { gap:2px; padding:0 1px; }
  #modal-comunidade .comunidade-aba { font-size:10px; }
  .comunidade-aba-icone { width:18px; height:18px; }
  .comunidade-aba-badge { min-width:23px; height:16px; padding:0 4px; font-size:9.5px; }
}

/* v42 — a tela mostra uma seção por vez (Ranking, Eventos ou Notificações): sem abas e sem chat. */
#modal-comunidade .comunidade-abas { display:none; }
#modal-comunidade .comunidade-titulo-topo { flex:1 1 auto; align-self:center; margin:0; padding:0 54px 0 18px; font:800 18px/1.2 Manrope,Inter,system-ui,sans-serif; letter-spacing:.01em; color:var(--text); }

/* ==========================================================================
   v43 — Ranking e Eventos com o mesmo visual do resto do app (Histórico/Início):
   Manrope, botão de voltar redondo à esquerda, título verde e listas em cartão com borda.
   ========================================================================== */
#modal-comunidade { font-family:'Manrope','Inter',system-ui,sans-serif; }

/* Topo igual ao do Histórico */
.comunidade-topo { align-items:center; min-height:calc(68px + env(safe-area-inset-top)); }
#modal-comunidade .comunidade-fechar { top:calc(env(safe-area-inset-top,0px) + 13px); right:auto; left:16px; width:42px; height:42px; border-radius:50%; background-color:var(--surface-alt) !important; color:var(--text) !important; }
#modal-comunidade .comunidade-fechar svg { width:22px; height:22px; stroke-width:2.4; }
#modal-comunidade .comunidade-titulo-topo { padding:0 16px 0 70px; font-family:'Manrope','Inter',system-ui,sans-serif; font-size:22px; font-weight:800; letter-spacing:-.025em; line-height:1.15; color:var(--primary); }
#modal-comunidade .comunidade-titulo-topo:focus { outline:none; }

/* Ranking: lista dentro de um cartão com borda (como a lista do Histórico) */
.comunidade-ranking { --gutter:16px; margin:14px 16px 8px; padding:0; overflow:hidden; border:1px solid var(--border); border-radius:20px; background:var(--surface); }
.comunidade-ranking .comunidade-ranking-titulo { padding:16px var(--gutter) 2px; color:var(--text); font-size:16px; font-weight:800; letter-spacing:-.01em; }
.comunidade-ranking .comunidade-ranking-cabecalho { padding-top:6px; padding-bottom:10px; border-bottom:1px solid var(--border); font-size:11px; font-weight:700; }
.comunidade-ranking .comunidade-ranking-item:last-child { border-bottom:0; }
.comunidade-ranking .comunidade-ranking-pos { font-size:15px; font-weight:800; }
.comunidade-ranking .comunidade-ranking-item.top .comunidade-ranking-pos { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; color:#2E1F17; font-size:14px; }
.comunidade-ranking .comunidade-ranking-item.top:nth-child(3) .comunidade-ranking-pos { background:#E7B65C; }
.comunidade-ranking .comunidade-ranking-item.top:nth-child(4) .comunidade-ranking-pos { background:#D5C7B0; }
.comunidade-ranking .comunidade-ranking-item.top:nth-child(5) .comunidade-ranking-pos { background:#D98A66; }
.comunidade-ranking .comunidade-ranking-info strong { font-size:15px; font-weight:800; }
.comunidade-ranking .comunidade-ranking-valor { color:var(--primary); font-size:14px; font-weight:800; }

/* Eventos e Notificações: cartão branco com borda, ícone em círculo e data em pílula */
.comunidade-grupo:has(> .comunidade-post.com-sistema) { padding:14px 16px 4px; border-bottom:0; }
.comunidade-post.com-sistema { padding:0; }
.comunidade-post.com-sistema .comunidade-aviso-card { margin:0 0 6px; padding:14px 16px 16px; border:1px solid var(--border); border-radius:20px; background:var(--surface); }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card { --aviso-bg:#20594D; --aviso-titulo:#FFFFFF; --aviso-texto:#F3EBDD; --aviso-pill:rgba(255,255,255,.14); --aviso-destaque:#F3EBDD; --aviso-destaque-texto:#20594D; border-color:var(--aviso-borda,#20594D); background:var(--aviso-bg); }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-titulo { color:var(--aviso-titulo,#FFFFFF); }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-titulo svg { background:rgba(255,255,255,.16); color:var(--aviso-texto,#F3EBDD); }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-texto { color:var(--aviso-texto,#F3EBDD); }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-sistema-data { background:var(--aviso-pill,rgba(255,255,255,.14)); color:var(--aviso-texto,#F3EBDD); }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-fixado-badge { background:var(--aviso-destaque,#F3EBDD); color:var(--aviso-destaque-texto,#20594D); }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-dourado { --aviso-bg:#FFF4CC; --aviso-borda:#D6A514; --aviso-titulo:#624800; --aviso-texto:#594713; --aviso-pill:#F3E4A9; --aviso-destaque:#D6A514; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-amarelo { --aviso-bg:#FFF9DB; --aviso-borda:#E0BD35; --aviso-titulo:#655600; --aviso-texto:#51470F; --aviso-pill:#F1E8B5; --aviso-destaque:#E0BD35; --aviso-destaque-texto:#3E3500; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-verde { --aviso-bg:#E7F5EB; --aviso-borda:#318454; --aviso-titulo:#185B36; --aviso-texto:#28563A; --aviso-pill:#D0E9D8; --aviso-destaque:#318454; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-azul { --aviso-bg:#EAF2FF; --aviso-borda:#3975C6; --aviso-titulo:#214F8A; --aviso-texto:#344E70; --aviso-pill:#D8E6FA; --aviso-destaque:#3975C6; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-vermelho { --aviso-bg:#FDEBE9; --aviso-borda:#C54B43; --aviso-titulo:#8B2D27; --aviso-texto:#6F3531; --aviso-pill:#F4D5D1; --aviso-destaque:#C54B43; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-roxo { --aviso-bg:#F2EAFE; --aviso-borda:#8152AE; --aviso-titulo:#5B347E; --aviso-texto:#57476A; --aviso-pill:#E3D6F1; --aviso-destaque:#8152AE; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-rosa { --aviso-bg:#FDEAF2; --aviso-borda:#C84D7D; --aviso-titulo:#8D3154; --aviso-texto:#6A4052; --aviso-pill:#F4D6E2; --aviso-destaque:#C84D7D; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-laranja { --aviso-bg:#FFF0E1; --aviso-borda:#CC6A25; --aviso-titulo:#884313; --aviso-texto:#694A32; --aviso-pill:#F5DEC8; --aviso-destaque:#CC6A25; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-turquesa { --aviso-bg:#E2F5F3; --aviso-borda:#27877E; --aviso-titulo:#17645D; --aviso-texto:#315B58; --aviso-pill:#CDE9E6; --aviso-destaque:#27877E; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-cinza { --aviso-bg:#F0F2F4; --aviso-borda:#687785; --aviso-titulo:#3F4C57; --aviso-texto:#4B5660; --aviso-pill:#E0E4E8; --aviso-destaque:#687785; --aviso-destaque-texto:#FFFFFF; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-preto { --aviso-bg:#272B2E; --aviso-borda:#111416; --aviso-titulo:#FFFFFF; --aviso-texto:#E7EAEC; --aviso-pill:#41474B; --aviso-destaque:#FFFFFF; --aviso-destaque-texto:#272B2E; }
.comunidade-post.com-sistema.com-aviso-sistema .comunidade-aviso-card.com-aviso-cor-branco { --aviso-bg:#FFFFFF; --aviso-borda:#D6DDE2; --aviso-titulo:#26323B; --aviso-texto:#46535D; --aviso-pill:#F0F3F5; --aviso-destaque:#E4E9ED; --aviso-destaque-texto:#26323B; }
.comunidade-post.com-sistema .comunidade-aviso-titulo { gap:10px; margin:0 0 10px; color:var(--text); font-size:16px; font-weight:800; letter-spacing:-.01em; line-height:1.25; }
.comunidade-post.com-sistema .comunidade-aviso-titulo svg { width:34px; height:34px; padding:8px; border-radius:50%; background:var(--primary-soft); color:var(--primary); }
.comunidade-post.com-sistema .comunidade-sistema-avatar { display:inline-flex; flex:0 0 34px; width:34px; height:34px; overflow:hidden; border-radius:50%; background:var(--primary-soft); }
.comunidade-post.com-sistema .comunidade-sistema-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.comunidade-post.com-sistema .comunidade-fixado-badge { flex:none; padding:4px 9px; border-radius:999px; background:var(--primary-soft); color:var(--primary); font-size:11px; font-weight:800; letter-spacing:.02em; }
.comunidade-post.com-sistema .comunidade-aviso-fixado { border-color:var(--primary); box-shadow:0 4px 16px rgba(34,83,72,.08); }
.comunidade-post.com-sistema .comunidade-sistema-data { padding:4px 10px; border-radius:999px; background:var(--surface-alt); color:var(--text-muted); font-size:12px; font-weight:700; }
.comunidade-post.com-sistema .comunidade-aviso-texto { color:var(--text-muted); font-size:15px; line-height:1.5; }
#modal-comunidade.notificacoes-abertas .comunidade-grupo:has(> .comunidade-post.com-sistema) { padding-top:5px; padding-bottom:0; }
#modal-comunidade.notificacoes-abertas .comunidade-post.com-sistema .comunidade-aviso-card { margin-bottom:0; padding-top:11px; padding-bottom:12px; }
#modal-comunidade.notificacoes-abertas .comunidade-post.com-sistema .comunidade-aviso-titulo { margin-bottom:5px; }
#modal-comunidade.notificacoes-abertas .comunidade-post.com-sistema .comunidade-acoes:empty { display:none; }
.comunidade-notificacoes-resumo { margin:10px 16px 24px; padding:14px 12px; border-top:1px solid var(--border); color:var(--text-muted); font-size:13px; font-weight:800; line-height:1.4; text-align:center; }

@media (max-width:480px) {
  .comunidade-ranking { margin-left:12px; margin-right:12px; --gutter:14px; }
  /* celular: "pedras" vai para baixo do nome e a coluna some do cabeçalho, sobra mais espaço para o nome */
  .comunidade-ranking .comunidade-ranking-cabecalho, .comunidade-ranking .comunidade-ranking-item { grid-template-columns:42px minmax(0,1fr) 78px; grid-template-areas:"pos perfil diam" "pos avaliacoes diam"; column-gap:8px; row-gap:0; }
  .comunidade-ranking .comunidade-ranking-cabecalho { grid-template-areas:none; }
  .comunidade-ranking .comunidade-ranking-cabecalho span:nth-child(3) { display:none; }
  .comunidade-ranking .comunidade-ranking-cabecalho span:nth-child(1) { text-align:center; margin:0 -4px; white-space:nowrap; }
  .comunidade-ranking .comunidade-ranking-cabecalho span:nth-child(2) { padding-left:6px; }
  .comunidade-ranking .comunidade-ranking-posicao { grid-area:pos; }
  .comunidade-ranking .comunidade-ranking-perfil { grid-area:perfil; }
  .comunidade-ranking .comunidade-ranking-avaliacoes { grid-area:avaliacoes; margin-top:-9px; padding-left:44px; font-size:12px; }
  .comunidade-ranking .comunidade-ranking-diamantes { grid-area:diam; }
  .comunidade-ranking .comunidade-ranking-info strong { font-size:15px; }
  .comunidade-grupo:has(> .comunidade-post.com-sistema) { padding-left:12px; padding-right:12px; }
}

/* Desktop: a área de trabalho usa o bege do site, com os cartões brancos por cima (como a Home) */
@media (min-width:960px) {
  #modal-comunidade.comunidade-modal { --bg:#FBF8F3; }
  :root[data-theme="dark"] #modal-comunidade.comunidade-modal { --bg:#1E1510; }
  #modal-comunidade .comunidade-titulo-topo { padding:0; }
  .comunidade-ranking { width:100%; max-width:none; margin-left:0; margin-right:0; }
  .comunidade-ranking-totais { margin-left:0; margin-right:0; }
  .comunidade-grupo:has(> .comunidade-post.com-sistema) { max-width:none; padding-left:0; padding-right:0; }
}

/* v44 — Ranking por quantidade de pedras (sem diamantes) + totais no topo */
.comunidade-ranking-totais { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:14px 16px 0; }
.comunidade-total { display:flex; flex-direction:column; align-items:center; gap:2px; padding:12px 6px; border:1px solid var(--border); border-radius:16px; background:var(--surface); text-align:center; }
.comunidade-total strong { color:var(--text); font-size:20px; font-weight:800; line-height:1.1; font-variant-numeric:tabular-nums; }
.comunidade-total span { color:var(--text-muted); font-size:12px; font-weight:600; }
@media (max-width:480px) { .comunidade-ranking-totais { margin-left:12px; margin-right:12px; } }
.comunidade-ranking .comunidade-ranking-cabecalho, .comunidade-ranking .comunidade-ranking-item { grid-template-columns:46px minmax(0,1fr) 104px; grid-template-areas:none; column-gap:10px; row-gap:0; }
.comunidade-ranking .comunidade-ranking-cabecalho span:nth-child(3) { display:block; text-align:right; }
.comunidade-ranking .comunidade-ranking-posicao, .comunidade-ranking .comunidade-ranking-perfil { grid-area:auto; }
  .comunidade-ranking .comunidade-ranking-avaliacoes { grid-area:auto; display:flex; align-items:baseline; justify-content:flex-end; gap:5px; margin:0; padding:0; white-space:nowrap; }
  .comunidade-ranking .comunidade-ranking-avaliacoes .comunidade-ranking-movimento { align-self:center; }
.comunidade-ranking .comunidade-ranking-valor { color:var(--primary); font-size:16px; font-weight:800; }
.comunidade-ranking .comunidade-ranking-unid { color:var(--text-muted); font-size:12px; }


/* ==========================================================================
   Celular/tablet (< 960px): sem abas. Ranking, Eventos e Notificações são abertos pelo menu de
   baixo e pelo sino do header; o topo é só o botão de voltar + o título da seção (como no mock).
   ========================================================================== */
@media (max-width:959px) {
  #modal-comunidade.comunidade-modal { --bg:#FBF8F3; }
  :root[data-theme="dark"] #modal-comunidade.comunidade-modal, .dark #modal-comunidade.comunidade-modal { --bg:#1E1510; }
  #modal-comunidade .comunidade-abas { display:none !important; }
  .comunidade-topo { border-bottom:0; }
  #modal-comunidade .comunidade-titulo-topo { color:var(--text); font-size:22px; }
}

/* Ranking, Eventos e Notificações usam o mesmo fundo da tela Início autenticada. */
#modal-comunidade.comunidade-modal { --bg:#FFFFFF; }
:root[data-theme="dark"] #modal-comunidade.comunidade-modal,
.dark #modal-comunidade.comunidade-modal { --bg:#1E1510; }

/* ==========================================================================
   v48 — Eventos com os exploradores (mock "Duostone — Eventos"): banner colorido em cada missão,
   avatares ilustrados, medalhas 1º/2º/3º e rostos no resumo da semana.
   ========================================================================== */
.ev-resumo { display:block; padding:16px; }
.ev-r1 { display:flex; align-items:center; gap:14px; }
.ev-r2 { display:flex; align-items:center; gap:10px; margin-top:14px; padding-top:14px; border-top:1px solid var(--ev-ring); font-size:12.5px; font-weight:600; }
.ev-faces { display:flex; }
.ev-face { display:block; flex:none; width:40px; height:40px; overflow:hidden; border:2px solid #fff; border-radius:50%; margin-left:-10px; box-sizing:border-box; }
.ev-face:first-child { margin-left:0; }
.ev-face img { display:block; width:100%; height:100%; object-fit:cover; }

.ev-banner { position:relative; display:flex; align-items:flex-end; justify-content:space-between; height:136px; padding:14px 0 0 16px; overflow:hidden; }
.ev-banner-txt { display:flex; flex-direction:column; flex:1 1 auto; align-self:stretch; justify-content:flex-end; min-width:0; max-width:190px; padding-bottom:14px; }
.ev-banner .ev-status { align-self:flex-start; margin-bottom:auto; background:rgba(255,255,255,.75); color:#2E1F17; }
.ev-banner .ev-status.urgente { color:#B0452A; }
.ev-banner .ev-status.ok { background:rgba(255,255,255,.85); color:#8A5F0A; }
.ev-banner h3 { margin:0; color:#2E1F17; font-size:18px; font-weight:800; letter-spacing:-.02em; line-height:1.2; }
.ev-banner p { margin:2px 0 0; color:#4A382C; font-size:12px; line-height:1.4; }
.ev-banner-img { display:block; flex:none; width:136px; height:136px; object-fit:cover; }
@media (max-width:360px) { .ev-banner { height:120px; } .ev-banner-img { width:112px; height:112px; } }

.ev-premio { justify-content:center; }
.ev-pessoa { grid-template-columns:24px 40px minmax(0,1fr) auto; }
.ev-pos { display:grid; width:24px; height:24px; place-items:center; justify-self:center; border-radius:50%; }
.ev-pos.m1 { background:#E8B95A; color:#2E1F17; }
.ev-pos.m2 { background:#D6C7AE; color:#2E1F17; }
.ev-pos.m3 { background:#D98B6A; color:#2E1F17; }
.ev-av { display:block; width:40px; height:40px; box-sizing:border-box; border:2px solid #fff; box-shadow:0 0 0 1px rgba(46,31,23,.10); }
.ev-av img { display:block; width:100%; height:100%; object-fit:cover; }
.ev-pessoa.eu .ev-av { box-shadow:0 0 0 2px var(--ev-accent); }
.ev-num { white-space:nowrap; }
.ev-falta { min-width:0; }

/* ==========================================================================
   v49 — Eventos com cards recolhidos (mock "Duostone — Eventos, cards recolhidos"):
   cada missão mostra só banner + rostos + "Ver ranking"; o placar abre ao tocar (um por vez).
   ========================================================================== */
.ev-hd { cursor:pointer; outline:none; -webkit-tap-highlight-color:transparent; }
.ev-hd:focus-visible { box-shadow:inset 0 0 0 2px var(--ev-accent); }
.ev-banner { height:104px; padding:0 0 0 14px; align-items:stretch; }
.ev-banner-txt { padding:12px 0; max-width:190px; }
.ev-banner h3 { font-size:17px; line-height:1.15; }
.ev-banner p { margin-top:3px; font-size:11.5px; line-height:1.35; }
.ev-banner-img { width:104px; height:104px; }
.ev-ft { display:flex; align-items:center; gap:8px; padding:10px 14px; }
.ev-fcs { display:flex; align-items:center; min-width:0; }
.ev-fa { display:block; flex:none; width:28px; height:28px; box-sizing:border-box; overflow:hidden; border:2px solid var(--ev-card); border-radius:50%; margin-left:-9px; }
.ev-fa:first-child { margin-left:0; }
.ev-fa img { display:block; width:100%; height:100%; object-fit:cover; }
.ev-mais { display:grid; flex:none; width:28px; height:28px; box-sizing:border-box; place-items:center; margin-left:-9px; border:2px solid var(--ev-card); border-radius:50%; background:var(--ev-card-alt); color:var(--text-muted); font-size:11px; font-weight:600; }
.ev-rot { display:flex; align-items:center; gap:4px; margin-left:auto; color:var(--ev-accent); font-size:12px; font-weight:600; }
.ev-rot svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; transition:transform .25s; }
.ev-card.aberto .ev-rot svg { transform:rotate(180deg); }
.ev-dt { display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s; }
.ev-card.aberto .ev-dt { grid-template-rows:1fr; }
.ev-dt > div { min-height:0; overflow:hidden; }
.ev-dti { border-top:1px solid var(--border); }
.ev-dt:not(:has(.ev-dti)) { display:none; }
.ev-card:not(.aberto) .ev-dt { visibility:hidden; transition:grid-template-rows .3s, visibility 0s .3s; }
@media (prefers-reduced-motion:reduce) { .ev-dt, .ev-rot svg { transition:none; } }