Draw the stat card without Tailwind

Plan step 36 (actions). <x-stat> renders data-md-stat with
data-md-stat-header/-value/-description/-extra; no class list.
stat.css draws the surface-container panel, the label-large header,
the value as an emphasized-headline-md hero with tabular figures, and
the body-small description. StatTest is rewritten on the hooks and
ComponentStylesheet.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9

resources/views/components/stat.blade.php

@@ -5,7 +5,9 @@
      headline with tabular figures, and a body-small `description`. The value counts up once on
      first appearance and again when it changes (`x-figure`), and rests under reduced motion.
      `icon` sits beside the title. The slot, if any, goes under the description — a progress bar
-     for a quota. --}}
+     for a quota.
+
+     Drawn by resources/css/components/stat.css from `data-md-stat`; no class list. --}}
 
 @props([
     'title' => null,
@@ -14,21 +16,21 @@
     'icon' => null,
 ])
 
-<div {{ $attributes->class('flex flex-col gap-1 rounded-corner-lg bg-surface-container p-4') }}>
-    <div class="flex items-center gap-2 type-label-lg text-on-surface-variant">
+<div data-md-stat {{ $attributes }}>
+    <div data-md-stat-header>
         @if ($icon)
-            <x-livewire-material::icon :name="$icon" optical="20" class="size-5" />
+            <x-livewire-material::icon :name="$icon" size="20" />
         @endif
         <span>{{ $title }}</span>
     </div>
 
-    <p class="type-emphasized-headline-md tabular-nums" x-data x-figure>{{ $value }}</p>
+    <p data-md-stat-value x-data x-figure>{{ $value }}</p>
 
     @if ($description)
-        <p class="type-body-sm text-on-surface-variant">{{ $description }}</p>
+        <p data-md-stat-description>{{ $description }}</p>
     @endif
 
     @if ($slot->isNotEmpty())
-        <div class="pt-2">{{ $slot }}</div>
+        <div data-md-stat-extra>{{ $slot }}</div>
     @endif
 </div>