fix: Correct fixed button tooltip positioning and add mobile support

- Remove tooltip-left class from zoom and shortcuts buttons (all left-side buttons show tooltips on RIGHT)
- Add mobile CSS rules for fixed-btn tooltips to appear on TOP (like macOS Dock)
- Update button template comments to reflect correct positioning
- Mobile: All fixed buttons now show tooltips above (top position)
- Desktop: All left-side fixed buttons show tooltips on right

static/css/04-interactive/_tooltips.css

@@ -110,7 +110,7 @@
    MOBILE RESPONSIVE BEHAVIOR
    ============================================================================ */
 
-/* Mobile: Switch action bar tooltips to TOP position (like macOS Dock) */
+/* Mobile: Switch all tooltips to TOP position (like macOS Dock) */
 @media (max-width: 900px) {
     /* Action bar buttons get TOP tooltips on mobile */
     .action-btn.has-tooltip::before {
@@ -125,6 +125,19 @@
         transform: translateX(-50%) scale(1);
     }
 
+    /* Fixed buttons (left side) get TOP tooltips on mobile - like macOS Dock */
+    .fixed-btn.has-tooltip::before {
+        bottom: calc(100% + 8px); /* 8px gap above button */
+        left: 50%;
+        top: auto;
+        right: auto;
+        transform: translateX(-50%) scale(0.8);
+    }
+
+    .fixed-btn.has-tooltip:hover::before {
+        transform: translateX(-50%) scale(1);
+    }
+
     /* Back-to-top button keeps LEFT position on mobile */
     .back-to-top.has-tooltip.tooltip-left::before {
         right: calc(100% + 8px);

templates/partials/widgets/shortcuts-button.html

@@ -1,8 +1,8 @@
 {{define "shortcuts-button"}}
-<!-- Keyboard Shortcuts Button (Fixed Right) -->
+<!-- Keyboard Shortcuts Button (Fixed Left) -->
 <button
     id="shortcuts-button"
-    class="fixed-btn shortcuts-btn no-print has-tooltip tooltip-left"
+    class="fixed-btn shortcuts-btn no-print has-tooltip"
     onclick="document.getElementById('shortcuts-modal').showModal()"
     aria-label="{{if eq .Lang "es"}}Atajos de teclado{{else}}Keyboard shortcuts{{end}}"
     data-tooltip="{{if eq .Lang "es"}}Atajos de teclado (?){{else}}Keyboard shortcuts (?){{end}}">

templates/partials/widgets/zoom-toggle-button.html

@@ -1,8 +1,8 @@
 {{define "zoom-toggle-button"}}
-<!-- Zoom Toggle Button (Fixed Right, above shortcuts button) -->
+<!-- Zoom Toggle Button (Fixed Left, above shortcuts button) -->
 <button
     id="zoom-toggle-button"
-    class="fixed-btn zoom-toggle-btn no-print has-tooltip tooltip-left"
+    class="fixed-btn zoom-toggle-btn no-print has-tooltip"
     aria-label="{{if eq .Lang "es"}}Alternar control de zoom{{else}}Toggle zoom control{{end}}"
     data-tooltip="{{if eq .Lang "es"}}Control de zoom{{else}}Zoom control{{end}}"
     _="on mouseenter call highlightZoomControl(true)