fix: resolve mobile column layout gap

- Fixed huge white gap between formatting toolbar and editor in mobile column view (≤1080px)
- Fixed similar vertical layout gap in Presentation (PPT) mode on mobile
- Prevented closed workspace sidebar from consuming vertical space in column flex layout

Author: ijbo

README.md

@@ -459,6 +459,7 @@ TextAgent has undergone significant evolution since its inception. What started
 
 | Date | Commits | Feature / Update |
 |------|---------|-----------------|
+| **2026-03-16** | | 📱 **Mobile Layout Gap Fix** — eliminated a massive white gap that appeared between the toolbar and editor/presentation preview on mobile devices (≤1080px) by fixing a CSS flexbox bug where the closed workspace sidebar still consumed vertical height in column mode |
 | **2026-03-16** | | 🐛 **File-Switch State Reset** — fixed Run All button staying in "Stop" mode when switching .md files; fixed document variables leaking across files; new `resetFileSessionState()` in `workspace.js` aborts execution, force-resets `_running` flag, clears Run All button/progress bar/variables/exec context on every file switch; new `forceReset()` in `exec-controller.js` for immediate hard-reset of internal state |
 | **2026-03-15** | | 🚀 **Run All Engine & TTS UX** — pre-execution model readiness check auto-loads all required models (AI + Kokoro TTS) before block execution starts; detailed `[RunAll]` console logging with `console.table` block summary, per-block timing, variable resolution status (✅/⚠), and completion summary; Stop button now works during model loading via `M._execAborted` cross-module flag; `ensureModelReadyAsync()` rewritten with fail-fast on missing consent/API key; compact preflight dialog (960px, smaller fonts, all 8 columns visible); `waitForModelReady()` handles Kokoro TTS via `M.tts.isKokoroReady()`; TTS card split into 3 buttons: ▶ Run (generate audio only), ▷ Play (replay stored audio), 💾 Save (download WAV); new `M.tts.generate()`, `playLastAudio()`, `isKokoroReady()`, `initKokoro()` APIs; AI model fallback in `run-requirements.js` correctly defaults to text models |
 | **2026-03-14** | | 🔗 **AI Variable Controls** — new unified 🔗 Vars button on AI and Agent cards opens combined dropdown with 📤 Output Variable (text input to name the block's result) and 📥 Input Variables (checkbox picker listing declared `@var:` names from other blocks + runtime vars); variable chaining enables multi-block AI pipelines (`@var: research` → `@input: research`); declared variables appear before execution with "declared" badge; Doc Variables Panel (`{•} Vars` toolbar button) now shows ⏳ Pending Vars section for declared-but-unexecuted variables; `@var:` and `@input:` directives stripped from displayed prompt text |

changelogs/CHANGELOG-mobile-column-gap.md

@@ -0,0 +1,25 @@
+# Mobile Column Layout Gap — Fixed large white gap in mobile stacked view
+
+- Fixed: Huge white gap between formatting toolbar and editor in mobile column view (≤1080px)
+- Fixed: Similar vertical layout gap in Presentation (PPT) mode on mobile
+- Prevented closed workspace sidebar from consuming vertical space in column flex layout
+
+---
+
+## Summary
+Fixed a layout bug where the workspace sidebar pushed the editor pane down in mobile/tablet stacked (column) view even when closed, creating a massive white gap.
+
+---
+
+## 1. Workspace Sidebar Mobile Layout Fix
+**Files:** `css/workspace.css`
+**What:** Added `height: 0` to the default `.workspace-sidebar` state instead of relying purely on `width: 0`, and restored `height: auto` when `.open`.
+**Impact:** Prevents the closed sidebar from acting as an invisible vertical spacer in the `flex-direction: column` layout (triggering at ≤1080px), completely eliminating the giant whitespace below the toolbar in both Split and PPT modes.
+
+---
+
+## Files Changed (1 total)
+
+| File | Lines Changed | Type |
+|------|:---:|------|
+| `css/workspace.css` | +2 −1 | CSS Fix |

css/workspace.css

@@ -6,21 +6,24 @@
 .workspace-sidebar {
     position: relative;
     width: 0;
+    height: 0;
     min-width: 0;
     overflow: hidden;
     background: var(--header-bg);
     border-right: 1px solid var(--border-color);
     display: flex;
     flex-direction: column;
     transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1),
-        min-width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+        min-width 0.25s cubic-bezier(0.4, 0, 0.2, 1),
+        height 0.25s cubic-bezier(0.4, 0, 0.2, 1);
     z-index: 10;
     flex-shrink: 0;
 }
 
 .workspace-sidebar.open {
     width: 220px;
     min-width: 220px;
+    height: auto;
 }
 
 /* --- Sidebar Header --- */