<div class="grid grid-cols-4 gap-4">
  <div class="card p-5 text-center">
    <div class="text-4xl font-bold text-[#60a5fa]">{{.sessions}}</div>
    <div class="text-[#6b7280] text-sm mt-1">Sessions</div>
  </div>
  <div class="card p-5 text-center">
    <div class="text-4xl font-bold text-[#34d399]">{{.events}}</div>
    <div class="text-[#6b7280] text-sm mt-1">Events</div>
  </div>
  <div class="card p-5 text-center">
    <div class="text-4xl font-bold text-[#a78bfa]">{{.checkpoints}}</div>
    <div class="text-[#6b7280] text-sm mt-1">Checkpoints</div>
  </div>
  <div class="card p-5 text-center">
    <div class="text-4xl font-bold text-[#fbbf24]">{{.flags}}</div>
    <div class="text-[#6b7280] text-sm mt-1">Flags</div>
  </div>
</div>
