Nice mobile composer rework. Two genuine pressure points (titlebar safe-area in non-installed shells, composer crowding on phone widths) handled separately rather than mashed into one fix — that's the right shape.

A few observations from skimming the diff against current static/index.html, static/style.css, and static/panels.js:

• Titlebar fix is correctly scoped. Limiting top safe-area padding to (display-mode: standalone) / (display-mode: fullscreen) is the right call. Mobile Safari and Chrome on iOS report safe-area insets even in regular browser tabs where the browser chrome already accounts for the notch — the previous unconditional padding was double-counting. This should be invisible on desktop and shave the extra whitespace in plain mobile browser views.

• Progressive disclosure preserves touch targets. Folding workspace/model/reasoning/context behind an explicit config button instead of shrinking inline controls is the correct trade-off for narrow widths. 44px touch targets are a real iOS HIG floor; squeezing inline controls to fit would have created the worse class of bug (mis-taps).

• Dropdown anchoring is the subtle part. _positionComposerWsDropdown() now anchors to composerMobileWorkspaceAction when the mobile config panel is open, falling back to the desktop chip otherwise. That looks correct, but it's exactly the kind of code that drifts when someone adds another dropdown surface — worth calling out in a comment in the function so the next person doesn't accidentally re-anchor everything to the desktop chip.

• Compact context badge on the config button is a nice touch. Keeps the "am I about to blow my context window" signal visible on mobile without needing to expand the panel. Glanceable cost/usage matters more on phones because the user is more likely to be away from the keyboard when it suddenly matters.

A few things worth checking in review:

1. Backdrop / outside-tap to close the config panel. The diff adds aria-expanded and aria-controls (good), but I didn't see an outside-click or escape-key handler in the snippet I looked at. If the panel only closes via re-tapping the config button, mobile users will hit it as a papercut — they expect overlay-style panels to dismiss on outside tap.

2. Reasoning row is display:none by default. That's fine because not every model exposes reasoning, but make sure the show/hide logic checks the same condition as the desktop reasoning chip — otherwise the mobile panel will be silently inconsistent with the desktop composer for the same session.

3. Workspace label sync. syncWorkspaceDisplays() now writes to both composerLabel and mobileLabel. Both are gated on S._bootReady to avoid the "No workspace" flash. Good — that's the same pattern the desktop chip uses, so the mobile path won't regress the boot-flicker fix from a few releases ago.

4. i18n strings for the new copy. Strings like "Workspace", "Model", "Reasoning", "Context" inside the new composer-mobile-config-kicker spans look hardcoded in HTML. The rest of the composer goes through data-i18n attributes. Worth migrating these to keys eventually so the mobile panel translates with the rest of the UI.

5. Test file added 474 lines. That's a meaningful chunk of regression coverage (tests/test_mobile_layout.py going from 42 passed to a larger count). Worth confirming the new asserts cover the dropdown re-anchor, the backdrop dismiss (if added), and the reasoning visibility condition — those are the bits most likely to break under future refactors.

Self-contained frontend change, no API or CLI surface touched, no hermes-agent dependency. Will defer merge to maintainer review.

Thanks for the detailed review — pushed a small follow-up in e500305 addressing the items you called out:

• added an inline comment on the mobile workspace dropdown anchoring so future edits don't accidentally re-anchor it to the desktop chip only
• added Escape-to-close support for the mobile config panel, including cleanup of workspace/model/reasoning dropdown state
• confirmed the reasoning chip sync path updates both desktop and mobile controls, and added regression coverage for that
• moved the new mobile panel kicker copy onto data-i18n keys with English fallback text preserved
• added targeted mobile layout tests for the anchoring, Escape behavior, reasoning sync, and i18n labels

Local verification passed:

python -m pytest tests/test_mobile_layout.py -q
# 46 passed

python -m pytest tests/test_reasoning_chip_btw_fixes.py tests/test_reasoning_chip_js_behaviour.py -q
# 28 passed

