Problem

The Dashboard chat interface has poor mobile responsiveness:

1. Page too small on mobile - Content is not properly scaled for small screens
2. Cannot scroll when landscape - The overflow: hidden on html/body prevents scrolling on mobile devices in landscape mode

Current Behavior

• On mobile (portrait): Page content is too small to read/interact
• On mobile (landscape): Page cannot be scrolled, cutting off content
• CSS has overflow: hidden on html, body, and #root elements

Expected Behavior

• Responsive layout that adapts to mobile screen sizes
• Scrollable content on all screen sizes and orientations
• Touch-friendly chat interface for mobile users

Environment

• Hermes Agent v0.14.0
• hermes-web-ui v0.5.22
• Tested on: Android mobile browser

Suggested Solutions

1. Add mobile-specific breakpoints for chat interface
2. Allow overflow scrolling on smaller screens
3. Consider a mobile-first responsive design approach
4. Add touch gestures support for chat navigation

CSS Issue

Current CSS prevents scrolling:

html {
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
}
body {
  overflow: hidden;
}
#root {
  overflow: hidden;
}

Should conditionally allow overflow on mobile:

@media (max-width: 768px) {
  html, body, #root {
    overflow: auto;
    height: auto;
  }
}