Allow forcing desktop mode from Ir al inicio button, rename creator return button to Biblioteca, and add user credits badges to creator screen

frontend/viewer.html

@@ -264,7 +264,7 @@
         <div style="display: flex; gap: 8px; align-items: center;">
             <button id="btnOpenCreator" style="background: #7c3aed; color: #fff; border: none; padding: 6px 12px; border-radius: 8px; font-weight: 700; font-size: 0.8rem; cursor: pointer; display: none;">➕ Crear</button>
             <button id="btnMobLogout" style="background: rgba(239, 68, 68, 0.12); border: 1px solid rgba(239, 68, 68, 0.25); color: #ef4444; padding: 6px 10px; border-radius: 8px; font-size: 0.8rem; font-weight: 700; cursor: pointer; display: none;">Salir</button>
-            <a href="/" class="btn-close">Ir al inicio</a>
+            <a href="/" class="btn-close" id="btnGoToDesktop">Ir al inicio</a>
         </div>
     </header>
 
@@ -296,10 +296,17 @@
     <div id="creator-container" style="display: none; flex-direction: column; max-width: 600px; margin: 0 auto; width: 100%;">
         <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;">
             <div>
-                <h2 style="font-family: 'Outfit', sans-serif; font-size: 1.5rem; font-weight: 700; margin: 0;">Crear Modelo 3D</h2>
-                <div style="font-size: 0.8rem; color: #ffeb3b; margin-top: 4px; font-weight: 600;">🪙 <span id="mobCreatorCreditsVal">-</span> Créditos disponibles</div>
+                <h2 style="font-family: 'Outfit', sans-serif; font-size: 1.4rem; font-weight: 700; margin: 0; margin-bottom: 6px;">Crear Modelo 3D</h2>
+                <div style="display: flex; align-items: center; gap: 8px; font-size: 0.75rem;">
+                    <span style="background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); padding: 4px 8px; border-radius: 20px; color: #fff; display: inline-flex; align-items: center; gap: 4px; font-weight: 600;">
+                        👤 <span id="mobCreatorUsername">-</span>
+                    </span>
+                    <span style="background: rgba(255, 235, 59, 0.05); border: 1px solid rgba(255, 235, 59, 0.2); padding: 4px 8px; border-radius: 20px; color: #ffeb3b; display: inline-flex; align-items: center; gap: 4px; font-weight: 600;">
+                        🪙 <span id="mobCreatorCredits">-</span> Créditos
+                    </span>
+                </div>
             </div>
-            <button id="btnBackToGalleryFromCreator" style="background: rgba(255,255,255,0.08); border: none; color: #fff; padding: 6px 12px; border-radius: 6px; font-size: 0.8rem; font-weight: 600; cursor: pointer;">Volver</button>
+            <button id="btnBackToGalleryFromCreator" style="background: rgba(124,58,237,0.15); border: 1px solid rgba(124,58,237,0.3); color: #c084fc; padding: 6px 12px; border-radius: 8px; font-size: 0.8rem; font-weight: 700; cursor: pointer;">📖 Biblioteca</button>
         </div>
 
         <!-- Creator Tabs -->
@@ -848,13 +855,15 @@
                         const mobUserCredits = document.getElementById('mobUserCredits');
                         const mobUsername = document.getElementById('mobUsername');
                         const mobCredits = document.getElementById('mobCredits');
-                        const mobCreatorCreditsVal = document.getElementById('mobCreatorCreditsVal');
+                        const mobCreatorUsername = document.getElementById('mobCreatorUsername');
+                        const mobCreatorCredits = document.getElementById('mobCreatorCredits');
                         const btnMobLogout = document.getElementById('btnMobLogout');
                         const btnOpenCreator = document.getElementById('btnOpenCreator');
                         
                         if (mobUsername) mobUsername.textContent = data.username;
                         if (mobCredits) mobCredits.textContent = data.credits || 0;
-                        if (mobCreatorCreditsVal) mobCreatorCreditsVal.textContent = data.credits || 0;
+                        if (mobCreatorUsername) mobCreatorUsername.textContent = data.username;
+                        if (mobCreatorCredits) mobCreatorCredits.textContent = data.credits || 0;
                         if (mobUserCredits) mobUserCredits.style.display = 'flex';
                         if (btnMobLogout) btnMobLogout.style.display = 'block';
                         if (btnOpenCreator) btnOpenCreator.style.display = 'block';
@@ -865,6 +874,14 @@
             }
         }
 
+        // Desktop redirection force setter
+        const btnGoToDesktop = document.getElementById('btnGoToDesktop');
+        if (btnGoToDesktop) {
+            btnGoToDesktop.addEventListener('click', () => {
+                sessionStorage.setItem('forceDesktop', 'true');
+            });
+        }
+
         // Logout handler
         const btnMobLogout = document.getElementById('btnMobLogout');
         if (btnMobLogout) {