feat(dashboard): implement smart auto-layout with expansion and better defaults

This commit implements 5 major improvements to the dashboard layout system:

**1. Improved Default Layout (defaultLayout.js)**
- Changed from 2 tabs to 3 tabs for better organization:
  - Tab 1 (Status): User widgets only (userInfo, userStats, userMood, userAttributes)
  - Tab 2 (Scene): Scene widgets + characters (calendar, weather, temp, clock, location, presentCharacters)
  - Tab 3 (Inventory): Full inventory widget
- Cleaner separation prevents cramming all widgets on one tab

**2. Widget Max Size Limits (widget definition files)**
- Added maxAutoSize property to all widgets (enforced only during auto-arrange):
  - Info widgets (calendar, weather, temp, clock): { w: 2, h: 3 }
  - Location: { w: 3, h: 3 }
  - presentCharacters: { w: 3, h: 6 } (can expand significantly)
  - Inventory: { w: 3, h: 8 } (full tab)
- Prevents blind expansion while allowing intelligent space filling

**3. Smart Expansion Algorithm (gridEngine.js)**
- Added expansion pass after compaction in autoLayout():
  - Sorts widgets top-to-bottom, left-to-right
  - Tries to expand height first (fills vertical gaps)
  - Then tries to expand width (fills horizontal gaps)
  - Respects maxAutoSize limits from widget definitions
  - Only expands if no collision with other widgets
- Widgets now fill available space instead of staying at default sizes
- Example: presentCharacters expands from 2x3 to 3x6 when space available

**4. Auto-Reflow on Column Change (dashboardManager.js)**
- Modified onColumnsChange callback to auto-layout after column count changes
- When grid transitions (2→3 or 3→2), automatically reflo ws widgets
- Prevents overlap and optimizes for new column count
- User experience: seamless adaptation when console opens/closes

**5. Fixed Grid Height/Scrollbar CSS (style.css)**
- Added flex: 1, overflow-y: auto, min-height: 0 to .rpg-dashboard-grid
- Grid now properly fills available space in dashboard container
- Accounts for bottom buttons (manual update, settings)
- Prevents "fingernail of extra height" that caused scrollbars

**Technical Changes:**
- Passed widget registry to GridEngine for maxAutoSize lookups
- getWidgetMaxSize() helper looks up definitions from registry
- Moved registry initialization before GridEngine construction
- Grid now uses flexbox to fill available vertical space

**User-Facing Improvements:**
- Reset layout creates logical 3-tab structure from the start
- Auto-arrange expands widgets to fill available space intelligently
- Resizing window/console automatically reflows layout
- No more unwanted scrollbars from slight overflow

Fixes cramped layouts, underutilized space, and scrollbar issues.

src/systems/dashboard/dashboardManager.js

@@ -101,48 +101,36 @@ export class DashboardManager {
         // Create container structure
         this.createContainerStructure();
 
+        // Initialize Widget Registry (use provided registry or create new one)
+        this.registry = this.config.registry || new WidgetRegistry();
+
         // Initialize Grid Engine (columns calculated dynamically)
         this.gridEngine = new GridEngine({
             rowHeight: this.config.rowHeight,
             gap: this.config.gap,
             container: this.gridContainer,
+            registry: this.registry, // Pass registry for maxAutoSize lookups
             onColumnsChange: (newCols, oldCols) => {
                 console.log('[DashboardManager] Grid columns changed:', oldCols, '→', newCols);
 
-                // Fix widget dimensions when column count changes
-                // This prevents widgets from shrinking when grid switches between 2/3/4 columns
+                // Auto-reflow current tab to optimize for new column count
                 const currentTab = this.tabManager.getTab(this.currentTabId);
-                if (currentTab) {
-                    currentTab.widgets.forEach(widget => {
-                        // If widget was full-width in old grid, make it full-width in new grid
-                        if (widget.w === oldCols) {
-                            console.log(`[DashboardManager] Adjusting full-width widget ${widget.id}: w=${widget.w} → ${newCols}`);
-                            widget.w = newCols;
-                        }
-                        // If widget is wider than new grid, clamp it
-                        else if (widget.w > newCols) {
-                            console.log(`[DashboardManager] Clamping oversized widget ${widget.id}: w=${widget.w} → ${newCols}`);
-                            widget.w = newCols;
-                        }
-                        // If widget x position is out of bounds, reset to 0
-                        if (widget.x >= newCols) {
-                            console.log(`[DashboardManager] Resetting out-of-bounds widget ${widget.id}: x=${widget.x} → 0`);
-                            widget.x = 0;
-                        }
-                    });
+                if (currentTab && currentTab.widgets && currentTab.widgets.length > 0) {
+                    console.log(`[DashboardManager] Auto-reflowing ${currentTab.widgets.length} widgets for ${newCols} columns`);
+
+                    // Run auto-layout to reflow and expand widgets for new grid
+                    // This prevents overlap and optimizes space usage
+                    this.gridEngine.autoLayout(currentTab.widgets, { preserveOrder: true });
 
                     // Save changes
                     this.triggerAutoSave();
                 }
 
-                // Re-render all widgets with adjusted dimensions
+                // Re-render all widgets with new layout
                 this.renderAllWidgets();
             }
         });
 
-        // Initialize Widget Registry (use provided registry or create new one)
-        this.registry = this.config.registry || new WidgetRegistry();
-
         // Initialize Tab Manager with dashboard data structure
         // Create default tab if no tabs exist
         if (this.dashboard.tabs.length === 0) {