feat: cog menu for layout modes, mobile viewport fix, better separation

Header UX:
- Replace 5 icon buttons with single cog (gear) dropdown menu
- Cog menu shows all layout options with icons + labels
- Help and Close buttons stay visible outside the cog
- Active mode highlighted in green

Mobile fixes:
- Fix viewport overflow (100vw + max-width: 100vw)
- Stronger shadow (0 -4px 20px) for clear CV/chat separation
- Rounded corners (12px) on top for recognizable chat window
- Hide desktop-only modes (side panel, floating, full) from cog on mobile
- max-height: 50vh ensures CV always visible above

Dark mode:
- Cog menu styled for dark backgrounds

templates/partials/widgets/chat-widget.html

@@ -17,29 +17,40 @@
         <iconify-icon icon="mdi:robot-happy-outline"></iconify-icon>
         <span>{{if eq .Lang "es"}}Asistente del CV{{else}}CV Assistant{{end}}</span>
         <div class="chat-header-actions">
-            <button class="chat-mode-btn active" data-mode="" title="{{if eq .Lang "es"}}Compacto{{else}}Compact{{end}}" onclick="setChatSize('')">
-                <iconify-icon icon="mdi:message-outline"></iconify-icon>
-            </button>
-            <button class="chat-mode-btn" data-mode="chat-split" title="{{if eq .Lang "es"}}Mitad de pantalla{{else}}Half screen{{end}}" onclick="setChatSize('chat-split')">
-                <iconify-icon icon="mdi:arrow-split-horizontal"></iconify-icon>
-            </button>
-            <button class="chat-mode-btn" data-mode="chat-half" title="{{if eq .Lang "es"}}Panel lateral{{else}}Side panel{{end}}" onclick="setChatSize('chat-half')">
-                <iconify-icon icon="mdi:page-layout-sidebar-right"></iconify-icon>
-            </button>
-            <button class="chat-mode-btn" data-mode="chat-float" title="{{if eq .Lang "es"}}Flotante — arrastra para mover{{else}}Floating — drag to move{{end}}" onclick="setChatSize('chat-float')">
-                <iconify-icon icon="mdi:cursor-move"></iconify-icon>
-            </button>
-            <button class="chat-mode-btn" data-mode="chat-full" title="{{if eq .Lang "es"}}Pantalla completa{{else}}Full screen{{end}}" onclick="setChatSize('chat-full')">
-                <iconify-icon icon="mdi:arrow-expand-all"></iconify-icon>
-            </button>
-            <span class="chat-header-divider"></span>
+            <!-- Cog menu for layout modes -->
+            <div class="chat-cog-wrapper">
+                <button class="chat-mode-btn" title="{{if eq .Lang "es"}}Opciones{{else}}Options{{end}}" onclick="toggleChatCog()">
+                    <iconify-icon icon="mdi:cog"></iconify-icon>
+                </button>
+                <div id="chat-cog-menu" class="chat-cog-menu">
+                    <button class="chat-cog-item active" data-mode="" onclick="setChatSize(''); closeChatCog()">
+                        <iconify-icon icon="mdi:message-outline"></iconify-icon>
+                        {{if eq .Lang "es"}}Compacto{{else}}Compact{{end}}
+                    </button>
+                    <button class="chat-cog-item" data-mode="chat-split" onclick="setChatSize('chat-split'); closeChatCog()">
+                        <iconify-icon icon="mdi:arrow-split-horizontal"></iconify-icon>
+                        {{if eq .Lang "es"}}Mitad{{else}}Half screen{{end}}
+                    </button>
+                    <button class="chat-cog-item" data-mode="chat-half" onclick="setChatSize('chat-half'); closeChatCog()">
+                        <iconify-icon icon="mdi:page-layout-sidebar-right"></iconify-icon>
+                        {{if eq .Lang "es"}}Lateral{{else}}Side panel{{end}}
+                    </button>
+                    <button class="chat-cog-item" data-mode="chat-float" onclick="setChatSize('chat-float'); closeChatCog()">
+                        <iconify-icon icon="mdi:cursor-move"></iconify-icon>
+                        {{if eq .Lang "es"}}Flotante{{else}}Floating{{end}}
+                    </button>
+                    <button class="chat-cog-item" data-mode="chat-full" onclick="setChatSize('chat-full'); closeChatCog()">
+                        <iconify-icon icon="mdi:arrow-expand-all"></iconify-icon>
+                        {{if eq .Lang "es"}}Completo{{else}}Full screen{{end}}
+                    </button>
+                </div>
+            </div>
             <button class="chat-mode-btn"
                 title="{{if eq .Lang "es"}}Ayuda{{else}}Help{{end}}"
                 commandfor="chat-help-modal"
                 command="show-modal">
                 <iconify-icon icon="mdi:help-circle-outline"></iconify-icon>
             </button>
-            <span class="chat-header-divider"></span>
             <button class="chat-mode-btn" title="{{if eq .Lang "es"}}Cerrar{{else}}Close{{end}}" onclick="toggleChatPanel()">
                 <iconify-icon icon="mdi:close"></iconify-icon>
             </button>
@@ -142,6 +153,18 @@ function toggleChatPanel() {
     }
 }
 
+// Cog menu toggle
+function toggleChatCog() {
+    document.getElementById('chat-cog-menu').classList.toggle('chat-cog-open');
+}
+function closeChatCog() {
+    document.getElementById('chat-cog-menu').classList.remove('chat-cog-open');
+}
+// Close cog when clicking outside
+document.addEventListener('click', function(e) {
+    if (!e.target.closest('.chat-cog-wrapper')) closeChatCog();
+});
+
 // Show user message bubble immediately in chat
 var chatBubblePending = false;
 function appendUserBubble(text) {
@@ -228,9 +251,9 @@ function setChatSize(size) {
     panel.style.width = '';
     panel.style.height = '';
     if (size) panel.classList.add(size);
-    // Update active button
-    document.querySelectorAll('.chat-mode-btn[data-mode]').forEach(function(btn) {
-        btn.classList.toggle('active', btn.getAttribute('data-mode') === size);
+    // Update active item in cog menu
+    document.querySelectorAll('.chat-cog-item[data-mode]').forEach(function(item) {
+        item.classList.toggle('active', item.getAttribute('data-mode') === size);
     });
     // Enable/disable drag
     if (size === 'chat-float') {