/* MyMusicSoul — badge del reto de curadores (api/badges.json, Hugo 2026-10-25)
   Una medalla con estrella y el nivel del año, con el metal de cada nivel.
   Va en todas las páginas (api/brand.py, head): feed, comunidad, mensajes y
   cuenta usan la misma pieza.
     <span class="bdg nivel-oro">Oro 2026</span>          junto al alias
     <span class="bdg bdg--lg nivel-oro">Curador élite · Oro 2026</span>   en la cuenta */

.bdg{
  --b-claro:#F6E3D3; --b-borde:#D9A877; --b-tinta:#6B3F17; --b-metal:#B87333; --b-sombra:#7A4A1E;
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:5px;
  margin-left:6px; padding:1px 9px 1px 2px;
  border:1px solid var(--b-borde); border-radius:999px;
  background:linear-gradient(135deg, var(--b-claro) 0%, #fff 42%, var(--b-claro) 68%, var(--b-borde) 130%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75), 0 1px 2px rgba(35,38,43,.10);
  color:var(--b-tinta); font-size:11px; font-weight:700; line-height:16px; letter-spacing:.01em;
  vertical-align:middle; white-space:nowrap; cursor:default;
}
/* la medalla: disco de metal con una estrella blanca */
.bdg::before{
  content:''; flex:none; width:16px; height:16px; border-radius:50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 3.2l2.6 5.5 6 .8-4.4 4.1 1.1 5.9L12 16.6l-5.3 2.9 1.1-5.9-4.4-4.1 6-.8z'/%3E%3C/svg%3E") center/10px no-repeat,
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.85) 0 14%, var(--b-metal) 52%, var(--b-sombra) 100%);
  box-shadow:0 0 0 1.5px rgba(255,255,255,.85), 0 1px 2px rgba(35,38,43,.25);
}
/* un destello que cruza una vez al aparecer */
.bdg::after{
  content:''; position:absolute; top:-50%; bottom:-50%; left:-40%; width:30%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.75), transparent);
  transform:skewX(-18deg) translateX(-120%); pointer-events:none;
  animation:bdg-brillo 1.6s ease-out .4s 1 both;
}
@keyframes bdg-brillo{ to{ transform:skewX(-18deg) translateX(560%); } }
@media (prefers-reduced-motion:reduce){ .bdg::after{ animation:none; display:none; } }

.bdg.nivel-bronce  { --b-claro:#F6E3D3; --b-borde:#D9A877; --b-tinta:#6B3F17; --b-metal:#C07F45; --b-sombra:#7A4A1E; }
.bdg.nivel-plata   { --b-claro:#EEF0F3; --b-borde:#B8BFCB; --b-tinta:#3F4654; --b-metal:#A3ABB8; --b-sombra:#5B6372; }
.bdg.nivel-oro     { --b-claro:#FFF1C9; --b-borde:#E3B341; --b-tinta:#714800; --b-metal:#E0A81E; --b-sombra:#8A5A00; }
.bdg.nivel-platino { --b-claro:#E3F2F0; --b-borde:#8CC7C1; --b-tinta:#1C524E; --b-metal:#6FB3AC; --b-sombra:#1F5F5B; }
.bdg.nivel-diamante{ --b-claro:#E6EEFD; --b-borde:#8FB0F0; --b-tinta:#23458E; --b-metal:#6C93E8; --b-sombra:#2A4F9A; }
/* Leyenda: la única que cambia de fondo, con los colores de la marca y medalla de oro */
.bdg.nivel-leyenda {
  --b-borde:#5E4BB8; --b-metal:#E9C46A; --b-sombra:#8A5A00;
  background:linear-gradient(135deg, #7A63D6 0%, #9B87E6 45%, #1F6F6B 130%);
  color:#fff; text-shadow:0 1px 0 rgba(0,0,0,.2);
}

/* el grande de la cuenta */
.bdg--lg{ margin-left:0; gap:7px; padding:3px 14px 3px 3px; font-size:14px; line-height:22px; }
.bdg--lg::before{ width:22px; height:22px; background-size:13px, auto; }
