Review — end-to-end ✅ (clean approve, regression test pushed)

What this ships

#1167 — iOS Safari auto-zooms when an <input>, <textarea>, or <select> with font-size < 16px is focused, and doesn't un-zoom on blur. Cdaringe's screenshots showed the WebUI getting stuck zoomed-in after tapping any small input (sidebar search, rename, settings selects, dialog inputs).

11-line CSS-only fix at the end of static/style.css:

@media (hover:none) and (pointer:coarse){
  input,textarea,select{font-size:max(16px,1em)!important;}
}

Traced against upstream hermes-agent

Pure CSS in static/style.css. Zero agent-side coupling.

End-to-end trace

Media query targets touch-primary devices only

(hover:none) and (pointer:coarse) is the canonical "phone or tablet" detection. Won't match:

• Desktop with mouse/trackpad: hover:hover, pointer:fine → rule doesn't apply ✅
• Surface / iPad with attached keyboard reporting pointer:fine → rule doesn't apply (acceptable trade-off; their keyboards bypass the touch keyboard zoom anyway) ✅

This is the same media query the existing boot.js keydown handler uses for mobile Enter detection (test_mobile_layout.py:255-258) — consistent across the codebase.

max(16px, 1em) semantics

In a font-size declaration, 1em resolves to the parent's computed font-size. So:

• Small input nested inside body (16px default): max(16px, 16px) = 16px ✅
• Input inside a 14px parent: max(16px, 14px) = 16px ✅
• Input inside an 18px parent (user OS-level larger fonts): max(16px, 18px) = 18px ✅ (preserves user accessibility preference)

!important overrides inline styles

index.html:700, 733, 774 have inline style="font-size:13px" (settingsBotName, settingsPassword) and font-size:12px (previewEditArea). CSS specificity rules:

So font-size:max(16px,1em)!important in the stylesheet correctly overrides the font-size:13px/font-size:12px inline values. Verified by reading specificity, no inline !important in the affected elements.

Affected elements verified

Per the PR table — all the small inputs were below 16px on mobile:

What I pushed — a5ad154

Added test_touch_device_inputs_meet_zoom_threshold to tests/test_mobile_layout.py which asserts the new media query exists with the right shape:

pattern = re.compile(
    r'@media\s*\(hover:none\)\s*and\s*\(pointer:coarse\)\s*\{[^}]*'
    r'input\s*,\s*textarea\s*,\s*select\s*\{[^}]*'
    r'font-size:\s*max\(\s*16px',
    re.DOTALL,
)

This locks the bug from regressing if a future per-element font-size tweak forgets to consider the touch-primary case. The existing test_composer_textarea_font_size_mobile only covers the composer; this new assertion covers the global rule across sidebar/select/dialog/onboarding fields.

CI re-ran green on a5ad154: 3.11 ✅, 3.12 ✅, 3.13 ✅.

Edge-case trace

Tests

• My new test (test_touch_device_inputs_meet_zoom_threshold): asserts the media query and rule shape. Passes.
• Existing 24 mobile layout tests: all pass (including the existing 16px composer assertion).
• Local full suite: 2596 passed, 47 skipped, 1 PR-unrelated pre-existing failure (macOS-only test_sprint3 quirk).
• CI on PR after my push: ✅ test (3.11), ✅ test (3.12), ✅ test (3.13).

Other audit — confirmed correct

• CSS placement: at end of style.css so the rule isn't shadowed by later more-specific rules — though !important would win regardless.
• No regression risk on desktop: the media query gate is robust; the rule simply doesn't apply.
• No layout flicker: max(16px, 1em) evaluates statically when the touch viewport breakpoint applies; no JS runtime cost.

Minor observations (non-blocking)

• The fix bumps font-size globally on mobile. Some tightly-spaced inputs (e.g. settings dropdowns sized for 12px) may now wrap or push other content slightly. This is the price of stopping auto-zoom; the issue explicitly calls out the trade-off as acceptable.
• iOS Safari select dropdowns use OS-rendered native UI for the option list, so the rule's effect is on the trigger text only. Still sufficient — zoom-on-focus triggers off the trigger element's font-size.
• !important is generally a code smell, but it's the right tool for a viewport-level zoom workaround that needs to override every existing per-element font-size declaration without rewriting them all.

Recommendation

Approved. Surgical 11-line CSS fix that closes #1167 with the canonical touch-primary media query. max(16px, 1em) correctly handles the user-accessibility-larger-fonts case. !important is justified here as the safe global override. No JS, no agent coupling, no desktop regression. Pushed a small regression test that locks the rule's shape so future restructuring can't silently break it. Parked at approval — ready for the release agent's merge/tag pipeline.