Skeleton Table

                    <div class="w-full max-w-4xl mx-auto p-4">
  <div class="skeleton h-8 w-full bg-gray-200 animate-pulse rounded mb-4"></div>
  <div class="grid grid-cols-4 gap-4 mb-4">
    <div class="skeleton h-6 bg-gray-200 animate-pulse rounded"></div>
    <div class="skeleton h-6 bg-gray-200 animate-pulse rounded"></div>
    <div class="skeleton h-6 bg-gray-200 animate-pulse rounded"></div>
    <div class="skeleton h-6 bg-gray-200 animate-pulse rounded"></div>
  </div>
  
  <div class="space-y-3">
    <!-- Row 1 -->
    <div class="grid grid-cols-4 gap-4">
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
    </div>
    
    <!-- Row 2 -->
    <div class="grid grid-cols-4 gap-4">
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
    </div>
    
    <!-- Row 3 -->
    <div class="grid grid-cols-4 gap-4">
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
      <div class="skeleton h-5 bg-gray-200 animate-pulse rounded"></div>
    </div>
  </div>
</div>