fix(dashboard): add CSS for header and container layout

Added missing CSS for dashboard v2 header and container:
- .rpg-dashboard-container: Flexbox column layout with gap
- .rpg-dashboard-header: Flexbox row with space-between
- .rpg-dashboard-header-left/right: Flex containers for button groups
- .rpg-dashboard-btn: Button styling with theme variables
- .rpg-dashboard-grid: Grid container styling

Also fixed dashboardManager.js to preserve template structure:
- Changed createContainerStructure() to query existing elements first
- Only creates elements if template didn't provide them
- Prevents clearing the entire container and losing the header

This fixes the issue where all components (header, buttons, widgets)
were stacking on top of each other due to missing layout CSS.

src/systems/dashboard/dashboardManager.js

@@ -190,22 +190,30 @@ export class DashboardManager {
      * Create dashboard container structure
      */
     createContainerStructure() {
-        // Clear container
+        // Check if tabs and grid containers already exist (from template)
-        this.container.innerHTML = '';
+        this.tabContainer = this.container.querySelector('#rpg-dashboard-tabs');
+        this.gridContainer = this.container.querySelector('#rpg-dashboard-grid');
 
-        // Create tab container
+        // If they don't exist, create them (fallback for legacy/minimal setup)
-        this.tabContainer = document.createElement('div');
+        if (!this.tabContainer) {
-        this.tabContainer.className = 'rpg-dashboard-tabs';
+            console.warn('[DashboardManager] Tab container not found in template, creating...');
-        this.tabContainer.id = 'rpg-dashboard-tabs';
+            this.tabContainer = document.createElement('div');
-        this.container.appendChild(this.tabContainer);
+            this.tabContainer.className = 'rpg-dashboard-tabs';
+            this.tabContainer.id = 'rpg-dashboard-tabs';
+            this.container.appendChild(this.tabContainer);
+        }
 
-        // Create grid container
+        if (!this.gridContainer) {
-        this.gridContainer = document.createElement('div');
+            console.warn('[DashboardManager] Grid container not found in template, creating...');
-        this.gridContainer.className = 'rpg-dashboard-grid';
+            this.gridContainer = document.createElement('div');
-        this.gridContainer.id = 'rpg-dashboard-grid';
+            this.gridContainer.className = 'rpg-dashboard-grid';
-        this.gridContainer.style.position = 'relative';
+            this.gridContainer.id = 'rpg-dashboard-grid';
-        this.gridContainer.style.minHeight = '600px';
+            this.gridContainer.style.position = 'relative';
-        this.container.appendChild(this.gridContainer);
+            this.gridContainer.style.minHeight = '600px';
+            this.container.appendChild(this.gridContainer);
+        }
+
+        console.log('[DashboardManager] Container structure ready');
     }
 
     /**

style.css

@@ -1040,6 +1040,65 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
     transform: scale(0.95);
 }
 
+/* ========================================
+   DASHBOARD V2 CONTAINER & HEADER STYLES
+   ========================================
+   Dashboard container and header layout
+   ======================================== */
+
+.rpg-dashboard-container {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+    width: 100%;
+}
+
+.rpg-dashboard-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0.5rem 0;
+    gap: 0.5rem;
+    flex-wrap: wrap;
+}
+
+.rpg-dashboard-header-left,
+.rpg-dashboard-header-right {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    flex-wrap: wrap;
+}
+
+.rpg-dashboard-btn {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.3rem;
+    padding: 0.4rem 0.6rem;
+    font-size: 0.75rem;
+    border: 1px solid var(--SmartThemeBorderColor);
+    background: var(--SmartThemeBlurTintColor);
+    color: var(--SmartThemeBodyColor);
+    border-radius: 6px;
+    cursor: pointer;
+    transition: all 0.2s;
+}
+
+.rpg-dashboard-btn:hover {
+    background: var(--SmartThemeQuoteColor);
+    transform: translateY(-1px);
+}
+
+.rpg-dashboard-btn i {
+    font-size: 0.85rem;
+}
+
+.rpg-dashboard-grid {
+    position: relative;
+    width: 100%;
+    min-height: 200px;
+}
+
 /* ========================================
    DASHBOARD V2 WIDGET STYLES
    ========================================