diff --git a/apps/web/src/components/terminal.tsx b/apps/web/src/components/terminal.tsx
index 8c3b236..63a5de5 100644
--- a/apps/web/src/components/terminal.tsx
+++ b/apps/web/src/components/terminal.tsx
@@ -163,11 +163,17 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
     term.loadAddon(new WebLinksAddon());
 
     term.open(terminalRef.current);
-    fitAddon.fit();
 
     // Connect WebSocket
     const ws = connectWebSocket();
 
+    // Fit after layout settles - use rAF to ensure DOM is ready
+    requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        fitAddon.fit();
+      });
+    });
+
     // Handle terminal input
     term.onData((data) => {
       if (ws.readyState !== WebSocket.OPEN) return;
diff --git a/apps/web/src/styles.css b/apps/web/src/styles.css
index f99fc42..5caf2ad 100644
--- a/apps/web/src/styles.css
+++ b/apps/web/src/styles.css
@@ -3074,6 +3074,8 @@ a.nav-item,
   min-height: 0;
   overflow: hidden;
   position: relative;
+  display: flex;
+  flex-direction: column;
 }
 
 /* Special Keys Strip */
@@ -3200,6 +3202,7 @@ a.nav-item,
   border-radius: 0;
   height: 100%;
   min-height: 100%;
+  width: 100%;
 }
 
 .terminal-wrapper.mobile .terminal-header {