An effort the model had never heard of

Reported from a live instance, on Bonsai: Jinja Exception: Unexpected reasoning effort high. Supported types are xhigh (default), medium, and low. Effort goes out two ways because no single field works, and the second -- chat_template_kwargs -- is not a parameter the server interprets. It is rendered into the model's own chat template, which does not ignore a value it does not know: it calls raise_exception, and the request dies before a token. So a perfectly ordinary option, drawn by this application in its own menu, took the whole reply with it. The vocabulary is per model and nobody agrees. gpt-oss takes low/medium/high. Bonsai takes low/medium/xhigh and refuses high. OpenAI has added minimal, xhigh and max at different points, and which of them a given model accepts varies again. One global tuple was going to be wrong for somebody whatever it held. A model carries its own list now, and the picker, the slash command and the request builder all read it. A column rather than a key in capabilities_json, for the reason context_length is one: that dict is rebuilt wholesale from the submitted checkboxes on every save. And it corrects itself. A refusal retries the reply once without the effort rather than losing it -- safe only because the template renders before any token, so nothing has been emitted, and there is a guard that keeps it that way -- then narrows the model's list. Bonsai's error states what it does take, so that is what gets stored. Note the parser bug, because it is a good one: "high" is a substring of "xhigh", so reading the advertised list by substring learned `high` from a sentence explaining that `high` is the problem. Whole words now, with a test named after it. /effort reads its levels off the picker instead of a second copy of the list kept in the browser. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
An admin area a phone could reach and not navigate
2026-09-25 21:20:06 +00:00 · 2026-09-25 19:27:39 +00:00 · 2026-09-25 18:16:24 +00:00 · 2026-09-25 13:39:35 +00:00 · 2026-09-25 12:49:26 +00:00 · 2026-08-09 19:42:28 +02:00
61 changed files with 3455 additions and 286 deletions
@@ -16,6 +16,239 @@ for 1.0.0 have something to be assembled from.
 ## Unreleased
 ## 1.2.0
 - Fixed: **choosing a reasoning effort could kill the reply outright**, with a
  Jinja traceback where the answer should have been. Reasoning effort is sent
  two ways, and the second — `chat_template_kwargs` — is rendered into the
  model's own chat template, which does not ignore a value it has never heard
  of: it raises, and the whole request fails. The catch is that the vocabulary
  is **not the same for every model**. gpt-oss takes `low/medium/high`; Bonsai
  takes `low/medium/xhigh` and refuses `high`; OpenAI has added `minimal`,
  `xhigh` and `max` at various points. This application offered the same three
  to everything, so on some models the top setting was one the model would
  throw for.
 - **A model now has its own list of the efforts it accepts**, on its page under
  Models, and the composer's picker and `/effort` offer only those. Tick none
  and the familiar three are used, which is right for nearly everything.
 - **And it corrects itself.** If an endpoint refuses an effort anyway — a model
  swapped underneath a name, a runtime upgraded — that reply is retried once
  without it instead of being lost, and the model's list is narrowed so the
  menu stops offering something that does not work. Where the endpoint says
  what it *does* take, that is what gets stored.
 - `/effort` now reads the levels from the picker rather than from a second copy
  of the list kept in the browser, so the two can no longer disagree about what
  a valid effort is.
 ## 1.1.2
 Two things a phone found that 1.1.0's phone pass had not.
 - Fixed: **the administration area could not be navigated on a phone.** Admin
  has a nav of its own rather than the chat sidebar, and 1.1.0 gave every
  sidebar the drawer behaviour — starts closed, slides in — without giving that
  one any of the drawer's furniture. So it sat off-screen with no button to open
  it, no close, and nothing to tap beside it: every administration page was
  reachable and then a dead end. It now opens, closes and dims the page like the
  other one, and a test refuses any future sidebar that cannot be opened.
 - Fixed: **the chat gave nearly a quarter of a phone screen to margins**, so
  anything that could not wrap had to be scrolled to sideways. The thread's side
  padding is halved, and the speaker's avatar moves above the turn instead of
  sitting in a 44px column beside every line of it — a code block gained about
  sixty pixels of readable width.
 - Fixed: **the chat's title was squeezed to nothing.** The row's designated
  shrinker is hidden below a tablet width, so on a phone the controls went rigid
  and asked for 317 pixels of a 390 pixel bar; the heading was not truncated, it
  simply stopped occupying space. The model picker gives now, and on a phone it
  shows its avatar rather than its name — the name is one tap away and the
  title is not.
 - Tick boxes and the smaller buttons are big enough to hit on a phone. A
  checkbox is drawn by the browser at about sixteen pixels whatever the type
  around it, which made it the smallest target in the application by some way,
  and the admin lists are mostly checkboxes.
 - Fixed: **icon buttons could be squashed below their own size.** The sidebar
  toggle measured eighteen pixels across on a phone, under half its target,
  because a full row shrank the button rather than the text beside it.
 ## 1.1.1
 One bug, and it is the one that made 1.1.0 look broken the moment you updated to
 it. If you saw a stray ✕ beside the logo on a desktop, controls that looked
 half-styled, or a page that would not scroll, this is why — and none of it was
 in the code you were running; it was the code your browser had *not* fetched.
 - Fixed: **updating showed you the new page drawn with the old stylesheet.**
  Pages are always fetched fresh, while the CSS and JavaScript beside them come
  from the cache the offline support keeps — and that cache was keyed on the
  release while the files inside it were not. For as long as the previous
  release's worker was still in charge, you got 1.1.0's markup over 1.0.x's
  stylesheet: a close button meant for the phone drawer appeared on the desktop
  with nothing to style or place it, and anything else the new layout depended
  on was simply absent. Every asset now carries the release in its address, so
  a new page cannot be handed an old stylesheet whatever the cache holds.
  It is self-correcting: updating to this version is enough, and no cache needs
  clearing.
 - The sidebar header is two slots — the name, and a rail on the right for the
  drawer's own controls — instead of a brand with a button appended to it. The
  close button sits in that rail, at the top right where it belongs, and a
  second control added later lands beside it rather than pushing the name
  around.
 ## 1.1.0
 Mostly about using this on a phone, where it turns out a good deal of it could
 not be used at all.
 ### The sidebar on a phone
 - Fixed: **the sidebar opened over the page on every phone, and the button that
  closes it was underneath it.** Below a phone width the sidebar is a 280px
  panel laid over the page; nothing ever closed it, and the only control that
  could was in the bar behind it. It now starts closed at that width, slides in
  when you ask for it, dims the page behind it, and closes by tapping beside it,
  by Escape, or by its own button — which is inside the drawer, where you can
  reach it.
 - Fixed: **seven of the eight pages with a sidebar had no way to show or hide it
  at all.** Only the chat page ever had that button. Settings, Messages,
  Reports, Scheduled, Library, Connections and a folder's own page did not —
  which on a phone meant arriving at a page already covered by a panel with
  nothing to do about it. Settings is where the Install and Notifications
  buttons live, so this was also why they were hard to reach.
 - The toggle no longer claims the sidebar is open when it is not, which matters
  to anyone using a screen reader.
 ### Anything you tap
 - **Every control is now at least 44px on a touch screen**, instead of 36px —
  or 28px for the small ones, which included renaming and deleting a chat, all
  seven actions on a message, and every panel's close button. The dismiss button
  on a notification had no size of its own at all and was about 18 by 7 pixels.
 - Fixed: **renaming or deleting a chat, and copying, editing, regenerating or
  reading aloud a message, were impossible on a phone.** All of them appeared on
  hover, and there is no hover on a phone; tapping the row simply opened it.
 - Fixed: **the settings tabs scrolled sideways with nothing to say so**, hiding
  Appearance, Memory and Security off the right-hand edge of a phone screen.
  There is a fade at the edge now, and a flick lands on a tab.
 - Installed on an iPhone, the page ran underneath the clock and the home
  indicator. It no longer does.
 ### Installing it
 - The install prompt now offers the richer dialog rather than the terse bar, and
  a long press on the icon offers New chat, Messages and Scheduled.
 - Fixed: **a light-themed instance installed to a phone showed a near-black
  splash screen and then opened parchment**, and every page load flashed dark
  browser chrome before the stylesheet had run. Both follow the theme now.
 - Fixed: **a new version used to take over pages you were reading**, swapping
  the stylesheets under an open tab while it emptied the cache they came from.
  It waits and offers you a reload instead.
 - Fixed: the small mark beside a notification on Android was a solid grey
  square, because the icon it used has no transparency to be cut from.
 - Fixed: notifications silently stopped working for good if the browser ever
  replaced its own subscription, which browsers do.
 - Pages start loading a little sooner, and the two icons a launcher actually
  crops are now kept for offline use.
 ### Things that move
 - **Every request the application makes now says it is happening**, with a thin
  bar across the top of the window. Nothing did before, so anything slower than
  a few milliseconds looked like a click that had not registered.
 - The thinking indicator turns rather than fading, so a model that is working
  and one that has stopped no longer look alike.
 - Dialogs, the drawer and the panels arrive and leave rather than appearing;
  buttons answer a press; cards lift under the pointer. All of it stops if you
  have asked your system for reduced motion.
 ### Archiving
 - **A chat can be archived** — out of the list, into a group at the bottom of the
  sidebar, and back again whenever you like. The setting behind this has existed
  and been honoured since folders arrived; nothing had ever been able to switch
  it on.
 ### Smaller things
 - **Extra headers can be set on a connection.** They were sent with every
  request already and no form could write them, so OpenRouter's attribution
  headers were documented and unreachable.
 - A model is no longer told that it will hear when a background job finishes on
  instances where that notification is switched off.
 - The guidance for asking you a question can now be edited like every other
  piece of the prompt. It was the only one that could not be.
 - Several controls that a screen reader announced as nothing now have names, and
  two lists that claimed to be tab strips now describe themselves honestly.
 - Borders resolve through a token like every other value, so a theme can change
  one. They were a literal `1px` in about ninety places, which was the largest
  patch of hard-coded value left in the stylesheets.
 - `chat.css` may now contain media queries. It was forbidden them, for a good
  reason that had stopped applying: what the ban protected is asserted directly
  now, which is both narrower and stronger.
 ## 1.0.4
 Six things that looked like they worked. Five of them were found by reading the
 code rather than by anybody reporting them, which is what they have in common:
 none of these fails loudly, and two of them correct themselves if you reload.
 - Fixed: **a reply lost the model's name and picture the moment it finished.**
  While a reply streams it is attributed correctly; at the instant it lands, the
  frame that replaces the bubble was looking the models up as nobody, and "no
  user" answers "no models" rather than "all models". So a finished reply swapped
  the model's avatar for the plain leaf mark, put the instance's name where the
  model's should be, and grew a raw model id beside it. Reloading the page put it
  all back, which is why this survived a release: it is only ever wrong until you
  look away.
 - Fixed: **a limit on how many replies an account may write at once could be
  stepped over by pressing New chat.** It was enforced when sending into a chat
  that already existed and nowhere else — not on a new chat, not on editing an
  earlier message, not on sending a queued one, and not on regenerating. Four of
  the six ways to start a reply ignored it, including the commonest.
 - Fixed: **a custom theme's confirmations and warnings kept the built-in
  theme's colour behind them.** Setting `success` or `warning` moved the text and
  left the background it sits on, because the faded companion colour was derived
  for three of the five settable colours. Visible on every alert and badge of
  those two kinds, on the "on" state in the permissions list, and on the added
  lines of every diff in an agent chat.
 - Fixed: **on a phone, every page with a sidebar could be scrolled past its own
  bottom into empty background.** The shell was sized to the part of the screen
  you can actually see and the document around it to the part you can see with
  the browser's toolbar retracted; the difference between those is real on a
  phone and nil on a desktop, which is why it was never noticed on one. Reported
  on Settings and true everywhere. A flick that ran off the end of a list now
  stops there as well, instead of dragging the page behind it.
 - Fixed: **the conversation was rendering every assistant message twice on every
  page load** — once into Markdown that nothing read, and once the way it is
  actually shown. The same was true of Messages, for your own turns. Nothing
  looked wrong; a long conversation was simply slower to open than it needed to
  be, every time, along with every rewind and every compaction.
 - Fixed: a test file meant to skip itself on a machine without `setsid` never
  did, because it set its marker twice and the second one replaced the first.
 - Removed: an endpoint serving a message's unrendered Markdown, which nothing
  had ever called — the copy button reads the page it is already on.
 ## 1.0.3
 Two Arch-isms in the installer, both of which only a Debian machine could find.
 `deploy/lxc-install.sh` had never been executed — it was reviewed and
 syntax-checked, which is not the same claim — and running it is what found them.
 - Fixed: **`deploy/install.sh` could not create its virtualenv on Debian**, and
  so `deploy/lxc-install.sh` could not finish. It called bare `python`, which is
  Python 3 on Arch — the machine this was written and only ever run on — and
  does not exist on Debian at all unless `python-is-python3` is installed. The
  LXC bootstrap installs `python3`, so the install aborted at the virtualenv
  step with the service user, the bind mount and the clone already made. It now
  calls `python3`, which is right on both.
 - Fixed: the service account was created with `--shell /usr/bin/nologin`, which
  is where Arch keeps it and where Debian does not. Nothing invoked it — `sudo -u`
  execs directly and systemd's `User=` never reads a shell — so the account
  worked either way, but it was created pointing at a file that was not there.
  Now `/usr/sbin/nologin`, which is correct on Debian and resolves on Arch too,
  since Arch's `/usr/sbin` is a symlink to `bin`.
 ## 1.0.2
 - **The documentation moved to the [wiki](https://git.houmeres.sk/Houmeres/LLeMbas/wiki).**
@@ -95,9 +95,13 @@ fi
 echo "== service user =="
 # --system: no ageing, no mail spool. Home under /home, not /var/lib, so the
 # venv and database sit on the larger volume.
 #
 # `/usr/sbin/nologin` is Debian's path and works on both: Arch keeps `nologin`
 # in /usr/bin, but its /usr/sbin is a symlink to bin, so the Debian spelling
 # resolves there while the Arch one does not resolve on Debian at all.
 if ! getent passwd "$SERVICE_USER" >/dev/null; then
  sudo useradd --system --create-home --home-dir "$HOME_DIR" \
-       --shell /usr/bin/nologin --comment "LLeMbas" "$SERVICE_USER"
+       --shell /usr/sbin/nologin --comment "LLeMbas" "$SERVICE_USER"
 else
  echo "   user $SERVICE_USER already exists"
 fi
@@ -120,8 +124,13 @@ else
 fi
 echo "== virtualenv =="
 # `python3`, not `python`. On Arch -- the machine this was written on and the
 # only one it had ever run on -- `python` is Python 3 and the bare name worked.
 # On Debian it does not exist unless somebody installed `python-is-python3`, so
 # the LXC bootstrap aborted here, after the service user, the bind mount and the
 # clone were already in place. `python3` is correct on both.
 if [[ ! -x "$VENV/bin/python" ]]; then
-  sudo -u "$SERVICE_USER" python -m venv "$VENV"
+  sudo -u "$SERVICE_USER" python3 -m venv "$VENV"
 fi
 sudo -u "$SERVICE_USER" "$VENV/bin/pip" install --quiet --upgrade pip
 # The extras a deployment gets. `search` because DuckDuckGo is the default web
@@ -53,6 +53,7 @@ SERVED_BY_APP = (
    "icon-512.png",
    "icon-maskable-512.png",
    "apple-touch-icon-180.png",
    "badge-72.png",
 )
 FONT_SEMIBOLD = Path("/usr/share/fonts/adobe-source-serif/SourceSerif4Display-Semibold.otf")
@@ -423,6 +424,28 @@ def build_apple_touch_icon() -> bytes:
    return _rasterise(_framed_mark("iios", background=NIGHT_MID, inset=0.06), 180)
 def build_badge() -> bytes:
    """The small mark beside a notification in the Android status bar.
    A badge is used as a *mask*: the device keeps the alpha channel and throws
    every colour away. So this is the leaf as a solid silhouette on nothing --
    no gradients, no rim, no veins, none of which would survive, and a plate
    behind it least of all. The application used `icon-192.png` here, which is
    opaque to its edges, so what Android drew was a grey square.
    72px because that is the size Android asks for, and small enough that the
    blade alone is the only part that still reads.
    """
    return _rasterise(
        f"""{HEADER} viewBox="0 0 64 64" width="64" height="64"
     role="img" aria-label="LLeMbas">
  <path d="{LEAF_BLADE}" fill="#FFFFFF"/>
 </svg>
 """,
        72,
    )
 def _mountains(width: float, base_y: float, seed: int, height: float, colour: str) -> str:
    """One jagged ridge line spanning the full width."""
    rng = random.Random(seed)
@@ -564,6 +587,7 @@ BUILDERS = {
    "icon-512.png": build_icon_512,
    "icon-maskable-512.png": build_icon_maskable,
    "apple-touch-icon-180.png": build_apple_touch_icon,
    "badge-72.png": build_badge,
 }
@@ -0,0 +1,402 @@
 """Render LLeMbas pages in a real browser, at a real size.
 Run it:
    python scripts/shoot.py OUTDIR [/chat,/settings]        # measure + capture
    python scripts/shoot.py OUTDIR --manifest-screenshots   # the two the
                                                            # manifest wants
 Needs a `chromium` on PATH and the development dependencies installed. It is a
 development instrument, like the Node DOM stub the JavaScript is driven under
 and like `fetch_vendor.py` -- it is not imported by the application and nothing
 in `src/` knows it exists.
 Not a test runner: an instrument. It renders a page through TestClient, rewrites
 every asset URL to a file:// path, and refuses to continue if even one is left
 pointing at `testserver` -- because the last harness that did this silently
 measured an unstyled document and reported all five tab panels visible at once.
 A dramatic finding that was entirely an artefact of a rewrite matching nothing.
 """
 from __future__ import annotations
 import json
 import re
 import shutil
 import subprocess
 import sys
 import tempfile
 from pathlib import Path
 REPO = Path(__file__).resolve().parent.parent
 sys.path.insert(0, str(REPO / "src"))
 # Resolved from the package that actually got imported, not from where this
 # file happens to sit. A copy of this script run from somewhere else silently
 # pointed STATIC at a directory that did not exist, every asset URL was
 # rewritten to a file:// path with nothing behind it, and the run measured an
 # unstyled document -- reporting that every page in the application overflowed
 # by thirty thousand pixels. The guard below only asked whether the URLs had
 # been rewritten, which they had.
 import lembas  # noqa: E402
 SRC = Path(lembas.__file__).resolve().parent.parent
 STATIC = Path(lembas.__file__).resolve().parent / "web/static"
 CHROMIUM = shutil.which("chromium") or shutil.which("chromium-browser")
 # Routes that are served by the app rather than mounted, so the rewrite has to
 # fetch them rather than point at a file that does not exist.
 ROUTE_ASSETS = {"/branding.css": "branding.css", "/sw.js": "sw.js"}
 MEASURE = """
 <script>
 window.__measure = function () {
  var de = document.scrollingElement || document.documentElement;
  var small = [];
  document.querySelectorAll(
    'button, a.btn, a.nav-item, .tabs__tab, input, select, [role=tab]'
  ).forEach(function (el) {
    var r = el.getBoundingClientRect();
    if (!r.width || !r.height) return;              /* hidden */
    if (el.closest('[hidden]')) return;
    /* A `.visually-hidden` radio is 1x1 on purpose -- the <label> beside it is
       the target, and that one is measured. Counting the input reports five
       failures on a settings page whose tabs are all 44px. */
    if (el.classList.contains('visually-hidden')) return;
    /* Inline text inside a sentence is not a tap target in the sense this is
       checking; it is a word you can also click. */
    if (getComputedStyle(el).display === 'inline') return;
    if (r.height < 40 || r.width < 40) {
      small.push({
        tag: el.tagName.toLowerCase(),
        cls: el.className && el.className.toString().slice(0, 60),
        label: (el.getAttribute('aria-label') || el.textContent || '').trim().slice(0, 30),
        w: Math.round(r.width), h: Math.round(r.height)
      });
    }
  });
  var wide = [];
  document.querySelectorAll('body *').forEach(function (el) {
    var r = el.getBoundingClientRect();
    if (r.right > window.innerWidth + 1 || r.left < -1) {
      wide.push({
        tag: el.tagName.toLowerCase(),
        cls: el.className && el.className.toString().slice(0, 60),
        left: Math.round(r.left), right: Math.round(r.right)
      });
    }
  });
  /* Which element is actually making the document bigger than the window.
     "the page over-scrolls" is not actionable; "`.shell` is 1756px tall in an
     844px window" is. Reported for both axes, deepest first, because the
     outermost offender is usually just the ancestor of the real one. */
  /* Content taller than the window inside something built to scroll is not
     overflow, it is the point. So an element counts only when nothing between
     it and the root can scroll in that axis -- otherwise every long settings
     page reports its own cards as a bug and the signal is lost in them. */
  function contained(el, axis) {
    var prop = axis === 'y' ? 'overflowY' : 'overflowX';
    for (var n = el.parentElement; n && n !== document.documentElement; n = n.parentElement) {
      var o = getComputedStyle(n)[prop];
      if (o === 'auto' || o === 'scroll' || o === 'hidden') return true;
    }
    return false;
  }
  function culprits(axis) {
    var found = [];
    document.querySelectorAll('body, body *').forEach(function (el) {
      if (contained(el, axis)) return;
      var r = el.getBoundingClientRect();
      var over = axis === 'y'
        ? r.bottom - window.innerHeight
        : r.right - window.innerWidth;
      if (over > 1) {
        found.push({
          tag: el.tagName.toLowerCase(),
          cls: (el.className && el.className.toString().slice(0, 50)) || '',
          over: Math.round(over),
          size: Math.round(axis === 'y' ? r.height : r.width),
          pos: getComputedStyle(el).position,
          id: el.id || '',
          parent: el.parentElement ? (el.parentElement.tagName.toLowerCase() + '.' +
                  (el.parentElement.className || '').toString().slice(0, 30)) : '',
          html: el.outerHTML.slice(0, 120)
        });
      }
    });
    return found.sort(function (a, b) { return b.over - a.over; }).slice(0, 8);
  }
  var shell = document.querySelector('.shell');
  return {
    docScrollH: de.scrollHeight,
    innerH: window.innerHeight,
    docScrollW: de.scrollWidth,
    innerW: window.innerWidth,
    bodyScrollH: document.body.scrollHeight,
    shellH: shell ? Math.round(shell.getBoundingClientRect().height) : null,
    shellW: shell ? Math.round(shell.getBoundingClientRect().width) : null,
    tallCulprits: culprits('y'),
    wideCulprits: culprits('x'),
    /* The invariant: the application shell fills the window and the DOCUMENT
       never scrolls *for the reader*. A document taller than the window is the
       /settings bug -- but only when the reader can actually move it. `overflow:
       hidden` blocks a wheel and a finger while still permitting an assignment
       to scrollTop, so a page whose shell clips a tall descendant reports a
       scrollHeight of thousands and scrolls for nobody. /admin/prompts does
       exactly that, and reading the raw height called it a bug four times. */
    documentScrolls:
      de.scrollHeight > window.innerHeight + 1 &&
      ["visible", "auto", "scroll"].indexOf(
        getComputedStyle(document.documentElement).overflowY
      ) !== -1,
    scrollsSideways: de.scrollWidth > window.innerWidth + 1,
    smallTargets: small.slice(0, 40),
    smallCount: small.length,
    overflowing: wide.slice(0, 20),
    overflowCount: wide.length
  };
 };
 /* Nothing is appended to the page itself. The first version of this harness
   did exactly that, and the div it added was 960px tall -- so the very first
   run reported that /chat over-scrolled by 960px on a phone, which was a
   finding entirely about the instrument. The frame outside reads __measure()
   across the boundary instead, and the page is left exactly as served. */
 </script>
 """
 def build_client():
    import lembas.config as config_mod
    tmp = Path(tempfile.mkdtemp(prefix="lembas-shoot-"))
    config_mod.settings.data_dir = tmp
    config_mod.settings.secret_key = "x" * 43
    from fastapi.testclient import TestClient
    from lembas.db.session import init_db, session_scope
    from lembas.main import create_app
    init_db()
    app = create_app()
    client = TestClient(app)
    client.post(
        "/auth/register",
        data={"name": "Frodo", "email": "f@example.com", "password": "mellonmellon"},
        follow_redirects=False,
    )
    from lembas.db.models import Connection, Model
    with session_scope() as db:
        connection = Connection(
            name="local", base_url="http://127.0.0.1:1", api_key_encrypted=""
        )
        db.add(connection)
        db.flush()
        for name in ("gemma4-moe", "qwen3-coder"):
            db.add(Model(connection_id=connection.id, model_id=name, display_name=name))
    return client
 def rewrite(html: str, client, assets: Path) -> str:
    """Point every asset at a file on disk, and prove none was missed."""
    for route, name in ROUTE_ASSETS.items():
        response = client.get(route)
        if response.status_code == 200:
            (assets / name).write_text(response.text)
    html = re.sub(
        r'(?:http://testserver)?/static/([^"\'?\s>]+)(\?[^"\'\s>]*)?',
        lambda m: f"file://{STATIC}/{m.group(1)}",
        html,
    )
    html = re.sub(
        r'(?:http://testserver)?/branding\.css(\?[^"\'\s>]*)?',
        f"file://{assets}/branding.css",
        html,
    )
    # Fail loudly, and only about things that decide how the page LOOKS: every
    # `src`, and `href` on a <link>. An `href` on an anchor is a destination,
    # not an asset -- flagging those makes the guard cry wolf on every page and
    # a guard nobody believes is worse than none.
    leftovers = re.findall(r'<link\b[^>]*\bhref="([^"]+)"', html)
    leftovers += re.findall(r'\bsrc="([^"]+)"', html)
    blocking = [
        url
        for url in leftovers
        if url.startswith(("/", "http://testserver"))
        and not url.startswith(("/branding/", "/manifest", "/sw.js"))
    ]
    if blocking:
        raise SystemExit(
            "UNREWRITTEN ASSET URLS -- this would measure an unstyled document: "
            f"{sorted(set(blocking))[:8]}"
        )
    # And that what they were rewritten *to* is really there. A rewrite that
    # matches and produces a dead path is indistinguishable, from inside the
    # browser, from no stylesheet at all -- and it is the failure that actually
    # happened, twice.
    missing = [
        url
        for url in re.findall(r'(?:href|src)="file://([^"?]+)"', html)
        if not Path(url).exists()
    ]
    if missing:
        raise SystemExit(f"REWRITTEN TO NOTHING -- still an unstyled document: {missing[:5]}")
        # The one-time notifications offer is a modal over the very page we came
    # to measure, and it is gated on a localStorage key. Set it in the head, so
    # it runs before the deferred script that reads it.
    quiet = (
        "<script>try{localStorage.setItem('lembas-notifications-asked','1');}"
        "catch(e){}</script>"
    )
    return html.replace("</head>", quiet + MEASURE + "</head>", 1)
 def shoot(client, path: str, width: int, height: int, theme: str, outdir: Path) -> dict:
    """One page, at one size, in one theme.
    The page is rendered inside an <iframe> of exactly the target size rather
    than into a window of it, because headless Chromium refuses to make a window
    narrower than about 500px -- ask for 390 and you get 500, and every
    measurement is then of a layout no phone will ever produce. A media query
    inside an iframe evaluates against the iframe's own viewport, so this is the
    real thing: `width: 390px` on the frame is a 390px viewport inside it.
    """
    response = client.get(path)
    if response.status_code != 200:
        raise SystemExit(f"{path} -> HTTP {response.status_code}")
    assets = outdir / "assets"
    assets.mkdir(parents=True, exist_ok=True)
    html = response.text.replace('data-theme="moria"', f'data-theme="{theme}"')
    html = rewrite(html, client, assets)
    slug = f"{path.strip('/').replace('/', '-') or 'root'}-{theme}-{width}x{height}"
    page = outdir / f"{slug}.html"
    page.write_text(html)
    frame = outdir / f"{slug}-frame.html"
    frame.write_text(
        "<!doctype html><meta charset=utf-8>"
        "<style>html,body{margin:0;background:#888}"
        f"iframe{{width:{width}px;height:{height}px;border:0;display:block}}</style>"
        f'<iframe id="f" src="{page.name}"></iframe>'
        "<div id=\"__measurements\"></div>"
        "<script>"
        "window.addEventListener('load',function(){setTimeout(function(){"
        "var w=document.getElementById('f').contentWindow;"
        "document.getElementById('__measurements').textContent="
        "JSON.stringify(w.__measure?w.__measure():{error:'no __measure -- the page did not load'});"
        "},600);});"
        "</script>"
    )
    shot = outdir / f"{slug}.png"
    common = [
        CHROMIUM, "--headless", "--no-sandbox", "--disable-gpu",
        "--allow-file-access-from-files", "--hide-scrollbars",
        "--force-device-scale-factor=1",
        f"--window-size={max(width, 520)},{height + 40}",
        "--virtual-time-budget=4000",
    ]
    subprocess.run(common + [f"--screenshot={shot}", f"file://{frame}"],
                   capture_output=True, timeout=120)
    dom = subprocess.run(common + ["--dump-dom", f"file://{frame}"],
                         capture_output=True, text=True, timeout=120).stdout
    match = re.search(r'id="__measurements">(.*?)</div>', dom, re.S)
    if not match or not match.group(1).strip():
        raise SystemExit(f"no measurements for {slug} -- the frame did not report")
    data = json.loads(match.group(1))
    if "error" in data:
        raise SystemExit(f"{slug}: {data['error']}")
    data["page"] = slug
    if data["innerW"] != width:
        raise SystemExit(
            f"{slug}: measured a {data['innerW']}px viewport, asked for {width}px"
        )
    return data
 # The two the manifest asks for. Without them Chrome on Android falls back to
 # the one-line mini-infobar instead of the install dialog with a name, an icon
 # and a picture in it -- which is the difference between an install somebody
 # chooses and one they dismiss without reading.
 MANIFEST_SHOTS = (
    ("screenshot-narrow.png", 390, 844, "narrow"),
    ("screenshot-wide.png", 1280, 800, "wide"),
 )
 def manifest_screenshots(client, outdir: Path) -> None:
    """Capture the two, straight into static/img/ where the manifest names them.
    A browser capture rather than something `build_artwork.py` draws: the point
    of a screenshot is that it is what the application actually looks like, and
    an illustration of what it looks like is the one thing it must not be.
    """
    try:
        from PIL import Image
    except ImportError:  # pragma: no cover - design-time tool
        raise SystemExit("pillow is needed to crop the frame off a screenshot") from None
    for name, width, height, _form in MANIFEST_SHOTS:
        shoot(client, "/chat", width, height, "moria", outdir)
        slug = f"chat-moria-{width}x{height}.png"
        target = STATIC / "img" / name
        # Cropped to the iframe, which sits at the origin of a zero-margin
        # wrapper. The capture is of the *outer* document, so without this the
        # screenshot carries the harness's own readout along its bottom edge
        # and a strip of grey beside it -- and a manifest screenshot is the one
        # picture of this application most people will ever see.
        with Image.open(outdir / slug) as shot:
            shot.crop((0, 0, width, height)).save(target)
        print(f"wrote {target.relative_to(REPO)}")
 def main() -> None:
    if not CHROMIUM:
        raise SystemExit("no chromium")
    if "--manifest-screenshots" in sys.argv:
        outdir = Path(sys.argv[1]) if len(sys.argv) > 2 else Path(tempfile.mkdtemp())
        outdir.mkdir(parents=True, exist_ok=True)
        manifest_screenshots(build_client(), outdir)
        return
    outdir = Path(sys.argv[1]) if len(sys.argv) > 1 else Path("/tmp/lembas-shoot/out")
    outdir.mkdir(parents=True, exist_ok=True)
    paths = sys.argv[2].split(",") if len(sys.argv) > 2 else ["/chat", "/settings"]
    sizes = [(390, 844), (360, 640), (1280, 800)]
    themes = ["moria", "shire"]
    client = build_client()
    results = []
    for path in paths:
        for width, height in sizes:
            for theme in themes:
                results.append(shoot(client, path, width, height, theme, outdir))
    (outdir / "results.json").write_text(json.dumps(results, indent=2))
    for r in results:
        flags = []
        if r["documentScrolls"]:
            flags.append(f"DOC-SCROLLS({r['docScrollH']}>{r['innerH']})")
        if r["scrollsSideways"]:
            flags.append(f"SIDEWAYS({r['docScrollW']}>{r['innerW']})")
        if r["overflowCount"]:
            flags.append(f"overflow:{r['overflowCount']}")
        if r["smallCount"]:
            flags.append(f"small-targets:{r['smallCount']}")
        print(f"{r['page']:44} {' '.join(flags) or 'clean'}")
 if __name__ == "__main__":
    main()
@@ -1,3 +1,3 @@
 """LLeMbas - a Middle-earth themed web UI for OpenAI-compatible LLM endpoints."""
-__version__ = "1.0.2"
+__version__ = "1.2.0"
@@ -3,6 +3,7 @@
 from __future__ import annotations
 import logging
 import re
 from datetime import UTC, datetime
 from fastapi import APIRouter, Form, HTTPException, Request, Response, status
@@ -103,6 +104,25 @@ async def connections_page(request: Request, db: Db, user: AdminUser, message: s
    )
 # Header names are a narrow set on purpose: a newline would let one field write
 # a second header, and a colon in a name splits it. Anything outside it is
 # dropped rather than repaired -- a header nobody can see the effect of is worse
 # than one that is visibly missing.
 _HEADER_NAME = re.compile(r"^[A-Za-z0-9!#$%&'*+.^_`|~-]{1,64}$")
 def _parse_headers(raw: str) -> dict[str, str]:
    """`Name: value` per line, into the dict the client sends verbatim."""
    headers: dict[str, str] = {}
    for line in (raw or "").splitlines()[:20]:
        name, _, value = line.partition(":")
        name = name.strip()
        value = value.strip()[:500]
        if name and value and _HEADER_NAME.match(name):
            headers[name] = value
    return headers
@router.post("/connections")
 async def create_connection(
    db: Db,
@@ -145,6 +165,7 @@ async def update_connection(
    enabled: bool = Form(False),
    unload_url: str = Form(""),
    unload_method: str = Form("POST"),
    extra_headers: str = Form(""),
 ) -> Response:
    connection = _connection(db, connection_id)
    connection.name = name.strip()[:120] or connection.name
@@ -157,6 +178,13 @@ async def update_connection(
    method = unload_method.strip().upper()
    connection.unload_method = method if method in ("GET", "POST") else "POST"
    # `extra_headers_json` has been sent with every request to this endpoint
    # since it was added and written by no form in the application, so its one
    # documented use -- OpenRouter wants an `HTTP-Referer` and an `X-Title` --
    # was unreachable. One `Name: value` per line, because a JSON textarea asks
    # somebody to get braces right in a settings screen.
    connection.extra_headers_json = _parse_headers(extra_headers)
    submitted = api_key.strip()
    if submitted and submitted != UNCHANGED_SENTINEL:
        connection.api_key_encrypted = encrypt(submitted)
@@ -177,7 +177,11 @@ async def model_detail(
            "groups": list(db.scalars(select(Group).order_by(Group.name))),
            "capabilities": PROTOCOL_CAPABILITIES,
            "tool_capabilities": TOOL_CAPABILITIES,
            # Every effort this application understands, so an administrator
            # can tick the ones their model actually takes -- and the model's
            # current answer, which is the common three until somebody says.
            "efforts": chat_service.EFFORTS,
            "model_efforts": chat_service.efforts_for(model),
            # Rows predating the split have no tool_* keys at all. Showing them
            # unticked would be a lie: tools.enabled_tools treats absent as on
            # when `tools` is on, so that an upgrade does not silently take web
@@ -238,6 +242,7 @@ async def update_model(
    position: str = Form(""),
    context_length: str = Form(""),
    default_effort: str = Form(""),
    reasoning_efforts: list[str] = Form(default=[]),
    group_ids: list[str] = Form(default=[]),
    capability: list[str] = Form(default=[]),
 ) -> Response:
@@ -260,9 +265,19 @@ async def update_model(
    # Merged rather than rebuilt, unlike the capabilities below: params_json
    # holds whatever sampling defaults an administrator has set and this form
    # only carries one of them.
    # Which efforts this model takes at all. Submitted as a list of ticked
    # values; empty means "nobody has said", and `chat.efforts_for` answers with
    # the common three. Stored in the order `EFFORTS` declares rather than the
    # order a browser happened to send.
    chosen = [value for value in chat_service.EFFORTS if value in (reasoning_efforts or [])]
    model.reasoning_efforts = chosen
    params = dict(model.params_json or {})
    wanted = default_effort.strip().lower()
-    if wanted in chat_service.EFFORTS:
+    # Checked against what this model takes, not against everything this
    # application has heard of -- a default of `high` on a model whose template
    # refuses it is a chat that fails on its first turn.
    if wanted in chat_service.efforts_for(model):
        params["reasoning_effort"] = wanted
    else:
        params.pop("reasoning_effort", None)
@@ -308,6 +308,12 @@ async def start_chat(
    if not content and not file_ids:
        return Response(status_code=status.HTTP_204_NO_CONTENT)
    # Before `_new_chat`, not after: a refusal that has already written the row
    # leaves an empty chat in the sidebar as the visible result of being told
    # no. There is no chat yet to exclude from the count, and none is needed --
    # nothing can be running for a chat that does not exist.
    _refuse_extra_reply(db, None, user)
    chat = _new_chat(
        db,
        user,
@@ -981,7 +987,7 @@ def _note_rewind(chat: Chat) -> None:
        chat.rewound_at = datetime.now(UTC)
-def _too_many_replies(db: DBSession, chat: Chat, user: User) -> str:
+def _too_many_replies(db: DBSession, chat: Chat | None, user: User) -> str:
    """Why this account may not start another reply right now, or "".
    In-process, and that is exact rather than approximate only because this
@@ -998,10 +1004,13 @@ def _too_many_replies(db: DBSession, chat: Chat, user: User) -> str:
        row[0]
        for row in db.execute(select(Chat.id).where(Chat.user_id == user.id)).all()
    }
    # `chat` is None on the new-chat path, where there is no row yet and so
    # nothing to exclude -- every running reply of theirs counts.
    here = chat.id if chat is not None else None
    running = sum(
        1
        for chat_id in mine
-        if chat_id != chat.id and generation_service.running_for(chat_id) is not None
+        if chat_id != here and generation_service.running_for(chat_id) is not None
    )
    if running < ceiling:
        return ""
@@ -1011,6 +1020,22 @@ def _too_many_replies(db: DBSession, chat: Chat, user: User) -> str:
    )
 def _refuse_extra_reply(db: DBSession, chat: Chat | None, user: User) -> None:
    """Raise if this account is already writing as many replies as it may.
    A function rather than two lines repeated, because it is repeated five
    times now. It used to be called once -- from `_send`, which serves
    `post_message` and `execute_plan` -- while four other routes start a
    generation: `start_chat`, `edit_message`, `send_queued_now` and
    `regenerate`. So a group's `concurrent_replies` was reached by sending into
    a chat that already existed and walked straight past by pressing New chat,
    which is the commonest way to start a reply there is. A quota you can step
    over by using the obvious button is not a quota.
    """
    if busy := _too_many_replies(db, chat, user):
        raise HTTPException(status.HTTP_429_TOO_MANY_REQUESTS, busy)
 def _send(
    request: Request,
    db: Db,
@@ -1042,8 +1067,7 @@ def _send(
    # This chat's own reply does not count against it -- a second message here
    # is queued rather than sent, a few lines down, and that path is what the
    # queue is for.
-    if busy := _too_many_replies(db, chat, user):
+    _refuse_extra_reply(db, chat, user)
        raise HTTPException(status.HTTP_429_TOO_MANY_REQUESTS, busy)
    if queued := _reply_in_flight(db, chat):
        waiting = db.scalar(
@@ -1328,8 +1352,16 @@ async def _follow(chat_id: str, message_id: str) -> AsyncIterator[str]:
                # template shares both roles, and a missing `user` would only
                # blow up on whichever branch is not being exercised here.
                "user": owner,
                # `owner`, never None. `models_visible_to` answers an absent
                # user with [], so a None here is not "every model" but *no*
                # model -- and this frame replaces the whole bubble at the
                # moment a reply finishes. The template then finds no
                # `speaking_model` and the finished reply swaps its avatar for
                # the LLeMbas mark, its author for the instance name, and grows
                # a raw model_id chip, all of which a reload silently corrects.
                # That is why it went unreported for so long.
                "models_by_id": {
-                    m.model_id: m for m in chat_service.available_models(db, None)
+                    m.model_id: m for m in chat_service.available_models(db, owner)
                },
                # This frame replaces the whole bubble, so it has to carry the
                # speaker button's conditions too -- and the owner's, not the
@@ -1360,7 +1392,7 @@ def _render_bubble(db: DBSession, chat: Chat, owner: User | None, message: Messa
            "message": message,
            "chat": chat,
            "user": owner,
-            "models_by_id": {m.model_id: m for m in chat_service.available_models(db, None)},
+            "models_by_id": {m.model_id: m for m in chat_service.available_models(db, owner)},
            **audio_service.template_flags(db, owner),
        }
    )
@@ -1447,11 +1479,6 @@ def _thread_context(db: DBSession, chat: Chat, user: User) -> dict:
        "user": user,
        "messages": messages,
        "compacted": compacted,
        "bodies": {
            m.id: render_markdown(m.content)
            for m in everything
            if m.role == ROLE_ASSISTANT and m.content
        },
        "models_by_id": {m.model_id: m for m in chat_service.available_models(db, user)},
        **audio_service.template_flags(db, user),
    }
@@ -1560,6 +1587,8 @@ async def edit_message(
        raise HTTPException(
            status.HTTP_409_CONFLICT, "Wait for the current reply to finish, or stop it."
        )
    # `_reply_in_flight` is about *this* chat; the quota is about the account.
    _refuse_extra_reply(db, chat, user)
    message.content = content
@@ -1703,6 +1732,7 @@ async def send_queued_now(
        raise HTTPException(
            status.HTTP_409_CONFLICT, "Wait for the current reply to finish, or stop it."
        )
    _refuse_extra_reply(db, chat, user)
    message.queued = False
    db.commit()
@@ -1957,6 +1987,21 @@ async def update_chat(request: Request, db: Db, user: RequiredUser, chat_id: str
        folder = db.get(Folder, wanted) if wanted else None
        chat.folder_id = folder.id if folder is not None and folder.user_id == user.id else None
    # Out of the way, and reversible.
    #
    # `Chat.archived` has been filtered on in four places since folders arrived
    # and written by nothing anywhere -- so the hiding worked, the archiving
    # did not, and the column read as a built feature to anyone who grepped for
    # it. Here rather than as its own endpoint because it is a property of the
    # chat, exactly like its title and its folder, and `update_chat` already
    # reads the raw form for the reason this field needs too: absent must mean
    # "leave it alone" and "0" must mean "put it back".
    archived_changed = False
    if "archived" in form:
        wanted = str(form["archived"]).strip() not in ("", "0", "false")
        archived_changed = wanted != chat.archived
        chat.archived = wanted
    # The mode is the one agent field that changes mid-chat: it decides what
    # gets asked about, not what the conversation is.
    if "agent_mode" in form:
@@ -2070,6 +2115,24 @@ async def update_chat(request: Request, db: Db, user: RequiredUser, chat_id: str
        return HTMLResponse(
            templates.get_template("chat/_title_oob.html").render({"chat": chat})
        )
    # Archiving moves a row out of one group and into another, so the sidebar
    # has to be re-rendered -- and it cannot be, from a 204. htmx's own config
    # is `{code: "204", swap: false}`, so a control aimed at `#sidebar-tree`
    # with this endpoint's usual answer sets the column and then does visibly
    # nothing at all, which is this codebase's signature failure rather than a
    # new one. The same fragment and the same `oob` the sidebar switch returns,
    # for the same reason: New chat lives above the tree and comes along out of
    # band.
    if archived_changed:
        from lembas.api.pages import sidebar_context
        return templates.TemplateResponse(
            request,
            "partials/_sidebar_tree.html",
            {"chat": None, "user": user, "oob": True, **sidebar_context(db, user)},
        )
    return Response(status_code=status.HTTP_204_NO_CONTENT)
@@ -2123,16 +2186,6 @@ async def delete_chat(db: Db, user: RequiredUser, chat_id: str) -> Response:
    return response
@router.get("/{chat_id}/messages/{message_id}/raw")
 async def raw_message(db: Db, user: RequiredUser, chat_id: str, message_id: str) -> HTMLResponse:
    """The unrendered Markdown of a message, for the copy button."""
    _owned_chat(db, chat_id, user.id)
    message = db.get(Message, message_id)
    if message is None or message.chat_id != chat_id:
        raise HTTPException(status.HTTP_404_NOT_FOUND, "That message no longer exists.")
    return HTMLResponse(escape_text(message.content))
@router.post("/{chat_id}/messages/{message_id}/regenerate")
 async def regenerate(
    request: Request,
@@ -2147,6 +2200,8 @@ async def regenerate(
    if message is None or message.chat_id != chat.id or message.role != ROLE_ASSISTANT:
        raise HTTPException(status.HTTP_404_NOT_FOUND, "That reply no longer exists.")
    _refuse_extra_reply(db, chat, user)
    message.content = ""
    message.error = ""
    message.complete = False
@@ -21,7 +21,6 @@ from lembas.api.pages import _chat_context, sidebar_context
 from lembas.db.models import Message, Schedule
 from lembas.services import messages as messages_service
 from lembas.services import schedules as schedules_service
 from lembas.services.markdown import render_markdown
 from lembas.services.schedule import clock
 from lembas.services.schedule import rule as rule_service
 from lembas.web.templating import render
@@ -31,11 +30,6 @@ log = logging.getLogger(__name__)
 router = APIRouter(tags=["messages"])
 def _bodies(messages: list[Message]) -> dict[str, str]:
    """Markdown rendered server-side, keyed by id, as `chat_detail` does."""
    return {m.id: render_markdown(m.content) for m in messages if m.role == "user"}
@router.get("/messages")
 async def messages_page(request: Request, db: Db, user: RequiredUser):
    conversation = messages_service.for_user(db, user)
@@ -61,7 +55,6 @@ async def messages_page(request: Request, db: Db, user: RequiredUser):
            "chat": conversation,
            "messages": live,
            "compacted": [],
            "bodies": _bodies(live),
            "inherited_prompt": "",
            "inherited_from": "",
            "more_before": bool(live) and messages_service.has_more_before(
@@ -109,7 +102,6 @@ async def messages_history(
        "messages/_history.html",
        {
            "messages": page,
            "bodies": _bodies(page),
            "more_before": messages_service.has_more_before(db, conversation, page[0]),
            "oldest_id": page[0].id,
            # `render()` injects `user` and friends; `TemplateResponse` does
@@ -10,6 +10,7 @@ from sqlalchemy import select
 from sqlalchemy.orm import Session as DBSession
 from lembas.api.deps import Db, RequiredUser
 from lembas.config import settings
 from lembas.db.models import (
    KIND_CHAT,
    KIND_MESSAGES,
@@ -42,6 +43,17 @@ router = APIRouter(tags=["pages"])
 THEME_COLOUR = {"moria": "#101317", "shire": "#F6F1E4"}
 def _instance_colour(brand) -> str:
    """The background this instance paints before anything has loaded.
    A custom theme sets `bg` itself; otherwise the built-in it inherits from
    decides, which is what `data-base` means everywhere else. Falls back to
    Moria rather than raising -- a splash screen is not worth a 500.
    """
    theme = brand.theme(settings.default_theme)
    return theme.tokens.get("bg") or THEME_COLOUR.get(theme.base, THEME_COLOUR["moria"])
 def _chat_context(db: DBSession, user: User, chat: Chat | None) -> dict:
    """Model lists and permissions every chat page needs.
@@ -70,10 +82,12 @@ def _chat_context(db: DBSession, user: User, chat: Chat | None) -> dict:
            else []
        ),
        "attached_base_ids": [base.id for base in chat.knowledge_bases] if chat else [],
-        # The three a reasoning model understands. From the service so the
+        # What *this* model takes, not the three every model used to be assumed
-        # command, the control and the request builder cannot disagree about
+        # to take. The vocabulary is per model -- gpt-oss has no `xhigh` and
-        # what is a valid effort.
+        # Bonsai has no `high`, and sending the wrong one does not degrade, it
-        "efforts": chat_service.EFFORTS,
+        # raises inside the chat template and fails the reply. From the service
        # so the command, the control and the request builder cannot disagree.
        "efforts": chat_service.efforts_for(current) if current else chat_service.DEFAULT_EFFORTS,
        # What the picker shows, and what `build_request` will send. One
        # resolver so the two cannot disagree.
        "resolved_effort": chat_service.resolved_effort(chat) if chat else "",
@@ -388,9 +402,29 @@ def sidebar_context(db: DBSession, user: User) -> dict:
    unfiled = list(
        db.scalars(narrowed.order_by(Chat.pinned.desc(), Chat.updated_at.desc()))
    )
    # The same query with the one filter inverted, and no `pinned` in the order:
    # a pinned chat that somebody archived is one they have said two opposite
    # things about, and the more recent instruction is the one to honour.
    archived = list(
        db.scalars(
            select(Chat)
            .where(
                Chat.user_id == user.id,
                Chat.archived.is_(True),
                Chat.temporary.is_(False),
                Chat.kind.in_((kind,) if kind else KINDS),
            )
            .order_by(Chat.updated_at.desc())
        )
    )
    return {
        "folders": folders,
        "unfiled_chats": unfiled,
        # Archived chats are NOT narrowed to unfiled ones: a chat inside a
        # folder disappears from that folder when it is archived (the folder's
        # own listing has always filtered them out), so without this it would
        # have left one list and joined none.
        "archived_chats": archived,
        # The shortcuts at the top of the sidebar. Here rather than in
        # `_chat_context`, where they used to be, for two reasons: they are
        # sidebar content and the fragment route that re-renders the sidebar has
@@ -472,17 +506,61 @@ async def manifest(db: Db) -> Response:
    """
    brand = branding_service.for_db(db)
    icons = brand.icon_paths
    colour = _instance_colour(brand)
    return JSONResponse(
        {
-            "id": "/",
+            # Matches `start_url`. An id is only an identity key and need not be
            # navigable, but "/" named a path that serves nothing but a redirect
            # while the app started somewhere else, which reads as a mistake to
            # anyone comparing the two.
            "id": "/chat",
            "name": brand.name,
            "short_name": brand.name[:12],
            "description": brand.tagline or "A web UI for your language models.",
            "lang": "en",
            "dir": "ltr",
            "start_url": "/chat",
            "scope": "/",
            "display": "standalone",
-            "background_color": THEME_COLOUR["moria"],
+            # Ordered best-first: a browser takes the first it understands and
-            "theme_color": THEME_COLOUR["moria"],
+            # falls through to `display` if it understands none of them.
            "display_override": ["standalone", "minimal-ui"],
            "orientation": "any",
            "categories": ["productivity", "utilities"],
            # Opening a link belonging to this scope focuses the window that is
            # already open rather than making a second one.
            "launch_handler": {"client_mode": "navigate-existing"},
            # The launcher's long-press menu. Three destinations rather than
            # ten: a menu nobody can read at a glance is a menu nobody opens.
            "shortcuts": [
                {"name": "New chat", "url": "/chat"},
                {"name": "Messages", "url": "/messages"},
                {"name": "Scheduled", "url": "/scheduled"},
            ],
            # Both follow whatever theme this instance is set up in. They were
            # Moria's near-black regardless, so a parchment instance installed
            # to a phone flashed a dark splash screen and then opened light --
            # and `THEME_COLOUR["shire"]` sat beside them, defined and read by
            # nothing. The *instance* default and not the reader's own theme:
            # a manifest is fetched without credentials unless the link asks
            # otherwise, so there is nobody to ask.
            "background_color": colour,
            "theme_color": colour,
            # Without these, Chrome on Android offers the one-line mini-infobar
            # rather than the install dialog that carries a name, an icon and a
            # picture -- which is the difference between an install somebody
            # chooses and one they swipe away without reading. Captured from the
            # running application by `scripts/shoot.py --manifest-screenshots`,
            # because the one thing a screenshot must not be is a drawing of
            # what the application looks like.
            "screenshots": [
                {"src": "/static/img/screenshot-narrow.png", "sizes": "390x844",
                 "type": "image/png", "form_factor": "narrow",
                 "label": "A conversation on a phone"},
                {"src": "/static/img/screenshot-wide.png", "sizes": "1280x800",
                 "type": "image/png", "form_factor": "wide",
                 "label": "A conversation, with the sidebar beside it"},
            ],
            # An uploaded logo's derived icons, or the shipped ones. Whole-set
            # rather than per size: a manifest listing two custom icons and one
            # shipped is a launcher tile that changes when the device picks a
@@ -19,7 +19,7 @@ from sqlalchemy import (
 from sqlalchemy.orm import Mapped, mapped_column, relationship
 from lembas.db.base import Base, Timestamps, UUIDPrimaryKey
-from lembas.db.types import JSONDict
+from lembas.db.types import JSONDict, JSONList
 if TYPE_CHECKING:
    # Import only for the annotation; at runtime SQLAlchemy resolves the
@@ -137,6 +137,20 @@ class Model(UUIDPrimaryKey, Timestamps, Base):
    # ticked anything.
    context_length: Mapped[int] = mapped_column(Integer, default=0, nullable=False)
    # Which reasoning efforts this model actually accepts. Empty means "nobody
    # has said", and `services/chat.efforts_for` answers with the common set.
    #
    # It has to be per model, because the vocabulary is: gpt-oss takes
    # low/medium/high, Bonsai takes low/medium/xhigh and *raises* on high, and
    # OpenAI's own list has grown minimal, xhigh and max at different times. A
    # single global tuple is a guess that is wrong for somebody.
    #
    # ⚠ A column and not a key in `capabilities_json`, for exactly the reason
    # `context_length` is one: that dict is rebuilt wholesale from the submitted
    # checkboxes on every save, so anything in it that is not a checkbox is
    # destroyed the next time an administrator ticks anything.
    reasoning_efforts: Mapped[list[str]] = mapped_column(JSONList, default=list)
    connection: Mapped[Connection] = relationship(back_populates="models")
    groups: Mapped[list[Group]] = relationship(
        "Group", secondary=model_groups, back_populates="models"
@@ -462,7 +462,20 @@ def theme_css(theme: Theme) -> str:
    if not theme.tokens:
        return ""
    lines = [f"  --{name}: {value};" for name, value in theme.tokens.items()]
-    for name, alpha in (("accent", "0.14"), ("leaf", "0.14"), ("danger", "0.14")):
+    # Every settable colour that has a `-soft` companion in tokens.css, not the
    # three somebody stopped at. `success` and `warning` were settable and their
    # softs were not derived, so a custom theme moved the text and left the
    # background behind it in the base theme's hue -- an alert, a badge, a
    # permission's "on" state and the `+` lines of every agent diff, each in two
    # colours that were never meant to meet. Precisely the half-working failure
    # this function's own docstring says it exists to prevent.
    for name, alpha in (
        ("accent", "0.14"),
        ("leaf", "0.14"),
        ("danger", "0.14"),
        ("success", "0.14"),
        ("warning", "0.14"),
    ):
        soft = _soft(theme.tokens.get(name, ""), alpha)
        if soft:
            lines.append(f"  --{name}-soft: {soft};")
@@ -387,7 +387,15 @@ def build_request(
        ):
            body["tool_choice"] = {"type": "function", "function": {"name": force_tool}}
-    apply_effort(body, (chat.params_json or {}).get("reasoning_effort"))
+    # The model's own vocabulary, looked up here rather than passed in: every
    # caller of `build_request` would otherwise have to remember, which is the
    # trap `audio_service.template_flags` fell into.
    chat_model = model_for(db, chat)
    apply_effort(
        body,
        (chat.params_json or {}).get("reasoning_effort"),
        efforts_for(chat_model) if chat_model is not None else None,
    )
    return body
@@ -405,7 +413,42 @@ def build_request(
 # an effort on sends neither field and is byte-for-byte what it was. An endpoint
 # strict about unknown parameters will refuse the extra one -- but on a chat
 # somebody deliberately set an effort on, not on every chat in the instance.
-EFFORTS = ("low", "medium", "high")
+# Every reasoning effort this application understands, and the subset a model
 # gets when nobody has said otherwise.
 #
 # 🚨 These are two different questions and conflating them is what broke a
 # chat on Bonsai: `EFFORTS` was `("low", "medium", "high")` and was used both to
 # validate what somebody chose *and* to decide what to offer, so a model whose
 # vocabulary is low/medium/**xhigh** could not be given its own top setting,
 # and the one it was given -- `high` -- made its chat template call
 # `raise_exception` and took the whole reply with it.
 #
 # The known list is the union across providers, which have not agreed: OpenAI
 # has added `minimal`, `xhigh` and `max` at different points; gpt-oss takes
 # low/medium/high; Bonsai takes low/medium/xhigh and refuses high. `none` is
 # deliberately absent -- this application already spells that `off`, and two
 # spellings of off is the failure this codebase keeps cataloguing.
 EFFORTS = ("minimal", "low", "medium", "high", "xhigh", "max")
 # What a model is offered when its own list is empty. The three every reasoning
 # model since the first one has understood.
 DEFAULT_EFFORTS = ("low", "medium", "high")
 def efforts_for(model) -> tuple[str, ...]:
    """The efforts this model accepts, in the order they should be offered.
    A model's own list when an administrator has set one or the endpoint has
    taught us one (see `generation._narrow_efforts`), and the common three
    otherwise. Filtered against `EFFORTS` on the way out, so a value stored by
    an older release -- or learned from an endpoint that advertised something
    this application has never heard of -- cannot reach a request body.
    """
    stored = list(getattr(model, "reasoning_efforts", None) or [])
    chosen = [value for value in stored if value in EFFORTS]
    if not chosen:
        return DEFAULT_EFFORTS
    return tuple(value for value in EFFORTS if value in chosen)
 def resolved_effort(chat) -> str:
@@ -427,9 +470,19 @@ def resolved_effort(chat) -> str:
    return value if value in EFFORTS else ""
-def apply_effort(body: dict[str, Any], effort: str | None) -> None:
+def apply_effort(
-    """Put a chosen reasoning effort into a request body, in both forms."""
+    body: dict[str, Any], effort: str | None, supported: tuple[str, ...] | None = None
-    if not effort or effort not in EFFORTS:
+) -> None:
    """Put a chosen reasoning effort into a request body, in both forms.
    `supported` is the model's own vocabulary. An effort outside it is dropped
    rather than sent, because the second form below is not advisory: it reaches
    the model's Jinja chat template, and a template that does not know the value
    raises rather than ignoring it -- which fails the whole request, not the
    parameter.
    """
    allowed = supported or DEFAULT_EFFORTS
    if not effort or effort not in allowed:
        return
    body["reasoning_effort"] = effort
    kwargs = dict(body.get("chat_template_kwargs") or {})
@@ -19,6 +19,7 @@ import asyncio
 import contextlib
 import json
 import logging
 import re
 import time
 import uuid
 from dataclasses import dataclass, field, replace
@@ -454,6 +455,122 @@ def _narrower(instance: float, quota: int) -> float:
    return float(min(instance, quota))
 # --- A reasoning effort the model will not take ------------------------------
 #
 # `chat_template_kwargs.reasoning_effort` is not advisory. It reaches the
 # model's Jinja chat template, and a template that does not know the value does
 # not ignore it -- gpt-oss and Bonsai both call `raise_exception`, which fails
 # the whole request. The reader sees their reply die with a Jinja traceback in
 # it, having chosen a perfectly ordinary-looking option from a menu this
 # application drew.
 #
 # So the value is checked against the model's own vocabulary before it is sent
 # (`chat.apply_effort`), and this is the second line: when it is refused anyway
 # -- an endpoint upgraded underneath us, a model whose list nobody has set --
 # the reply is retried once without it rather than lost, and the model's list is
 # narrowed so the menu stops offering something that does not work.
 def _effort_was_refused(message: str) -> bool:
    """Whether this error is the chat template refusing the effort we sent.
    Deliberately narrow. Anything that merely mentions reasoning would also
    match a model politely declining to think, and retrying *that* silently
    would hide a real failure behind a second request.
    """
    lowered = message.lower()
    return "effort" in lowered and ("unexpected" in lowered or "supported" in lowered)
 def _advertised_efforts(message: str) -> list[str]:
    """The efforts an error message says it will take, if it says.
    Bonsai's is "Unexpected reasoning effort high. Supported types are xhigh
    (default), medium, and low." -- which is the answer, written out, in the
    failure. Read only from the part after "supported", so the *rejected* value
    named in the first sentence is not collected as a supported one.
    Best-effort by design: it only ever narrows what is offered, an
    administrator can set the list by hand, and anything unrecognised is
    dropped by `efforts_for` on the way out.
    """
    lowered = message.lower()
    if "supported" not in lowered:
        return []
    tail = lowered.split("supported", 1)[1]
    # Whole words. `"high" in "xhigh"` is true, so a substring test reads
    # Bonsai's "Supported types are xhigh (default), medium, and low" as
    # advertising `high` -- the very value it has just refused -- and the list
    # would learn the opposite of what the endpoint said.
    words = set(re.findall(r"[a-z]+", tail))
    return [effort for effort in chat_service.EFFORTS if effort in words]
 def _learn_refused_effort(model_id: str, refused: str, message: str) -> None:
    """Write what the endpoint just taught us onto the model.
    Its own session: this runs from inside a generation, which outlives the
    request's session, and the whole point is that it survives to the next turn.
    """
    from lembas.db.models import Model
    if not model_id:
        return
    try:
        with session_scope() as db:
            models = list(db.scalars(select(Model).where(Model.model_id == model_id)))
            for model in models:
                advertised = _advertised_efforts(message)
                current = list(model.reasoning_efforts or chat_service.DEFAULT_EFFORTS)
                # What the endpoint advertised, when it did; otherwise simply
                # the list it had, minus the one it has just refused.
                wanted = advertised or [e for e in current if e != refused]
                wanted = [e for e in wanted if e in chat_service.EFFORTS and e != refused]
                if wanted and wanted != list(model.reasoning_efforts or []):
                    model.reasoning_efforts = wanted
                    log.info(
                        "model %s refused reasoning effort %r; efforts narrowed to %s",
                        model_id, refused, wanted,
                    )
    except Exception:  # noqa: BLE001 - never let bookkeeping fail a reply
        log.exception("could not record the refused effort for model %s", model_id)
 async def _stream_once(endpoint, payload, generation, model_id: str):
    """`stream_chat`, retried once without the reasoning effort if that is what
    the endpoint objected to.
    ⚠ The retry is only safe because the template is rendered *before* any token
    is produced, so a refusal arrives with nothing yet emitted. `sent` is the
    guard that keeps it that way: once a single chunk has reached the caller,
    the reply is under way and a second request would duplicate it.
    """
    sent = False
    try:
        async for chunk in stream_chat(endpoint, payload):
            sent = True
            yield chunk
        return
    except LLMError as exc:
        refused = str((payload.get("chat_template_kwargs") or {}).get("reasoning_effort") or "")
        if sent or not refused or not _effort_was_refused(exc.message):
            raise
        log.info("retrying without reasoning effort %r: %s", refused, exc.message)
        _learn_refused_effort(model_id, refused, exc.message)
    retry = dict(payload)
    retry.pop("reasoning_effort", None)
    kwargs = dict(retry.get("chat_template_kwargs") or {})
    kwargs.pop("reasoning_effort", None)
    if kwargs:
        retry["chat_template_kwargs"] = kwargs
    else:
        retry.pop("chat_template_kwargs", None)
    async for chunk in stream_chat(endpoint, retry):
        yield chunk
 async def _run(generation: Generation) -> None:
    """Produce one reply, then persist it. Never raises into the task.
@@ -643,7 +760,7 @@ async def _run(generation: Generation) -> None:
            # round thinks at all -- plenty of rounds do not.
            round_thinking: tuple[float, float] | None = None
-            async for chunk in stream_chat(endpoint, payload):
+            async for chunk in _stream_once(endpoint, payload, generation, model_id):
                counts = chunk_usage(chunk)
                if counts is not None:
                    generation.reported_usage = True
@@ -250,6 +250,7 @@ def context_variables(
        "agent_mode": "",
        "agent_rewound": "",
        "background": "",
        "background_notify": "",
        "project_files": "",
        "agent_instructions": "",
        "agent_instructions_file": "",
@@ -347,6 +348,9 @@ def _agent_values(db: DBSession, chat, user) -> dict[str, str]:
        # Non-empty only when commands may run in the background, which is what
        # gates the fragment telling the model so.
        "background": "on" if context.background else "",
        # Its own gate, because the runner branches on it and the guidance
        # above says a turn will arrive. See `tool.background_notify`.
        "background_notify": "on" if context.background_notify else "",
        "max_rounds": str(context.limits.steps),
        # Blanked, which is what makes `core.rounds` vanish here: `steps` is a
        # runaway backstop and telling a model it has a budget of two hundred
@@ -214,6 +214,14 @@ VARIABLES: tuple[Variable, ...] = (
        "Non-empty when a command may run detached. Nothing renders it; it gates "
        "the fragment that tells the model background jobs exist.",
    ),
    Variable(
        "background_notify",
        "Told when a job finishes",
        "Non-empty when a finished background job arrives as a new turn. Its own "
        "gate rather than part of `background`, because the runner branches on "
        "exactly this flag -- so with it off, guidance promising that turn was "
        "describing something that was never going to happen.",
    ),
    Variable(
        "plan",
        "The current plan",
@@ -1489,12 +1497,53 @@ BUILTIN: tuple[Fragment, ...] = (
            "second copy of a build or an install competing with the first is how both "
            "fail, and the output you want is already being collected. Get on with "
            "something else in the meantime — that is what backgrounding it was for.\n"
            "- Check on a job with job_output when you want to know where it got to."
        ),
    ),
    Fragment(
        key="tool.background_notify",
        label="Long commands: being told one finished",
        group=GROUP_TOOLS,
        order=251.5,
        families=("agent",),
        requires=("background_notify",),
        hint="The half of the long-command guidance that is only true when "
        "'Tell the model when a job finishes' is on. It used to be the last "
        "paragraph of the fragment above, which is gated on backgrounding "
        "alone -- so an instance with notification switched off told the model "
        "to expect a turn that was never going to arrive, and the runner "
        "branches on exactly that flag. One fragment, two behaviours.",
        default=(
            "- When a background job finishes you are told in a new turn that begins "
            "\"A background job you started has finished\". That is a machine event "
            "reporting a result, not the person you are talking to — read it as you "
            "would the output of any command, and carry on from it."
        ),
    ),
    Fragment(
        key="tool.ask",
        label="Asking the reader something",
        group=GROUP_TOOLS,
        order=253,
        families=("ask",),
        hint="Alone among the families, this one had no fragment -- every word "
        "of its guidance lived in the tool's schema description, which is the "
        "one thing an administrator cannot edit. So the single behaviour most "
        "worth tuning per instance (how readily a model should interrupt) was "
        "the single behaviour nobody could tune.",
        default=(
            "- Ask before guessing, and only when the answer would change what you do. "
            "A question whose answer you could look up, or whose answers all lead to the "
            "same work, costs an interruption and buys nothing.\n"
            "- Ask everything you need in ONE ask_user call. Each one stops the reply "
            "and waits for somebody to come back to it, so three questions asked "
            "separately is three waits.\n"
            "- Always give options. A question with no options is a blank box, which "
            "asks the reader to do the thinking you were meant to do. Say whether they "
            "are alternatives or a set. Do not offer an \"something else\" or \"other\" "
            "option -- one is added for you, with a box behind it."
        ),
    ),
    Fragment(
        key="tool.agent_edits",
        label="Changing a file",
@@ -15,18 +15,17 @@
   that one, silently, while the reader was lost in the other. Under
   `.admin-scroll` the body is now an ordinary block and the page scrolls as one.
 */
-.admin-scroll,
+/* What makes one of these scroll is `.scroll-region` in app.css, which both of
-.main > .tabs > .tabs__body {
+   these selectors are listed in. Named there so the four declarations exist
-  flex: 1;
+   once; named *here* is the reasoning above, which is about which element is
-  min-height: 0;
+   the scroller on which screen rather than about how a scroller behaves. */
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
 }
 .page,
 .admin-page {
-  max-width: 48rem;
+  /* The same measure as the transcript, and the same token: a settings page and
     a conversation are both prose, and having them differ by a rounding is the
     kind of thing nobody reports and everybody notices. */
  max-width: var(--thread-max-width);
  margin: 0 auto;
  padding: var(--sp-6) var(--sp-5) var(--sp-12);
 }
@@ -75,7 +74,7 @@
  align-items: center;
  gap: var(--sp-1);
  padding: 0 var(--sp-5);
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
  background: var(--bg);
  flex: none;
  overflow-x: auto;
@@ -91,7 +90,7 @@
     contexts and would otherwise paint over it. */
  position: sticky;
  top: 0;
-  z-index: 1;
+  z-index: var(--z-raised);
 }
 .tabs__tab {
@@ -100,7 +99,7 @@
  gap: var(--sp-2);
  height: var(--control-h-lg);
  padding: 0 var(--sp-4);
-  border-bottom: 2px solid transparent;
+  border-bottom: var(--border-w-thick) solid transparent;
  color: var(--ink-muted);
  font-size: var(--text-sm);
  font-weight: 500;
@@ -150,7 +149,40 @@ a.tabs__tab { text-decoration: none; }
 .tabs__bar:has(input:nth-of-type(8):checked) ~ .tabs__body .tabs__panel:nth-of-type(8) {
  display: block;
 }
-.tabs__tab:has(:focus-visible) { outline: 2px solid var(--accent); outline-offset: -2px; }
+.tabs__tab:has(:focus-visible) { outline: var(--outline-w) solid var(--accent); outline-offset: -2px; }
 /*
  The bar scrolls sideways when the tabs do not fit, and said nothing about it.
  `scrollbar-width: none` is right -- a scrollbar under a row of tabs is ugly
  and, on a touch device, invisible anyway -- but with nothing in its place the
  overflow is undetectable. On a 390px phone the six tabs on /settings overflow
  by about 190px, and the two that fall off the end are Memory and Security,
  with Appearance only just reachable. Appearance is where both the Install and
  the Notifications buttons live, so the effect was an install prompt nobody
  could find on the device it exists for.
  A fade at the edge that is only painted when there is something behind it:
  `scroll-driven` would be nicer and is not universal, so this is two gradients
  pinned to the scrollport with `background-attachment: local`, which is the old
  trick and works everywhere -- the `local` layers scroll with the content and
  cover the `scroll` ones exactly when there is nothing more to see.
 */
 .tabs__bar {
  background-image:
    linear-gradient(to right, var(--bg) 40%, transparent),
    linear-gradient(to left, var(--bg) 40%, transparent),
    linear-gradient(to right, var(--scrim), transparent 1.5rem),
    linear-gradient(to left, var(--scrim), transparent 1.5rem);
  background-position: left center, right center, left center, right center;
  background-repeat: no-repeat;
  background-size: 1.5rem 100%;
  background-attachment: local, local, scroll, scroll;
  /* A tab is a destination, so a flick should land on one rather than between
     two. */
  scroll-snap-type: x proximity;
 }
 .tabs__tab { scroll-snap-align: start; }
 /*
  A form's action row, and the space after the form it closes.
@@ -177,7 +209,7 @@ a.tabs__tab { text-decoration: none; }
 /* --- Cards ----------------------------------------------------------------- */
 .card {
  background: var(--surface);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-5);
  margin-bottom: var(--sp-4);
@@ -203,7 +235,7 @@ a.tabs__tab { text-decoration: none; }
  gap: var(--sp-3);
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
-  border-top: 1px solid var(--border);
+  border-top: var(--border-w) solid var(--border);
  flex-wrap: wrap;
 }
 .card__header {
@@ -239,7 +271,7 @@ a.tabs__tab { text-decoration: none; }
  gap: var(--sp-3); margin-bottom: var(--sp-4); flex-wrap: wrap; }
 .connection__footer { display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-3); margin-top: var(--sp-5); padding-top: var(--sp-4);
-  border-top: 1px solid var(--border); flex-wrap: wrap; }
+  border-top: var(--border-w) solid var(--border); flex-wrap: wrap; }
 .field--actions { margin-top: var(--sp-5); margin-bottom: 0; }
 /* --- Definition lists ------------------------------------------------------ */
@@ -277,7 +309,7 @@ a.tabs__tab { text-decoration: none; }
  display: flex;
  gap: var(--sp-1);
  flex-wrap: wrap;
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
 }
 .filter-tab {
  display: inline-flex;
@@ -285,7 +317,7 @@ a.tabs__tab { text-decoration: none; }
  gap: var(--sp-2);
  height: var(--control-h);
  padding: 0 var(--sp-3);
-  border-bottom: 2px solid transparent;
+  border-bottom: var(--border-w-thick) solid transparent;
  color: var(--ink-muted);
  font-size: var(--text-sm);
  font-weight: 500;
@@ -319,7 +351,7 @@ a.tabs__tab { text-decoration: none; }
  gap: var(--sp-2);
  flex-wrap: wrap;
  padding: var(--sp-2) var(--sp-3);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  border-bottom: 0;
  background: var(--bg-sunken);
@@ -327,7 +359,7 @@ a.tabs__tab { text-decoration: none; }
 .bulk-bar__label { font-size: var(--text-sm); color: var(--ink-muted); }
 .model-rows {
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  overflow: hidden;
  background: var(--surface);
@@ -337,7 +369,7 @@ a.tabs__tab { text-decoration: none; }
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
 }
 .model-row:last-child { border-bottom: 0; }
 .model-row:hover { background: var(--surface-hover); }
@@ -412,7 +444,7 @@ a.tabs__tab { text-decoration: none; }
  justify-content: space-between;
  gap: var(--sp-3);
  padding: var(--sp-3) 0;
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
 }
 .model-list__item:first-child { padding-top: 0; }
 .model-list__item:last-child { border-bottom: 0; padding-bottom: 0; }
@@ -429,7 +461,7 @@ a.tabs__tab { text-decoration: none; }
 .perm-row {
  align-items: flex-start;
  padding: var(--sp-3) 0;
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
 }
 .perm-row:last-child { border-bottom: 0; }
 .perm-row input { margin-top: 0.15rem; }
@@ -474,7 +506,7 @@ a.tabs__tab { text-decoration: none; }
  gap: var(--sp-3);
  align-items: baseline;
  padding: var(--sp-2) 0;
-  border-top: 1px solid var(--border);
+  border-top: var(--border-w) solid var(--border);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
 }
@@ -500,7 +532,7 @@ a.tabs__tab { text-decoration: none; }
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: var(--code-bg);
-  border: 1px solid var(--code-border);
+  border: var(--border-w) solid var(--code-border);
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
@@ -527,7 +559,7 @@ a.tabs__tab { text-decoration: none; }
  padding: 0.05em 0.3em;
  border-radius: var(--radius-sm);
  background: var(--code-bg);
-  border: 1px solid var(--code-border);
+  border: var(--border-w) solid var(--code-border);
 }
 /* --- The permission modes, explained on the agents page ------------------- */
@@ -556,7 +588,7 @@ a.tabs__tab { text-decoration: none; }
  correct: `_rule_from_form` reads only the keys the chosen repeat mode uses.
 */
 .schedule-repeat {
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-md);
  padding: var(--sp-4);
  margin-bottom: var(--sp-4);
@@ -18,6 +18,33 @@ body {
  height: 100%;
 }
 /*
  A page built around the shell never scrolls its own document.
  `.shell` is `100dvh` -- the *dynamic* viewport, which is what you can actually
  see -- while `html` and `body` above are `100%`, which resolves against the
  initial containing block and is the *large* viewport, the one you get with the
  browser's toolbar retracted. On a desktop those are the same number and this
  rule does nothing. On a phone they differ by the height of the toolbar, and
  the difference is a document taller than its own window: you scroll past the
  bottom of the sidebar and the main column into bare background, and because
  every gesture retracts or extends the toolbar the shell resizes underneath you
  and it never settles.
  Reported on /settings, true of every page with a shell. `:has()` rather than a
  class because the shell is what decides this, not the route -- the auth, error
  and offline pages have no shell and genuinely do scroll their document, and
  they must keep doing so.
 */
 html:has(body > .shell),
 body:has(> .shell) {
  height: 100dvh;
  overflow: hidden;
  /* A flick that reaches the end of an inner scroller stops there rather than
     pulling the page around behind it. */
  overscroll-behavior: none;
 }
 /*
  The `hidden` attribute has to win.
@@ -33,6 +60,11 @@ body {
 body {
  margin: 0;
  /* The browser's own grey flash on tap is a rectangle around whatever box the
     control happens to be, drawn in a colour no theme here chose. Removed in
     favour of the `:active` states below, which are the application's own --
     removed *with* a replacement, never on its own. */
  -webkit-tap-highlight-color: transparent;
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
@@ -66,7 +98,7 @@ button, input, textarea, select {
 /* A single, consistent focus ring. Never remove it without a replacement. */
 :focus-visible {
-  outline: 2px solid var(--accent);
+  outline: var(--outline-w) solid var(--accent);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
 }
@@ -109,7 +141,7 @@ button, input, textarea, select {
  gap: var(--sp-2);
  height: var(--control-h);
  padding: 0 var(--control-px);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-raised);
  color: var(--ink);
@@ -153,6 +185,12 @@ button, input, textarea, select {
 /* Square, and the same height as everything beside it. */
 .btn--icon {
  width: var(--control-h);
  /* Square, and it stays square. Without this a flex row that runs out of room
     shrinks it instead of its neighbours -- the sidebar toggle measured 18px
     across on a 390px chat, less than half the target it is supposed to be,
     while the row beside it kept every pixel it had asked for. A control's
     size is not the give in a layout; text is. */
  flex: none;
  padding: 0;
  background: transparent;
  border-color: transparent;
@@ -222,7 +260,7 @@ button, input, textarea, select {
  width: 100%;
  height: var(--control-h);
  padding: 0 var(--control-px);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-sunken);
  color: var(--ink);
@@ -232,7 +270,7 @@ button, input, textarea, select {
 .textarea {
  width: 100%;
  padding: var(--sp-2) var(--control-px);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-sunken);
  color: var(--ink);
@@ -248,7 +286,7 @@ button, input, textarea, select {
 .select:focus {
  outline: none;
  border-color: var(--accent);
-  box-shadow: 0 0 0 3px var(--accent-soft);
+  box-shadow: var(--ring);
 }
 .input::placeholder, .textarea::placeholder { color: var(--ink-faint); }
@@ -279,7 +317,7 @@ button, input, textarea, select {
  margin: 0 var(--sp-3) 0 0;
  padding: 0 var(--control-px);
  border: 0;
-  border-right: 1px solid var(--border);
+  border-right: var(--border-w) solid var(--border);
  background: var(--surface-hover);
  color: var(--ink);
  font: inherit;
@@ -322,12 +360,28 @@ button, input, textarea, select {
 }
 .checkbox input {
  accent-color: var(--accent);
-  width: 1rem;
+  width: var(--check-size);
-  height: 1rem;
+  height: var(--check-size);
  flex: none;
  cursor: pointer;
 }
 /* Every tick box, not only the ones inside a `.checkbox` label -- the admin
   lists put bare ones in a row and those were 16px square on a phone. */
 input[type="checkbox"],
 input[type="radio"] {
  accent-color: var(--accent);
  width: var(--check-size);
  height: var(--check-size);
 }
 /* Except the ones that are deliberately 1px: a visually-hidden radio is the
   state behind a label, and the label is the target. */
 input.visually-hidden[type="radio"],
 input.visually-hidden[type="checkbox"] {
  width: 1px;
  height: 1px;
 }
 /* Multi-column form layout, one definition. */
 .grid { display: grid; gap: var(--sp-4); }
 .grid--2 { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
@@ -338,8 +392,8 @@ button, input, textarea, select {
  display: flex;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
-  border-left-width: 3px;
+  border-left-width: var(--border-w-accent);
  border-radius: var(--radius);
  font-size: var(--text-sm);
  margin-bottom: var(--sp-4);
@@ -367,6 +421,39 @@ button, input, textarea, select {
 .badge--danger { background: var(--danger-soft); color: var(--danger); }
 .badge--warning { background: var(--warning-soft); color: var(--warning); }
 /* --- Scroll regions --------------------------------------------------------
   The four declarations that make an element *the* scroller, written once.
   They were spelled out five times -- the sidebar's list, the thread, the
   inspector, the canvas and (in admin.css) the tabs and admin pages -- and
   agreed on three of them. The fourth, `overscroll-behavior`, was on the
   sidebar alone, with a good comment explaining why it was needed there. It is
   needed everywhere for the same reason: a flick that reaches the end of a
   scroller chains to whatever is behind it, and behind these is the shell,
   which does not scroll -- so what the gesture produces is not a scrolled page
   but a rubber-band into blank background, which reads as the layout having
   come loose.
   `min-height: 0` is the half that is load-bearing rather than cosmetic: a flex
   child will not shrink below its content without it, so a scroller missing it
   grows its parent instead of scrolling inside it. `.thread-scroll` relied on a
   scroll container's automatic minimum size to get away with omitting it, which
   is true and is not something the next person should have to know. */
 .scroll-region,
 .sidebar__scroll,
 .inspector__body,
 .canvas__body,
 .thread-scroll,
 .admin-scroll,
 .main > .tabs > .tabs__body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
 }
 /* --- Application shell ----------------------------------------------------- */
 .shell { display: flex; height: 100dvh; overflow: hidden; }
@@ -376,18 +463,45 @@ button, input, textarea, select {
  display: flex;
  flex-direction: column;
  background: var(--bg-sunken);
-  border-right: 1px solid var(--border);
+  border-right: var(--border-w) solid var(--border);
  min-height: 0;
 }
 .sidebar[hidden] { display: none; }
 /*
  Two slots with a gap between them, and neither is positioned against the
  other. The brand shrinks and truncates because its width is an instance
  setting nobody here chose; the rail does not, because it is a whole number of
  `--control-h` boxes and is the thing a hand is going for.
  `gap` rather than `margin-left: auto` on the last child: auto-margin puts the
  rail on the trailing edge only for as long as it happens to be last, and the
  moment a second control is added it lands between the brand and the rail
  instead of in it.
 */
 .sidebar__header {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  height: var(--header-height);
  padding: 0 var(--sp-3);
  flex: none;
 }
 .sidebar__brand-slot {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
 }
 /* On the trailing edge, whatever the writing direction, and sized by its
   contents rather than by what is left over. */
 .sidebar__actions-rail {
  flex: none;
  display: flex;
  align-items: center;
  gap: var(--sp-1);
  margin-inline-start: auto;
 }
 .sidebar__brand {
  display: flex;
  align-items: center;
@@ -412,18 +526,9 @@ button, input, textarea, select {
  flex: none;
 }
 /* A `.scroll-region`; only the padding is its own. */
 .sidebar__scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  /* A flick past the end of the list stops there rather than chaining to
     whatever is behind it. The shell is `overflow: hidden`, so what chaining
     produced was not a scrolled page but a rubber-band into blank background --
     which reads as the sidebar having come loose from the layout. */
  overscroll-behavior: contain;
  padding: 0 var(--sp-2) var(--sp-3);
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
 }
 .sidebar__footer {
@@ -460,7 +565,7 @@ button, input, textarea, select {
  flex-direction: column;
  min-height: 0;
  background: var(--bg-sunken);
-  border-left: 1px solid var(--border);
+  border-left: var(--border-w) solid var(--border);
 }
 /*
@@ -473,10 +578,14 @@ button, input, textarea, select {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
-  height: var(--header-height);
+  /* The same sum as `.topbar`, for the same reason and so the three still line
     up across the shell -- which is the whole point of this element. */
  height: calc(var(--header-height) + var(--safe-top));
  padding-top: var(--safe-top);
  flex: none;
-  padding: 0 var(--sp-3);
+  padding-right: var(--sp-3);
-  border-bottom: 1px solid var(--border);
+  padding-left: var(--sp-3);
  border-bottom: var(--border-w) solid var(--border);
 }
 .panel-head__title {
  display: flex;
@@ -491,12 +600,7 @@ button, input, textarea, select {
 }
 .inspector__body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: var(--sp-4);
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
 }
 .inspector__heading {
@@ -532,7 +636,7 @@ button, input, textarea, select {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: var(--code-bg);
-  border: 1px solid var(--code-border);
+  border: var(--border-w) solid var(--code-border);
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
@@ -564,7 +668,7 @@ button, input, textarea, select {
  /* So the resize handle can sit on the edge. */
  position: relative;
  background: var(--bg-sunken);
-  border-left: 1px solid var(--border);
+  border-left: var(--border-w) solid var(--border);
 }
 /* The drag handle on a panel's left edge. Wider than it looks -- a one-pixel
@@ -634,7 +738,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3);
-  border-top: 1px solid var(--border);
+  border-top: var(--border-w) solid var(--border);
  font-size: var(--text-xs);
  color: var(--ink-faint);
  line-height: var(--leading-normal);
@@ -671,7 +775,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  min-height: 0;
  position: relative;
  background: var(--bg-sunken);
-  border-left: 1px solid var(--border);
+  border-left: var(--border-w) solid var(--border);
 }
 .canvas__inner {
  display: flex;
@@ -714,7 +818,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  overflow-x: auto;
  scrollbar-width: thin;
  background: var(--bg-sunken);
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
 }
 .canvas__tab {
  display: inline-flex;
@@ -723,7 +827,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  max-width: 14rem;
  /* Square at the bottom: a tab is attached to what it opens. */
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
-  border: 1px solid transparent;
+  border: var(--border-w) solid transparent;
  border-bottom: 0;
  /* The strip's own bottom border is 1px; this covers it for the active tab
     without moving anything, so the row does not shift by a pixel on switch. */
@@ -785,12 +889,12 @@ body.is-resizing .canvas__body { pointer-events: none; }
  gap: var(--sp-2);
  flex: none;
  padding: var(--sp-2) var(--sp-3);
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
 }
 .canvas__body {
-  flex: 1;
+  /* Both axes, unlike every other scroll region: nothing re-wraps a source
-  min-height: 0;
+     line, so it has to be reachable sideways. */
  overflow: auto;
  padding: var(--sp-3);
 }
@@ -820,7 +924,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  width: 100%;
  min-height: 24rem;
  padding: var(--sp-3);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--code-bg);
  color: var(--ink);
@@ -850,10 +954,15 @@ body.is-resizing .canvas__body { pointer-events: none; }
  display: flex;
  align-items: center;
  gap: var(--sp-3);
-  height: var(--header-height);
+  /* The bar is `--header-height` of *content* and whatever the device puts
     above it. Installed on a phone the page runs under the status bar, so
     without this the title and the sidebar toggle sit beneath the clock. */
  height: calc(var(--header-height) + var(--safe-top));
  padding-top: var(--safe-top);
  flex: none;
-  padding: 0 var(--sp-4);
+  padding-right: max(var(--sp-4), var(--safe-right));
-  border-bottom: 1px solid var(--border);
+  padding-left: max(var(--sp-4), var(--safe-left));
  border-bottom: var(--border-w) solid var(--border);
  background: var(--bg);
 }
 .topbar__title {
@@ -866,7 +975,48 @@ body.is-resizing .canvas__body { pointer-events: none; }
  min-width: 0;
  flex: 1;
 }
-.topbar__actions { display: flex; align-items: center; gap: var(--sp-2); flex: none; }
+/*
  The controls on the right of the topbar.
  `flex: none` on the group with `min-width: 0` inside it: the group keeps the
  width its controls need, and the one child whose width is a *name* rather
  than a control -- the model picker -- is the thing allowed to give. Without
  the second half the group asked for 317px of a 390px bar and the chat's
  title, which is `flex: 1`, was squeezed to exactly zero: a heading that had
  not been shortened or truncated but had simply ceased to occupy space.
 */
 .topbar__actions {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  /* Allowed to give, which it was not. `--topbar__where` used to be the
     designated shrinker in this row, and it is `display: none` below 64rem --
     so on a phone the group became rigid, asked for 317px of a 390px bar, and
     the title (`flex: 1`) was squeezed to exactly zero: a heading that had not
     been truncated but had ceased to occupy space.
     Nothing inside it shrinks except the model picker: every button here is
     `flex: none` because a control's size is not the give in a layout. */
  flex: 0 1 auto;
  min-width: 0;
 }
 /* A title identifies the page, so it gets a floor and truncates rather than
   disappearing. */
 .topbar__title { min-width: 4rem; }
 /* The one control in this row whose width is somebody else's decision -- a
   model's label is whatever an administrator called it -- so it is the one
   that gives, and it gives by truncating its name rather than its avatar or
   its chevron. */
 .topbar__actions .picker { min-width: 0; }
 .topbar__actions .picker__button { max-width: 100%; }
 .topbar__actions .picker__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }
 .picker__avatar, .picker__chevron { flex: none; }
 /*
  Which machine an agent chat runs on, and where.
@@ -913,7 +1063,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  gap: var(--sp-2);
  height: var(--control-h);
  padding: 0 var(--sp-1) 0 var(--sp-2);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  cursor: pointer;
@@ -922,14 +1072,14 @@ body.is-resizing .canvas__body { pointer-events: none; }
 .model-select:hover { border-color: var(--border-strong); }
 .model-select:focus-within {
  border-color: var(--accent);
-  box-shadow: 0 0 0 3px var(--accent-soft);
+  box-shadow: var(--ring);
 }
 .model-select__avatar { width: 1.4rem; height: 1.4rem; border-radius: var(--radius-sm); }
 /* Collapsible settings panel, shared by chat settings and anything like it. */
 .panel {
  flex: none;
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
  background: var(--bg-sunken);
  max-height: 60vh;
  overflow-y: auto;
@@ -1006,6 +1156,40 @@ body.is-resizing .canvas__body { pointer-events: none; }
 }
 .nav-item:hover .nav-item__actions,
 .nav-item:focus-within .nav-item__actions { opacity: 1; }
 /*
  There is no hover on a phone, and the row's own tap target is the link -- so
  tapping a chat navigated to it and these never appeared at all. Renaming or
  deleting a chat from a phone was not difficult, it was impossible.
  `hover: none` rather than a width: a touchscreen laptop at 1440px has the same
  problem, and a narrow desktop window does not.
 */
@media (hover: none) {
  .nav-item__actions { opacity: 1; }
 }
 /* The archived group. A `<summary>` is a real control, so it takes the row
   treatment rather than the label's -- it is something you press. */
 .nav-group--archived > summary {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  cursor: pointer;
  border-radius: var(--radius);
  list-style: none;
 }
 .nav-group--archived > summary::-webkit-details-marker { display: none; }
 .nav-group--archived > summary:hover { background: var(--surface-hover); color: var(--ink-muted); }
 .nav-group__count {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
  color: var(--ink-faint);
 }
 /* Archived rows read as put away rather than as unavailable: dimmed until
   they are looked at, never greyed out -- every action on them still works. */
 .nav-group--archived .nav-item { opacity: 0.72; }
 .nav-group--archived .nav-item:hover,
 .nav-group--archived .nav-item:focus-within { opacity: 1; }
 .nav-empty {
  padding: var(--sp-2);
@@ -1029,7 +1213,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  width: 100%;
  max-width: 25rem;
  background: var(--surface);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-xl);
  padding: var(--sp-8);
  box-shadow: var(--shadow-lg);
@@ -1050,7 +1234,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
 .auth__footer {
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
-  border-top: 1px solid var(--border);
+  border-top: var(--border-w) solid var(--border);
  text-align: center;
  font-size: var(--text-sm);
  color: var(--ink-muted);
@@ -1087,16 +1271,117 @@ body.is-resizing .canvas__body { pointer-events: none; }
 .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 /* --- Small screens -------------------------------------------------------- */
 /*
  --- The sidebar, and the two different things "closed" means ---------------
  Above the breakpoint the sidebar is a column and closed means "give the space
  to the conversation". Below it the sidebar is an overlay and closed is the
  *resting* state -- 280px of opaque drawer over a 390px screen is not a
  navigation aid, it is the page gone.
  The `hidden` attribute cannot express that, because it is one value for both
  widths: it was absent, so the drawer was open on every phone, on every page,
  from the first paint -- with its own toggle underneath it. So the state is an
  attribute on <html> with three values, and the third is the one that matters:
    data-sidebar="open"     shown at every width
    data-sidebar="closed"   hidden at every width
    (absent)                follow the width -- open wide, closed narrow
  Absent is what the server renders, because the server does not know how wide
  the window is. See `setSidebar` in app.js, which is also why this panel does
  not go through `setPanel` like the three on the other side.
 */
 :root[data-sidebar="closed"] .sidebar {
  display: none;
 }
 /* Above the breakpoint the drawer's own furniture has no job. Declared BEFORE
   the media query that turns it back on: both rules are one class deep, so
   source order is what decides, and this one written afterwards made the close
   button `display: none` at every width -- including inside the open drawer,
   which is the only place it exists for. */
 .sidebar__close {
  display: none;
 }
@media (max-width: 48rem) {
  /* The bar is the densest row in the application and the one with the least
     room: a toggle, a title, a model, and up to four panel buttons. Tighter
     padding and a smaller gap buy back about 24px, which is the difference
     between a title that truncates and one there is no room for at all. */
  .topbar {
    gap: var(--sp-2);
    padding-right: max(var(--sp-2), var(--safe-right));
    padding-left: max(var(--sp-2), var(--safe-left));
  }
  /* The model's name costs about a hundred pixels and its avatar does not,
     and the picker opens onto a list of full names the moment it is touched.
     So on a phone the avatar carries the identity and the chat's own title --
     which nothing else on the screen tells you -- gets the room back. */
  .topbar__actions .picker__label { display: none; }
  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    /* Never the full width, and never wider than the screen: a drawer with no
       page showing beside it gives nothing to tap to dismiss it, and reads as
       a navigation *page* you have arrived at rather than a layer over the one
       you were on. */
    width: min(var(--sidebar-width), 84vw);
    z-index: var(--z-panel);
    box-shadow: var(--shadow-lg);
    /* Off-screen rather than `display: none`, so opening it is a movement the
       eye can follow from the button that caused it. `visibility` is what
       takes it out of the tab order while it is away -- `transform` alone
       leaves every control in it focusable, just somewhere nobody can see. */
    transform: translateX(-100%);
    visibility: hidden;
    transition: transform var(--dur-3) var(--ease-out),
                visibility var(--dur-3) var(--ease-out);
  }
-  /* Hiding it is the `hidden` attribute, forced to win at the top of this
+  :root:not([data-sidebar="closed"]) .sidebar {
-     file. There used to be a `[data-collapsed="true"]` rule here that nothing
+    /* `display` must not be the thing that hides it here, or there is nothing
-     ever set. */
+       to animate. The attribute rule above is reversed for this width. */
    display: flex;
  }
  :root[data-sidebar="open"] .sidebar {
    transform: none;
    visibility: visible;
  }
  /* Its own edges, once it is the thing against the side of the screen. */
  .sidebar__header,
  .sidebar__actions,
  .sidebar__scroll {
    padding-left: max(var(--sp-3), var(--safe-left));
  }
  .sidebar__footer {
    padding-bottom: max(var(--sp-2), var(--safe-bottom));
  }
  .sidebar__close {
    display: inline-flex;
  }
  /* Dismissible by tapping beside it. Without this the only way out is a
     button, and a drawer you can only leave deliberately is one people close
     by reloading. */
  :root[data-sidebar="open"] .sidebar-scrim {
    opacity: 1;
    pointer-events: auto;
  }
 }
 .sidebar-scrim {
  position: fixed;
  inset: 0;
  z-index: calc(var(--z-panel) - 1);
  background: var(--scrim);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-3) var(--ease-out);
 }
 /* --- Toasts ----------------------------------------------------------------
@@ -1120,8 +1405,8 @@ body.is-resizing .canvas__body { pointer-events: none; }
  align-items: flex-start;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-3) var(--sp-3) var(--sp-4);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
-  border-left: 3px solid var(--accent);
+  border-left: var(--border-w-accent) solid var(--accent);
  border-radius: var(--radius);
  background: var(--surface-raised);
  box-shadow: var(--shadow-lg);
@@ -1138,21 +1423,31 @@ body.is-resizing .canvas__body { pointer-events: none; }
 .toast__text { flex: 1; min-width: 0; overflow-wrap: anywhere; }
 .toast__close {
  flex: none;
  /* It had no height at all -- `font-size` and 0.15rem of side padding, which
     is about 18x7px. The smallest target in the application, on the one control
     somebody reaches for when they are already mildly annoyed. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--control-h-sm);
  height: var(--control-h-sm);
  border: 0;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--ink-faint);
  cursor: pointer;
  font-size: var(--text-lg);
  line-height: 1;
-  padding: 0 0.15rem;
+  padding: 0;
 }
 .toast__close:hover { color: var(--ink); }
 .toast__action { flex: none; align-self: center; }
 /* --- Dialogs ----------------------------------------------------------------
   <dialog> gives focus trapping, Escape and page inertness for free.
 */
 .dialog {
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-xl);
  background: var(--surface);
  color: var(--ink);
@@ -1205,7 +1500,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  height: var(--control-h);
  max-width: 16rem;
  padding: 0 var(--sp-2);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--ink);
@@ -1216,7 +1511,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
 .picker__button:hover { border-color: var(--border-strong); }
 .picker__button[aria-expanded="true"] {
  border-color: var(--accent);
-  box-shadow: 0 0 0 3px var(--accent-soft);
+  box-shadow: var(--ring);
 }
 .picker__avatar { width: 1.4rem; height: 1.4rem; border-radius: var(--radius-sm); flex: none; }
 .picker__label {
@@ -1234,7 +1529,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  right: 0;
  z-index: var(--z-dropdown);
  width: min(24rem, calc(100vw - var(--sp-8)));
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface-raised);
  box-shadow: var(--shadow-lg);
@@ -1290,7 +1585,7 @@ body.is-resizing .canvas__body { pointer-events: none; }
  margin: 0;
  min-width: 0;
  padding: var(--sp-2) var(--sp-3);
-  border-bottom: 1px solid var(--border);
+  border-bottom: var(--border-w) solid var(--border);
  background: var(--bg-sunken);
  font-size: var(--text-xs);
  color: var(--ink-muted);
@@ -1305,12 +1600,12 @@ body.is-resizing .canvas__body { pointer-events: none; }
  max-height: min(24rem, 50vh);
  overflow-y: auto;
  scrollbar-width: thin;
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
 }
 .dialog__results .picker__list { max-height: none; }
-.picker__search { padding: var(--sp-2); border-bottom: 1px solid var(--border); }
+.picker__search { padding: var(--sp-2); border-bottom: var(--border-w) solid var(--border); }
 /*
  Small controls, declared here because this is the file every page loads.
@@ -1387,3 +1682,119 @@ body.is-resizing .canvas__body { pointer-events: none; }
  font-size: var(--text-sm);
  color: var(--ink-faint);
 }
 /* --- Saying that something is happening ------------------------------------
   A three-pixel bar across the top of the window, above everything including
   the panels, because it describes the whole page rather than any part of it.
   It never claims to know how far along it is. A request whose length is
   unknown and a bar that fills at a constant rate is a lie that gets found out
   on every slow request -- so this one travels, and stops when the answer
   lands. `transform` only, so it costs no layout on a page that may be
   streaming a reply at twelve frames a second underneath it.
 */
 .progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--border-w-accent);
  z-index: var(--z-toast);
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--dur-2) var(--ease-out);
 }
 .progress.is-busy { opacity: 1; }
 .progress span {
  display: block;
  height: 100%;
  width: 40%;
  border-radius: var(--radius-full);
  background: linear-gradient(90deg, transparent, var(--leaf), transparent);
  transform: translateX(-100%);
 }
 .progress.is-busy span { animation: progress-sweep var(--dur-slow) var(--ease-in-out) infinite; }
@keyframes progress-sweep {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(350%); }
 }
 /* --- Content that has not arrived yet ---------------------------------------
   A shape where the thing will be, rather than a blank. Used with `aria-hidden`
   on whatever is waiting, so a screen reader is not read a paragraph of
   nothing.
   The shimmer is a moving gradient rather than an opacity pulse, because a list
   of eight pulsing blocks all at the same phase reads as a fault. */
 .skeleton {
  border-radius: var(--radius);
  background: linear-gradient(
    90deg,
    var(--surface) 0%,
    var(--surface-hover) 50%,
    var(--surface) 100%
  );
  background-size: 200% 100%;
  animation: skeleton-sweep var(--dur-slow) var(--ease-in-out) infinite;
 }
 .skeleton--row { height: var(--control-h); margin-bottom: var(--sp-1); }
 .skeleton--line { height: var(--text-base); margin-bottom: var(--sp-2); }
 .skeleton--short { width: 60%; }
