    /* ---------- ARTILHARIA (público) ---------- */
    .art-list {
      background: var(--card);
      border: 1px solid var(--line);
      border-radius: 14px;
      overflow: hidden
    }

    .art-row {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 13px 18px;
      border-bottom: 1px dashed var(--line)
    }

    .art-row:last-child {
      border-bottom: 0
    }

    .art-medal {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      font-family: 'Bebas Neue', sans-serif;
      font-size: 15px;
      flex: none;
      background: var(--line);
      color: var(--label)
    }

    .art-row:nth-child(1) .art-medal {
      background: #D9A441;
      color: #fff
    }

    .art-row:nth-child(2) .art-medal {
      background: #B9C0C4;
      color: #fff
    }

    .art-row:nth-child(3) .art-medal {
      background: #C1673A;
      color: #fff
    }

    .art-avatar {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      font-family: 'Bebas Neue', sans-serif;
      font-size: 15px;
      color: #fff;
      flex: none
    }

    .art-info {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px
    }

    .art-info .nm {
      font-size: 14.5px;
      font-weight: 700;
      line-height: 1.2;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap
    }

    /* Nome do artilheiro escalando por posição — 1º maior que todos, 2º e
       3º um pouco menores cada, 4º já na mesma fonte do resto (só a cor
       diferencia). Cores reaproveitam as mesmas de .art-medal (ouro/prata/
       bronze), escurecidas com color-mix pra funcionar como TEXTO num fundo
       claro (a versão crua já é usada como fundo de círculo com texto
       branco em cima — direto como texto ficaria com contraste baixo); 4º
       usa --ac (a cor do campeonato) — não há uma 4ª cor de medalha no
       site, e assim continua se destacando sem precisar inventar um hex
       novo. */
    .art-row:nth-child(1) .art-info .nm {
      font-size: 22px;
      font-weight: 800;
      color: color-mix(in srgb, #D9A441 70%, black)
    }

    .art-row:nth-child(2) .art-info .nm {
      font-size: 18px;
      font-weight: 800;
      color: #8a8f93
    }

    .art-row:nth-child(3) .art-info .nm {
      font-size: 16px;
      color: #C1673A
    }

    .art-row:nth-child(4) .art-info .nm {
      color: var(--ac, var(--green))
    }

    .art-info .tm {
      display: flex;
      align-items: center;
      gap: 7px;
      font-size: 12.5px;
      color: var(--muted);
      font-weight: 600
    }

    .art-info .tm .crest {
      width: 21px;
      height: 23px
    }

    .art-goals {
      text-align: right;
      flex: none
    }

    .art-goals .g {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 22px;
      color: #C1673A
    }

    .art-goals .lbl {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 10px;
      color: var(--label);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .05em
    }
