/* =====================================================================
   ÁGORA — folha de estilo
   =====================================================================
   MESMA PALETA DO PAINEL da Kairós Afiliados (copiada de conta/dashboard.php,
   variável a variável). A Ágora e o painel são a mesma casa: quem salta de um
   para o outro não pode sentir que mudou de produto.

   Estrutura do Orkut — comunidades em grelha, recados no perfil, gente à
   vista, caixas com título — mas com feitio de plataforma de 2026: branco,
   respiração, cantos macios, sombra ténue.

   DUAS TENTATIVAS JÁ REPROVADAS, não voltar a nenhuma:
    · escuro azul-noite + dourado (parecia outro produto);
    · Orkut literal com barras azuis e letra miúda (parecia de 2006).

   CONTRASTE (regra da casa, tema claro): cor de texto EXPLÍCITA em tudo.
   Nunca cinzento sobre branco abaixo de 4.5:1 — o --faint do painel já foi
   corrigido uma vez por causa disso, não repetir o erro aqui.

   REGRA: sempre que este ficheiro muda, SOBE o ?v= em _layout.php.
   ===================================================================== */

:root{
  /* --- estes valores são os do painel; se lá mudarem, mudam aqui --- */
  --canvas:#f7f8fa; --surface:#fff; --border:#e9eaf0; --border-soft:#f1f2f6;
  --ink:#111827; --body:#374151; --muted:#6b7280; --faint:#6b7280;
  --indigo:#5850ec; --indigo-deep:#4338ca; --indigo-soft:#eef2ff;
  --green:#047857; --green-soft:#ecfdf5; --amber:#b45309; --amber-soft:#fffbeb;
  --red:#b91c1c; --red-soft:#fef2f2;
  --radius:14px; --shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);

  /* --- nomes antigos, apontados para a paleta nova ---
     As vistas foram escritas com var(--texto), var(--cartao), var(--ouro)...
     Em vez de lhes mexer uma a uma (e arriscar falhar uma), reapontam-se
     aqui. É por isto que trocar de tema é trocar este bloco. */
  --fundo:var(--canvas); --fundo2:#fff;
  --cartao:var(--surface); --cartao2:#f4f5f8; --cartao3:#eceef3;
  --borda:var(--border); --borda2:#dcdee7;
  --texto:var(--ink); --medio:var(--body); --fraco:var(--muted);
  --ouro:var(--indigo); --ouro-claro:var(--indigo-deep); --ouro-escuro:var(--indigo-deep);
  --verde:var(--green); --vermelho:var(--red);
  --raio:var(--radius); --raio-p:10px; --sombra:var(--shadow);
  --topo:60px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--canvas); color:var(--body);
  font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
:focus-visible{outline:2px solid var(--indigo);outline-offset:2px;border-radius:8px}