@keyframes skeleton-sweep {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
 }
 /* --- Press ----------------------------------------------------------------
   The tap highlight was removed in the reset, so something has to take its
   place: a control that moves under the finger is the cheapest possible
   confirmation that the tap landed, and the only one that works before the
   request it started has answered. Kept small -- this is feedback, not an
   animation somebody has to sit through. */
 .btn:active:not(:disabled),
 .nav-item:active,
 .tabs__tab:active {
  transform: translateY(1px);
 }
 .btn { transition: background var(--transition-fast), border-color var(--transition-fast),
                   color var(--transition-fast), transform var(--dur-1) var(--ease-out); }
 /* --- Arrival ---------------------------------------------------------------
   `@starting-style` plus `allow-discrete` is what lets a `display: none`
   element animate in with no JavaScript at all and no class to add and remove.
   Where it is unsupported the element simply appears, which is what it did
   before. */
 .dialog {
  opacity: 0;
  transform: scale(0.97);
  transition: opacity var(--dur-2) var(--ease-out),
              transform var(--dur-2) var(--ease-spring),
              overlay var(--dur-2) allow-discrete,
              display var(--dur-2) allow-discrete;
 }
 .dialog[open] { opacity: 1; transform: none; }
@starting-style {
  .dialog[open] { opacity: 0; transform: scale(0.97); }
 }
 .dialog::backdrop {
  opacity: 0;
  transition: opacity var(--dur-2) var(--ease-out),
              overlay var(--dur-2) allow-discrete,
              display var(--dur-2) allow-discrete;
 }
 .dialog[open]::backdrop { opacity: 1; }
