fix: prevent app offset on mobile refresh - simplify keyboard handling

- Revert interactive-widget viewport meta (caused iOS layout shifts)
- Delay initial viewport height capture to let viewport stabilize
- Update initialViewportHeight on window resize (address bar changes)
- Remove visualViewport scroll handler (not needed, caused issues)
- Scope keyboard CSS to .modal.active only
- Use vh instead of dvh for more stable layout

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

CLAUDE.md

@@ -16,7 +16,7 @@ When user says "COM":
 1. Increment version in BOTH `package.json` AND `CLAUDE.md`
 2. Run: `git add -A && git commit -m "chore: bump version to X.XXXX" && git push && npm run build && systemctl --user restart claudeman-web`
 
-**Version**: 0.1452 (must match `package.json`)
+**Version**: 0.1453 (must match `package.json`)
 
 ## Project Overview
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "claudeman",
-  "version": "0.1452",
+  "version": "0.1453",
   "description": "The missing control plane for Claude Code - run 20 autonomous agents with real-time monitoring and session persistence",
   "type": "module",
   "main": "dist/index.js",

src/web/public/app.js

@@ -192,7 +192,6 @@ const KeyboardHandler = {
   isKeyboardVisible: false,
   keyboardHeight: 0,
   resizeHandler: null,
-  scrollHandler: null,
 
   /** Initialize keyboard detection */
   init() {
@@ -202,16 +201,16 @@ const KeyboardHandler = {
     const vv = window.visualViewport;
     if (!vv) return;
 
-    // Store initial height (update on orientation change)
-    this.initialViewportHeight = vv.height;
+    // Store initial height after a brief delay to let viewport stabilize
+    setTimeout(() => {
+      this.initialViewportHeight = window.visualViewport?.height || window.innerHeight;
+    }, 500);
 
-    // Create bound handlers for cleanup
+    // Create bound handler for cleanup
     this.resizeHandler = this.handleResize.bind(this);
-    this.scrollHandler = this.handleVisualViewportScroll.bind(this);
 
     // Listen for visualViewport resize (keyboard open/close)
     vv.addEventListener('resize', this.resizeHandler);
-    vv.addEventListener('scroll', this.scrollHandler);
 
     // Update initial height on orientation change
     window.addEventListener('orientationchange', () => {
@@ -219,7 +218,15 @@ const KeyboardHandler = {
         if (window.visualViewport) {
           this.initialViewportHeight = window.visualViewport.height;
         }
-      }, 200);
+      }, 300);
+    });
+
+    // Also update on regular resize (address bar hide/show)
+    window.addEventListener('resize', () => {
+      // Only update if keyboard is NOT visible (address bar change)
+      if (!this.isKeyboardVisible && window.visualViewport) {
+        this.initialViewportHeight = window.visualViewport.height;
+      }
     });
 
     // Focus event handling for scrolling inputs into view
@@ -244,15 +251,6 @@ const KeyboardHandler = {
     }
   },
 
-  /** Handle visualViewport scroll - keep fixed elements positioned on iOS */
-  handleVisualViewportScroll() {
-    const vv = window.visualViewport;
-    if (!vv || !this.isKeyboardVisible) return;
-
-    // Update CSS property for any elements that need to track viewport offset
-    document.documentElement.style.setProperty('--viewport-offset-top', `${vv.offsetTop}px`);
-  },
-
   /** Update keyboard visibility state */
   updateKeyboardState(visible, height) {
     if (this.isKeyboardVisible === visible && this.keyboardHeight === height) return;
@@ -260,14 +258,9 @@ const KeyboardHandler = {
     this.isKeyboardVisible = visible;
     this.keyboardHeight = height;
 
-    // Update CSS custom properties
+    // Update CSS custom property
     document.documentElement.style.setProperty('--keyboard-height', `${height}px`);
 
-    // Reset viewport offset when keyboard closes
-    if (!visible) {
-      document.documentElement.style.setProperty('--viewport-offset-top', '0px');
-    }
-
     // Toggle class for CSS targeting
     document.body.classList.toggle('keyboard-visible', visible);
 

src/web/public/index.html

@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, interactive-widget=resizes-content">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta name="description" content="Claude Code session manager with web interface">
   <meta name="theme-color" content="#0a0a0a">
   <title>Claudeman</title>

src/web/public/styles.css

@@ -7886,7 +7886,7 @@ kbd {
     scroll-margin-top: 80px;
   }
 
-  .keyboard-visible .modal-body {
+  .keyboard-visible .modal.active .modal-body {
     max-height: calc(60vh - var(--keyboard-height) / 2);
     overflow-y: auto;
   }
@@ -8417,15 +8417,15 @@ kbd {
   }
 
   /* Modal adjustments when keyboard is visible */
-  .keyboard-visible .modal-content {
+  .keyboard-visible .modal.active .modal-content {
     /* Don't take full height - resize with keyboard */
     height: auto;
-    max-height: calc(100dvh - var(--keyboard-height));
+    max-height: calc(100vh - var(--keyboard-height));
   }
 
-  .keyboard-visible .modal-body {
+  .keyboard-visible .modal.active .modal-body {
     /* Limit modal body height when keyboard up - make room for header/footer */
-    max-height: calc(50dvh - var(--keyboard-height) / 3);
+    max-height: calc(50vh - var(--keyboard-height) / 3);
     overflow-y: auto;
     -webkit-overflow-scrolling: touch;
   }
@@ -8436,7 +8436,6 @@ kbd {
    ============================================================================ */
 :root {
   --keyboard-height: 0px;
-  --viewport-offset-top: 0px;
 }
 
 .keyboard-visible .toolbar {