<!doctype html>
<html lang="pt-BR">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>Ranking de Pontuação — 2026-08</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
  <style>
    body { background:#0b0f14; color:#e6edf3; }
    .card { background:#111827; border:1px solid #1f2937; border-radius:14px; padding:16px; box-shadow:0 6px 24px rgba(0,0,0,.3); }
    h1,h2,h3 { color:#e6edf3; }
    .muted { color:#9aa4b2; }
    .grid { display:grid; gap:16px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
    table { width:100%; }
    th, td { color:#e6edf3; }
    .tiny { font-size:12px; color:#9aa4b2; }
  </style>
</head>
<body>
<main class="container">
  <header class="grid">
    <div>
      <h1>Ranking de Pontuação — 2026-08        <small class="muted">(agosto de 2026)</small>
      </h1>
      <p class="tiny">
        Ranking baseado no total de DJRCOINS positivos acumulados no mês selecionado,
        somando lançamentos de todas as tabelas de ledger encontradas (djrcoins_ledger + djr_coins_ledger).
      </p>
    </div>
    <div>
      <a role="button" href="?m=2026-07">« julho de 2026</a>
      <a role="button" href="?m=2026-04">Hoje</a>
      <a role="button" href="?m=2026-09">setembro de 2026 »</a>
    </div>
  </header>

  <section class="grid">
    <article class="card">
      <h3>🏆 Top 3 do mês</h3>
              <p class="muted">Sem dados disponíveis.</p>
          </article>
  </section>

  <article class="card">
    <h3>Ranking completo do mês</h3>
    <table>
      <thead><tr><th>#</th><th>Participante</th><th>DJRCOINS no mês</th></tr></thead>
      <tbody>
              <tr><td colspan="3" class="muted">Nenhum dado para este mês.</td></tr>
            </tbody>
    </table>
  </article>
</main>
</body>
</html>
