fix: redesign attributes as ultra-compact 2x3 grid for mobile

Completely redesigned the classic stats (STR, DEX, CON, INT, WIS, CHA)
section for mobile with 1/3 size reduction and vertical stack layout.

**CSS Changes (style.css:3510-3587):**
- Changed from vertical flex list to 2x3 CSS grid layout
- Reduced all dimensions by ~66% for ultra-compact mobile view:
  * Labels: 9px (was 12px)
  * Values: 14px (was 20px)
  * Buttons: 24x24px (was 36x36px)
  * Padding: 4px 6px (was 8px 10px)
  * Gaps: 2-4px (was 6-8px)
- Vertical stack layout within each stat box:
  * Row 1: Label (left) | Value (right)
  * Row 2: Minus button (left) | Plus button (right)
- Fixed button visibility:
  * Added explicit background, border, and color styles
  * Added display: flex !important to ensure rendering
  * Added hover and active states
- Fixed right-side cutoff:
  * Added 5px padding-right to stats grid
  * Adjusted margins for proper spacing
- Centered all elements using justify-self: center
- Removed conflicting @media (max-width: 768px) rule that enlarged buttons

**JavaScript Changes (index.js:518, 985-1011):**
- Created setupClassicStatsButtons() function with delegated event listeners
- Moved event handlers from renderUserStats() to setup function
- Used jQuery .on() delegation to persist across re-renders
- Prevents duplicate handlers and ensures buttons always work
- Called in initUI() during extension initialization

**Benefits:**
- Attributes take up 1/3 the vertical space on mobile
- No vertical overflow in mobile Stats tab
- All 6 attributes fit comfortably in 2x3 grid
- +/- buttons visible and properly aligned
- Buttons fully functional with delegation pattern
- Desktop layout completely unaffected (>1000px)

**Layout:**
```
┌────────────┐ ┌────────────┐
│ STR    13  │ │ DEX    16  │
│  -      +  │ │  -      +  │
└────────────┘ └────────────┘
┌────────────┐ ┌────────────┐
│ CON    14  │ │ INT    18  │
│  -      +  │ │  -      +  │
└────────────┘ └────────────┘
┌────────────┐ ┌────────────┐
│ WIS    13  │ │ CHA    15  │
│  -      +  │ │  -      +  │
└────────────┘ └────────────┘
```

index.js

@@ -515,6 +515,7 @@ async function initUI() {
     renderThoughts();
     updateDiceDisplay();
     setupDiceRoller();
+    setupClassicStatsButtons();
     setupSettingsPopup();
     addDiceQuickReply();
     setupPlotButtons();
@@ -978,6 +979,38 @@ function addDiceQuickReply() {
     }
 }
 
+/**
+ * Sets up event listeners for classic stat +/- buttons using delegation.
+ * Uses delegated events to persist across re-renders of the stats section.
+ */
+function setupClassicStatsButtons() {
+    if (!$userStatsContainer) return;
+
+    // Delegated event listener for increase buttons
+    $userStatsContainer.on('click', '.rpg-stat-increase', function() {
+        const stat = $(this).data('stat');
+        if (extensionSettings.classicStats[stat] < 20) {
+            extensionSettings.classicStats[stat]++;
+            saveSettings();
+            saveChatData();
+            // Update only the specific stat value, not the entire stats panel
+            $(this).closest('.rpg-classic-stat').find('.rpg-classic-stat-value').text(extensionSettings.classicStats[stat]);
+        }
+    });
+
+    // Delegated event listener for decrease buttons
+    $userStatsContainer.on('click', '.rpg-stat-decrease', function() {
+        const stat = $(this).data('stat');
+        if (extensionSettings.classicStats[stat] > 1) {
+            extensionSettings.classicStats[stat]--;
+            saveSettings();
+            saveChatData();
+            // Update only the specific stat value, not the entire stats panel
+            $(this).closest('.rpg-classic-stat').find('.rpg-classic-stat-value').text(extensionSettings.classicStats[stat]);
+        }
+    });
+}
+
 /**
  * SettingsModal - Manages the settings popup modal
  * Handles opening, closing, theming, and animations
@@ -2767,29 +2800,6 @@ function renderUserStats() {
 
     $userStatsContainer.html(html);
 
-    // Add event listeners for classic stat buttons
-    $('.rpg-stat-increase').on('click', function() {
-        const stat = $(this).data('stat');
-        if (extensionSettings.classicStats[stat] < 20) {
-            extensionSettings.classicStats[stat]++;
-            saveSettings();
-            saveChatData();
-            // Update only the specific stat value, not the entire stats panel
-            $(this).closest('.rpg-classic-stat').find('.rpg-classic-stat-value').text(extensionSettings.classicStats[stat]);
-        }
-    });
-
-    $('.rpg-stat-decrease').on('click', function() {
-        const stat = $(this).data('stat');
-        if (extensionSettings.classicStats[stat] > 1) {
-            extensionSettings.classicStats[stat]--;
-            saveSettings();
-            saveChatData();
-            // Update only the specific stat value, not the entire stats panel
-            $(this).closest('.rpg-classic-stat').find('.rpg-classic-stat-value').text(extensionSettings.classicStats[stat]);
-        }
-    });
-
     // Add event listeners for editable stat values
     $('.rpg-editable-stat').on('blur', function() {
         const field = $(this).data('field');