fix: add safety guards to font size change and show buttons on all screen sizes

- Add null checks and try/catch around fitAddon.fit() to prevent viewport errors
- Use requestAnimationFrame to ensure DOM is stable before fitting
- Remove isMobile condition from font size buttons in TerminalComponent
- Font size controls now visible on both mobile and desktop terminals

apps/web/src/components/terminal.tsx

@@ -266,9 +266,17 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
     const newSize = Math.max(MIN_FONT_SIZE, Math.min(MAX_FONT_SIZE, fontSize + delta));
     setFontSize(newSize);
     localStorage.setItem(FONT_SIZE_KEY, newSize.toString());
-    if (termRef.current) {
+    if (termRef.current && fitAddonRef.current) {
       termRef.current.options.fontSize = newSize;
-      fitAddonRef.current?.fit();
+      requestAnimationFrame(() => {
+        if (termRef.current && fitAddonRef.current) {
+          try {
+            fitAddonRef.current.fit();
+          } catch {
+            // Ignore fit errors during re-initialization
+          }
+        }
+      });
     }
   };
 
@@ -345,26 +353,22 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
           )}
         </div>
         <div className="terminal-header-right">
-          {isMobile && (
+          <button
-            <>
+            className="terminal-header-button"
-              <button
+            onClick={() => handleFontSizeChange(-1)}
-                className="terminal-header-button"
+            type="button"
-                onClick={() => handleFontSizeChange(-1)}
+            aria-label="Decrease font size"
-                type="button"
+          >
-                aria-label="Decrease font size"
+            A-
-              >
+          </button>
-                A-
+          <button
-              </button>
+            className="terminal-header-button"
-              <button
+            onClick={() => handleFontSizeChange(1)}
-                className="terminal-header-button"
+            type="button"
-                onClick={() => handleFontSizeChange(1)}
+            aria-label="Increase font size"
-                type="button"
+          >
-                aria-label="Increase font size"
+            A+
-              >
+          </button>
-                A+
-              </button>
-            </>
-          )}
           {onClose && (
             <button className="terminal-close" onClick={onClose} type="button">
               Close