Improve Media Manager loading state visibility

- Removed the full-screen 'Connecting' overlay in MediaManager.html

- Implemented an inline loading spinner control

- Ensure log container is visible immediately during initialization so users can track progress

src/MediaManager.html

@@ -606,6 +606,17 @@
                 });
               }
 
+                  setLoadingState(isLoading) {
+                    if (isLoading) {
+                      this.grid.innerHTML = `
+                        <div style="grid-column: 1 / -1; text-align: center; padding: 40px; color: var(--text-secondary);">
+                            <div class="spinner" style="margin-bottom: 12px;"></div>
+                            <div>Connecting to systems...</div>
+                        </div>
+                      `;
+                    }
+                  }
+
                 logStatus(step, message, type = 'info') {
                   const container = this.logContainer;
                   const icon = type === 'success' ? '✅' : type === 'error' ? '❌' : '⏳';
@@ -798,9 +809,12 @@
                   // Reset State (this calls ui.updateSku which might show main-ui, so we re-toggle below if needed)
                   state.setSku(sku);
 
-                  // Enforce Loading State Again (in case setSku reset it)
+                  // Show Main UI immediately so logs are visible
-                  document.getElementById('loading-ui').style.display = 'block';
+                  document.getElementById('loading-ui').style.display = 'none';
-                  document.getElementById('main-ui').style.display = 'none';
+                  document.getElementById('main-ui').style.display = 'block';
+
+                  // Set Inline Loading State
+                  ui.setLoadingState(true);
 
                 if (!preserveLogs) {
                   document.getElementById('status-log-container').innerHTML = '';