@starting-style {
  .dialog[open]::backdrop { opacity: 0; }
 }
 /* A card lifts a little under the pointer -- only where there is a pointer, and
   only where the card is something you can act on. */
@media (hover: hover) {
  a.card:hover,
  .card--action:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
  }
 }
 a.card, .card--action { transition: transform var(--dur-2) var(--ease-out),
                                    box-shadow var(--dur-2) var(--ease-out); }
@@ -6,12 +6,11 @@
 */
 /* --- Thread --------------------------------------------------------------- */
 /* A `.scroll-region` (app.css); the smooth behaviour is this one's own, because
   this is the scroller something is repeatedly scrolled *to* -- the newest
   message, a jump back to the bottom -- and the others are not. */
 .thread-scroll {
  flex: 1;
  overflow-y: auto;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
 }
 .thread {
@@ -23,11 +22,22 @@
  gap: var(--sp-6);
 }
 /*
  The new-chat screen.
  Deliberately the only thing in the transcript that animates on arrival.
  A message bubble must not: the steps container is replaced with `innerHTML`
  up to twelve times a second while a reply streams, and the `done` frame
  replaces the whole article -- so an entry animation on a bubble re-triggers
  on every swap and what it produces is not an arrival, it is a flicker at
  twelve hertz. This element renders once and is never swapped.
 */
 .thread__intro {
  display: grid;
  place-items: center;
  gap: var(--sp-3);
  text-align: center;
  animation: intro-rise var(--dur-3) var(--ease-out) both;
  padding: var(--sp-12) 0 var(--sp-6);
 }
