A phone, and how much of this could not be used on one

The sidebar was a 280px panel laid over the page below the phone breakpoint,
opened from first paint, with the only control that closed it underneath it --
and that control existed on /chat and on none of the seven other pages carrying
a sidebar, Settings included. It starts closed at that width now, slides, dims
the page behind it, and closes by tapping beside it, by Escape, or by its own
button, which is inside the drawer where it can be reached.

Everything a finger has to hit was 36px, or 28 for renaming a chat, every action
on a message and every panel's close button. Raising --control-h under a coarse
pointer is the only fix that reaches all forty of them, which is what that token
is for. The row and message actions were also hover-only, so on a phone they did
not exist at all.

Installing: the splash and the browser chrome follow the instance's theme rather
than always being Moria's near-black; there are screenshots, so the install
offer is a dialog rather than a one-line bar; a new release no longer takes over
a page somebody is reading; the notification badge is a silhouette rather than a
grey square; and a browser rotating its own subscription no longer ends
notifications for good.

Every request now says it is happening -- nothing did before, so anything slower
than a few milliseconds looked like a click that had not registered.

A chat can be archived. The column has been filtered on in four places since
folders arrived and written by nothing, which is what made it look built.

chat.css may contain media queries. The ban protected the composer toolbar from
being "fixed" with a breakpoint; that guarantee is asserted directly now, and
the old test would have passed a version of the file that wrapped the toolbar
without one.

scripts/shoot.py is the instrument all of this was found with: it renders a page
through TestClient into a real headless browser at a real size and refuses to
run if an asset URL was left pointing at testserver.

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

tests/test_chat.py

@@ -446,7 +446,15 @@ def test_an_archived_chat_inside_a_folder_is_not_listed(
     db.commit()
 
     page = client.get("/chat").text
-    assert "Mount Doom" not in page
+
+    # The original guarantee, and now a narrower assertion than "nowhere on the
+    # page": archiving puts a chat in the Archived group, so it IS on the page
+    # -- being able to find it again is the difference between archiving it and
+    # deleting it. What must not happen is it still showing inside its folder,
+    # which is the bug this test was written for.
+    before_archived = page.split('nav-group--archived', 1)[0]
+    assert "Mount Doom" not in before_archived
+    assert "Mount Doom" in page
     # And the folder must say so, rather than claiming to hold something.
     assert "Empty" in page
 
@@ -959,16 +967,89 @@ def test_the_agent_controls_shrink_rather_than_pushing_send_off_the_row(
         assert opens < html.index(control) < actions, control
 
 
-def test_the_chat_stylesheet_has_no_media_queries(client: TestClient):
-    """A stated design constraint, pinned so nobody 'fixes' a layout with a
-    breakpoint later. The composer fits at every width by saying which child
-    gives, not by rearranging itself at a threshold."""
+def _chat_css() -> str:
     from pathlib import Path
 
     import lembas
 
-    css = Path(lembas.__file__).parent / "web/static/css/chat.css"
-    assert "@media" not in css.read_text()
+    return (Path(lembas.__file__).parent / "web/static/css/chat.css").read_text()
+
+
+def test_the_composer_toolbar_can_never_wrap(client: TestClient):
+    """This is what the old blanket ban on `@media` in this file was protecting.
+
+    The toolbar used to wrap, and `.composer__actions` is last in the DOM with
+    `margin-left: auto` -- so the moment an agent chat added a connection, a
+    directory and a mode to the row, Send and the microphone were what dropped
+    to a second line. The fix was to say which child gives, not to rearrange the
+    row at a threshold, and the test that pinned it refused every media query in
+    the file so that nobody would "fix" a regression with a breakpoint instead.
+
+    The ban outlived its usefulness: a phone needs bigger targets and different
+    spacing, and refusing all width- and pointer-awareness here made the file
+    unable to say so. What it was *actually* protecting is asserted directly
+    now, which is both narrower and stronger -- the old test would have passed a
+    version of this file that wrapped the toolbar without a media query.
+    """
+    css = _chat_css()
+    toolbar = css.split(".composer__toolbar {", 1)[1].split("}", 1)[0]
+    assert "flex-wrap: nowrap" in toolbar
+
+    actions = css.split(".composer__actions {", 1)[1].split("}", 1)[0]
+    assert "flex: none" in actions
+    assert "flex-wrap" not in actions
+
+    # The one child allowed to give, and the reason the rest never have to.
+    context = css.split(".composer__context {", 1)[1].split("}", 1)[0]
+    assert "min-width: 0" in context
+    assert "overflow-x: auto" in context
+
+
+def _media_blocks(css: str) -> list[str]:
+    """Each `@media` block's own contents, by balancing braces.
+
+    Splitting on "@media" and taking what follows gives everything to the end of
+    the file, so a test written that way asserts about the whole stylesheet
+    while appearing to be about one block -- and fails on a rule three hundred
+    lines below the query.
+    """
+    blocks = []
+    for start in (i for i in range(len(css)) if css.startswith("@media", i)):
+        opened = css.index("{", start)
+        depth, cursor = 0, opened
+        while cursor < len(css):
+            if css[cursor] == "{":
+                depth += 1
+            elif css[cursor] == "}":
+                depth -= 1
+                if depth == 0:
+                    break
+            cursor += 1
+        blocks.append(css[opened + 1 : cursor])
+    return blocks
+
+
+def test_no_breakpoint_may_undo_the_toolbar_rule(client: TestClient):
+    """A media query in this file is allowed; one that lets the toolbar wrap or
+    lets the actions shrink is the original bug with a threshold in front of
+    it."""
+    for body in _media_blocks(_chat_css()):
+        assert "flex-wrap: wrap" not in body
+        assert ".composer__actions" not in body or "flex: none" in body
+
+
+def test_width_awareness_in_this_file_is_deliberate(client: TestClient):
+    """Every media query here carries a comment immediately above it.
+
+    The replacement for "none allowed": a breakpoint in this file has to say why
+    it exists, because the failure this file is shaped around is somebody
+    reaching for one instead of fixing the sizing.
+    """
+    css = _chat_css()
+    for index, line in enumerate(css.splitlines()):
+        if line.strip().startswith("@media"):
+            above = "\n".join(css.splitlines()[max(0, index - 12):index])
+            assert "*" in above, f"undocumented @media at line {index + 1}"
 
 
 def _user_id(db):