Fix mobile horizontal fit with Fira Code font consistency

- Remove debug logging after confirming font fix works
- Fira Code provides consistent character width across platforms
- Horizontal fit now works reliably on real devices and emulators
- Minimum font size of 4px enables proper mobile fitting

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

web/public/tests/dom-terminal-test.html

@@ -380,7 +380,7 @@
             // ASCII art
             content += '\x1b[1;31m🎭 ASCII Art:\x1b[0m\r\n';
             content += '\x1b[33m    ╭────────────────────────────────────╮\r\n';
-            content += '\x1b[33m    │  \x1b[36m*\x1b[32m+\x1b[35m#\x1b[31mo \x1b[1;37mDOM Terminal Ready! \x1b[31mo\x1b[35m#\x1b[32m+\x1b[36m*\x1b[33m  │\r\n';
+            content += '\x1b[33m    │  \x1b[36m*\x1b[32m+\x1b[35m#\x1b[31mo \x1b[1;37mDOM Terminal Ready! \x1b[31mo\x1b[35m#\x1b[32m+\x1b[36m*\x1b[33m     │\r\n';
             content += '\x1b[33m    ╰────────────────────────────────────╯\x1b[0m\r\n\r\n';
 
             // Interactive instructions

web/src/client/components/terminal.ts

@@ -145,10 +145,7 @@ export class Terminal extends LitElement {
   }
 
   private measureCharacterWidth(): number {
-    if (!this.container) {
+    if (!this.container) return 8;
-      console.log('measureCharacterWidth: no container, returning default 8px');
-      return 8;
-    }
 
     // Create temporary element with same styles as terminal content, attached to container
     const measureEl = document.createElement('div');
@@ -167,16 +164,12 @@ export class Terminal extends LitElement {
     const testContent = testString.repeat(repeatCount).substring(0, this.cols);
     measureEl.textContent = testContent;
 
-    console.log(`measureCharacterWidth: measuring ${this.cols} chars with fontSize=${this.fontSize}px, testContent length: ${testContent.length}`);
-
     // Attach to container so it inherits all the proper CSS context
     this.container.appendChild(measureEl);
     const measureRect = measureEl.getBoundingClientRect();
     const actualCharWidth = measureRect.width / this.cols;
     this.container.removeChild(measureEl);
 
-    console.log(`measureCharacterWidth: measureRect.width=${measureRect.width}px, cols=${this.cols}, calculated charWidth=${actualCharWidth}px`);
-
     return actualCharWidth;
   }
 
@@ -189,8 +182,6 @@ export class Terminal extends LitElement {
       const containerHeight = this.container.clientHeight;
       const targetCharWidth = containerWidth / this.cols;
 
-      console.log(`Horizontal fit: container ${containerWidth}x${containerHeight}px, target charWidth=${targetCharWidth}px for ${this.cols} cols`);
-
       // Calculate fontSize needed for target character width
       // Use current font size as starting point and measure actual character width
       const currentCharWidth = this.measureCharacterWidth();
@@ -198,16 +189,12 @@ export class Terminal extends LitElement {
       const calculatedFontSize = this.fontSize * scaleFactor;
       const newFontSize = Math.max(4, Math.min(32, calculatedFontSize));
 
-      console.log(`Horizontal fit: currentCharWidth=${currentCharWidth}px, scaleFactor=${scaleFactor}, calculatedFontSize=${calculatedFontSize}px, clampedFontSize=${newFontSize}px`);
-
       this.fontSize = newFontSize;
 
       // Also fit rows to use full container height with the new font size
       const lineHeight = this.fontSize * 1.2;
       const fittedRows = Math.max(1, Math.floor(containerHeight / lineHeight));
 
-      console.log(`Horizontal fit: lineHeight=${lineHeight}px, fittedRows=${fittedRows}`);
-
       // Update both actualRows and the terminal's actual row count
       this.actualRows = fittedRows;
       this.rows = fittedRows;
@@ -216,16 +203,11 @@ export class Terminal extends LitElement {
       if (this.terminal) {
         this.terminal.resize(this.cols, this.rows);
       }
-
-      console.log(
-        `Horizontal fit: FINAL fontSize ${this.fontSize}px, ${this.cols}x${this.rows} in ${containerWidth}x${containerHeight}px`
-      );
     } else {
       // Normal mode: just calculate how many rows fit in the viewport
       const containerHeight = this.container.clientHeight;
       const lineHeight = this.fontSize * 1.2;
       this.actualRows = Math.max(1, Math.floor(containerHeight / lineHeight));
-      console.log(`Viewport fits ${this.actualRows} rows`);
     }
 
     this.requestUpdate();