docs: Sprint 21 release notes, version v0.23, Docker localhost binding

- CHANGELOG: add v0.23 Sprint 21 entry (mobile + Docker)
- SPRINTS: Sprint 21 marked COMPLETED, footer updated
- index.html: version label v0.22 -> v0.23
- docker-compose.yml: bind to 127.0.0.1 by default (SEC-1 fix)
- README: add security note about Docker port binding

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

CHANGELOG.md

@@ -5,6 +5,38 @@
 
 ---
 
+## [v0.23] Sprint 21 -- Mobile Responsive + Docker
+*April 3, 2026 | 415 tests*
+
+### Features
+- **Mobile responsive layout (Issue #21).** Full mobile experience with
+  hamburger sidebar (slide-in overlay), bottom navigation bar (5-tab iOS
+  pattern), and files slide-over panel. Touch targets minimum 44px. Composer
+  positioned above bottom nav. Session clicks auto-close sidebar. Desktop
+  layout completely unchanged — all mobile elements hidden via `@media`.
+- **Docker support (Issue #7).** Dockerfile (`python:3.12-slim`), docker-compose.yml
+  with named volume for state persistence, optional `~/.hermes` mount for
+  agent features. Binds to `127.0.0.1` by default for security.
+
+### Bug Fixes (from review)
+- **CSS cascade broke mobile slide-in.** `position:relative` rules after the
+  media query overrode `position:fixed` on mobile. Wrapped in `@media(min-width:641px)`.
+- **mobileSwitchPanel() always reopened sidebar.** Chat tab now closes sidebar
+  instead of reopening it over the main chat area.
+- **Dockerfile missing pip install.** Added `pip install -r requirements.txt`.
+- **No .dockerignore.** Added exclusions for `.git`, `tests/`, `.env*`.
+- **docker-compose tilde expansion.** Changed `~/.hermes` default to
+  `${HOME}/.hermes` (Docker Compose doesn't shell-expand `~`).
+
+### Architecture
+- Mobile navigation functions in `boot.js`: `toggleMobileSidebar()`,
+  `closeMobileSidebar()`, `toggleMobileFiles()`, `mobileSwitchPanel()`.
+- `sessions.js`: `closeMobileSidebar()` called after session click.
+- 69 new CSS lines in `@media(max-width:640px)` block.
+- New files: `Dockerfile`, `docker-compose.yml`, `.dockerignore`.
+
+---
+
 ## [v0.22] Sprint 20 -- Voice Input + Send Button Polish
 *April 3, 2026 | 415 tests*
 
@@ -716,4 +748,4 @@ Three-panel layout: sessions sidebar, chat area, workspace panel.
 
 ---
 
-*Last updated: v0.22, April 3, 2026 | Tests: 415*
+*Last updated: v0.23, April 3, 2026 | Tests: 415*

README.md

@@ -60,6 +60,10 @@ docker run -d -p 8787:8787 -e HERMES_WEBUI_PASSWORD=your-secret -v ~/.hermes:/ro
 
 Session data persists in a named volume (`hermes-data`) across restarts.
 
+> **Note:** By default, Docker Compose binds to `127.0.0.1` (localhost only).
+> To expose on a network, change the port to `"8787:8787"` in `docker-compose.yml`
+> and set `HERMES_WEBUI_PASSWORD` to enable authentication.
+
 ---
 
 ## What start.sh discovers automatically

SPRINTS.md

@@ -1,6 +1,6 @@
 # Hermes Web UI -- Forward Sprint Plan
 
-> Current state: v0.22 | 415 tests | Daily driver ready
+> Current state: v0.23 | 415 tests | Daily driver ready
 > This document plans the path from here to two targets:
 >
 > Target A: 1:1 feature parity with the Hermes CLI (everything you can do from the
@@ -421,16 +421,36 @@ UX was a low-effort high-impact polish opportunity that pairs naturally.
 
 ---
 
-## Sprint 21 -- Mobile Responsive (PLANNED)
+## Sprint 21 -- Mobile Responsive + Docker (COMPLETED)
 
-**Theme:** A genuinely good mobile experience, not just responsive CSS.
+**Theme:** Mobile experience + containerized deployment.
+
+**Why now:** Issue #21 (mobile) was the most-requested UX gap. Issue #7 (Docker)
+enables deployment beyond localhost. Both were achievable without new dependencies.
+
+### Track A: Bugs (from review)
+- **CSS cascade broke mobile slide-in.** `position:relative` after the media query
+  overrode `position:fixed`. Wrapped in `@media(min-width:641px)`.
+- **mobileSwitchPanel() always reopened sidebar.** Chat tab now closes it.
+- **Dockerfile missing pip install.** Container failed on startup.
+- **No .dockerignore.** `.git`, `tests/`, `.env*` leaked into images.
+- **docker-compose tilde expansion.** `~` doesn't expand in Compose defaults.
 
 ### Track B: Features
-- **Collapsible sidebar.** Hamburger menu replaces the always-visible sidebar.
+- **Hamburger sidebar.** Slide-in overlay on mobile, tap outside to close.
-- **Touch-friendly session list.** Tap to navigate, swipe gestures.
+- **Bottom navigation bar.** 5-tab iOS-style bar replaces sidebar tabs.
-- **Right panel as tab.** Files panel hidden by default, accessible via tab.
+- **Files slide-over.** Right panel opens as slide-over from right edge.
-- **Composer focus behavior.** Expands on focus, keyboard-aware.
+- **Touch targets.** Minimum 44px on all interactive elements.
-- Consider a separate mobile-optimized layout rather than just media queries.
+- **Docker support.** Dockerfile, docker-compose.yml, .dockerignore.
+
+### Track C: Architecture
+- Mobile nav functions in `boot.js`. Session click auto-closes sidebar.
+- 69 new CSS lines scoped to `@media(max-width:640px)`.
+- Desktop layout untouched — all mobile elements `display:none` by default.
+
+**Tests:** 0 new (CSS/DOM changes). Total: 415.
+**Hermes CLI parity impact:** Low
+**Claude parity impact:** High (Claude has mobile layout)
 
 ---
 
@@ -540,5 +560,5 @@ UX was a low-effort high-impact polish opportunity that pairs naturally.
 ---
 
 *Last updated: April 3, 2026*
-*Current version: v0.22 | 415 tests*
+*Current version: v0.23 | 415 tests*
-*Next sprint: Sprint 21 (Mobile Responsive)*
+*Next sprint: Sprint 22 (Multi-Profile Support)*

docker-compose.yml

@@ -4,7 +4,7 @@ services:
   hermes-webui:
     build: .
     ports:
-      - "8787:8787"
+      - "127.0.0.1:8787:8787"
     volumes:
       # Persist session data, settings, and projects across restarts
       - hermes-data:/data

static/index.html

@@ -13,7 +13,7 @@
 <body>
 <div class="layout">
   <aside class="sidebar">
-    <div class="sidebar-header"><div class="logo">H</div><div><h1 style="margin:0;font-size:15px;font-weight:700;letter-spacing:-.01em">Hermes</h1><div style="font-size:10px;color:var(--muted);opacity:.8;margin-top:1px">v0.22</div></div></div>
+    <div class="sidebar-header"><div class="logo">H</div><div><h1 style="margin:0;font-size:15px;font-weight:700;letter-spacing:-.01em">Hermes</h1><div style="font-size:10px;color:var(--muted);opacity:.8;margin-top:1px">v0.23</div></div></div>
     <div class="sidebar-nav">
       <button class="nav-tab active" data-panel="chat" data-label="Chat" onclick="switchPanel('chat')" title="Chat">&#128172;</button>
       <button class="nav-tab" data-panel="tasks" data-label="Tasks" onclick="switchPanel('tasks')" title="Tasks">&#128197;</button>