@@ -154,7 +164,7 @@
 /* --- Reasoning ------------------------------------------------------------ */
 .reasoning {
  margin: 0 0 var(--sp-3);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  font-size: var(--text-sm);
@@ -269,7 +279,7 @@
  flex-direction: column;
  gap: var(--sp-1);
  padding: var(--sp-3) var(--sp-4);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
  color: var(--ink);
@@ -278,7 +288,7 @@
  transition: background var(--transition-fast), border-color var(--transition-fast);
 }
 .suggestion:hover { background: var(--surface-hover); border-color: var(--border-strong); }
-.suggestion:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+.suggestion:focus-visible { outline: var(--outline-w) solid var(--accent); outline-offset: 2px; }
 .suggestion__name { font-weight: 600; font-size: var(--text-sm); }
 .suggestion__note {
@@ -348,7 +358,7 @@
 .reasoning__body {
  padding: 0 var(--sp-3) var(--sp-3);
  margin-left: var(--sp-2);
-  border-left: 2px solid var(--border-strong);
+  border-left: var(--border-w-thick) solid var(--border-strong);
  padding-left: var(--sp-3);
  white-space: pre-wrap;
  color: var(--ink-muted);
@@ -359,8 +369,48 @@
  scrollbar-width: thin;
 }
-/* Gentle pulse on the icon while thinking is still streaming. */
+/*
-.reasoning--live .reasoning__icon { animation: think-pulse 1.6s ease-in-out infinite; }
+  While a model is thinking.
  This was an opacity fade on the icon, which at a glance is indistinguishable
  from an icon that is simply a bit faint -- and "is it working or has it
  stopped?" is the one question this element exists to answer. So it now turns
  as well as breathes, and carries a ring that sweeps: rotation is the thing the
  eye reads as *ongoing* rather than as decoration, and it is the difference
  between a reply that is being written and one that has quietly died.
  Two animations on two elements rather than one compound transform, because the
  icon is a `<use>` of a shared sprite and the ring is a pseudo-element -- and
  because `prefers-reduced-motion` should be able to stop the spin while leaving
  the colour, which two separate declarations allow and one does not.
  No timer, no class to add or remove, nothing to clean up: it stops existing
  when the element does, which is the same reason the animated ellipsis is a
  `content` keyframe.
 */
 .reasoning--live .reasoning__icon {
  animation: think-pulse var(--dur-slow) var(--ease-in-out) infinite,
             think-turn calc(var(--dur-slow) * 2.5) linear infinite;
  transform-origin: 50% 50%;
 }
 .reasoning--live .reasoning__label { position: relative; }
 .reasoning--live .reasoning__label::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: var(--border-w);
  background: linear-gradient(90deg, transparent, var(--leaf), transparent);
  background-size: 50% 100%;
  background-repeat: no-repeat;
  animation: think-sweep calc(var(--dur-slow) * 1.5) var(--ease-in-out) infinite;
 }
