feat: rediseño sidebar con paleta del login + responsive unificado

- Layout.php inyecta --brand y --brand-dark desde doc_color de BD
- Sidebar usa el mismo gradiente azul del login (brand-dark → brand)
- Círculos decorativos animados igual que el login
- Items activos: fondo blanco con texto brand (inverso al fondo)
- Hover: overlay blanco sutil + translateX(3px)
- Ancho unificado en --sidebar-width (270px)
- Breakpoint responsive consistente en 991.98px

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

core/Layout.php

@@ -33,6 +33,23 @@ class Layout
         $GLOBALS['_LAYOUT_TITLE'] = $title;
         $GLOBALS['_LAYOUT_ICON']  = $icon;
 
+        // Color de marca desde BD
+        $brandColor = '#1565c0';
+        try {
+            $row = Database::getInstance()->fetch("SELECT valor FROM lab_config WHERE clave = 'doc_color'");
+            if ($row && preg_match('/^#[0-9a-fA-F]{3,8}$/', $row['valor'])) {
+                $brandColor = $row['valor'];
+            }
+        } catch (\Throwable $_) {}
+
+        // Derivar color oscuro para gradiente
+        $hex = ltrim($brandColor, '#');
+        $brandDark = sprintf('#%02x%02x%02x',
+            max(0, hexdec(substr($hex,0,2)) - 40),
+            max(0, hexdec(substr($hex,2,2)) - 40),
+            max(0, hexdec(substr($hex,4,2)) - 40)
+        );
+
         // Detectar base URL (para assets relativos)
         $base = defined('APP_URL') ? rtrim(APP_URL, '/') : '';
         ?>
@@ -48,26 +65,23 @@ class Layout
     <!-- Font Awesome 6 -->
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
     <!-- Estilos del sistema -->
-    <link href="<?= $base ?>/assets/css/styles.css?v=12" rel="stylesheet">
+    <link href="<?= $base ?>/assets/css/styles.css?v=13" rel="stylesheet">
 
     <style>
-        /* Variables del tema ERP */
         :root {
-            --sidebar-width: 260px;
-            --header-height: 56px;
-        }
-        body {
-            overflow-x: hidden;
+            --brand:        <?= htmlspecialchars($brandColor, ENT_QUOTES, 'UTF-8') ?>;
+            --brand-dark:   <?= htmlspecialchars($brandDark,  ENT_QUOTES, 'UTF-8') ?>;
+            --sidebar-width: 270px;
         }
+        body { overflow-x: hidden; }
         .main-content {
             margin-left: var(--sidebar-width);
             min-height: 100vh;
             background: #f8f9fa;
         }
-        @media (max-width: 768px) {
+        @media (max-width: 991.98px) {
             .main-content { margin-left: 0; }
         }
-        /* Toast container */
         #toast-container {
             position: fixed;
             top: 1rem;