fix: keep mobile tabs immediately reachable

src/App.tsx

@@ -728,6 +728,21 @@ function App() {
         </div>
       </header>
 
+      <nav className="tab-bar" aria-label="BuildPulse v0.1 views" role="tablist">
+        {TABS.map((tab) => (
+          <button
+            key={tab.key}
+            type="button"
+            role="tab"
+            aria-selected={tab.key === activeTab}
+            className={tab.key === activeTab ? 'tab active' : 'tab'}
+            onClick={() => setActiveTab(tab.key)}
+          >
+            {tab.label}
+          </button>
+        ))}
+      </nav>
+
       <section className="status-strip card">
         <div className="status-strip-row">
           <span className={`pill status-${backendMode === 'appwrite' ? 'healthy' : backendMode === 'connecting' ? 'connecting' : 'degraded'}`}>
@@ -785,21 +800,6 @@ function App() {
         </div>
       </section>
 
-      <nav className="tab-bar" aria-label="BuildPulse v0.1 views" role="tablist">
-        {TABS.map((tab) => (
-          <button
-            key={tab.key}
-            type="button"
-            role="tab"
-            aria-selected={tab.key === activeTab}
-            className={tab.key === activeTab ? 'tab active' : 'tab'}
-            onClick={() => setActiveTab(tab.key)}
-          >
-            {tab.label}
-          </button>
-        ))}
-      </nav>
-
       <div className="quick-actions card">
         <button type="button" className="ghost" onClick={() => setActiveTab('functionalities')}>
           Show Functionalities