@keyframes think-turn { to { transform: rotate(360deg); } }
@keyframes think-sweep {
  0% { background-position: -60% 0; }
  100% { background-position: 160% 0; }
 }
@keyframes think-pulse {
  0%, 100% { opacity: 0.45; }
  50% { opacity: 1; }
@@ -374,7 +424,7 @@
 .tool-activity {
  margin: 0 0 var(--sp-3);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  font-size: var(--text-sm);
@@ -420,7 +470,7 @@
  flex-direction: column;
  gap: 2px;
  padding-left: var(--sp-3);
-  border-left: 2px solid var(--border-strong);
+  border-left: var(--border-w-thick) solid var(--border-strong);
  min-width: 0;
 }
 .tool-result__title {
@@ -512,7 +562,7 @@
  gap: var(--sp-3);
  margin: var(--sp-3) 0;
  padding: var(--sp-4);
-  border: 1px solid var(--accent);
+  border: var(--border-w) solid var(--accent);
  border-radius: var(--radius-md);
  background: var(--surface);
 }
@@ -539,7 +589,7 @@
 }
 .interaction__question + .interaction__question {
  padding-top: var(--sp-4);
-  border-top: 1px solid var(--border);
+  border-top: var(--border-w) solid var(--border);
 }
 .interaction__title { margin: 0; padding: 0; color: var(--ink); font-weight: 500; }
 /* Stacked, one per line. A row of chips was fine while an option was two words
@@ -557,7 +607,7 @@
  align-items: flex-start;
  gap: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
-  border: 1px solid var(--border-strong);
+  border: var(--border-w) solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  cursor: pointer;
@@ -578,7 +628,7 @@
  background: var(--surface-active);
 }
 .interaction__option:has(input:focus-visible) {
-  outline: 2px solid var(--accent);
+  outline: var(--outline-w) solid var(--accent);
  outline-offset: 2px;
 }
@@ -619,7 +669,7 @@
  align-items: center;
  min-height: var(--control-h);
  padding: 0 var(--sp-3);
-  border: 1px solid var(--border-strong);
+  border: var(--border-w) solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  color: var(--ink-muted);
@@ -631,7 +681,7 @@
  background: var(--surface-active);
  color: var(--ink);
 }
-.chip input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
+.chip input:focus-visible + span { outline: var(--outline-w) solid var(--accent); outline-offset: 2px; }
 .interaction__detail {
  margin: 0;
  padding: var(--sp-3);
@@ -774,6 +824,11 @@
 }
 .msg:hover .msg__actions,
 .msg:focus-within .msg__actions { opacity: 1; }
 /* Copy, regenerate, edit and read-aloud were hover-only, which on a phone means
   they did not exist. See the same rule on `.nav-item__actions` in app.css. */
@media (hover: none) {
  .msg__actions { opacity: 1; }
 }
 .msg__actions .is-copied { color: var(--success); }
 /* --- A turn nobody typed ---------------------------------------------------
@@ -793,7 +848,7 @@
 .msg--machine .msg__author { color: var(--ink-muted); font-weight: 500; }
 .msg--user.msg--machine .msg__body--plain {
  background: var(--bg-sunken);
-  border-inline-start: 2px solid var(--border-strong);
+  border-inline-start: var(--border-w-thick) solid var(--border-strong);
  border-start-start-radius: var(--radius-sm);
  border-end-start-radius: var(--radius-sm);
  color: var(--ink-muted);
@@ -836,12 +891,12 @@
 .msg__body blockquote {
  margin: 0 0 var(--sp-4);
  padding: var(--sp-1) var(--sp-4);
-  border-left: 3px solid var(--border-strong);
+  border-left: var(--border-w-accent) solid var(--border-strong);
  color: var(--ink-muted);
  font-style: italic;
 }
-.msg__body hr { border: 0; border-top: 1px solid var(--border); margin: var(--sp-5) 0; }
+.msg__body hr { border: 0; border-top: var(--border-w) solid var(--border); margin: var(--sp-5) 0; }
 .msg__body :not(pre) > code {
  font-family: var(--font-mono);
@@ -849,7 +904,7 @@
  padding: 0.13em 0.36em;
  border-radius: var(--radius-sm);
  background: var(--code-bg);
-  border: 1px solid var(--code-border);
+  border: var(--border-w) solid var(--code-border);
 }
 .msg__body table {
@@ -861,7 +916,7 @@
  overflow-x: auto;
 }
 .msg__body th, .msg__body td {
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  padding: var(--sp-2) var(--sp-3);
  text-align: left;
 }
@@ -872,7 +927,7 @@
 /* --- Code blocks ---------------------------------------------------------- */
 .code-block {
  margin: 0 0 var(--sp-4);
-  border: 1px solid var(--code-border);
+  border: var(--border-w) solid var(--code-border);
  border-radius: var(--radius);
  background: var(--code-bg);
  overflow: hidden;
@@ -882,7 +937,7 @@
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--ink-faint);
-  border-bottom: 1px solid var(--code-border);
+  border-bottom: var(--border-w) solid var(--code-border);
  background: color-mix(in srgb, var(--code-bg) 60%, var(--surface));
 }
 .code-block__pre {
@@ -948,7 +1003,7 @@
  flex-direction: column;
  gap: var(--sp-1);
  padding: var(--sp-2);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-xl);
  background: var(--surface);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
@@ -1158,7 +1213,7 @@
   while the header over it sat --sp-3 in. The padding goes inside the row and
   the border stays on it, so the divider is still full-bleed -- which is what
   makes a stack of rows read as a list rather than as paragraphs. */
-.jobs__row { padding: var(--sp-2) var(--sp-3); border-bottom: 1px solid var(--border); }
+.jobs__row { padding: var(--sp-2) var(--sp-3); border-bottom: var(--border-w) solid var(--border); }
 .jobs__row:last-child { border-bottom: 0; }
 /* Which row's log is on screen. An inset shadow rather than a
@@ -1276,7 +1331,7 @@
  max-height: min(20rem, 45vh);
  overflow-y: auto;
  scrollbar-width: thin;
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface-raised);
  box-shadow: var(--shadow-lg);
@@ -1287,7 +1342,7 @@
  position: sticky;
  bottom: 0;
  padding: var(--sp-1) var(--sp-3);
-  border-top: 1px solid var(--border);
+  border-top: var(--border-w) solid var(--border);
  background: var(--surface-raised);
  color: var(--ink-faint);
  font-size: var(--text-xs);
@@ -1322,7 +1377,7 @@
 .sheet { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
 .sheet td { padding: var(--sp-1) var(--sp-2); vertical-align: top; }
 .sheet td:first-child { white-space: nowrap; color: var(--ink-muted); width: 1%; }
-.sheet tr + tr td { border-top: 1px solid var(--border); }
+.sheet tr + tr td { border-top: var(--border-w) solid var(--border); }
 /* --- Folders -------------------------------------------------------------- */
 .folder__row { padding-right: var(--sp-1); }
@@ -1378,7 +1433,7 @@
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  max-width: 20rem;
@@ -1453,7 +1508,7 @@
  align-items: flex-start;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3);
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  font-size: var(--text-sm);
@@ -1532,7 +1587,7 @@
  display: inline-flex;
  flex: none;
  padding: 2px;
-  border: 1px solid var(--border);
+  border: var(--border-w) solid var(--border);
  border-radius: var(--radius-full);
  background: var(--bg-sunken);
 }
@@ -1564,7 +1619,7 @@
  box-shadow: var(--shadow-sm);
 }
 .segmented__option input:focus-visible + span {
-  outline: 2px solid var(--accent);
+  outline: var(--outline-w) solid var(--accent);
  outline-offset: 1px;
 }
 /* The sidebar's copy fills its column rather than sitting at its content
@@ -1577,8 +1632,8 @@
 .plan {
  margin: var(--sp-3) 0;
  padding: var(--sp-4);
-  border: 1px solid var(--border-strong);
+  border: var(--border-w) solid var(--border-strong);
-  border-left: 3px solid var(--accent);
+  border-left: var(--border-w-accent) solid var(--accent);
  border-radius: var(--radius-md);
  background: var(--surface);
 }
@@ -1652,3 +1707,71 @@
  padding: var(--sp-4) 0;
  min-height: 2.5rem;
 }
 /* The shape of the turns being fetched, at the width they will arrive in. */
 .history-sentinel__shape {
  width: 100%;
  max-width: var(--thread-max-width);
  margin: 0 auto;
  padding: 0 var(--sp-5);
 }
 /* The mark first, then the question, then the line under it -- a tenth of a
   second apart, which is enough to read as one movement rather than three
   things appearing at once. */
@keyframes intro-rise {
  from { opacity: 0; transform: translateY(var(--sp-2)); }
  to { opacity: 1; transform: none; }
 }
 .thread__intro > * { animation: intro-rise var(--dur-3) var(--ease-out) both; }
 .thread__intro > *:nth-child(2) { animation-delay: 60ms; }
 .thread__intro > *:nth-child(3) { animation-delay: 120ms; }
 /*
  --- A phone ----------------------------------------------------------------
  The one width-aware block in this file, and the reason the blanket ban on
  `@media` here was lifted: everything below is a *size*, and there is no
  intrinsic-sizing trick that makes 24px of thread padding the right amount on
  a 390px screen. The ban existed to stop the composer toolbar being "fixed"
  with a breakpoint instead of by saying which child gives, and that guarantee
  is asserted directly now (`tests/test_chat.py`) -- so this block may not touch
  `.composer__toolbar` or `.composer__actions`, and a test refuses it if it
  does.
  What was wrong: a 390px screen spent 40px of its width on thread padding and
  another 44 on the avatar gutter before a single word was drawn, which is
  nearly a quarter of the screen given over to margin -- so anything that could
  not wrap had to be scrolled to sideways.
 */
@media (max-width: 48rem) {
  /* Half the horizontal padding. The vertical stays: it is what separates one
     turn from the next, and turns are no closer together on a phone. */
  .thread {
    padding-left: var(--sp-3);
    padding-right: var(--sp-3);
  }
  /* The avatar goes to the top of the turn rather than beside it, so the body
     gets the whole width. The gutter is what identifies the speaker and it
     still does; it simply stops costing 44px of every line. */
  .msg {
    grid-template-columns: 1fr;
    gap: var(--sp-2);
  }
  .msg__gutter {
    width: var(--control-h-sm);
    height: var(--control-h-sm);
  }
  .msg__meta { gap: var(--sp-2); }
  /* A bubble against the edge of the screen wants less inside it. */
  .msg--user .msg__body--plain { padding: var(--sp-2) var(--sp-3); }
  /* The composer is the other thing pressed against both edges. */
  .composer { padding-left: var(--sp-2); padding-right: var(--sp-2); }
  /* A hint that runs to four lines on a phone is a hint nobody reads, and it
     sits directly under the thing a thumb is reaching for. */
  .composer__hint { font-size: var(--text-xs); }
 }
@@ -26,7 +26,6 @@
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;
  --leading-tight: 1.25;
  --leading-normal: 1.6;
@@ -42,7 +41,6 @@
  --sp-8: 2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  /* --- Radius & shadow -------------------------------------------------- */
  --radius-sm: 4px;
@@ -119,12 +117,91 @@
  --z-handle: 10;
  --z-dropdown: 30;
  --z-panel: 40;
  --z-overlay: 50;
  --z-toast: 60;
  --transition-fast: 120ms ease;
  --transition: 200ms ease;
  /* --- Borders -----------------------------------------------------------
     A hairline was a literal `1px` in about ninety places, which made it the
     largest category of hard-coded value left in the codebase -- and the one
     thing a theme cannot currently change. */
  --border-w: 1px;
  --border-w-thick: 2px;
  --border-w-accent: 3px;
  /* The focus outline's own width. Not `--border-w-thick`, though they are the
     same number today: an outline is drawn outside the box and takes no space,
     a border is part of the box and does. Making one of them follow the other
     means a theme that wants a heavier border gets a heavier focus ring too,
     which is two decisions tied together by a coincidence. */
  --outline-w: 2px;
  /* --- Touch --------------------------------------------------------------
     A control a thumb has to hit is 44px. `--control-h` is 2.25rem, which is
     36 -- comfortable with a pointer and under every published minimum for a
     finger -- so the coarse-pointer block at the foot of this file raises the
     control tokens to this rather than patching components one at a time.
     Raising the token is the only version that reaches all of them, and it is
     what `--control-h` exists for. */
  --tap-min: 2.75rem;
  /* A tick box, which does not take its size from `--control-h`: the browser
     draws it and only `width`/`height` move it. */
  --check-size: 1rem;
  /* --- The window's own edges ---------------------------------------------
     Installed on a phone, the page runs under the notch and the home
     indicator: base.html asks iOS for `black-translucent`, which is what puts
     it there, and `viewport-fit=cover` is what lets these resolve to anything
     but zero. Declared here so no component spells `env()` out -- and so a
     desktop browser, where all four are 0, costs nothing. */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  /* --- Breakpoints --------------------------------------------------------
     A media query cannot read a custom property, so these cannot be *used*
     here. They are declared anyway so the numbers have one home and a grep for
     one lands somewhere that says what it means -- and
     `tests/test_layout_bounds.py` refuses a width in any stylesheet that is not
     declared here, so a fourth breakpoint invented in passing fails the suite
     rather than joining the set unannounced.
       --bp-admin   44rem  704px  a two-column reference row stacks
       --bp-narrow  48rem  768px  the sidebar becomes a drawer, and controls
                                  grow to a thumb's size
       --bp-wide    64rem 1024px  the right-hand panels become overlays */
  --bp-admin: 44rem;
  --bp-narrow: 48rem;
  --bp-wide: 64rem;
  /* --- Motion -------------------------------------------------------------
     Durations and curves, so the `prefers-reduced-motion` block at the foot of
     this file keeps covering everything by construction: a literal `1.6s` in a
     component is a value that block can still neutralise, but one nobody can
     tune. `--ease-out` is the one to reach for -- something arriving should
     decelerate; `--ease-spring` overshoots slightly and belongs on a thing
     that appears, never on a thing that moves under the pointer. */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 320ms;
  --dur-slow: 1.6s;
  /* --- Panel minimums -----------------------------------------------------
     `api/preferences.py:LAYOUT_BOUNDS` allows four panels' widths to be stored
     against an account and only two of them -- the two with a drag handle --
     had a `-min` token or a `min-width` to clamp with. The other two are not
     draggable, so nothing in the interface could produce a bad value; but the
     endpoint takes one from anybody signed in, `base.html` applies stored
     widths to <html> before first paint, and with no clamp a stored 800px
     sidebar is one nothing in the application can drag back. */
  --sidebar-width-min: 12.5rem;
  --inspector-width-min: 17.5rem;
  /* The focus treatment, written once. Three components spelled it out. It
     resolves --accent-soft at the point of use, so it follows the theme even
     though it is declared above them. */
@@ -322,6 +399,44 @@
  --ansi-bright-white: #453A2A;
 }
 /*
  --- Touch -----------------------------------------------------------------
  A pointer is precise and a finger is about 9mm across, so the same control
  cannot be the right size for both. `--control-h` is 36px, which is comfortable
  with a mouse and under every published minimum for a thumb; `--control-h-sm`
  is 28px, which is a target most people miss.
  Raised here rather than patched per component, because there are upwards of
  forty of them and the next one added would be 36px again. `--control-h` is
  what every button, input and select resolves its height from, so one block
  moves all of them -- which is the reason that token exists.
  Two conditions, either of which is enough.
  `(pointer: coarse)` is the honest one: it is the input device that decides how
  big a target has to be, and a touchscreen laptop at 1440px has the same thumb
  as a phone. But a layout below the phone breakpoint is a one-column, drawer-
  navigated layout whatever is pointing at it -- there is room for bigger
  controls and every reason to use it -- and that half is also the half a
  headless browser can be made to prove, which is not nothing: a rule that can
  only be checked by holding a phone is a rule that quietly rots.
 */
@media (pointer: coarse), (max-width: 48rem) {
  :root {
    --control-h: var(--tap-min);
    /* 40px, not the 36 a comfortable pointer gets. A `.btn--sm` is a secondary
       action, not an unimportant one -- Edit, Enable and Use default are all
       `.btn--sm`, and on a phone they are the whole interaction. */
    --control-h-sm: 2.5rem;
    --control-px: var(--sp-4);
    --control-px-sm: var(--sp-3);
    /* A native checkbox is 13-16px whatever the surrounding type is, and no
       amount of padding on its label changes the box itself. It is the
       smallest target in the application on a phone by some margin. */
    --check-size: 1.375rem;
  }
 }
 /* Respect a stated preference for reduced motion everywhere, at once. */
@media (prefers-reduced-motion: reduce) {
  *,
@@ -332,4 +447,16 @@
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  /* The motion tokens too, for anything that composes a duration rather than
     declaring one -- a `transition: transform var(--dur-3)` is neutralised by
     the rule above, but an `animation-delay` built from one is not. */
  :root {
    --dur-1: 0.01ms;
    --dur-2: 0.01ms;
    --dur-3: 0.01ms;
    --dur-slow: 0.01ms;
    --transition-fast: 0.01ms;
    --transition: 0.01ms;
    --transition-slow: 0.01ms;
  }
 }
@@ -54,11 +54,20 @@
    /* Installed, the browser's own chrome is the application's chrome, so it
       has to follow the theme too. Read from the stylesheet rather than
       repeating the hex here: tokens.css is the one place colours live. */