/* ---------------------------------------------------------------- topo */
.ag-topo{
  position:sticky; top:0; z-index:50; height:var(--topo);
  background:var(--surface); border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:14px; padding:0 18px;
}
.ag-marca{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:-.025em;font-size:1.18rem;color:var(--ink)}
.ag-marca b{color:var(--indigo)}
.ag-marca small{color:var(--muted);font-weight:700;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase}
.ag-topo-nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.ag-icone{
  position:relative;width:38px;height:38px;border-radius:11px;
  display:grid;place-items:center;font-size:1.05rem;color:var(--muted);
  transition:background .16s,color .16s;
}
.ag-icone:hover{background:var(--canvas);color:var(--ink)}
.ag-icone.on{background:var(--indigo-soft);color:var(--indigo-deep)}
.ag-bolha{
  position:absolute;top:2px;right:2px;min-width:17px;height:17px;padding:0 5px;
  background:var(--indigo);color:#fff;border-radius:9px;
  font-size:.62rem;font-weight:800;display:grid;place-items:center;
  box-shadow:0 0 0 2px var(--surface);
}
.ag-chave{background:var(--amber-soft);box-shadow:inset 0 0 0 1px #fde68a;color:var(--amber)}
.ag-chave:hover{background:#fef3c7;color:var(--amber)}

/* ------------------------------------- faixa "põe uma foto" (insistente) */
.ag-faixa-foto{
  display:flex;align-items:center;gap:13px;
  max-width:1200px;margin:16px auto 0;padding:11px 16px;
  background:var(--amber-soft);border:1px solid #fde68a;border-radius:var(--radius);
}
.ag-faixa-foto:hover{background:#fef3c7}
.ag-faixa-av{flex:none;display:flex}
.ag-faixa-txt{flex:1;min-width:0;font-size:.85rem;color:#78350f;line-height:1.45}
.ag-faixa-txt b{color:var(--amber)}
.ag-faixa-btn{flex:none;padding:8px 15px;font-size:.8rem}
@media (max-width:660px){
  .ag-faixa-foto{margin:12px 12px 0;padding:10px 12px}
  .ag-faixa-txt b{display:block}
  .ag-faixa-txt{font-size:.79rem}
}

/* --------------------------------------------------------------- corpo */
.ag-wrap{max-width:1200px;margin:0 auto;padding:20px 18px 96px;display:grid;gap:20px}
.ag-3col{grid-template-columns:220px minmax(0,1fr) 300px}
.ag-2col{grid-template-columns:minmax(0,1fr) 300px}
.ag-1col{grid-template-columns:minmax(0,1fr);max-width:760px}

/* -------------------------------------------------------------- barras */
.ag-lado{position:sticky;top:calc(var(--topo) + 20px);align-self:start;display:grid;gap:14px}
.ag-menu{
  display:grid;gap:0;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;
}
.ag-menu a{
  display:flex;align-items:center;gap:11px;padding:11px 14px;
  color:var(--body);font-weight:600;font-size:.87rem;
  border-bottom:1px solid var(--border-soft);transition:background .16s,color .16s;
}
.ag-menu a:last-child{border-bottom:0}
.ag-menu a:hover{background:var(--canvas);color:var(--ink)}
.ag-menu a.on{background:var(--indigo-soft);color:var(--indigo-deep);font-weight:700}
.ag-menu span:first-child{font-size:1.02rem;width:20px;text-align:center}

/* ------------------------------------------------------------- cartões */
.ag-cartao,.ag-caixa{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);margin-bottom:14px;
}
.ag-cartao{padding:18px}
.ag-cartao:last-child,.ag-caixa:last-child{margin-bottom:0}
.ag-cartao h3{margin:0 0 5px;font-size:.95rem;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.ag-caixa{overflow:hidden}
.ag-caixa-topo{display:flex;align-items:center;gap:10px;padding:15px 18px 0}
.ag-caixa-topo b{font-size:.95rem;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.ag-caixa-topo a{margin-left:auto;font-size:.82rem;color:var(--indigo);font-weight:700}
.ag-caixa-topo a:hover{color:var(--indigo-deep)}
.ag-caixa-corpo{padding:13px 18px 18px}
.ag-cartao .sub,.sub{margin:0 0 12px;color:var(--muted);font-size:.82rem;line-height:1.55}
.sub a{color:var(--indigo);font-weight:600}

/* --------------------------------------------------------------- botão */
.ag-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 17px;border-radius:11px;font-weight:700;font-size:.86rem;
  background:var(--surface);color:var(--body);border:1px solid var(--border);
  box-shadow:var(--shadow);transition:background .16s,border-color .16s,transform .12s;
}
.ag-btn:hover{background:var(--canvas);border-color:#dcdee7}
.ag-btn:active{transform:scale(.975)}
.ag-btn-ouro{
  background:var(--indigo);color:#fff;border-color:var(--indigo);
  box-shadow:0 1px 2px rgba(88,80,236,.2),0 2px 8px rgba(88,80,236,.14);
}
.ag-btn-ouro:hover{background:var(--indigo-deep);border-color:var(--indigo-deep)}
.ag-btn-lg{padding:13px 24px;font-size:.93rem;width:100%}
button.ag-btn:disabled{opacity:.55;cursor:default}

/* ---------------------------------------------------------------- post */
.ag-post{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:20px;margin-bottom:14px;transition:border-color .16s;
}
.ag-post:hover{border-color:#dcdee7}
.ag-post-topo{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.ag-av{border-radius:50%;object-fit:cover;flex:none;background:var(--canvas)}
.ag-av-ini{
  position:relative;overflow:hidden;
  display:grid;place-items:center;font-weight:800;
  background:linear-gradient(140deg,var(--indigo),var(--indigo-deep));color:#fff;
}
/* A foto vai POR CIMA da inicial. Se não carregar, o onerror tira-a e o
   círculo com a letra fica à vista — nunca um ícone de imagem rasgada. */
.ag-av-f{
  position:absolute;inset:0;width:100%;height:100%;
  border-radius:50%;object-fit:cover;background:var(--canvas);
}
.ag-quem{min-width:0;flex:1}
.ag-quem b{display:block;font-size:.9rem;font-weight:700;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ag-quem b a:hover{color:var(--indigo)}
.ag-quem span{color:var(--muted);font-size:.77rem}
.ag-post h2{margin:0 0 9px;font-size:1.18rem;line-height:1.33;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.ag-post h2 a:hover{color:var(--indigo)}
.ag-post .corpo{color:var(--body);font-size:.93rem;line-height:1.7}
.ag-post .corpo p{margin:0 0 12px}
.ag-post .corpo h2,.ag-post .corpo h3,.ag-post .corpo h4{color:var(--ink);margin:22px 0 9px;line-height:1.3}
.ag-post .corpo a{color:var(--indigo);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.ag-post .corpo img{border-radius:var(--raio-p);margin:14px 0}
.ag-post .corpo blockquote{
  margin:14px 0;padding:10px 16px;border-left:3px solid var(--indigo);
  background:var(--indigo-soft);border-radius:0 var(--raio-p) var(--raio-p) 0;color:var(--body);
}
.ag-post .corpo ul,.ag-post .corpo ol{margin:0 0 12px;padding-left:22px}

/* ----------------------------------------------------- cartão de venda */
.ag-produto{
  display:flex;gap:14px;align-items:center;margin:16px 0 0;padding:14px;
  background:var(--amber-soft);border:1px solid #fde68a;border-radius:var(--radius);
  transition:background .16s;
}
.ag-produto:hover{background:#fef3c7}
.ag-produto img{width:56px;height:56px;border-radius:var(--raio-p);object-fit:cover;flex:none}
.ag-produto .txt{min-width:0;flex:1}
.ag-produto b{display:block;font-size:.88rem;line-height:1.35;margin-bottom:3px;color:var(--ink)}
.ag-produto span{color:var(--amber);font-size:.79rem;font-weight:700}

/* -------------------------------------------------------------- ações */
.ag-acoes{display:flex;align-items:center;gap:4px;margin-top:15px;padding-top:13px;border-top:1px solid var(--border-soft)}
.ag-acao{
  display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:10px;
  color:var(--muted);font-size:.83rem;font-weight:600;transition:background .16s,color .16s;
}
.ag-acao:hover{background:var(--canvas);color:var(--ink)}
.ag-acao.on{color:var(--indigo-deep);background:var(--indigo-soft)}
.ag-acao .em{display:inline-block;transition:transform .16s}
.ag-acao.on .em{transform:scale(1.14)}

/* ----------------------------------------------------------- etiquetas */
.ag-eti{
  display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;
  font-size:.72rem;font-weight:700;
  background:var(--canvas);color:var(--body);border:1px solid var(--border);
}
a.ag-eti:hover,button.ag-eti:hover{background:var(--indigo-soft);color:var(--indigo-deep);border-color:#c7d2fe}
.ag-eti-ouro{background:var(--amber-soft);color:var(--amber);border-color:#fde68a}
.ag-eti-verde{background:var(--green-soft);color:var(--green);border-color:#a7f3d0}

/* ------------------------------------------------------------- números */
.ag-nums{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ag-num{background:var(--canvas);border:1px solid var(--border);border-radius:12px;padding:12px 13px}
.ag-num b{display:block;font-size:1.32rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--ink)}
.ag-num span{color:var(--muted);font-size:.72rem;font-weight:600}
.ag-num.ouro b{color:var(--indigo)}

/* ----------------------------------------------------------- movimento */
.ag-mov{display:grid;gap:0;max-height:290px;overflow:hidden;position:relative}
.ag-mov::after{content:"";position:absolute;bottom:0;left:0;right:0;height:44px;
  background:linear-gradient(transparent,var(--surface));pointer-events:none}
.ag-mov-l{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:.81rem;color:var(--body);
  border-bottom:1px solid var(--border-soft)}
.ag-mov-l .p{width:7px;height:7px;border-radius:50%;background:var(--green);flex:none;
  box-shadow:0 0 0 0 rgba(4,120,87,.5);animation:ag-pulso 2.6s infinite}
@keyframes ag-pulso{0%{box-shadow:0 0 0 0 rgba(4,120,87,.35)}70%{box-shadow:0 0 0 7px rgba(4,120,87,0)}100%{box-shadow:0 0 0 0 rgba(4,120,87,0)}}
.ag-mov-l b{color:var(--ink);font-weight:700}
.ag-mov-l i{color:var(--muted);font-style:normal;margin-left:auto;font-size:.73rem;white-space:nowrap}

/* --------------------------------------------------------------- mural */
.ag-mural{display:flex;flex-wrap:wrap;gap:7px}
.ag-mural a{position:relative;display:block;transition:transform .16s}
.ag-mural a:hover{transform:translateY(-2px)}
.ag-mural .ag-av{width:38px;height:38px;border:2px solid var(--surface);box-shadow:var(--shadow)}
.ag-mural .band{position:absolute;bottom:-2px;right:-2px;font-size:.63rem;line-height:1}

/* --------------------------------------------------------- comunidades */
.ag-grelha-com{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:12px}
.ag-com{
  display:block;text-align:center;padding:16px 10px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);transition:border-color .16s,transform .14s;
}
.ag-com:hover{border-color:#c7d2fe;transform:translateY(-2px)}
.ag-com .ic{
  display:grid;place-items:center;width:52px;height:52px;margin:0 auto 10px;
  font-size:1.55rem;border-radius:14px;background:var(--indigo-soft);border:1px solid #e0e7ff;
}
.ag-com b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:.83rem;font-weight:700;color:var(--ink);line-height:1.35}
.ag-com small{display:block;color:var(--muted);font-size:.72rem;margin-top:4px}
.ag-com-cabeca{display:flex;gap:16px;align-items:flex-start}
.ag-com-cabeca .ic{
  display:grid;place-items:center;width:72px;height:72px;flex:none;font-size:2.1rem;border-radius:18px;
  background:var(--indigo-soft);border:1px solid #e0e7ff;
}
.ag-com-cabeca h1{margin:0 0 6px;font-size:1.38rem;letter-spacing:-.025em;line-height:1.2;color:var(--ink)}
.ag-com-meta{margin:0 0 8px;font-size:.79rem;color:var(--muted)}
.ag-com-meta a{color:var(--indigo);font-weight:600}
.ag-com-desc{margin:0;font-size:.9rem;color:var(--body);line-height:1.6}
.ag-com-acoes{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--border-soft)}
.ag-com-linha{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border-soft);font-size:.85rem}
.ag-com-linha:last-of-type{border-bottom:0}
.ag-com-linha b{flex:1;min-width:0;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ag-com-linha:hover b{color:var(--indigo)}
.ag-com-linha small{color:var(--muted);font-size:.76rem}
.ag-conversa{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--border-soft)}
.ag-conversa:first-child{padding-top:0}
.ag-conversa:last-child{border-bottom:0;padding-bottom:0}
.ag-conversa .tit{display:block;font-size:.94rem;font-weight:700;line-height:1.35;margin-bottom:4px;color:var(--ink)}
.ag-conversa .tit:hover{color:var(--indigo)}
.ag-conversa p{margin:0 0 5px;font-size:.85rem;color:var(--body);line-height:1.5}
.ag-conversa small{color:var(--muted);font-size:.76rem}
.ag-icones{display:flex;flex-wrap:wrap;gap:7px}
.ag-icones label{cursor:pointer}
.ag-icones input{position:absolute;opacity:0;pointer-events:none}
.ag-icones span{
  display:grid;place-items:center;width:44px;height:44px;font-size:1.3rem;border-radius:12px;
  background:var(--canvas);border:1px solid var(--border);transition:all .16s;
}
.ag-icones span:hover{background:var(--indigo-soft)}
.ag-icones input:checked + span{background:var(--indigo-soft);border-color:var(--indigo);box-shadow:0 0 0 2px #c7d2fe}

/* ------------------------------------------------------------ progresso */
.ag-barra{height:7px;background:var(--canvas);border:1px solid var(--border);border-radius:99px;overflow:hidden;margin:8px 0 5px}
.ag-barra i{display:block;height:100%;background:linear-gradient(90deg,var(--indigo),var(--indigo-deep));border-radius:99px}

/* --------------------------------------------------------------- missão */
.ag-missao{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--border-soft)}
.ag-missao:last-child{border-bottom:0;padding-bottom:0}
.ag-missao .ic{font-size:1.28rem;flex:none;width:28px;text-align:center}
.ag-missao b{display:block;font-size:.87rem;margin-bottom:3px;color:var(--ink)}
.ag-missao p{margin:0;color:var(--muted);font-size:.79rem;line-height:1.5}
.ag-missao.feita{opacity:.5}
.ag-missao.feita b{text-decoration:line-through}

/* -------------------------------------------------------------- troféu */
.ag-trofeus{display:flex;flex-wrap:wrap;gap:10px}
.ag-trofeu{width:64px;text-align:center}
.ag-trofeu .disco{
  width:54px;height:54px;margin:0 auto 6px;border-radius:50%;display:grid;place-items:center;
  font-size:1.3rem;border:3px solid;
}
.ag-trofeu.bronze .disco{background:#fdf1e3;border-color:#b87333;color:#8a4f14}
.ag-trofeu.prata  .disco{background:#f3f4f6;border-color:#9ca3af;color:#4b5563}
.ag-trofeu.ouro   .disco{background:var(--amber-soft);border-color:#d97706;color:#92400e}
.ag-trofeu.diamante .disco{background:#e0f2fe;border-color:#0284c7;color:#075985}
.ag-trofeu small{display:block;font-size:.65rem;color:var(--muted);line-height:1.3}

/* --------------------------------------------------------------- selos */
.ag-selos{display:flex;flex-wrap:wrap;gap:7px}
.ag-selo{
  display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;
  font-size:.75rem;font-weight:700;background:var(--canvas);border:1px solid var(--border);color:var(--body);
}
.ag-selo.lendario{background:var(--amber-soft);border-color:#fcd34d;color:#92400e}
.ag-selo.epico{background:#f5f3ff;border-color:#c4b5fd;color:#5b21b6}
.ag-selo.raro{background:#e0f2fe;border-color:#7dd3fc;color:#075985}

/* ---------------------------------------------------------- partilhar */
.ag-partilha{display:flex;flex-wrap:wrap;gap:7px}
.ag-partilha a,.ag-partilha button{
  display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:11px;
  font-size:.82rem;font-weight:700;color:#fff;transition:filter .16s,transform .12s;
}
.ag-partilha a:hover,.ag-partilha button:hover{filter:brightness(1.1)}
.ag-partilha a:active,.ag-partilha button:active{transform:scale(.96)}

/* ------------------------------------------------------------- entrada */
.ag-heroi{text-align:center;padding:50px 20px 36px}
.ag-heroi h1{font-size:clamp(1.9rem,5vw,2.9rem);line-height:1.12;margin:0 0 16px;
  font-weight:800;letter-spacing:-.035em;color:var(--ink)}
.ag-heroi h1 em{font-style:normal;color:var(--indigo)}
.ag-heroi p{color:var(--body);font-size:1.04rem;max-width:570px;margin:0 auto 28px;line-height:1.62}

/* ---------------------------------------------------------------- form */
.ag-campo{
  width:100%;padding:11px 14px;border-radius:11px;background:var(--surface);
  border:1px solid #d7d9e3;color:var(--ink);font:inherit;
  transition:border-color .16s,box-shadow .16s;
}
.ag-campo:focus{border-color:var(--indigo);outline:none;box-shadow:0 0 0 3px rgba(88,80,236,.14)}
.ag-campo::placeholder{color:#9099a8}
label.ag-rot{display:block;font-size:.82rem;font-weight:700;color:var(--ink);margin:0 0 7px}

/* --------------------------------------------------------------- aviso */
.ag-aviso{
  background:var(--red-soft);border:1px solid #fecaca;border-radius:var(--radius);
  padding:15px;color:var(--red);font-size:.87rem;
}
.ag-caixa-alerta{
  background:var(--red-soft);border:1px solid #fecaca;border-radius:var(--radius);
  padding:15px;margin-bottom:14px;
}
.ag-caixa-alerta h3{margin:0 0 5px;font-size:.92rem;color:var(--red)}
.ag-caixa-alerta p{margin:0;font-size:.85rem;color:#991b1b;line-height:1.55}

/* --------------------------------------------------------------- vazio */
.ag-vazio{text-align:center;padding:40px 20px;color:var(--muted)}
.ag-vazio .em{font-size:2.3rem;display:block;margin-bottom:12px;line-height:1}
.ag-vazio h3{margin:0 0 6px;font-size:1.03rem;color:var(--ink);font-weight:800}
.ag-vazio p{margin-left:auto;margin-right:auto}
.ag-vazio .ag-btn{display:inline-flex}

/* ----------------------------------------------------------- consola */
.ag-abas{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.ag-abas a{padding:9px 14px;border-radius:11px;font-size:.83rem;font-weight:700;
  background:var(--surface);border:1px solid var(--border);color:var(--body);box-shadow:var(--shadow)}
.ag-abas a:hover{background:var(--canvas);color:var(--ink)}
.ag-abas a.on{background:var(--indigo-soft);color:var(--indigo-deep);border-color:#c7d2fe}
.ag-adm{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:15px 17px;margin-bottom:10px}
.ag-adm.morto{opacity:.6;background:var(--canvas)}
.ag-adm-topo{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:9px}
.ag-adm b{display:block;font-size:.89rem;margin-bottom:5px;color:var(--ink)}
.ag-adm p{margin:0;color:var(--body);font-size:.84rem;line-height:1.55;overflow-wrap:anywhere}
.ag-adm-pe{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:12px;
  padding-top:11px;border-top:1px solid var(--border-soft);color:var(--muted);font-size:.77rem}
.ag-adm-pe small{color:var(--muted);opacity:.8}

/* ----------------------------------------------------------- telemóvel */
.ag-baixo{display:none}
@media (max-width:980px){
  .ag-3col,.ag-2col{grid-template-columns:minmax(0,1fr)}
  .ag-lado.dir,.ag-lado.esq{display:none}
  .ag-baixo{
    display:flex;position:fixed;bottom:0;left:0;right:0;z-index:60;
    background:var(--surface);border-top:1px solid var(--border);
    padding:7px 4px calc(7px + env(safe-area-inset-bottom));
    box-shadow:0 -1px 3px rgba(16,24,40,.06);
  }
  .ag-baixo a{flex:1;display:grid;place-items:center;gap:3px;padding:5px 0;color:var(--muted);font-size:.63rem;font-weight:700}
  .ag-baixo a .em{font-size:1.28rem}
  .ag-baixo a.on{color:var(--indigo)}
}
@media (max-width:520px){
  .ag-wrap{padding:14px 12px 92px}
  .ag-post{padding:16px;border-radius:12px}
  .ag-post h2{font-size:1.06rem}
  .ag-caixa-topo{padding:14px 15px 0}
  .ag-caixa-corpo{padding:12px 15px 15px}
  .ag-cartao{padding:15px}
}

/* ----------------------------------------------------- selo "Equipa"
   Quem escreveu os primeiros textos da Praça foi a casa. Este selo é
   para que ninguém tome uma conta da equipa por um afiliado como ele —
   a Ágora bane quem finge ser outra pessoa, não podíamos ser os
   primeiros a fazê-lo. Discreto, mas legível: índigo sobre índigo-claro
   passa o contraste com folga. */
.ag-equipa,
.ag-quem b .ag-equipa,
.ag-conversa small .ag-equipa,
h1 .ag-equipa{
  display:inline-block;vertical-align:middle;margin-left:6px;
  padding:2px 7px;border-radius:999px;
  font-size:.63rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;
  background:var(--indigo-soft);color:var(--indigo-deep);border:1px solid #c7d2fe;
}
h1 .ag-equipa{font-size:.7rem}

/* =====================================================================
   TELEMÓVEL — correções medidas no aparelho, não a olho
   =====================================================================
   Apanhado a 375px com a Praça já a receber gente vinda do email: a
   página tinha 427px de largura num ecrã de 375, ou seja, arrastava-se
   para o lado. A culpa era da barra de cima — marca e ícones lado a lado
   sem poderem encolher —, e a barra de baixo (fixa, left:0/right:0) só
   parecia culpada porque herdava a largura já estragada.
   ===================================================================== */

/* Rede de segurança: mesmo que um dia entre cá dentro alguma coisa larga
   de mais (uma imagem, uma tabela, um embed), a página nunca anda para o
   lado. Não substitui arranjar a causa — apanha o que escapar. */
html,body{overflow-x:hidden;max-width:100%}

@media (max-width:520px){
  /* A barra de cima tem de poder encolher. `min-width:0` é o que falta a
     quase todo o flex que transborda: sem isso o filho recusa-se a ficar
     mais pequeno do que o conteúdo dele. */
  .ag-topo{padding:0 12px;gap:9px}
  .ag-marca{min-width:0;font-size:1.06rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .ag-topo-nav{gap:1px;min-width:0;flex-shrink:0}
  .ag-icone{width:36px;height:36px;font-size:1rem}

  /* Alvos para o dedo: 37px era pouco para carregar num 👍 em andamento. */
  .ag-acao{min-height:42px;padding-left:11px;padding-right:11px}
}

/* Ecrãs mesmo estreitos (iPhone SE e afins): a etiqueta "REDE" ao lado da
   marca é decoração, e decoração é a primeira coisa a sair. */
@media (max-width:380px){
  .ag-marca small{display:none}
  .ag-topo{gap:6px;padding:0 10px}
}