/* ============================================================
   MURAL DE CONQUISTAS — Hall da Fama dos medalhistas olímpicos.
   Identidade Avance: roxo #5B1F7E + ouro #D4AF37 sobre o tema escuro do app.
   Lê um agregado SANITIZADO (nomes + medalhas, SEM CPF) → seguro para todos verem.
   ============================================================ */

.mural-wrap { --mural-roxo:#5B1F7E; --mural-roxo-claro:#8B5CF6; --mural-ouro:#D4AF37; --mural-ouro-claro:#F0CF6B;
  --mural-prata:#C0C0C0; --mural-bronze:#CD7F32; color:#EDE7F2; }

/* Cabeçalho / hero */
.mural-hero { text-align:center; padding:26px 18px 10px; border-radius:18px;
  background:#1f1029; border:1px solid rgba(212,175,55,.22); position:relative; overflow:hidden; }
.mural-hero .mural-kicker { display:inline-flex; align-items:center; gap:8px; color:var(--mural-ouro);
  font-size:11px; letter-spacing:.18em; text-transform:uppercase; font-weight:700; }
.mural-hero h2 { margin:8px 0 4px; font-size:26px; font-weight:800; color:#fff; letter-spacing:-.01em; }
.mural-hero p { margin:0; font-size:13px; color:#B49ECB; }
.mural-hero-emoji { font-size:30px; }

/* Pódio */
.mural-podio { display:flex; align-items:flex-end; justify-content:center; gap:14px; padding:20px 10px 8px; flex-wrap:wrap; }
.mural-degrau { flex:1 1 150px; max-width:190px; text-align:center; }
.mural-ava { width:56px; height:56px; margin:0 auto 8px; border-radius:50%; display:flex; align-items:center;
  justify-content:center; font-weight:800; font-size:17px; background:#33223f; color:#E8E8E8; border:2px solid #555; }
.mural-degrau.ouro .mural-ava { width:68px; height:68px; font-size:20px; background:#3a2710; color:var(--mural-ouro); border-color:var(--mural-ouro); }
.mural-degrau.prata .mural-ava { border-color:var(--mural-prata); color:#E8E8E8; }
.mural-degrau.bronze .mural-ava { border-color:var(--mural-bronze); color:#E0A06A; }
.mural-nome { font-size:13px; font-weight:700; color:#fff; line-height:1.2; }
.mural-degrau.ouro .mural-nome { font-size:15px; }
.mural-escola { font-size:11px; color:#A98BC4; margin-bottom:8px; }
.mural-base { border-radius:14px 14px 0 0; padding:12px 8px; background:#241430; border:1px solid #3a2a48; }
.mural-degrau.ouro .mural-base { padding:20px 8px; background:#2a1c0a; border-color:rgba(212,175,55,.5); }
.mural-degrau.prata .mural-base { border-color:rgba(192,192,192,.35); }
.mural-degrau.bronze .mural-base { border-color:rgba(205,127,50,.4); }
.mural-num { font-size:22px; font-weight:800; color:#fff; }
.mural-degrau.ouro .mural-num { font-size:30px; color:var(--mural-ouro); }
.mural-degrau.prata .mural-num { color:var(--mural-prata); }
.mural-degrau.bronze .mural-num { color:#E0A06A; }
.mural-num-lbl { font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#9a8aa8; }
.mural-pos { margin-top:6px; font-size:11px; font-weight:700; }
.mural-degrau.ouro .mural-pos { color:var(--mural-ouro); }
.mural-coroa { color:var(--mural-ouro); font-size:20px; margin-bottom:2px; }

/* Cartões de números */
.mural-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:10px; padding:14px 0; }
.mural-card { background:#1f1029; border-radius:12px; padding:13px 14px; border:1px solid rgba(255,255,255,.05); }
.mural-card .lbl { font-size:11px; color:#A98BC4; }
.mural-card .val { font-size:23px; font-weight:800; color:#fff; margin-top:3px; }
.mural-card .val.ouro { color:var(--mural-ouro); }

/* Tabela / listas */
.mural-bloco { background:#1b0e25; border:1px solid rgba(255,255,255,.06); border-radius:16px; overflow:hidden; }
.mural-bloco-head { padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.06);
  display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:#fff; }
.mural-bloco-head .ic { color:var(--mural-ouro); }
.mural-rank { list-style:none; margin:0; padding:6px; }
.mural-rank li { display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:10px; }
.mural-rank li:nth-child(odd) { background:rgba(255,255,255,.02); }
.mural-rank .rk { width:24px; text-align:center; font-weight:800; color:#8B6FB0; font-size:13px; }
.mural-rank .rk.top { color:var(--mural-ouro); }
.mural-rank .who { min-width:0; flex:1; }
.mural-rank .who b { display:block; font-size:13px; color:#fff; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mural-rank .who span { font-size:11px; color:#A98BC4; }
.mural-rank .meds { display:flex; gap:6px; flex-shrink:0; font-size:11px; font-weight:700; }
.mural-med { padding:2px 7px; border-radius:20px; }
.mural-med.o { background:rgba(212,175,55,.14); color:var(--mural-ouro-claro); }
.mural-med.p { background:rgba(192,192,192,.14); color:#d8d8d8; }
.mural-med.b { background:rgba(205,127,50,.16); color:#E0A06A; }

/* Feed de conquistas recentes */
.mural-feed { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px; padding:12px; }
.mural-feed-item { background:#241430; border:1px solid rgba(255,255,255,.06); border-radius:12px; padding:12px 14px; }
.mural-feed-item .pz { display:inline-block; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.06em;
  padding:2px 8px; border-radius:20px; margin-bottom:7px; }
.mural-feed-item .pz.o { background:rgba(212,175,55,.16); color:var(--mural-ouro-claro); }
.mural-feed-item .pz.p { background:rgba(192,192,192,.16); color:#d8d8d8; }
.mural-feed-item .pz.b { background:rgba(205,127,50,.16); color:#E0A06A; }
.mural-feed-item .pz.x { background:rgba(139,92,246,.16); color:#c4b5fd; }
.mural-feed-item .fn { font-size:13px; font-weight:700; color:#fff; }
.mural-feed-item .fo { font-size:11px; color:#B49ECB; margin-top:2px; }

/* Estado vazio / barra ADM */
.mural-vazio { text-align:center; padding:40px 20px; color:#A98BC4; }
.mural-vazio i { font-size:34px; color:#4a3560; margin-bottom:12px; display:block; }
.mural-admbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:12px 14px; margin-bottom:14px;
  background:#1f1029; border:1px dashed rgba(212,175,55,.3); border-radius:12px; }
.mural-admbar .info { font-size:12px; color:#B49ECB; margin-right:auto; }
.mural-btn-gerar { background:var(--mural-roxo); color:#fff; border:none; border-radius:10px; padding:9px 14px;
  font-size:12px; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; gap:7px; }
.mural-btn-gerar:hover { background:#6d2796; }
.mural-stamp { font-size:11px; color:#7c6890; }