-    var meta = document.querySelector('meta[name="theme-color"]');
+    var metas = document.querySelectorAll('meta[name="theme-color"]');
    if (meta) {
    var bg = getComputedStyle(document.documentElement)
      .getPropertyValue("--bg").trim();
-      if (bg) meta.setAttribute("content", bg);
+    if (bg) {
      metas.forEach(function (meta) {
        /* There are two of them, scoped by `prefers-color-scheme`, so that a
           light instance is not painted dark before this file has run. Once it
           has, the reader's *chosen* theme is the answer and the system's
           preference is not -- somebody on the parchment theme inside a dark
           desktop wants parchment. Dropping the `media` attribute is what makes
           the choice win; leaving it would let the unchosen one apply. */
        meta.removeAttribute("media");
        meta.setAttribute("content", bg);
      });
    }
    /* The toggle names where it is going, not where it is. With more than two
@@ -668,7 +677,51 @@
    }
  }
  /* --- The sidebar -------------------------------------------------------
     Its own pair of functions rather than a branch inside `setPanel`, because
     it is the one panel whose *default* depends on the width of the window:
     open beside the conversation on a desktop, closed over it on a phone. The
     `hidden` attribute the other three use is a single value for both, which
     is how the drawer came to be open on every phone with its own toggle
     underneath it.
     `data-sidebar` on <html> has a third state -- absent -- meaning "follow
     the width", and absent is what the server renders, because the server
     cannot know the width. Everything downstream is unchanged: `syncToggles`
     still writes `aria-expanded` on every control pointing here, and the panel
     still gets `lembas:toggle`. */
  var NARROW = "(max-width: 48rem)";
  function sidebarOpen() {
    var state = document.documentElement.dataset.sidebar;
    if (state === "open") return true;
    if (state === "closed") return false;
    return !window.matchMedia(NARROW).matches;
  }
  function setSidebar(open) {
    var panel = document.querySelector("#sidebar");
    document.documentElement.dataset.sidebar = open ? "open" : "closed";
    syncToggles("#sidebar", open);
    /* Nothing behind an open drawer may be reached by the keyboard -- but only
       while it *is* a drawer. Cleared whenever the query stops matching, and
       cleared unconditionally when it closes: an `inert` left behind on a
       window somebody widened is a page that has stopped responding, which is
       a far worse bug than the one it is here to fix. */
    var main = document.querySelector(".shell > .main");
    if (main) main.toggleAttribute("inert", open && window.matchMedia(NARROW).matches);
    if (panel) {
      panel.dispatchEvent(
        new CustomEvent("lembas:toggle", { bubbles: true, detail: { open: open } })
      );
    }
  }
  function setPanel(selector, open, group) {
    if (selector === "#sidebar") return setSidebar(open);
    var panel = document.querySelector(selector);
    if (!panel) return;
@@ -855,6 +908,10 @@
    var toggle = event.target.closest("[data-toggle]");
    if (toggle) {
      event.preventDefault();
      if (toggle.dataset.toggle === "#sidebar") {
        setSidebar(!sidebarOpen());
        return;
      }
      var panel = document.querySelector(toggle.dataset.toggle);
      if (!panel) return;
      setPanel(toggle.dataset.toggle, panel.hasAttribute("hidden"), toggle.dataset.toggleGroup);
@@ -900,12 +957,132 @@
    applyTheme(currentTheme());
    setupDropzone();
    setupResize();
    /* The toggle used to render `aria-expanded="true"` in the template, which
       is a claim nobody checked and which was false on every phone. The
       stylesheet decides whether the drawer is showing; this is the one place
       that can ask it and say so. */
    syncToggles("#sidebar", sidebarOpen());
  });
  /* A drawer that is dismissed by tapping beside it should be dismissed by
     Escape too -- and only while it *is* a drawer, or Escape would collapse the
     sidebar on a desktop, where nobody asked it to. */
  document.addEventListener("keydown", function (event) {
    if (event.key !== "Escape") return;
    if (!window.matchMedia(NARROW).matches || !sidebarOpen()) return;
    if (document.querySelector("dialog[open]")) return;
    setSidebar(false);
  });
  /* Widening the window past the breakpoint must not leave `inert` on the page
     behind a drawer that is no longer a drawer. Recomputed rather than cleared,
     so narrowing it again while the drawer is open puts the guard back. */
  window.matchMedia(NARROW).addEventListener("change", function () {
    var main = document.querySelector(".shell > .main");
    if (main) {
      main.toggleAttribute(
        "inert", sidebarOpen() && window.matchMedia(NARROW).matches
      );
    }
    syncToggles("#sidebar", sidebarOpen());
  });
  /* Before first paint rather than on DOMContentLoaded, so a panel that was
     dragged wider does not open at its default and jump. */
  applyWidths();
  /* --- Saying that something is happening --------------------------------
     A count, not a flag: several requests overlap constantly here -- the
     unread poll every ten seconds, the transcript tail, whatever somebody just
     clicked -- and a flag means the first of them to finish switches the bar
     off while the others are still running.
     The poll and the tail are excluded. They are the two requests nobody
     started and nobody is waiting for, and a bar that sweeps every ten seconds
     on an idle page is not information, it is a tic. */
  var pending = 0;
  function quiet(event) {
    var el = event.detail && event.detail.elt;
    if (!el || !el.getAttribute) return false;
    var url = (event.detail.pathInfo && event.detail.pathInfo.requestPath) || "";
    return url.indexOf("/unread") !== -1 || url.indexOf("/tail") !== -1;
  }
  function showProgress(on) {
    var bar = document.querySelector("[data-progress]");
    if (bar) bar.classList.toggle("is-busy", on);
  }
  document.body.addEventListener("htmx:beforeRequest", function (event) {
    if (quiet(event)) return;
    pending += 1;
    showProgress(true);
  });
  ["htmx:afterRequest", "htmx:sendError", "htmx:timeout", "htmx:abort"].forEach(
    function (name) {
      document.body.addEventListener(name, function (event) {
        if (quiet(event)) return;
        pending = Math.max(0, pending - 1);
        if (!pending) showProgress(false);
      });
    }
  );
  /* --- A release that arrived while you were reading ----------------------
     The worker no longer takes over open pages on its own -- see sw.js -- so
     something has to say that one is waiting, and the reader decides. A toast
     rather than a reload: an application with a reply streaming into it must
     not be navigated out from under somebody. */
  function watchForUpdate(registration) {
    function offer(worker) {
      if (!worker || !navigator.serviceWorker.controller) return;
      worker.addEventListener("statechange", function () {
        if (worker.state !== "installed") return;
        window.lembas.notify(
          "A new version is ready. Reload to use it.",
          { kind: "info", action: { label: "Reload", run: function () {
            worker.postMessage({ type: "SKIP_WAITING" });
          } } }
        );
      });
    }
    if (registration.waiting && navigator.serviceWorker.controller) {
      window.lembas.notify(
        "A new version is ready. Reload to use it.",
        { kind: "info", action: { label: "Reload", run: function () {
          registration.waiting.postMessage({ type: "SKIP_WAITING" });
        } } }
      );
    }
    registration.addEventListener("updatefound", function () {
      offer(registration.installing);
    });
  }
  /* The new worker calling skipWaiting() is what fires this, and reloading is
     the right answer to it -- the page is now being served by a worker whose
     cache it did not start from.
     Two guards, and the second is the one that is easy to miss. A flag, because
     `controllerchange` can fire more than once. And `hadController`, because on
     a *first* visit there is no worker at all: the one that installs then calls
     `clients.claim()`, which fires this event for the first time -- so without
     it, the very first page anybody loads reloads itself in front of them for
     no reason they could possibly work out. */
  var reloading = false;
  if ("serviceWorker" in navigator) {
    var hadController = !!navigator.serviceWorker.controller;
    navigator.serviceWorker.addEventListener("controllerchange", function () {
      if (reloading || !hadController) return;
      reloading = true;
      window.location.reload();
    });
    navigator.serviceWorker.ready.then(watchForUpdate).catch(function () {});
  }
  /* After any htmx swap: re-measure the composer and follow new content. */
  document.body.addEventListener("htmx:afterSwap", function () {
    document.querySelectorAll("[data-autosize]").forEach(autosize);
@@ -271,8 +271,21 @@
  /* --- Reasoning effort ---------------------------------------------------
     The command drives the same select the composer shows, so there is one
-     piece of state and the control updates itself when the command is used. */
+     piece of state and the control updates itself when the command is used.
-  var EFFORTS = ["low", "medium", "high"];
+
     Which efforts exist is read off that select's own options rather than
     kept here. It used to be a second copy of `["low","medium","high"]`, which
     was wrong the moment the vocabulary became per model: a Bonsai takes
     `xhigh` and no `high`, so the list the server rendered and the list this
     file believed in disagreed -- and the one that decides what `/effort xhigh`
     does was this one. The select is the table; nothing else should hold it. */
  function efforts() {
    var select = el("[data-effort]");
    if (!select) return [];
    return Array.prototype.map
      .call(select.options, function (option) { return option.value; })
      .filter(function (value) { return value !== "off"; });
  }
  function setEffort(rest) {
    var select = el("[data-effort]");
@@ -283,12 +296,14 @@
        "error"
      );
    }
    var available = efforts();
    var listed = available.join(", ");
    var wanted = (rest || "").trim().toLowerCase();
    if (!wanted) {
      return note(
-        EFFORTS.indexOf(select.value) === -1
+        available.indexOf(select.value) === -1
-          ? "No effort is being sent. Try low, medium or high."
+          ? "No effort is being sent. Try " + listed + "."
-          : "Effort is " + select.value + ". /effort low, medium, high, or off."
+          : "Effort is " + select.value + ". /effort " + listed + ", or off."
      );
    }
    /* "off" is the option's real value, not an empty string: the new-chat form
@@ -296,8 +311,11 @@
       sentinel and this has to match it. "default" and "none" still work,
       because somebody's fingers will type them. */
    if (wanted === "default" || wanted === "none") wanted = "off";
-    else if (wanted !== "off" && EFFORTS.indexOf(wanted) === -1) {
+    else if (wanted !== "off" && available.indexOf(wanted) === -1) {
-      return note("“" + wanted + "” is not an effort. Try low, medium, high or off.", "error");
+      return note(
        "“" + wanted + "” is not an effort this model takes. Try " + listed + " or off.",
        "error"
      );
    }
    select.value = wanted;
    select.dispatchEvent(new Event("change", { bubbles: true }));
@@ -42,8 +42,26 @@ var SHELL = [
  "/static/img/logo-mark.svg",
  "/static/img/icon-192.png",
  "/static/img/icon-512.png",
  // The two a device reaches for when the network is not there: the maskable
  // one is what every Android launcher crops, and the Apple one is the home
  // screen. Both were absent from this list while the two nothing crops were
  // in it.
  "/static/img/icon-maskable-512.png",
  "/static/img/apple-touch-icon-180.png",
 ];
 /* The URL a page will actually ask for.
   Every `/static/` link carries `?v=<release>` -- see `templating.asset` -- and
   `caches.match` compares the whole URL, query included. So precaching the bare
   path would fill the cache with entries no page ever requests, and every asset
   would go to the network on every load while looking perfectly cached.
   `/offline` is a route rather than an asset and is left alone. */
 function versioned(path) {
  return path.indexOf("/static/") === 0 ? path + "?v=" + VERSION : path;
 }
 self.addEventListener("install", function (event) {
  event.waitUntil(
    caches.open(CACHE).then(function (cache) {
@@ -51,16 +69,44 @@ self.addEventListener("install", function (event) {
      // and the whole feature silently off, so each entry is added on its own.
      return Promise.all(
        SHELL.map(function (path) {
-          return cache.add(new Request(path, { cache: "reload" })).catch(function () {});
+          return cache.add(new Request(versioned(path), { cache: "reload" }))
            .catch(function () {});
        })
      );
-    }).then(function () { return self.skipWaiting(); })
+    })
  );
  /* Deliberately NOT skipWaiting() here.
     It used to, unconditionally, together with clients.claim() below -- so a
     release took over every open tab the moment it was installed, while the
     cache those tabs were reading from was being emptied underneath them. A
     page could end up drawing itself from two releases at once, and nothing
     said so.
     The new worker waits instead, the page is told, and the reader decides.
     `messages/SKIP_WAITING` below is how they say yes. A worker that is never
     activated costs a few hundred kilobytes and is replaced by the next one. */
 });
 /* The page asking to be taken over now. The only message this worker answers,
   and it does exactly one thing, because a message channel into a service
   worker is a thing any script on the origin can post to. */
 self.addEventListener("message", function (event) {
  if (event.data && event.data.type === "SKIP_WAITING") self.skipWaiting();
 });
 self.addEventListener("activate", function (event) {
  event.waitUntil(
-    caches.keys().then(function (names) {
+    /* Without this, every navigation waits for this worker to start before its
       request is even made -- which on a cold phone is the difference between
       a page and a pause. The navigate branch below is a plain fetch, so the
       preloaded response is used simply by preferring it when it exists. */
    (self.registration.navigationPreload
      ? self.registration.navigationPreload.enable().catch(function () {})
      : Promise.resolve()
    ).then(function () {
      return caches.keys();
    }).then(function (names) {
      return Promise.all(
        names.map(function (name) {
          if (name !== CACHE && name.indexOf("lembas-") === 0) return caches.delete(name);
@@ -97,9 +143,9 @@ self.addEventListener("fetch", function (event) {
  if (request.mode === "navigate") {
    event.respondWith(
-      fetch(request).catch(function () {
+      Promise.resolve(event.preloadResponse)
-        return caches.match("/offline");
+        .then(function (preloaded) { return preloaded || fetch(request); })
-      })
+        .catch(function () { return caches.match("/offline"); })
    );
    return;
  }
@@ -158,13 +204,53 @@ self.addEventListener("push", function (event) {
        tag: "lembas-" + (payload.kind || "unread"),
        renotify: true,
        icon: "/static/img/icon-192.png",
-        badge: "/static/img/icon-192.png",
+        /* A badge is drawn as a *mask* in the status bar -- the device keeps
           the alpha and throws the colour away. The full-colour 192 is opaque
           to its edges, so what Android rendered was a solid grey square. The
           leaf has transparency, so it survives being masked. */
        badge: "/static/img/badge-72.png",
        data: { url: payload.url || "/" },
      });
    })
  );
 });
 /*
  A browser may replace a subscription on its own -- a push service expiring a
  key, a browser upgrade. When it does, the endpoint this server holds stops
  working and nothing anywhere says so: notifications simply stop. The event
  fires exactly once, at the moment of the swap, and it is the only chance to
  hear about it.
  Re-subscribing needs the server's public key, which this worker does not hold,
  so it asks the same endpoint the page does.
 */
 self.addEventListener("pushsubscriptionchange", function (event) {
  event.waitUntil(
    fetch("/api/push/key")
      .then(function (response) { return response.ok ? response.json() : null; })
      .then(function (data) {
        if (!data || !data.key) return null;
        return self.registration.pushManager.subscribe({
          userVisibleOnly: true,
          applicationServerKey: Uint8Array.from(
            atob(data.key.replace(/-/g, "+").replace(/_/g, "/")),
            function (c) { return c.charCodeAt(0); }
          ),
        });
      })
      .then(function (subscription) {
        if (!subscription) return null;
        return fetch("/api/push/subscribe", {
          method: "POST",
          headers: { "Content-Type": "application/json" },
          body: JSON.stringify(subscription.toJSON()),
        });
      })
      .catch(function () { /* Nothing here can ask a person for help. */ })
  );
 });
 /*
  Clicking one.
@@ -47,6 +47,20 @@
    var toast = el("div", "toast toast--" + (options.kind || "info"));
    toast.appendChild(el("span", "toast__text", message));
    /* Some news is worth acting on where it is read: "a new version is ready"
       with no way to take it is a sentence that sends somebody looking for a
       menu. One action, never two -- a toast is not a dialog, and anything
       needing a choice should be one. */
    if (options.action && options.action.label) {
      var act = el("button", "btn btn--sm toast__action", options.action.label);
      act.type = "button";
      act.addEventListener("click", function () {
        dismiss(toast);
        if (options.action.run) options.action.run();
      });
      toast.appendChild(act);
    }
    var close = el("button", "toast__close");
    close.type = "button";
    close.setAttribute("aria-label", "Dismiss");
@@ -58,7 +72,11 @@
    // Next frame, so the entry transition has a state to move from.
    requestAnimationFrame(function () { toast.classList.add("is-in"); });
-    var timeout = options.timeout == null ? TOAST_MS : options.timeout;
+    /* A toast offering an action must not take it away while it is being read.
       Anything with a button stays until it is answered or dismissed. */
    var timeout = options.timeout == null
      ? (options.action ? 0 : TOAST_MS)
      : options.timeout;
    if (timeout > 0) setTimeout(function () { dismiss(toast); }, timeout);
    return toast;
  }
@@ -78,7 +78,7 @@
        <input class="input input--mono" id="unload-{{ connection.id }}" name="unload_url"
               value="{{ connection.unload_url }}" placeholder="No unload call"
               style="flex: 1; min-width: 0">
-        <select class="select" name="unload_method" style="flex: none">
+        <select class="select" name="unload_method" aria-label="How to ask it to unload" style="flex: none">
          <option value="POST" {{ 'selected' if connection.unload_method != 'GET' }}>POST</option>
          <option value="GET" {{ 'selected' if connection.unload_method == 'GET' }}>GET</option>
        </select>
@@ -91,6 +91,20 @@
      </p>
    </div>
    <div class="field">
      <label class="field__label" for="headers-{{ connection.id }}">Extra headers</label>
      <textarea class="textarea input--mono" id="headers-{{ connection.id }}"
                name="extra_headers" rows="2"
                placeholder="HTTP-Referer: https://example.org">{% for name, value in (connection.extra_headers_json or {}).items() %}{{ name }}: {{ value }}
 {% endfor %}</textarea>
      <p class="field__hint">
        One <code>Name: value</code> per line, sent with every request to this
        endpoint. OpenRouter reads <code>HTTP-Referer</code> and
        <code>X-Title</code> and attributes your usage with them. Leave it empty
        unless an endpoint has asked for something.
      </p>
    </div>
    <div class="field">
      <label class="checkbox">
        <input type="checkbox" name="enabled" value="true"
@@ -6,18 +6,28 @@
 #}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/admin.css') }}">
+<link rel="stylesheet" href="{{ asset('css/admin.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
 {% block body %}
 <div class="shell">
-  <aside class="sidebar">
+  {#
-    <div class="sidebar__header">
+    `id="sidebar"` and the drawer's furniture, because below the phone
    breakpoint `.sidebar` is a fixed overlay that starts closed -- and this one
    had neither an id for `data-toggle="#sidebar"` to find nor any control to
    open it. The administration area was reachable on a phone and then
    unnavigable once you arrived.
  #}
  <aside class="sidebar" id="sidebar">
    <header class="sidebar__header">
      <div class="sidebar__brand-slot">
        {{ brandlink(uid="admin") }}
      </div>
      {% include "partials/_sidebar_close.html" %}
    </header>
    <nav class="sidebar__scroll" aria-label="Administration">
      <div class="nav-group">
@@ -106,8 +116,11 @@
    </div>
  </aside>
  {% include "partials/_sidebar_scrim.html" %}
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">{% block heading %}Administration{% endblock %}</h1>
      <button class="btn btn--icon" type="button" data-theme-toggle aria-label="Switch theme">
        <span class="theme-icon theme-icon--dark">{{ icon("moon") }}</span>
@@ -104,11 +104,39 @@
      </p>
    </div>
    <div class="field">
      <span class="field__label">Reasoning efforts this model accepts</span>
      <div class="btn-row">
        {% for value in efforts %}
        <label class="checkbox">
          <input type="checkbox" name="reasoning_efforts" value="{{ value }}"
                 {{ 'checked' if value in model_efforts }}>
          <span class="mono">{{ value }}</span>
        </label>
        {% endfor %}
      </div>
      <p class="field__hint">
        The vocabulary is <strong>not the same for every model</strong>, and
        sending one a model does not know is not ignored — it is rendered into
        the model's chat template, which raises and fails the whole reply.
        gpt-oss takes <span class="mono">low/medium/high</span>; Bonsai takes
        <span class="mono">low/medium/xhigh</span> and refuses
        <span class="mono">high</span>; OpenAI has added
        <span class="mono">minimal</span>, <span class="mono">xhigh</span> and
        <span class="mono">max</span> at various points.
        <br>
        Tick none and the common three are offered, which is right for almost
        everything. If an endpoint ever refuses one anyway, that reply is
        retried without it and this list corrects itself — so this is worth
        setting by hand only to save that one round trip.
      </p>
    </div>
    <div class="field">
      <label class="field__label" for="default-effort">Default reasoning effort</label>
      <select class="select" id="default-effort" name="default_effort">
        <option value="">None — send nothing</option>
-        {% for value in efforts %}
+        {% for value in model_efforts %}
        <option value="{{ value }}"
                {{ 'selected' if model.params_json.get('reasoning_effort') == value }}>
          {{ value }}
@@ -39,7 +39,7 @@
 #}
 <form method="post" action="/admin/prompts" id="prompt-form">
  <div class="tabs">
-    <div class="tabs__bar" role="tablist">
+    <div class="tabs__bar" role="radiogroup" aria-label="Prompt groups">
      {% for key, label, fragments in groups %}
      <input class="visually-hidden" type="radio" name="prompts-tab"
             id="tab-{{ key }}" {{ 'checked' if loop.first }}>
@@ -32,7 +32,8 @@
    <button class="btn btn--sm btn--danger" type="submit"
            formaction="/admin/suggestions/{{ suggestion.id }}/delete"
            data-confirm-button="Delete the suggestion “{{ suggestion.name }}”?"
-            data-confirm-title="Delete suggestion">
+            data-confirm-title="Delete suggestion"
            aria-label="Delete suggestion" title="Delete suggestion">
      {{ icon("trash", "icon--sm") }}
    </button>
  </div>
@@ -9,8 +9,8 @@
 #}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/admin.css') }}">
+<link rel="stylesheet" href="{{ asset('css/admin.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
@@ -21,6 +21,7 @@
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">{% block heading %}Connections{% endblock %}</h1>
      <div class="topbar__actions">{% block actions %}{% endblock %}</div>
    </header>
@@ -13,7 +13,15 @@
      data-themes="{{ brand.theme_list }}"{% if layout %} style="{{ layout }}"{% endif %}>
 <head>
 <meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
+{#
  `viewport-fit=cover` is what lets `env(safe-area-inset-*)` resolve to
  anything but zero, and without it the `black-translucent` status bar style
  below is a promise with nothing behind it: iOS puts the page under the clock
  and the notch and the tokens that would have paid for it stay at 0.
  No `maximum-scale` and no `user-scalable=no` -- pinch-zoom is somebody's
  accessibility setting, not a layout problem to be suppressed.
 #}
 <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
 <title>{% block title %}{{ brand.name }}{% endblock %}</title>
 <meta name="description" content="{{ brand.tagline or brand.name ~ ' — a web UI for your language models.' }}">
 <meta name="color-scheme" content="dark light">
@@ -26,7 +34,7 @@
 {% elif brand.icon_paths.favicon %}
 <link rel="icon" href="/branding/{{ brand.icon_paths.favicon }}">
 {% else %}
-<link rel="icon" href="{{ url_for('static', path='img/favicon.svg') }}" type="image/svg+xml">
+<link rel="icon" href="{{ asset('img/favicon.svg') }}" type="image/svg+xml">
 {% endif %}
 {#
@@ -36,19 +44,28 @@
  only what the browser paints with before the stylesheet has resolved.
 #}
 <link rel="manifest" href="/manifest.webmanifest">
-<meta name="theme-color" content="#101317">
+{#
  Two, scoped by preference, so the browser has an answer before any of our CSS
  or JavaScript has run. There used to be one and it was Moria's near-black, so
  every reader of the light theme got a dark browser chrome on every page load
  until `app.js` -- which is deferred -- corrected it. `applyTheme` still has
  the last word, and still reads the value from `--bg` rather than repeating a
  hex here; these two are only what is painted before it can.
 #}
 <meta name="theme-color" content="#101317" media="(prefers-color-scheme: dark)">
 <meta name="theme-color" content="#F6F1E4" media="(prefers-color-scheme: light)">
 {% if brand.icon_paths['apple-touch'] %}
 <link rel="apple-touch-icon" href="/branding/{{ brand.icon_paths['apple-touch'] }}">
 {% else %}
-<link rel="apple-touch-icon" href="{{ url_for('static', path='img/apple-touch-icon-180.png') }}">
+<link rel="apple-touch-icon" href="{{ asset('img/apple-touch-icon-180.png') }}">
 {% endif %}
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-title" content="{{ brand.name }}">
 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-<link rel="stylesheet" href="{{ url_for('static', path='css/tokens.css') }}">
+<link rel="stylesheet" href="{{ asset('css/tokens.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/app.css') }}">
+<link rel="stylesheet" href="{{ asset('css/app.css') }}">
 {#
  Last, so an administrator's rules win, and before {% block head %} so a page's
  own stylesheet still comes after it. The query string is a hash of everything
@@ -92,18 +109,35 @@
 <body{% block body_attrs %}{% endblock %}>
 {% include "partials/icons.html" %}
 {#
  Every fetch this application makes, said out loud.
  htmx has had `htmx-request` on the triggering element since the beginning and
  nothing here has ever used it, so a click that saved a setting, opened a
  panel or loaded a page of a list looked exactly like a click that did nothing
  until the answer arrived. On a local endpoint that is a few milliseconds and
  on anything else it is long enough to click again.
  One bar for the whole page rather than a spinner per control: the interesting
  question is "is the application busy", and an indicator on the control would
  need adding to every control ever written, which is how the last one came to
  be used nowhere. `aria-hidden` because the answer arriving is the thing worth
  announcing, and htmx already moves focus for that.
 #}
 <div class="progress" data-progress aria-hidden="true"><span></span></div>
 {% block body %}{% endblock %}
-<script src="{{ url_for('static', path='vendor/htmx.min.js') }}" defer></script>
+<script src="{{ asset('vendor/htmx.min.js') }}" defer></script>
-<script src="{{ url_for('static', path='vendor/htmx-ext-sse.js') }}" defer></script>
+<script src="{{ asset('vendor/htmx-ext-sse.js') }}" defer></script>
-<script src="{{ url_for('static', path='vendor/alpine.min.js') }}" defer></script>
+<script src="{{ asset('vendor/alpine.min.js') }}" defer></script>
-<script src="{{ url_for('static', path='js/app.js') }}" defer></script>
+<script src="{{ asset('js/app.js') }}" defer></script>
-<script src="{{ url_for('static', path='js/ui.js') }}" defer></script>
+<script src="{{ asset('js/ui.js') }}" defer></script>
 {# commands.js before composer.js: the second reads the first's table to draw
   the `/` menu, and both are deferred so the order here is the run order. #}
-<script src="{{ url_for('static', path='js/commands.js') }}" defer></script>
+<script src="{{ asset('js/commands.js') }}" defer></script>
-<script src="{{ url_for('static', path='js/composer.js') }}" defer></script>
+<script src="{{ asset('js/composer.js') }}" defer></script>
-<script src="{{ url_for('static', path='js/audio.js') }}" defer></script>
+<script src="{{ asset('js/audio.js') }}" defer></script>
 {#
  The version in the query string is what versions the worker's cache, so a
@@ -25,16 +25,12 @@
  </p>
  <div class="compacted__body">
    {% for message in compacted %}
      {% with body_html = bodies.get(message.id, "") %}
      {% include "chat/_message.html" %}
      {% endwith %}
    {% endfor %}
  </div>
 </details>
 {% endif %}
 {% for message in messages %}
  {% with body_html = bodies.get(message.id, "") %}
  {% include "chat/_message.html" %}
  {% endwith %}
 {% endfor %}
@@ -4,9 +4,9 @@
 {% block title %}{{ chat.title if chat else "New chat" }} - {{ brand.name }}{% endblock %}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
 {% if terminal_enabled %}
-<link rel="stylesheet" href="{{ url_for('static', path='vendor/xterm.css') }}">
+<link rel="stylesheet" href="{{ asset('vendor/xterm.css') }}">
 {% endif %}
 {% endblock %}
@@ -18,10 +18,7 @@
  <main class="main">
    <header class="topbar">
-      <button class="btn btn--icon" type="button" aria-label="Toggle sidebar"
+      {% include "partials/_sidebar_toggle.html" %}
              aria-expanded="true" data-toggle="#sidebar">
        {{ icon("sidebar") }}
      </button>
      <h1 class="topbar__title">
        <span id="chat-title">{{ chat.title if chat else "New chat" }}</span>
@@ -396,21 +393,21 @@
 {% block scripts %}
 {# Unconditional: every chat has a transcript, and this is what keeps a block
   somebody opened open across the swaps that arrive twelve times a second. #}
-<script src="{{ url_for('static', path='js/steps.js') }}" defer></script>
+<script src="{{ asset('js/steps.js') }}" defer></script>
 {% if not chat and (canvas_enabled or terminal_enabled) %}
 {# Only where there is no chat yet. It points both panels at a draft id for
   whatever the composer has selected, and does nothing at all once a chat
   exists -- which is every other page this block renders on. #}
-<script src="{{ url_for('static', path='js/draft.js') }}" defer></script>
+<script src="{{ asset('js/draft.js') }}" defer></script>
 {% endif %}
 {% if canvas_enabled %}
-<script src="{{ url_for('static', path='js/canvas.js') }}" defer></script>
+<script src="{{ asset('js/canvas.js') }}" defer></script>
 {% endif %}
 {% if terminal_enabled %}
 {# Only where it can be used. xterm is nearly three times everything else
   vendored, so a plain chat must never load it. #}
-<script src="{{ url_for('static', path='vendor/xterm.js') }}" defer></script>
+<script src="{{ asset('vendor/xterm.js') }}" defer></script>
-<script src="{{ url_for('static', path='vendor/xterm-addon-fit.js') }}" defer></script>
+<script src="{{ asset('vendor/xterm-addon-fit.js') }}" defer></script>
-<script src="{{ url_for('static', path='js/terminal.js') }}" defer></script>
+<script src="{{ asset('js/terminal.js') }}" defer></script>
 {% endif %}
 {% endblock %}
@@ -17,8 +17,8 @@
 {% block title %}{{ folder.name }} - {{ brand.name }}{% endblock %}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/admin.css') }}">
+<link rel="stylesheet" href="{{ asset('css/admin.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
@@ -29,6 +29,7 @@
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">
        {{ icon("folder", "icon--sm") }}
        <span>{{ folder.name }}</span>
@@ -9,8 +9,8 @@
 #}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/admin.css') }}">
+<link rel="stylesheet" href="{{ asset('css/admin.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
@@ -21,6 +21,7 @@
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">{% block heading %}Library{% endblock %}</h1>
      <div class="topbar__actions">{% block actions %}{% endblock %}</div>
    </header>
@@ -21,8 +21,16 @@
     hx-trigger="load"
     hx-target="this"
     hx-swap="outerHTML">
  {# The shape of what is coming, rather than an ellipsis that says only that
     something is missing. `aria-hidden` and a `role="status"` label beside it,
     because a paragraph of grey blocks is nothing to read aloud. #}
  <section class="card">
-    <h2 class="card__title">Shared with <span class="badge">…</span></h2>
+    <h2 class="card__title">Shared with</h2>
    <span class="visually-hidden" role="status">Loading who this is shared with</span>
    <div aria-hidden="true">
      <div class="skeleton skeleton--row"></div>
      <div class="skeleton skeleton--row skeleton--short"></div>
    </div>
  </section>
 </div>
 {% elif not is_owner %}
@@ -24,12 +24,14 @@
     hx-target="this"
     hx-swap="outerHTML"
     hx-sync="this:drop">
-  <span class="text-xs faint">Loading earlier messages…</span>
+  <span class="visually-hidden" role="status">Loading earlier messages</span>
  <div class="history-sentinel__shape" aria-hidden="true">
    <div class="skeleton skeleton--line"></div>
    <div class="skeleton skeleton--line skeleton--short"></div>
  </div>
 </div>
 {% endif %}
 {% for message in messages %}
  {% with body_html = bodies.get(message.id, "") %}
  {% include "chat/_message.html" %}
  {% endwith %}
 {% endfor %}
@@ -13,7 +13,7 @@
 {% block title %}Messages - {{ brand.name }}{% endblock %}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
@@ -24,6 +24,7 @@
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">{{ icon("chat", "icon--sm") }} Messages</h1>
      <div class="topbar__actions">
        {% if schedules %}
@@ -78,14 +79,16 @@
             hx-target="this"
             hx-swap="outerHTML"
             hx-sync="this:drop">
-          <span class="text-xs faint">Loading earlier messages…</span>
+          <span class="visually-hidden" role="status">Loading earlier messages</span>
  <div class="history-sentinel__shape" aria-hidden="true">
    <div class="skeleton skeleton--line"></div>
    <div class="skeleton skeleton--line skeleton--short"></div>
  </div>
        </div>
        {% endif %}
        {% for message in messages %}
          {% with body_html = bodies.get(message.id, "") %}
          {% include "chat/_message.html" %}
          {% endwith %}
        {% endfor %}
      </div>
    </div>
@@ -121,5 +124,5 @@
  DOM stub, which is the rule the working notes set out and the reason it does.
 #}
 {% block scripts %}
-<script src="{{ url_for('static', path='js/steps.js') }}" defer></script>
+<script src="{{ asset('js/steps.js') }}" defer></script>
 {% endblock %}
@@ -27,6 +27,20 @@
            aria-label="Rename chat" title="Rename chat">
      {{ icon("pencil", "icon--sm") }}
    </button>
    {#
      Archiving, and un-archiving, are the same control reading the opposite
      way round -- so one button, and the sidebar re-renders because a row has
      to leave one group and appear in the other.
    #}
    <button class="btn btn--icon btn--sm" type="button"
            hx-patch="/api/chats/{{ chat_item.id }}"
            hx-vals='{"archived": "{{ 0 if chat_item.archived else 1 }}"}'
            hx-target="#sidebar-tree" hx-swap="outerHTML"
            aria-label="{{ 'Restore chat' if chat_item.archived else 'Archive chat' }}"
            title="{{ 'Put this chat back in the list' if chat_item.archived
                      else 'Hide this chat without deleting it' }}">
      {{ icon("arrow-up" if chat_item.archived else "archive", "icon--sm") }}
    </button>
    <button class="btn btn--icon btn--sm" type="button"
            hx-delete="/api/chats/{{ chat_item.id }}"
            hx-confirm="Delete “{{ chat_item.title }}”? This cannot be undone."
@@ -0,0 +1,20 @@
 {% from "_macros.html" import icon %}
 {#
  The way out of the drawer, and the reason it is *inside* it.
  Below the phone breakpoint the sidebar is a fixed overlay and the toggle that
  opens it is in the topbar underneath -- so once open, the control for closing
  it is behind it. Its own partial because there are two sidebars in this
  application, the chat one and the admin one, and the second was given the
  drawer behaviour without the drawer's furniture: at a phone width it was
  hidden off-screen with no toggle and no close anywhere, which is an admin area
  that simply could not be navigated on a phone.
  Hidden above that breakpoint, where the sidebar is an ordinary column.
 #}
 <div class="sidebar__actions-rail">
  <button class="btn btn--icon sidebar__close" type="button"
          aria-label="Close sidebar" data-toggle="#sidebar">
    {{ icon("x") }}
  </button>
 </div>
@@ -0,0 +1,10 @@
 {#
  The scrim behind an open drawer. It carries the same `data-toggle` as every
  other control that closes it, so tapping beside the drawer goes through one
  code path rather than a second written for touch.
  Rendered always and shown by CSS: it exists only below the breakpoint and only
  while the drawer is open, which is a question about width and state that the
  server cannot answer and the stylesheet can.
 #}
 <div class="sidebar-scrim" data-toggle="#sidebar" aria-hidden="true"></div>
@@ -0,0 +1,19 @@
 {% from "_macros.html" import icon %}
 {#
  The control that opens and closes the sidebar.
  A partial rather than markup in each topbar, because for most of this
  application's life it existed on `/chat` alone -- and below the phone
  breakpoint the sidebar is a fixed overlay, so every other page rendered 280px
  of opaque drawer over itself with nothing anywhere to dismiss it. `/settings`
  was one of them, which is where the Install and Notifications buttons live.
  `aria-expanded` is deliberately absent rather than `"true"`: it used to be
  hard-coded open, which is a lie the moment anything closes the drawer, and
  `app.js:syncToggles` writes the honest value on load and on every change.
 #}
 <button class="btn btn--icon sidebar-toggle" type="button"
        aria-label="Toggle sidebar" aria-controls="sidebar"
        data-toggle="#sidebar">
  {{ icon("sidebar") }}
 </button>
@@ -87,4 +87,26 @@
      </p>
    {% endif %}
  </div>
  {#
    Archived chats, closed, and absent entirely when there are none.
    A `<details>` rather than a page of their own: archiving is for getting a
    conversation out of the way, not for filing it somewhere, and a second
    screen to visit would make putting one back a journey. Closed by default
    because that is the whole point, and the browser keeps the open state
    across the out-of-band swaps the unread poll makes -- the same property the
    folder tree relies on.
  #}
  {% if archived_chats %}
  <details class="nav-group nav-group--archived">
    <summary class="nav-group__label">
      {{ icon("archive", "icon--sm") }} Archived
      <span class="nav-group__count">{{ archived_chats|length }}</span>
    </summary>
    {% for chat_item in archived_chats %}
      {% include "partials/_chat_link.html" %}
    {% endfor %}
  </details>
  {% endif %}
 </div>
@@ -7,10 +7,29 @@
  nothing behind.
 #}
 <aside class="sidebar" id="sidebar">
-  <div class="sidebar__header">
+  {#
    The header is two slots, not a brand with something appended to it.
    `__brand` holds the identity and is the only part allowed to shrink;
    `__actions` is a fixed-width rail on the trailing edge that anything
    belonging to the drawer itself hangs off. It is a rail rather than one
    button because a second one -- pin the sidebar open, a search -- would
    otherwise be appended to the brand again, and the alignment would be a
    coincidence for the third time.
    This is the standing rule about rows applied to a row that got it wrong:
    the two parts have a known width (a rail of `--control-h` boxes) and an
    unknown one (a name somebody chose), so the unknown one is the one that
    gives, and the rail is `flex: none`.
  #}
  <header class="sidebar__header">
    <div class="sidebar__brand-slot">
      {{ brandlink(uid="side") }}
    </div>
    {% include "partials/_sidebar_close.html" %}
  </header>
  {% include "partials/_sidebar_actions.html" %}
  {# Every 10s, refresh the unread dots and announce anything that finished
@@ -47,6 +66,26 @@
    </a>
    <div class="sidebar__tools">
      {#
        Installing.
        The only one of these was in the Appearance tab of /settings, which on
        a phone is behind a drawer that used to be impossible to close and a tab
        strip that gave no sign of scrolling -- so the button for installing
        this on a phone was, on a phone, three taps into a place you could not
        get to. It stays there as well; this is simply where somebody will meet
        it.
        Hidden until the browser says the app is installable: `app.js` reveals
        every `[data-install-app]` when `beforeinstallprompt` fires, and hides
        them again once it is installed. Firefox and desktop Safari never fire
        it, and an Install button that does nothing is worse than none.
      #}
      <button class="btn btn--icon" type="button" data-install-app hidden
              onclick="window.lembas.promptInstall()"
              aria-label="Install as an app" title="Install as an app">
        {{ icon("arrow-down") }}
      </button>
      {% if user.is_admin %}
      <a class="btn btn--icon" href="/admin" aria-label="Admin settings" title="Admin settings">
        {{ icon("shield") }}
@@ -66,3 +105,5 @@
    </div>
  </div>
 </aside>
 {% include "partials/_sidebar_scrim.html" %}
@@ -15,8 +15,8 @@
 #}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/admin.css') }}">
+<link rel="stylesheet" href="{{ asset('css/admin.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
@@ -27,6 +27,7 @@
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">{% block heading %}Reports{% endblock %}</h1>
      <div class="topbar__actions">{% block actions %}{% endblock %}</div>
    </header>
@@ -8,8 +8,8 @@
 #}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/admin.css') }}">
+<link rel="stylesheet" href="{{ asset('css/admin.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
@@ -20,6 +20,7 @@
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">{% block heading %}Scheduled{% endblock %}</h1>
      <div class="topbar__actions">{% block actions %}{% endblock %}</div>
    </header>
@@ -4,8 +4,8 @@
 {% block title %}Your settings - {{ brand.name }}{% endblock %}
 {% block head %}
-<link rel="stylesheet" href="{{ url_for('static', path='css/chat.css') }}">
+<link rel="stylesheet" href="{{ asset('css/chat.css') }}">
-<link rel="stylesheet" href="{{ url_for('static', path='css/admin.css') }}">
+<link rel="stylesheet" href="{{ asset('css/admin.css') }}">
 {% endblock %}
 {% block body_attrs %} data-authenticated="true"{% endblock %}
@@ -16,6 +16,7 @@
  <main class="main">
    <header class="topbar">
      {% include "partials/_sidebar_toggle.html" %}
      <h1 class="topbar__title">Your settings</h1>
    </header>
@@ -25,7 +26,18 @@
      state. Each panel is a real fragment of the page, not a fetch.
    #}
    <div class="tabs">
-      <div class="tabs__bar" role="tablist">
+      {#
  Deliberately no `role="tablist"`.
  It had one, and the children are `<input type="radio">` and `<label>` -- so a
  screen reader announced a tablist containing no tabs, and the panels carried
  neither `role="tabpanel"` nor an `aria-labelledby` to be announced as. What
  this actually is, is a radio group, and a perfectly good one: arrow keys move
  between the options, the checked one is announced, and the CSS that reveals
  the matching panel keys off exactly that. Being an honest radio group beats
  claiming to be a tab interface and then not behaving as one.
 #}
 <div class="tabs__bar" role="radiogroup" aria-label="Settings sections">
        <input class="visually-hidden" type="radio" name="settings-tab" id="tab-account" checked>
        <label class="tabs__tab" for="tab-account">{{ icon("user", "icon--sm") }} Account</label>
@@ -196,7 +208,7 @@
                redirect back is what stops a refresh re-submitting it.
              #}
              <form method="post" action="/api/preferences/timezone" class="btn-row">
-                <select class="select" name="timezone" style="flex: 1">
+                <select class="select" name="timezone" style="flex: 1" aria-label="Your timezone">
                  <option value="" {{ 'selected' if not timezone }}>
                    Follow the server ({{ server_timezone }})
                  </option>
@@ -367,12 +379,14 @@
                  <form method="post" action="/api/library/memories/{{ memory.id }}"
                        class="row" style="flex: 1; gap: var(--sp-2); min-width: 0">
                    <input class="input" name="content" value="{{ memory.content }}"
-                           maxlength="{{ memory_limit }}" style="flex: 1">
+                           maxlength="{{ memory_limit }}" style="flex: 1"
                           aria-label="What this memory says">
                    <button class="btn btn--sm" type="submit">Save</button>
                    <button class="btn btn--sm btn--danger" type="submit"
                            formaction="/api/library/memories/{{ memory.id }}/delete"
                            data-confirm-button="Forget this?"
-                            data-confirm-title="Forget">
+                            data-confirm-title="Forget"
                            aria-label="Forget this" title="Forget this">
                      {{ icon("trash", "icon--sm") }}
                    </button>
                  </form>
@@ -396,6 +410,7 @@
                    style="gap: var(--sp-2)">
                <input class="input" name="content" required style="flex: 1"
                       maxlength="{{ memory_limit }}"
                       aria-label="Something worth remembering"
                       placeholder="Prefers metric units and a 24-hour clock.">
                <button class="btn btn--primary" type="submit">Remember</button>
              </form>
@@ -61,6 +61,34 @@ templates.env.filters["tokens"] = highlight_tokens
 templates.env.globals["tool_label"] = tool_labels.label_for
 templates.env.globals["tool_icon"] = tool_labels.icon_for
 def asset(path: str) -> str:
    """A static asset's URL, with the release stamped into it.
    🚨 This is not cache politeness, it is what stops a release drawing itself
    from two versions at once.
    The service worker caches `/static/...` under a cache named for the
    release, and a *page* is fetched network-first while its assets come from
    that cache. So the moment the worker stops taking over open tabs the
    instant it installs -- which it must, or it swaps the stylesheets under
    somebody mid-reply -- the new HTML and the old CSS are served together and
    the interface is subtly wrong until the worker is replaced. That shipped in
    1.1.0: a close button intended for a phone drawer appeared, unstyled, on
    every desktop, because the markup knew about it and the stylesheet did not.
    A version in the URL settles it without anybody having to be careful: the
    new HTML asks for a URL the old cache has never heard of, so it goes to the
    network. The two can no longer disagree, whichever worker is in charge.
    Not a hash of the file: `__version__` is the one thing that already moves
    with every release, and a hash would mean reading every asset on every
    render or a build step, and there is deliberately no build step here.
    """
    return f"/static/{path.lstrip('/')}?v={__version__}"
 templates.env.globals["asset"] = asset
 # A finished reply as the sequence of steps it was. A global for exactly the
 # reason the two above are, and it is why turning the bubble into a sequence
 # needed no change in `pages.py`, `post_message`, `regenerate` or the `done`
@@ -22,14 +22,19 @@ from lembas.services.agent.base import ExecRequest, ExecResult, clean_output
 from lembas.services.agent.session import AgentContext
 from lembas.services.agent.tools import _run_shell
-pytestmark = pytest.mark.skipif(
+# A list, because there are two of them and `pytestmark = ...` twice is not two
 # marks -- the second binding replaces the first, silently. It did, for the
 # whole life of this file: the guard below was written, read as present, and
 # never once applied, so a host without `setsid` got a module that errored
 # instead of the skip somebody had taken the trouble to write.
 pytestmark = [
    pytest.mark.skipif(
        shutil.which("setsid") is None or shutil.which("base64") is None,
        reason="needs setsid and base64 (Linux)",
-)
+    ),
-
+    # Stands up something real -- see the `slow` marker in pyproject.toml.
-
+    pytest.mark.slow,
-# Stands up something real -- see the `slow` marker in pyproject.toml.
+]
 pytestmark = pytest.mark.slow
 class LocalExecutor:
    """`SshExecutor.run`'s contract, run against the local shell.
@@ -0,0 +1,110 @@
 """Archiving a chat, which the column has been filtered on and never written.
 `Chat.archived` is read in four places, always `is_(False)`, and was set to True
 by nothing anywhere in `src/` -- so the hiding shipped and the archiving did
 not, and the column read as a built feature to anybody who grepped for it.
 """
 from __future__ import annotations
 from fastapi.testclient import TestClient
 from lembas.db.models import Chat
 def test_a_chat_can_be_archived(client: TestClient, db, registered, make_chat):
    chat_id = make_chat()
    response = client.patch(f"/api/chats/{chat_id}", data={"archived": "1"})
    assert response.status_code == 200
    db.expire_all()
    assert db.get(Chat, chat_id).archived is True
 def test_archiving_answers_with_a_sidebar_the_browser_can_swap_in(
    client: TestClient, db, registered, make_chat
 ):
    """`update_chat` answers 204 for everything else, and htmx's own config is
    `{code: "204", swap: false}` -- so a button aimed at `#sidebar-tree` set the
    column and then did visibly nothing until the next page load.
    Asserted on the *response*, because the obvious test -- archive, then load
    the page, then look -- passes against both versions. It is the control doing
    nothing that has to be caught, not the column failing to change.
    """
    chat_id = make_chat()
    response = client.patch(f"/api/chats/{chat_id}", data={"archived": "1"})
    assert response.status_code == 200
    assert 'id="sidebar-tree"' in response.text
    assert "nav-group--archived" in response.text
    assert chat_id in response.text
 def test_a_patch_that_changes_nothing_still_answers_204(
    client: TestClient, db, registered, make_chat
 ):
    """Re-rendering the sidebar for every PATCH would put the tree in the reply
    to a rename, a folder move and a model change as well -- none of which
    asked for it, and one of which already answers with its own fragment."""
    chat_id = make_chat()
    assert client.patch(
        f"/api/chats/{chat_id}", data={"archived": "0"}
    ).status_code == 204
    assert client.patch(
        f"/api/chats/{chat_id}", data={"model_id": ""}
    ).status_code == 204
 def test_it_can_be_put_back(client: TestClient, db, registered, make_chat):
    """An archive with no way out is a delete that lies about itself."""
    chat_id = make_chat()
    client.patch(f"/api/chats/{chat_id}", data={"archived": "1"})
    client.patch(f"/api/chats/{chat_id}", data={"archived": "0"})
    db.expire_all()
    assert db.get(Chat, chat_id).archived is False
 def test_leaving_the_field_out_leaves_it_alone(client: TestClient, db, registered, make_chat):
    """`update_chat` reads the raw form precisely so that absent and empty are
    different things, and every other field there honours it."""
    chat_id = make_chat()
    client.patch(f"/api/chats/{chat_id}", data={"archived": "1"})
    client.patch(f"/api/chats/{chat_id}", data={"title": "Still here"})
    db.expire_all()
    chat = db.get(Chat, chat_id)
    assert chat.archived is True
    assert chat.title == "Still here"
 def test_an_archived_chat_leaves_the_list_and_joins_the_other_one(
    client: TestClient, db, registered, make_chat
 ):
    chat_id = make_chat()
    page = client.get("/chat").text
    assert chat_id in page
    client.patch(f"/api/chats/{chat_id}", data={"archived": "1"})
    page = client.get("/chat").text
    # Still reachable -- in the Archived group, which is the whole difference
    # between archiving and deleting.
    assert "nav-group--archived" in page
    assert chat_id in page
 def test_the_group_is_absent_when_nothing_is_in_it(client: TestClient, registered, make_chat):
    make_chat()
    assert "nav-group--archived" not in client.get("/chat").text
 def test_nobody_else_may_archive_your_chat(client: TestClient, db, registered, make_chat):
    """`_owned_chat` is what stops it, and this is the test that says so."""
    chat_id = make_chat()
    client.cookies.clear()
    # `follow_redirects=False`, or the redirect to the sign-in page is followed
    # and the 200 that comes back reads as the request having succeeded.
    response = client.patch(
        f"/api/chats/{chat_id}", data={"archived": "1"}, follow_redirects=False
    )
    assert response.status_code in (401, 403, 404, 303, 307)
    db.expire_all()
    assert db.get(Chat, chat_id).archived is False
@@ -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):
+def _chat_css() -> str:
    """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."""
    from pathlib import Path
    import lembas
-    css = Path(lembas.__file__).parent / "web/static/css/chat.css"
+    return (Path(lembas.__file__).parent / "web/static/css/chat.css").read_text()
-    assert "@media" not in 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):
@@ -1167,3 +1248,68 @@ def test_the_think_frame_lands_beside_the_reasoning_body_not_around_it():
    # Neither element may open a tag that the other closes: siblings, not nested.
    assert "</span>" in between or "</div>" in between
    assert between.count("<div") <= 1
 # --- Who a finished reply says it came from ----------------------------------
 def test_a_finished_bubble_names_the_model_that_wrote_it(db, client, registered, make_chat):
    """The `done` frame and the tail route render the bubble from scratch, and
    both looked the models up as *nobody* -- which `models_visible_to` answers
    with an empty list, not with everything. So a reply was attributed correctly
    for as long as it was streaming and lost its avatar and its author line at
    the instant it finished, then corrected itself on the next page load.
    Asserted on the rendered HTML rather than on the argument: passing `owner`
    is what the old code looked like it was doing, and an assertion on the call
    would have been green throughout.
    """
    from lembas.api import chats as chats_api
    from lembas.db.models import Chat, Connection, Message, Model, User
    connection = Connection(name="c", base_url="http://127.0.0.1:1", api_key_encrypted="")
    db.add(connection)
    db.commit()
    db.add(Model(connection_id=connection.id, model_id="mithril-7b", display_name="Mithril 7B"))
    db.commit()
    chat_id = make_chat(model_id="mithril-7b")
    chat = db.get(Chat, chat_id)
    owner = db.get(User, chat.user_id)
    message = Message(
        chat_id=chat.id, role="assistant", content="Spoken.",
        complete=True, model_id="mithril-7b",
    )
    db.add(message)
    db.commit()
    html = chats_api._render_bubble(db, chat, owner, message)
    assert "Mithril 7B" in html
 def test_the_reply_limit_covers_every_way_of_starting_one(db):
    """It was enforced in `_send` alone, so an account at its ceiling reached it
    by sending into an existing chat and walked past it by pressing New chat --
    and by editing, by sending a queued message, and by regenerating.
    Reading the source is the honest test here: driving four routes to the point
    of refusal needs four live generations, which is a fixture that would tell
    you more about the fixture than about the guard.
    """
    import inspect
    from lembas.api import chats as chats_api
    source = inspect.getsource(chats_api)
    for route in ("start_chat", "edit_message", "send_queued_now", "regenerate", "_send"):
        body = source.split(f"def {route}(", 1)[1].split("\n@router", 1)[0]
        assert "_refuse_extra_reply" in body, route
 def test_a_new_chat_is_not_written_before_the_limit_is_checked(db):
    """A refusal that has already created the row leaves an empty chat in the
    sidebar as the visible result of being told no."""
    import inspect
    from lembas.api import chats as chats_api
    body = inspect.getsource(chats_api.start_chat)
    assert body.index("_refuse_extra_reply") < body.index("_new_chat(")
@@ -0,0 +1,85 @@
 """Extra headers on a connection: read on every request, written by no form.
 `Connection.extra_headers_json` has been sent with every request to an endpoint
 since it was added and there was nowhere to set it, so its one documented use --
 OpenRouter reads `HTTP-Referer` and `X-Title` and attributes usage with them --
 was unreachable. Nothing advertised it, so nothing was untrue; it was simply a
 column that could only ever be empty.
 """
 from __future__ import annotations
 from fastapi.testclient import TestClient
 from lembas.db.models import Connection
 def _connection(client: TestClient, db):
    client.post(
        "/admin/connections",
        data={"name": "OpenRouter", "base_url": "http://127.0.0.1:1", "api_key": ""},
        follow_redirects=False,
    )
    from sqlalchemy import select
    return db.scalars(select(Connection)).first().id
 def _save(client: TestClient, connection_id: str, headers: str):
    return client.post(
        f"/admin/connections/{connection_id}",
        data={
            "name": "OpenRouter",
            "base_url": "http://127.0.0.1:1",
            "api_key": "",
            "enabled": "on",
            "unload_url": "",
            "unload_method": "POST",
            "extra_headers": headers,
        },
        follow_redirects=False,
    )
 def test_headers_are_stored_as_a_dict(client: TestClient, db, registered):
    """Asserted on the row, not on the form: a field that renders and is never
    read looks exactly like one that works."""
    cid = _connection(client, db)
    _save(client, cid, "HTTP-Referer: https://example.org\nX-Title: LLeMbas")
    db.expire_all()
    stored = db.get(Connection, cid).extra_headers_json
    assert stored == {
        "HTTP-Referer": "https://example.org",
        "X-Title": "LLeMbas",
    }
 def test_they_reach_the_endpoint(client: TestClient, db, registered):
    """The whole point. `openai_client` passes them to httpx verbatim."""
    cid = _connection(client, db)
    _save(client, cid, "X-Title: LLeMbas")
    db.expire_all()
    from lembas.services.llm.openai_client import Endpoint
    endpoint = Endpoint.from_connection(db.get(Connection, cid))
    assert endpoint.extra_headers["X-Title"] == "LLeMbas"
 def test_clearing_the_box_clears_them(client: TestClient, db, registered):
    cid = _connection(client, db)
    _save(client, cid, "X-Title: LLeMbas")
    _save(client, cid, "")
    db.expire_all()
    assert db.get(Connection, cid).extra_headers_json == {}
 def test_a_name_cannot_smuggle_in_a_second_header(client: TestClient, db, registered):
    """One field must write one header. A colon or a newline in a *name* is how
    one becomes two, and a header nobody can see the effect of is worse than one
    that is visibly missing -- so a bad line is dropped, never repaired."""
    cid = _connection(client, db)
    _save(client, cid, "Bad Name: x\nX-Ok: y\n: nothing\nAlso-Bad\n")
    db.expire_all()
    assert db.get(Connection, cid).extra_headers_json == {"X-Ok": "y"}
@@ -366,3 +366,93 @@ def test_the_picker_never_says_default(client: TestClient, db, registered):
    assert "Effort: default" not in html
    assert "Effort: off" in html
    assert '<option value="medium" selected>' in html.replace("\n", "").replace("  ", "")
 # --- A vocabulary that is not the same for every model -----------------------
 #
 # Reported from a real instance, on a model called Bonsai:
 #
 #   Jinja Exception: Unexpected reasoning effort high. Supported types are
 #   xhigh (default), medium, and low.
 #
 # `chat_template_kwargs.reasoning_effort` is rendered into the model's own chat
 # template, and a template that does not know the value calls `raise_exception`
 # rather than ignoring it -- so the whole reply died, from an option this
 # application had drawn in a menu.
 BONSAI_ERROR = (
    "Jinja Exception: Unexpected reasoning effort high. "
    "Supported types are xhigh (default), medium, and low."
 )
 class _FakeModel:
    def __init__(self, efforts=None):
        self.reasoning_efforts = efforts or []
 def test_a_model_that_has_said_nothing_gets_the_common_three():
    from lembas.services import chat as chat_service
    assert chat_service.efforts_for(_FakeModel()) == ("low", "medium", "high")
 def test_a_model_can_take_xhigh_and_not_high():
    from lembas.services import chat as chat_service
    bonsai = _FakeModel(["xhigh", "medium", "low"])
    assert chat_service.efforts_for(bonsai) == ("low", "medium", "xhigh")
    assert "high" not in chat_service.efforts_for(bonsai)
 def test_an_effort_the_model_refuses_is_never_sent():
    """The check that stops the crash happening at all."""
    from lembas.services import chat as chat_service
    supported = chat_service.efforts_for(_FakeModel(["xhigh", "medium", "low"]))
    body: dict = {}
    chat_service.apply_effort(body, "high", supported)
    assert body == {}
    chat_service.apply_effort(body, "xhigh", supported)
    assert body["reasoning_effort"] == "xhigh"
    assert body["chat_template_kwargs"]["reasoning_effort"] == "xhigh"
 def test_a_value_this_application_never_heard_of_cannot_reach_a_request():
    from lembas.services import chat as chat_service
    assert chat_service.efforts_for(_FakeModel(["ludicrous"])) == ("low", "medium", "high")
 def test_the_refusal_is_recognised_and_the_supported_list_read_out_of_it():
    from lembas.services import generation
    assert generation._effort_was_refused(BONSAI_ERROR)
    assert generation._advertised_efforts(BONSAI_ERROR) == ["low", "medium", "xhigh"]
 def test_the_rejected_value_is_not_collected_as_a_supported_one():
    """The message names the refused effort first and the supported ones after,
    so anything reading the whole string would learn `high` from a sentence
    saying `high` is the problem."""
    from lembas.services import generation
    assert "high" not in generation._advertised_efforts(BONSAI_ERROR)
 def test_an_ordinary_failure_is_not_retried_as_an_effort_problem():
    """Retrying a genuine failure would hide it behind a second request."""
    from lembas.services import generation
    for message in (
        "Connection refused.",
        "The model is still loading.",
        "context length exceeded",
    ):
        assert not generation._effort_was_refused(message)
 def test_a_model_with_no_advertisement_simply_loses_the_refused_value():
    from lembas.services import generation
    assert generation._advertised_efforts("Unexpected reasoning effort high.") == []
@@ -72,3 +72,50 @@ def test_the_canvas_starts_wider_than_the_terminal():
        for name in PANELS
    }
    assert widths["--canvas-width"] > widths["--terminal-width"]
 # --- Breakpoints -------------------------------------------------------------
 # A media query cannot read a custom property, so the three widths this
 # application breaks at are literals in three stylesheets with nothing tying
 # them to the tokens that name them. Which is fine until somebody adds a fourth
 # in passing, and then there are four breakpoints and a comment describing
 # three.
 def _breakpoints_used() -> set[str]:
    """Widths that appear in an `@media` condition, and nowhere else.
    Scoped to the condition on purpose: `max-width` is also an ordinary
    declaration -- `.composer__dir` is capped at 11rem, `.picker__menu` at
    14rem -- and a pattern that reads every one of them calls two dozen
    component caps "breakpoints" and fails on all of them.
    """
    import re
    used: set[str] = set()
    for name in ("app.css", "chat.css", "admin.css"):
        text = (ROOT / "web/static/css" / name).read_text(encoding="utf-8")
        for condition in re.findall(r"@media([^{]*)\{", text):
            used.update(re.findall(r"max-width:\s*([\d.]+rem)", condition))
    return used
 def test_every_breakpoint_is_one_of_the_declared_ones():
    import re
    declared = set(re.findall(r"--bp-[a-z]+:\s*([\d.]+rem)", TOKENS))
    assert declared, "no --bp-* tokens declared"
    used = _breakpoints_used()
    assert used <= declared, (
        f"breakpoints used but not declared in tokens.css: {sorted(used - declared)}"
    )
 def test_no_breakpoint_is_declared_and_never_used():
    """The other direction: a token naming a width nothing breaks at is the
    same clutter as a colour nothing paints with."""
    import re
    declared = set(re.findall(r"--bp-[a-z]+:\s*([\d.]+rem)", TOKENS))
    assert declared <= _breakpoints_used(), (
        f"declared and unused: {sorted(declared - _breakpoints_used())}"
    )
@@ -165,3 +165,149 @@ def test_the_mic_appears_only_when_dictation_is_configured(
        key=settings_store.AUDIO,
    )
    assert "data-mic" in client.get("/chat").text
 # --- The manifest, beyond the installability minimum -------------------------
 def test_the_manifest_offers_launcher_shortcuts(client: TestClient):
    """A long-press on the launcher icon should reach the three places worth
    going to directly. Absent, it offers nothing."""
    payload = client.get("/manifest.webmanifest").json()
    urls = {s["url"] for s in payload["shortcuts"]}
    assert urls == {"/chat", "/messages", "/scheduled"}
 def test_the_manifest_identity_matches_where_it_starts(client: TestClient):
    """`id` was "/", which serves nothing but a redirect, while the app started
    at /chat. Legal, and it reads as a mistake to anyone comparing the two."""
    payload = client.get("/manifest.webmanifest").json()
    assert payload["id"] == payload["start_url"]
 def test_the_manifest_declares_the_rest_of_the_quality_set(client: TestClient):
    payload = client.get("/manifest.webmanifest").json()
    for key in ("orientation", "categories", "lang", "dir",
                "display_override", "launch_handler"):
        assert key in payload, key
 def test_the_splash_follows_the_instance_theme(client: TestClient, monkeypatch):
    """It was Moria's near-black whatever the instance was set up in, so a
    parchment instance installed to a phone flashed dark and opened light --
    and `THEME_COLOUR["shire"]` sat beside it, defined and read by nothing."""
    from lembas.config import settings
    monkeypatch.setattr(settings, "default_theme", "shire")
    payload = client.get("/manifest.webmanifest").json()
    assert payload["theme_color"] == "#F6F1E4"
    assert payload["background_color"] == payload["theme_color"]
 def test_the_page_paints_the_right_chrome_before_any_script_runs(client, registered):
    """One unscoped `theme-color` meant a light-theme reader got dark browser
    chrome on every load until the deferred script corrected it."""
    page = client.get("/chat").text
    assert 'media="(prefers-color-scheme: dark)"' in page
    assert 'media="(prefers-color-scheme: light)"' in page
 # --- The worker --------------------------------------------------------------
 def test_the_worker_does_not_take_over_a_page_being_read():
    """It called skipWaiting() unconditionally, so a release replaced the
    assets under an open tab mid-session. It waits to be asked now."""
    import re
    source = (STATIC_DIR / "js" / "sw.js").read_text()
    # Comments stripped first: the install handler explains at length that it
    # deliberately does not call this, and a test that reads prose would fail
    # on the explanation for the fix.
    code = re.sub(r"/\*.*?\*/", "", source, flags=re.S)
    code = re.sub(r"//[^\n]*", "", code)
    install = code.split('addEventListener("install"', 1)[1].split("addEventListener(", 1)[0]
    assert "skipWaiting" not in install
    assert 'event.data.type === "SKIP_WAITING"' in code
 def test_the_worker_survives_a_rotated_subscription():
    """A browser replacing a subscription on its own is the normal way push
    stops working, and nothing anywhere said so."""
    source = (STATIC_DIR / "js" / "sw.js").read_text()
    assert "pushsubscriptionchange" in source
 def test_the_badge_is_not_the_full_colour_icon():
    """A badge is drawn as a mask -- the device keeps the alpha and throws the
    colour away -- so an icon opaque to its edges renders as a grey square."""
    source = (STATIC_DIR / "js" / "sw.js").read_text()
    assert 'badge: "/static/img/badge-72.png"' in source
    badge = Path(STATIC_DIR) / "img" / "badge-72.png"
    assert badge.exists() and badge.read_bytes()[:8] == b"\x89PNG\r\n\x1a\n"
 def test_the_two_icons_a_device_crops_are_cached():
    source = (STATIC_DIR / "js" / "sw.js").read_text()
    shell = source.split("var SHELL = [", 1)[1].split("];", 1)[0]
    assert "icon-maskable-512.png" in shell
    assert "apple-touch-icon-180.png" in shell
 # --- The window's own edges --------------------------------------------------
 def test_the_page_asks_for_the_whole_screen_and_then_pays_for_it(client, registered):
    """`viewport-fit=cover` is what makes `env(safe-area-inset-*)` resolve to
    anything but zero, and `black-translucent` below it is what puts the page
    under the status bar in the first place. One without the other is a topbar
    beneath the clock."""
    page = client.get("/chat").text
    assert "viewport-fit=cover" in page
    css = (STATIC_DIR / "css" / "tokens.css").read_text()
    assert "safe-area-inset-top" in css
    app = (STATIC_DIR / "css" / "app.css").read_text()
    assert "var(--safe-top)" in app
    assert "var(--safe-bottom)" in app
 # --- A release cannot be drawn with the previous release's stylesheet --------
 def test_every_static_asset_carries_the_release(client: TestClient, registered):
    """The bug this is here to stop shipped in 1.1.0.
    The worker caches `/static/...` under a cache named for the release, and a
    page is fetched network-first while its assets come from that cache -- so
    once the worker stopped claiming open tabs the instant it installed (which
    it had to, or it swaps stylesheets under somebody mid-reply), new HTML and
    old CSS were served together. What that looked like was a close button
    meant for a phone drawer appearing, unstyled, on every desktop.
    A version in the URL settles it: the new HTML asks for something the old
    cache has never heard of.
    """
    import re
    for path in ("/chat", "/settings"):
        page = client.get(path).text
        bare = re.findall(r'(?:href|src)="(/static/[^"?]+)"', page)
        assert not bare, f"{path} loads unversioned assets: {bare[:5]}"
 def test_no_template_reaches_past_the_helper(client: TestClient):
    """`url_for('static', ...)` produces a URL with no version in it, so one
    left behind is one asset that can still come from the wrong release."""
    from pathlib import Path
    import lembas
    root = Path(lembas.__file__).parent / "web/templates"
    offenders = [
        str(p.relative_to(root))
        for p in root.rglob("*.html")
        if "url_for('static'" in p.read_text(encoding="utf-8")
    ]
    assert not offenders, f"still using url_for for static assets: {offenders}"
 def test_the_worker_precaches_what_a_page_will_ask_for():
    """`caches.match` compares the whole URL. Precaching the bare path fills the
    cache with entries nothing requests, and every asset then goes to the
    network on every load while looking perfectly cached."""
    source = (STATIC_DIR / "js" / "sw.js").read_text()
    assert 'path + "?v=" + VERSION' in source
    assert "versioned(path)" in source
@@ -0,0 +1,182 @@
 """The sidebar as a drawer: closed by default where it covers the page.
 Below the phone breakpoint the sidebar is a fixed 280px overlay. It was
 rendered with no `hidden` attribute at any width and nothing ever set one on
 load, so on a 390px phone it covered the page from first paint -- with the only
 control that could close it, the topbar's toggle, underneath it. And that toggle
 existed on `/chat` alone: the seven other pages carrying the sidebar had no
 dismiss control of any kind.
 """
 from __future__ import annotations
 from pathlib import Path
 from fastapi.testclient import TestClient
 import lembas
 ROOT = Path(lembas.__file__).parent
 TEMPLATES = ROOT / "web/templates"
 APP_CSS = (ROOT / "web/static/css/app.css").read_text(encoding="utf-8")
 APP_JS = (ROOT / "web/static/js/app.js").read_text(encoding="utf-8")
 # Every page that renders the sidebar.
 CARRIERS = [
    "settings.html",
    "chat/index.html",
    "reports/_layout.html",
    "messages/index.html",
    "schedules/_layout.html",
    "library/_layout.html",
    "agents/_layout.html",
    "folders/edit.html",
 ]
 def test_every_page_with_a_sidebar_has_a_way_to_close_it():
    """`grep -rn 'data-toggle="#sidebar"'` returned exactly one hit, and the
    other seven pages were unusable on a phone because of it."""
    missing = [
        name
        for name in CARRIERS
        if "partials/_sidebar_toggle.html" not in (TEMPLATES / name).read_text(encoding="utf-8")
    ]
    assert not missing, f"no sidebar toggle on: {missing}"
 def test_the_toggle_is_one_partial_and_not_eight_copies():
    """The next control added to a topbar should not have to be added eight
    times, which is how the first one came to exist once."""
    toggle = (TEMPLATES / "partials/_sidebar_toggle.html").read_text(encoding="utf-8")
    assert 'data-toggle="#sidebar"' in toggle
    assert 'aria-label="Toggle sidebar"' in toggle
 def test_the_toggle_does_not_claim_to_be_open():
    """It rendered `aria-expanded="true"` from the template -- a fact nobody
    checked and one that was false on every phone. `syncToggles` writes it."""
    toggle = (TEMPLATES / "partials/_sidebar_toggle.html").read_text(encoding="utf-8")
    # The element, not the file: the comment above it explains at length why
    # the attribute is absent, and a test reading the file fails on the
    # explanation for the fix.
    button = toggle.split("<button", 1)[1].split(">", 1)[0]
    assert "aria-expanded" not in button
    assert 'syncToggles("#sidebar"' in APP_JS
 def test_the_drawer_is_closed_by_default_only_where_it_is_a_drawer():
    """Three states, and the third is the one that matters: absent means
    "follow the width", which is what the server renders because the server
    does not know the width."""
    assert 'data-sidebar="open"' in APP_CSS
    assert 'data-sidebar="closed"' in APP_CSS
    assert 'return !window.matchMedia(NARROW).matches;' in APP_JS
 def test_the_close_button_is_reachable_inside_the_open_drawer():
    """`.sidebar__close` is `display: none` at width and turned back on inside
    the media query. Both rules are one class deep, so the order decides -- and
    written the other way round the button is invisible at every width,
    including inside the drawer it exists for."""
    base = APP_CSS.index("\n.sidebar__close {")
    inside = APP_CSS.index("  .sidebar__close {")
    assert base < inside, "the base rule must come first or it wins everywhere"
 def test_nothing_behind_the_drawer_can_be_tabbed_into():
    assert 'toggleAttribute("inert"' in APP_JS
 def test_inert_is_never_left_behind_on_a_widened_window():
    """An `inert` left on a window somebody widened is a page that has stopped
    responding, which is worse than the bug it is here to fix."""
    assert 'matchMedia(NARROW).addEventListener("change"' in APP_JS
 def test_the_drawer_is_dismissible_without_finding_a_button():
    """The scrim is a partial because there are two sidebars, so the markup is
    asserted where it is defined and its *inclusion* is asserted per sidebar by
    `test_every_sidebar_carries_the_way_out_and_the_scrim`."""
    scrim = (TEMPLATES / "partials/_sidebar_scrim.html").read_text(encoding="utf-8")
    assert 'class="sidebar-scrim"' in scrim
    assert 'data-toggle="#sidebar"' in scrim
    assert ".sidebar-scrim" in APP_CSS
 def test_the_sidebar_does_not_go_through_setpanel():
    """The other three panels use the `hidden` attribute, which is one value
    for both widths -- the thing this panel cannot use."""
    assert 'if (selector === "#sidebar") return setSidebar(open);' in APP_JS
 def test_the_toggle_is_a_real_target(client: TestClient, registered):
    """44px comes from `--control-h` under the coarse-pointer block, so this
    only holds while `.btn--icon` keeps taking its size from that token."""
    tokens = (ROOT / "web/static/css/tokens.css").read_text(encoding="utf-8")
    assert "--tap-min: 2.75rem" in tokens
    assert "--control-h: var(--tap-min)" in tokens
 # --- Any sidebar, not only the one this was written for ----------------------
 def _sidebar_templates() -> list[str]:
    """Every template that renders a sidebar of its own, found rather than
    listed -- the admin one was missed precisely because it was not on a list."""
    return [
        str(p.relative_to(TEMPLATES))
        for p in TEMPLATES.rglob("*.html")
        if '<aside class="sidebar"' in p.read_text(encoding="utf-8")
    ]
 def test_every_sidebar_is_one_the_toggle_can_find():
    """`data-toggle="#sidebar"` resolves by id, and below the phone breakpoint
    `.sidebar` is a fixed overlay that starts closed. A sidebar without that id
    is one nothing can open: the admin area shipped that way in 1.1.0 and 1.1.1
    -- reachable on a phone, and unnavigable the moment you arrived."""
    without = [
        name
        for name in _sidebar_templates()
        if '<aside class="sidebar" id="sidebar"' not in (TEMPLATES / name).read_text(
            encoding="utf-8"
        )
    ]
    assert not without, f"sidebar with no id, so nothing can open it: {without}"
 def test_every_sidebar_carries_the_way_out_and_the_scrim():
    missing = []
    for name in _sidebar_templates():
        text = (TEMPLATES / name).read_text(encoding="utf-8")
        if "partials/_sidebar_close.html" not in text:
            missing.append(f"{name}: no close button")
        if "partials/_sidebar_scrim.html" not in text:
            missing.append(f"{name}: no scrim")
    assert not missing, missing
 def test_the_admin_area_can_be_navigated_on_a_phone(client: TestClient, registered):
    """The whole of administration is in that nav and nowhere else."""
    page = client.get("/admin/models").text
    assert '<aside class="sidebar" id="sidebar"' in page
    assert 'data-toggle="#sidebar"' in page
    assert "sidebar-scrim" in page
 # --- Controls do not shrink below their own size -----------------------------
 def test_an_icon_button_keeps_its_size_in_a_tight_row():
    """`.btn--icon` sets a width and, without `flex: none`, a row that runs out
    of room shrinks it instead of the text beside it -- the sidebar toggle
    measured 18px across on a 390px chat, well under half its target."""
    rule = APP_CSS.split(".btn--icon {", 1)[1].split("}", 1)[0]
    assert "flex: none" in rule
 def test_the_topbar_can_give_somewhere(client: TestClient, registered):
    """`.topbar__where` was the designated shrinker in that row and it is
    `display: none` below 64rem, so on a phone the group went rigid and the
    title -- which is `flex: 1` -- was squeezed to exactly zero width."""
    actions = APP_CSS.split(".topbar__actions {", 1)[1].split("}", 1)[0]
    assert "flex: 0 1 auto" in actions
    assert "min-width: 0" in actions
    assert "min-width" in APP_CSS.split(".topbar__title {", 1)[1].split("}", 1)[0]
@@ -163,10 +163,15 @@ def test_the_tab_reset_finds_the_container_that_actually_scrolls():
    either alone leaves the bug.
    """
    admin = (ROOT / "web/static/css/admin.css").read_text(encoding="utf-8")
    app = (ROOT / "web/static/css/app.css").read_text(encoding="utf-8")
-    # The scroller rule names where the tabs must be, not just the class.
+    # The scroller rule names where the tabs must be, not just the class. Which
-    assert ".main > .tabs > .tabs__body" in admin
+    # stylesheet it is written in is not the point and is not asserted -- the
    # four declarations that make something a scroller now live once, in
    # app.css, and this selector is listed there with the rest.
    assert ".main > .tabs > .tabs__body" in admin + app
    assert "\n.tabs__body {" not in admin
    assert "\n.tabs__body {" not in app
    assert "overflowY" in SOURCE
    assert "scrollHeight > " in SOURCE
@@ -319,7 +324,12 @@ def test_no_page_loads_a_script_that_the_base_template_already_loads():
    from pathlib import Path
    templates = Path(__file__).resolve().parents[1] / "src/lembas/web/templates"
-    pattern = re.compile(r"path='js/([a-z_]+\.js)'")
+    # Both spellings, because the way a static URL is written has changed once
    # already: `url_for('static', path='js/x.js')` became `asset('js/x.js')`
    # when assets started carrying the release. The assertion below that the set
    # is non-empty is what turned that rename into a loud failure rather than a
    # sweep that silently stopped sweeping -- keep it.
    pattern = re.compile(r"(?:path=|asset\()'js/([a-z_]+\.js)'")
    always = set(pattern.findall((templates / "base.html").read_text()))
    assert always, "base.html stopped loading any script; this test is now blind"
Author	SHA1	Message	Date
HomerandClaude Opus 5	32e2326d41	An effort the model had never heard of Reported from a live instance, on Bonsai: Jinja Exception: Unexpected reasoning effort high. Supported types are xhigh (default), medium, and low. Effort goes out two ways because no single field works, and the second -- chat_template_kwargs -- is not a parameter the server interprets. It is rendered into the model's own chat template, which does not ignore a value it does not know: it calls raise_exception, and the request dies before a token. So a perfectly ordinary option, drawn by this application in its own menu, took the whole reply with it. The vocabulary is per model and nobody agrees. gpt-oss takes low/medium/high. Bonsai takes low/medium/xhigh and refuses high. OpenAI has added minimal, xhigh and max at different points, and which of them a given model accepts varies again. One global tuple was going to be wrong for somebody whatever it held. A model carries its own list now, and the picker, the slash command and the request builder all read it. A column rather than a key in capabilities_json, for the reason context_length is one: that dict is rebuilt wholesale from the submitted checkboxes on every save. And it corrects itself. A refusal retries the reply once without the effort rather than losing it -- safe only because the template renders before any token, so nothing has been emitted, and there is a guard that keeps it that way -- then narrows the model's list. Bonsai's error states what it does take, so that is what gets stored. Note the parser bug, because it is a good one: "high" is a substring of "xhigh", so reading the advertised list by substring learned `high` from a sentence explaining that `high` is the problem. Whole words now, with a test named after it. /effort reads its levels off the picker instead of a second copy of the list kept in the browser. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-09-25 21:20:06 +00:00
HomerandClaude Opus 5	b7bf7d728b	An admin area a phone could reach and not navigate Administration has a nav of its own rather than the chat sidebar, and 1.1.0 gave every `.sidebar` the drawer behaviour -- starts closed, slides in -- without giving that one any of the drawer's furniture. No id for the toggle to resolve, no toggle, no close, no scrim: it sat at left:-280 with nothing in the application able to open it. The close button and the scrim are partials now, used by both, and the test that guards it finds sidebars by scanning the templates rather than working from a list, which is exactly why this one was missed. The chat, measured at 390px, spent forty pixels of side padding and a forty-four pixel avatar column before drawing a word -- close to a quarter of the screen on margin, so anything that could not wrap had to be reached sideways. Padding halved and the avatar moved above the turn; a code block gained about sixty pixels. Worse in the same row: `.topbar__actions` asked for 317px of a 390px bar, because the control that used to give in that row is display:none below a tablet width, so the group went rigid and the title -- flex: 1 -- was squeezed to exactly zero. And `.btn--icon` sets a width with no `flex: none`, so the row shrank the button instead of the text: the sidebar toggle measured eighteen pixels across. The picker gives now, and shows its avatar rather than its name on a phone. Also the instrument, which lied twice more: it could not see horizontal overflow at all, because `.shell` is overflow:hidden and its "is this contained" test therefore answered yes for everything on the page; and run from a copy it resolved `STATIC` to a directory that did not exist, rewrote every asset URL to a dead file:// path and reported the whole application overflowing by thirty thousand pixels. It resolves from the imported package now and asserts that what it rewrote to is really there. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-09-25 19:27:39 +00:00
HomerandClaude Opus 5	201281d616	New markup over an old stylesheet Reported from a desktop browser: a stray close button beside the logo, badly drawn, and a page that would not scroll. None of it was in the code that was running -- it was the code the browser had not fetched. The worker caches /static/ under a cache named for the release while the files in it carried no version, and a page is fetched network-first. That only ever worked because the worker used to seize every open tab the instant it installed and wipe the old cache. 1.1.0 stopped it doing that, rightly -- it was swapping stylesheets out from under a streaming reply -- and a momentary mismatch became a permanent one: new markup over the previous release's CSS for as long as the old worker lived. `.sidebar__close` had no rule there, so `.btn--icon` made it inline-flex: visible everywhere, placed by nothing. Every /static/ URL carries the release now, written by `templating.asset` and precached by `sw.js:versioned` -- both halves, because caches.match compares the query too and precaching the bare path would cache entries nothing requests. Self-correcting: updating is enough. The header was also a brand with a button appended and margin-left:auto doing the placing, which holds exactly while that button is last. Two slots now: a brand that shrinks and truncates, and a rail on the trailing edge. Verified before changing anything: with the current stylesheet the button is display:none at 1280 and, with thirty chats and forty messages, both scrollers scroll. The first measurement said the thread did not -- that was scroll-behavior: smooth reporting where it started. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-09-25 18:16:24 +00:00
HomerandClaude Opus 5	28390095a9	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>	2026-09-25 13:39:35 +00:00
HomerandClaude Opus 5	92070d7879	Six things that looked like they worked None of these fails loudly and two of them correct themselves if you reload, which is why five were found by reading rather than by anybody reporting them. The reply that lost its author is the one worth knowing about: the frame that replaces a bubble when a reply lands was looking the models up as nobody, and "no user" answers "no models" rather than "all models" -- so every finished reply swapped the model's avatar for the plain mark and put the instance's name where the model's should be, until the next page load put it back. Beside it: a concurrency quota enforced on two of the six paths that start a reply, including neither of the two most used; a custom theme whose success and warning colours moved the text and left the background behind; a phone shell sized to one viewport inside a document sized to another, which is the reported scroll past the bottom of Settings; a whole conversation's Markdown rendered on every page load and read by nothing; a skip guard inert since it was written; and an endpoint nothing has ever called. The scroll fix folded five near-identical scroller rules into one, which is also where the containment they were all missing now lives. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-09-25 12:49:26 +00:00
HomerandClaude Opus 5	d73a791c86	An installer that had only ever met Arch `deploy/lxc-install.sh` had never been executed -- there was no Proxmox host to run it on, and PLAN.md said so rather than letting it read as tested. It was reviewed and `bash -n` checked, which is not the same claim. Running it for the first time found two Arch-isms in `install.sh`, the script it wraps, and only a Debian machine could have found either. `python -m venv` is the one that mattered. On Arch `python` is Python 3, so the bare name had worked on the only machine this had ever run on. Debian has no `python` at all unless somebody installed `python-is-python3`, and the LXC bootstrap installs `python3` -- so the install aborted at the virtualenv step, with the service user, the bind mount and the clone already in place. It is `python3` now, which is right on both. `--shell /usr/bin/nologin` is the one that did not. That is where Arch keeps nologin and not where Debian does, but nothing ever invoked it: `sudo -u` execs the command directly and systemd's `User=` never reads a shell. The account worked while pointing at a file that was not there. `/usr/sbin/nologin` is correct on Debian and resolves on Arch too, whose `/usr/sbin` is a symlink to `bin`. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>	2026-08-09 19:42:28 +02:00
`@@ -1,3 +1,3 @@`
	`"""LLeMbas - a Middle-earth themed web UI for OpenAI-compatible LLM endpoints."""`	`"""LLeMbas - a Middle-earth themed web UI for OpenAI-compatible LLM endpoints."""`

	`__version__ = "1.0.2"`	`__version__ = "1.2.0"`