node --check static/ui.js
node --check static/panels.js
node --check static/i18n.js
git diff --check
# all passed

Thanks for this — the structure here is solid (scoped to @container composer-footer (max-width: 520px) + @media (max-width: 640px), tests added, CI green, desktop layout looks unaffected on inspection). Marking hold + ux because mobile-composer changes at this size (+918/-57 across 6 files including index.html/panels.js/ui.js/style.css) need a visual sign-off on real devices before we merge — that's a release-process rule we apply to all mobile UI refreshes, not a comment on the PR itself.

What we'll need before flipping to merge-queue:

1. Screenshots / short clip on a real phone (or 390×844 DevTools mobile preset) showing:
   • Composer at rest with the new config button visible
   • Config panel open with workspace / model / reasoning / context all reachable
   • The compact context badge in its 3 states (default / mid / high) — even synthetic
   • One full streaming send with a queued message, to confirm queue card insertion still respects pinning under the new layout
2. Confirmation that the new composer-mobile-config-panel doesn't appear on desktop at any width that the previous layout supported. I'd specifically like a 1024×768 and a 320×568 screenshot side-by-side so we can see the desktop chrome is identical to before and the panel only activates at narrow widths.
3. Behavior of _positionComposerWsDropdown() when both anchors exist — the new code anchors to #composerMobileWorkspaceAction when the panel is open, otherwise to the desktop chip. If the panel is open at a desktop width via debug toggling, the anchor switch could position the dropdown weirdly. Quick note that the panel .open class is only ever applied at narrow widths would resolve this.

Code-level notes (none blocking, but worth addressing in the same push):

• closeWsDropdown() now also clears mobileAction.classList.remove('active') — good. Same pattern is missing in any Esc-key dismissal path; if there isn't one, no action needed.
• The new :root{--app-titlebar-safe-top:0px;} + @supports (padding-top: env(safe-area-inset-top)) { @media (display-mode: standalone), (display-mode: fullscreen) { :root{--app-titlebar-safe-top:env(safe-area-inset-top,0px);} } } is exactly the right scoping. Nice.
• The .composer-workspace-chip{display:none!important;} hides the chip but keeps the wrapper for layout — confirm the wrapper has no rendered border/background at compact widths (otherwise you'll see a blank pill segment).
• When the config panel is open and the user opens the system file picker (workspace files) or sends a message, does the panel auto-close? Worth pinning that behavior in _renderQueueChips.

Once the screenshots are posted I'll re-review and flip to the merge queue. Thank you for the careful scoping with @container — that's the right way to do this.

Added visual validation for the mobile composer update.

The summary image covers the requested states:

• 390×844 mobile composer at rest with the config button visible
• 390×844 mobile config panel open with workspace / model / reasoning / context controls reachable
• compact context badge states: default / mid / high
• queued message state with the queue card pinned above the composer
• 320×568 narrow viewport showing the config/tools button remains visible beside Send
• 1024×768 desktop sanity check showing the desktop composer layout remains unchanged

Also confirmed:

• the mobile config panel is scoped to narrow/mobile layouts
• 44px touch targets are preserved
• the panel auto-closes on send / workspace open / file attach

Released as part of v0.50.253 — thanks @starship-s!

This PR was merged into the v0.50.253 release batch via #1391 alongside two other contributor fixes (#1342 by @bergeouss). Full CHANGELOG entry: https://github.com/nesquena/hermes-webui/blob/master/CHANGELOG.md.

Pre-release verification:

• pytest: 3558 passing (up from 3507 baseline)
• run-browser-tests.sh + webui_qa_agent.sh: all green
• Comprehensive E2E browser walk (desktop + mobile) — every interactive surface verified
• Telegram screenshot approval gate: passed
• Opus Advisor pre-release review: APPROVED with 1 NEEDS-FIX (resolved) and 2 follow-ups (both applied in same release)
• Independent review by @nesquena: APPROVED with end-to-end behavioral harness verification

Closing this PR — the change is live on master and tagged.